tcjlj/PicList
1
0
Fork 0
mirror of https://github.com/Kuingsmile/PicList.git synced 2025-02-02 11:08:13 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ Feature: rewrite the layout of the settings page

Browse Source
This commit is contained in:
萌萌哒赫萝 2023-05-22 23:41:28 +08:00
parent 8f512fe488
commit 5ccb899264
5 changed files with 533 additions and 413 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
public/i18n/en.yml
View File

@ -265,6 +265,11 @@ SETTINGS_SYNC_DOWNLOAD_FAILED: Download failed
SETTINGS_SYNC_COMMON_CONFIG: Common configuration
SETTINGS_SYNC_MANAGE_CONFIG: Manage configuration
SETTINGS_AUTO_IMPORT: Auto import config in manage page
SETTINGS_TAB_SYSTEM: System
SETTINGS_TAB_SYNC_CONFIG: Sync and Configuration
SETTINGS_TAB_UPLOAD: Upload
SETTINGS_TAB_ADVANCED: Advanced
SETTINGS_TAB_UPDATE: Update
# shortcut-page
BUILTIN_CLIPBOARD_TIPS: Use builtin clipboard function to upload instead of using scripts

5
public/i18n/zh-CN.yml
View File

@ -268,6 +268,11 @@ SETTINGS_SYNC_DOWNLOAD_FAILED: 下载失败
SETTINGS_SYNC_COMMON_CONFIG: 通用配置
SETTINGS_SYNC_MANAGE_CONFIG: 管理配置
SETTINGS_AUTO_IMPORT: 管理页面自动导入配置
SETTINGS_TAB_SYSTEM: 系统设置
SETTINGS_TAB_SYNC_CONFIG: 同步与配置
SETTINGS_TAB_UPLOAD: 上传设置
SETTINGS_TAB_ADVANCED: 高级设置
SETTINGS_TAB_UPDATE: 更新
# shortcut-page
SHORTCUT_NAME: 快捷键名称

5
public/i18n/zh-TW.yml
View File

@ -266,6 +266,11 @@ SETTINGS_SYNC_DOWNLOAD_FAILED: 下載失敗
SETTINGS_SYNC_COMMON_CONFIG: 通用配置
SETTINGS_SYNC_MANAGE_CONFIG: 管理配置
SETTINGS_AUTO_IMPORT: 管理頁面自動導入配置
SETTINGS_TAB_SYSTEM: 系統設置
SETTINGS_TAB_SYNC_CONFIG: 同步與配置
SETTINGS_TAB_UPLOAD: 上傳設置
SETTINGS_TAB_ADVANCED: 高級設置
SETTINGS_TAB_UPDATE: 更新
# shortcut-page
SHORTCUT_NAME: 快捷鍵名稱

544
src/renderer/pages/PicGoSetting.vue
View File

@ -13,6 +13,17 @@
<Reading />
</el-icon>
</el-row>
<el-tabs
v-model="activeName"
stretch
style="height: calc(100vh - 50px);width: 100%;overflow-x: hidden;top: 50px;position: absolute;"
tab-position="left"
>
<el-tab-pane
name="system"
:label="$T('SETTINGS_TAB_SYSTEM')"
style="height: 100%;overflow-y: scroll;height: calc(100vh - 50px);color: #fff;"
>
<el-row class="setting-list">
<el-col
:span="22"
@ -87,218 +98,6 @@
@change="handleHideDockChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SYNC_CONFIG')"
>
<el-button
type="primary"
round
size="small"
@click="syncVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_UP_DOWN_DESC')"
>
<el-button
type="primary"
round
size="small"
@click=" upDownConfigVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_MIGRATE_FROM_PICGO')"
>
<el-button
type="primary"
round
size="small"
@click="handleMigrateFromPicGo"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_CONFIG_FILE')"
>
<el-button
type="primary"
round
size="small"
@click="openFile('data.json')"
>
{{ $T('SETTINGS_CLICK_TO_OPEN') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_LOG_FILE')"
>
<el-button
type="primary"
round
size="small"
@click="openLogSetting"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_SHORTCUT')"
>
<el-button
type="primary"
round
size="small"
@click="goShortCutPage"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_CUSTOM_LINK_FORMAT')"
>
<el-button
type="primary"
round
size="small"
@click="customLinkVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_COMPRESS_AND_WATERMARK')"
>
<el-button
type="primary"
round
size="small"
@click="imageProcessDialogVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_PROXY_AND_MIRROR')"
>
<el-button
type="primary"
round
size="small"
@click="proxyVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_SERVER')"
>
<el-button
type="primary"
round
size="small"
@click="serverVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_AUTO_IMPORT')"
>
<el-switch
v-model="form.autoImport"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="autoImportChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_CHECK_UPDATE')"
>
<el-button
type="primary"
round
size="small"
@click="checkUpdate"
>
{{ $T('SETTINGS_CLICK_TO_CHECK') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_UPDATE_HELPER')"
>
<el-switch
v-model="form.updateHelper"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="updateHelperChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_LAUNCH_ON_BOOT')"
>
<el-switch
v-model="form.autoStart"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleAutoStartChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SYNC_DELETE_CLOUD')"
>
<el-switch
v-model="form.deleteCloudFile"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleDeleteCloudFile"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_DELETE_LOCAL_FILE_AFTER_UPLOAD')"
>
<el-switch
v-model="form.deleteLocalFile"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleDeleteLocalFile"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_RENAME_BEFORE_UPLOAD')"
>
<el-switch
v-model="form.rename"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleRename"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_TIMESTAMP_RENAME')"
>
<el-switch
v-model="form.autoRename"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleAutoRename"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_UPLOAD_TIPS')"
>
<el-switch
v-model="form.uploadNotification"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleUploadNotification"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_MAIN_WINDOW_SIZE')"
>
@ -346,6 +145,190 @@
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_LAUNCH_ON_BOOT')"
>
<el-switch
v-model="form.autoStart"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleAutoStartChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_SHORTCUT')"
>
<el-button
type="primary"
round
size="small"
@click="goShortCutPage"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
</el-form>
</el-row>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane
name="syncAndConfigure"
:label="$T('SETTINGS_TAB_SYNC_CONFIG')"
style="height: 100%;overflow-y: scroll;height: calc(100vh - 50px);color: #fff;"
>
<el-row class="setting-list">
<el-col
:span="22"
:offset="1"
>
<el-row style="width: 100%">
<el-form
label-position="left"
label-width="50%"
size="small"
>
<el-form-item
:label="$T('SETTINGS_SYNC_CONFIG')"
>
<el-button
type="primary"
round
size="small"
@click="syncVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_UP_DOWN_DESC')"
>
<el-button
type="primary"
round
size="small"
@click=" upDownConfigVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_MIGRATE_FROM_PICGO')"
>
<el-button
type="primary"
round
size="small"
@click="handleMigrateFromPicGo"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_CONFIG_FILE')"
>
<el-button
type="primary"
round
size="small"
@click="openFile('data.json')"
>
{{ $T('SETTINGS_CLICK_TO_OPEN') }}
</el-button>
</el-form-item>
</el-form>
</el-row>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane
name="upload"
:label="$T('SETTINGS_TAB_UPLOAD')"
style="height: 100%;overflow-y: scroll;height: calc(100vh - 50px);color: #fff;"
>
<el-row class="setting-list">
<el-col
:span="22"
:offset="1"
>
<el-row style="width: 100%">
<el-form
label-position="left"
label-width="50%"
size="small"
>
<el-form-item
:label="$T('SETTINGS_AUTO_IMPORT')"
>
<el-switch
v-model="form.autoImport"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="autoImportChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SYNC_DELETE_CLOUD')"
>
<el-switch
v-model="form.deleteCloudFile"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleDeleteCloudFile"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_UPLOAD_TIPS')"
>
<el-switch
v-model="form.uploadNotification"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleUploadNotification"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_COMPRESS_AND_WATERMARK')"
>
<el-button
type="primary"
round
size="small"
@click="imageProcessDialogVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_RENAME_BEFORE_UPLOAD')"
>
<el-switch
v-model="form.rename"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleRename"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_TIMESTAMP_RENAME')"
>
<el-switch
v-model="form.autoRename"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleAutoRename"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_DELETE_LOCAL_FILE_AFTER_UPLOAD')"
>
<el-switch
v-model="form.deleteLocalFile"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleDeleteLocalFile"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_AUTO_COPY_URL_AFTER_UPLOAD')"
>
@ -356,6 +339,18 @@
@change="handleAutoCopyUrl"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_CUSTOM_LINK_FORMAT')"
>
<el-button
type="primary"
round
size="small"
@click="customLinkVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SHORT_URL')"
>
@ -366,6 +361,16 @@
@change="handleUseShortUrl"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_ENCODE_OUTPUT_URL')"
>
<el-switch
v-model="form.encodeOutputURL"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleEncodeOutputURL"
/>
</el-form-item>
<el-form-item>
<template #label>
<el-row align="middle">
@ -389,16 +394,6 @@
@change="useBuiltinClipboardChange"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_ENCODE_OUTPUT_URL')"
>
<el-switch
v-model="form.encodeOutputURL"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="handleEncodeOutputURL"
/>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_WATCH_CLIPBOARD')"
>
@ -432,6 +427,108 @@
</el-row>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane
name="advanced"
:label="$T('SETTINGS_TAB_ADVANCED')"
style="height: 100%;overflow-y: scroll;height: calc(100vh - 50px);color: #fff;"
>
<el-row class="setting-list">
<el-col
:span="22"
:offset="1"
>
<el-row style="width: 100%">
<el-form
label-position="left"
label-width="50%"
size="small"
>
<el-form-item
:label="$T('SETTINGS_SET_LOG_FILE')"
>
<el-button
type="primary"
round
size="small"
@click="openLogSetting"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_PROXY_AND_MIRROR')"
>
<el-button
type="primary"
round
size="small"
@click="proxyVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_SET_SERVER')"
>
<el-button
type="primary"
round
size="small"
@click="serverVisible = true"
>
{{ $T('SETTINGS_CLICK_TO_SET') }}
</el-button>
</el-form-item>
</el-form>
</el-row>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane
name="upadte"
:label="$T('SETTINGS_TAB_UPDATE')"
style="height: 100%;overflow-y: scroll;height: calc(100vh - 50px);"
>
<el-row class="setting-list">
<el-col
:span="22"
:offset="1"
>
<el-row style="width: 100%">
<el-form
label-position="left"
label-width="50%"
size="small"
>
<el-form-item
:label="$T('SETTINGS_CHECK_UPDATE')"
>
<el-button
type="primary"
round
size="small"
@click="checkUpdate"
>
{{ $T('SETTINGS_CLICK_TO_CHECK') }}
</el-button>
</el-form-item>
<el-form-item
:label="$T('SETTINGS_OPEN_UPDATE_HELPER')"
>
<el-switch
v-model="form.updateHelper"
:active-text="$T('SETTINGS_OPEN')"
:inactive-text="$T('SETTINGS_CLOSE')"
@change="updateHelperChange"
/>
</el-form-item>
</el-form>
</el-row>
</el-col>
</el-row>
</el-tab-pane>
</el-tabs>
<el-dialog
v-model="customLinkVisible"
:title="$T('SETTINGS_CUSTOM_LINK_FORMAT')"
@ -1171,6 +1268,7 @@ import { IConfig, IBuildInCompressOptions, IBuildInWaterMarkOptions } from 'picl
import { invokeToMain } from '@/manage/utils/dataSender'
const imageProcessDialogVisible = ref(false)
const activeName = ref<'system' | 'syncAndConfigure' | 'upload' | 'advanced' | 'upadte'>('system')
const waterMarkPositionMap = new Map([
['north', $T('UPLOAD_PAGE_IMAGE_PROCESS_POSITION_TOP')],
@ -1901,6 +1999,8 @@ export default {
transition color .2s ease-in-out
&:hover
color #49B1F5
.el-tabs__item
color:white
#picgo-setting
height 100%
position absolute

5
src/universal/types/i18n.d.ts vendored
View File

@ -261,6 +261,11 @@ interface ILocales {
SETTINGS_SYNC_COMMON_CONFIG: string
SETTINGS_SYNC_MANAGE_CONFIG: string
SETTINGS_AUTO_IMPORT: string
SETTINGS_TAB_SYSTEM: string
SETTINGS_TAB_SYNC_CONFIG: string
SETTINGS_TAB_UPLOAD: string
SETTINGS_TAB_ADVANCED: string
SETTINGS_TAB_UPDATE: string
SHORTCUT_NAME: string
SHORTCUT_BIND: string
SHORTCUT_STATUS: string