✨ Feature(custom): optimize the logic of second picbed upload, and fix a bug of local picbed

resources/i18n/en.yml

@@ -21,7 +21,7 @@ NO_MORE_NOTICE: No More Notice
 SHOW_DEVTOOLS: Show Devtools
 FEEDBACK: Feedback
 CURRENT_PICBED: Current Picbed
-CURRENT_SECOND_PICBED: Current Second Picbed
+CURRENT_SECOND_PICBED: Current
 START_WATCH_CLIPBOARD: Start Watch Clipboard
 STOP_WATCH_CLIPBOARD: Stop Watch Clipboard
 OPEN_TOOLBOX: Open Toolbox

resources/i18n/zh-CN.yml

@@ -21,7 +21,7 @@ NO_MORE_NOTICE: 以后不再提醒
 SHOW_DEVTOOLS: 打开开发者工具
 FEEDBACK: 反馈问题
 CURRENT_PICBED: 当前图床
-CURRENT_SECOND_PICBED: 当前第二图床
+CURRENT_SECOND_PICBED: 当前
 START_WATCH_CLIPBOARD: 开始监听剪贴板
 STOP_WATCH_CLIPBOARD: 停止监听剪贴板
 OPEN_TOOLBOX: 打开修复工具箱

resources/i18n/zh-TW.yml

@@ -21,7 +21,7 @@ NO_MORE_NOTICE: 以後不再提醒
 SHOW_DEVTOOLS: 開啟開發者工具
 FEEDBACK: 問題反饋
 CURRENT_PICBED: 當前圖床
-CURRENT_SECOND_PICBED: 當前第二圖床
+CURRENT_SECOND_PICBED: 當前
 START_WATCH_CLIPBOARD: 開始監聽剪貼簿
 STOP_WATCH_CLIPBOARD: 停止監聽剪貼簿
 OPEN_TOOLBOX: 開啟修復工具箱

src/main/apis/app/system/index.ts

@@ -1,7 +1,7 @@
 import db, { GalleryDB } from '@core/datastore'
 import picgo from '@core/picgo'
 import uploader from 'apis/app/uploader'
-import { handleSecondaryUpload, uploadClipboardFiles } from 'apis/app/uploader/apis'
+import { uploadClipboardFiles } from 'apis/app/uploader/apis'
 import windowManager from 'apis/app/window/windowManager'
 import {
   app,
@@ -312,16 +312,9 @@ export function createTray(tooltip: string) {
         const pasteStyle = db.get(configPaths.settings.pasteStyle) || IPasteStyle.MARKDOWN
         const rawInput = cloneDeep(files)
         const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)!
-        const { needRestore, ctx } = await handleSecondaryUpload(trayWindow.webContents, files, 'tray')
+        const res = await uploader.setWebContents(trayWindow.webContents).uploadReturnCtx(files)
-        let imgs: ImgInfo[] | false = false
+        const imgs = res[0] ? res[0] : false
-        if (needRestore) {
+        const backImgs = res[1] ? res[1] : false
-          const res = await uploader
-            .setWebContents(trayWindow.webContents)
-            .uploadReturnCtx(ctx ? ctx.processedInput : files, true)
-          imgs = res ? res.output : false
-        } else {
-          imgs = await uploader.setWebContents(trayWindow.webContents).upload(files)
-        }
         const deleteLocalFile = db.get(configPaths.settings.deleteLocalFile) || false
         if (imgs !== false) {
           const pasteText: string[] = []
@@ -355,6 +348,12 @@ export function createTray(tooltip: string) {
           handleCopyUrl(pasteText.join('\n'))
           trayWindow.webContents.send('dragFiles', imgs)
         }
+        if (backImgs !== false) {
+          for (const backImg of backImgs) {
+            await GalleryDB.getInstance().insert(backImg)
+          }
+          trayWindow.webContents.send('dragFiles', backImgs)
+        }
       })
     }
     // toggleWindow()

src/main/apis/app/uploader/apis.ts

@@ -5,48 +5,31 @@ import windowManager from 'apis/app/window/windowManager'
 import { Notification, WebContents } from 'electron'
 import fs from 'fs-extra'
 import { cloneDeep } from 'lodash-es'
-import type { IPicGo } from 'piclist'
 
 import { T as $t } from '~/i18n/index'
 import { handleCopyUrl, handleUrlEncodeWithSetting } from '~/utils/common'
 import { configPaths } from '~/utils/configPaths'
 import { IPasteStyle, IWindowList } from '~/utils/enum'
-import { changeCurrentUploader } from '~/utils/handleUploaderConfig'
 import pasteTemplate from '~/utils/pasteTemplate'
 
-const handleClipboardUploading = async (): Promise<false | ImgInfo[]> => {
+const handleClipboardUploadingReturnCtx = async (img?: IUploadOption): Promise<(ImgInfo[] | false)[]> => {
   const useBuiltinClipboard =
     db.get(configPaths.settings.useBuiltinClipboard) === undefined
       ? true
       : !!db.get(configPaths.settings.useBuiltinClipboard)
   const win = windowManager.getAvailableWindow()
   if (useBuiltinClipboard) {
-    return await uploader.setWebContents(win!.webContents).uploadWithBuildInClipboard()
+    return await uploader.setWebContents(win!.webContents).uploadWithBuildInClipboardReturnCtx(img)
   }
-  return await uploader.setWebContents(win!.webContents).upload()
+  return await uploader.setWebContents(win!.webContents).uploadReturnCtx(img)
-}
-
-const handleClipboardUploadingReturnCtx = async (img?: IUploadOption, skipProcess = false): Promise<false | IPicGo> => {
-  const useBuiltinClipboard =
-    db.get(configPaths.settings.useBuiltinClipboard) === undefined
-      ? true
-      : !!db.get(configPaths.settings.useBuiltinClipboard)
-  const win = windowManager.getAvailableWindow()
-  if (useBuiltinClipboard) {
-    return await uploader.setWebContents(win!.webContents).uploadWithBuildInClipboardReturnCtx(img, skipProcess)
-  }
-  return await uploader.setWebContents(win!.webContents).uploadReturnCtx(img, skipProcess)
 }
 
 export const uploadClipboardFiles = async (): Promise<IStringKeyMap> => {
-  const { needRestore, ctx } = await handleSecondaryUpload(undefined, undefined, 'clipboard')
   let img: ImgInfo[] | false = false
-  if (needRestore) {
+  let backImg: ImgInfo[] | false = false
-    const res = await handleClipboardUploadingReturnCtx(ctx ? ctx.processedInput : undefined, true)
+  const res = await handleClipboardUploadingReturnCtx()
-    img = res ? res.output : false
+  img = res[0] ? res[0] : false
-  } else {
+  backImg = res[1] ? res[1] : false
-    img = await handleClipboardUploading()
-  }
   if (img !== false) {
     if (img.length > 0) {
       const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)
@@ -71,10 +54,17 @@ export const uploadClipboardFiles = async (): Promise<IStringKeyMap> => {
       const inserted = await GalleryDB.getInstance().insert(img[0])
       // trayWindow just be created in mac/windows, not in linux
       trayWindow?.webContents?.send('clipboardFiles', [])
-      trayWindow?.webContents?.send('uploadFiles', img)
+      trayWindow?.webContents?.send('uploadFiles')
       if (windowManager.has(IWindowList.SETTING_WINDOW)) {
         windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
       }
+      if (backImg !== false) {
+        await GalleryDB.getInstance().insert(backImg[0])
+        trayWindow?.webContents?.send('uploadFiles')
+        if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
+        }
+      }
       return {
         url: handleUrlEncodeWithSetting(inserted.imgUrl as string),
         fullResult: inserted,
@@ -104,14 +94,11 @@ export const uploadChoosedFiles = async (
 ): Promise<IStringKeyMap[]> => {
   const input = files.map(item => item.path)
   const rawInput = cloneDeep(input)
-  const { needRestore, ctx } = await handleSecondaryUpload(webContents, input)
   let imgs: ImgInfo[] | false = false
-  if (needRestore) {
+  let backImgs: ImgInfo[] | false = false
-    const res = await uploader.setWebContents(webContents).uploadReturnCtx(ctx ? ctx.processedInput : input, true)
+  const res = await uploader.setWebContents(webContents).uploadReturnCtx(input)
-    imgs = res ? res.output : false
+  imgs = res[0] ? res[0] : false
-  } else {
+  backImgs = res[1] ? res[1] : false
-    imgs = await uploader.setWebContents(webContents).upload(input)
-  }
   const result = []
   if (imgs !== false) {
     const pasteStyle = db.get(configPaths.settings.pasteStyle) || IPasteStyle.MARKDOWN
@@ -167,80 +154,21 @@ export const uploadChoosedFiles = async (
     }
     handleCopyUrl(pasteText.join('\n'))
     // trayWindow just be created in mac/windows, not in linux
-    windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles', imgs)
+    windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles')
     if (windowManager.has(IWindowList.SETTING_WINDOW)) {
       windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
     }
+    if (backImgs !== false) {
+      for (const backImg of backImgs) {
+        await GalleryDB.getInstance().insert(backImg)
+      }
+      windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles')
+      if (windowManager.has(IWindowList.SETTING_WINDOW)) {
+        windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
+      }
+    }
     return result
   } else {
     return []
   }
 }
-
-export const handleSecondaryUpload = async (
-  webContents?: WebContents,
-  input?: string[],
-  uploadType: 'clipboard' | 'file' | 'tray' = 'file',
-): Promise<{ needRestore: boolean; ctx: IPicGo | false }> => {
-  const enableSecondUploader = db.get(configPaths.settings.enableSecondUploader) || false
-  let currentPicBedType = ''
-  let currentPicBedConfig = {} as IStringKeyMap
-  let currentPicBedConfigId = ''
-  let needRestore = false
-  let ctx: IPicGo | false = false
-  if (enableSecondUploader) {
-    const secondUploader = db.get(configPaths.picBed.secondUploader)
-    const secondUploaderConfig = db.get(configPaths.picBed.secondUploaderConfig)
-    const secondUploaderId = db.get(configPaths.picBed.secondUploaderId)
-    const currentPicBed = db.get('picBed') || ({} as IStringKeyMap)
-    currentPicBedType = currentPicBed.uploader || currentPicBed.current || 'smms'
-    currentPicBedConfig = currentPicBed[currentPicBedType] || ({} as IStringKeyMap)
-    currentPicBedConfigId = currentPicBedConfig._id
-    if (
-      secondUploader === currentPicBedType &&
-      secondUploaderConfig._configName === currentPicBedConfig._configName &&
-      secondUploaderId === currentPicBedConfigId
-    ) {
-      picgo.log.info('second uploader is the same as current uploader')
-    } else {
-      needRestore = true
-      let secondImgs: ImgInfo[] | false = false
-      changeCurrentUploader(secondUploader, secondUploaderConfig, secondUploaderId)
-      if (uploadType === 'clipboard') {
-        ctx = await handleClipboardUploadingReturnCtx(undefined)
-      } else {
-        ctx = await uploader.setWebContents(webContents!).uploadReturnCtx(input)
-      }
-      secondImgs = ctx ? ctx.output : false
-      if (secondImgs !== false) {
-        const trayWindow = windowManager.get(IWindowList.TRAY_WINDOW)
-        if (uploadType === 'clipboard') {
-          if (secondImgs.length > 0) {
-            await GalleryDB.getInstance().insert(secondImgs[0])
-            trayWindow?.webContents?.send('clipboardFiles', [])
-            trayWindow?.webContents?.send('uploadFiles', secondImgs)
-          }
-        } else {
-          for (const secondImgsItem of secondImgs) {
-            await GalleryDB.getInstance().insert(secondImgsItem)
-          }
-          if (uploadType === 'tray') {
-            trayWindow?.webContents?.send('dragFiles', secondImgs)
-          } else {
-            trayWindow?.webContents?.send('uploadFiles', secondImgs)
-          }
-        }
-        if (windowManager.has(IWindowList.SETTING_WINDOW) && uploadType !== 'tray') {
-          windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
-        }
-      }
-    }
-  }
-  if (needRestore) {
-    changeCurrentUploader(currentPicBedType, currentPicBedConfig, currentPicBedConfigId)
-  }
-  return {
-    needRestore,
-    ctx,
-  }
-}

src/main/apis/app/uploader/index.ts

@@ -137,15 +137,15 @@ class Uploader {
     }
   }
 
-  async uploadWithBuildInClipboardReturnCtx(img?: IUploadOption, skipProcess = false): Promise<IPicGo | false> {
+  async uploadWithBuildInClipboardReturnCtx(img?: IUploadOption): Promise<(ImgInfo[] | false)[]> {
     let imgPath: string | false = false
     try {
       imgPath = await this.getClipboardImagePath()
-      if (!imgPath) return false
+      if (!imgPath) return [false, false]
-      return await this.uploadReturnCtx(img ?? [imgPath], skipProcess)
+      return await this.uploadReturnCtx(img ?? [imgPath])
     } catch (e: any) {
       logger.error(e)
-      return false
+      return [false, false]
     } finally {
       if (imgPath && imgPath.startsWith(path.join(picgo.baseDir, CLIPBOARD_IMAGE_FOLDER))) {
         fs.remove(imgPath)
@@ -153,16 +153,25 @@ class Uploader {
     }
   }
 
-  async uploadReturnCtx(img?: IUploadOption, skipProcess = false): Promise<IPicGo | false> {
+  async uploadReturnCtx(img?: IUploadOption): Promise<(ImgInfo[] | false)[]> {
     try {
-      const ctx = await picgo.uploadReturnCtx(img, skipProcess)
+      const result = [false, false] as (ImgInfo[] | false)[]
-      if (!Array.isArray(ctx.output) || !ctx.output.some((item: ImgInfo) => item.imgUrl)) return false
+      const res = await picgo.uploadReturnCtx(img)
 
-      ctx.output.forEach((item: ImgInfo) => {
+      if (Array.isArray(res.output) && res.output.some((item: ImgInfo) => item.imgUrl)) {
+        res.output.forEach((item: ImgInfo) => {
           item.config = JSON.parse(JSON.stringify(db.get(`picBed.${item.type}`)))
         })
+        result[0] = res.output
+      }
 
-      return ctx
+      if (Array.isArray(res.backupOutput) && res.backupOutput.some((item: ImgInfo) => item.imgUrl)) {
+        res.backupOutput.forEach((item: ImgInfo) => {
+          item.config = JSON.parse(JSON.stringify(db.get(`picBed.${item.type}`)))
+        })
+        result[1] = res.backupOutput
+      }
+      return result
     } catch (e: any) {
       logger.error(e)
       setTimeout(() => {
@@ -172,7 +181,7 @@ class Uploader {
           clickToCopy: true,
         })
       }, 500)
-      return false
+      return [false, false]
     } finally {
       ipcMain.removeAllListeners(GET_RENAME_FILE_NAME)
     }

src/main/apis/gui/index.ts

@@ -3,7 +3,6 @@ import db, { GalleryDB } from '@core/datastore'
 import { dbPathChecker, defaultConfigPath, getGalleryDBPath } from '@core/datastore/dbChecker'
 import { DBStore } from '@piclist/store'
 import uploader from 'apis/app/uploader'
-import { handleSecondaryUpload } from 'apis/app/uploader/apis'
 import { BrowserWindow, dialog, ipcMain, IpcMainEvent, MessageBoxOptions, Notification } from 'electron'
 import fs from 'fs-extra'
 import { cloneDeep } from 'lodash-es'
@@ -74,14 +73,10 @@ class GuiApi implements IGuiApi {
     this.windowId = await getWindowId()
     const webContents = this.getWebcontentsByWindowId(this.windowId)
     const rawInput = cloneDeep(input)
-    const { needRestore, ctx } = await handleSecondaryUpload(webContents!, input)
+    const res = await uploader.setWebContents(webContents!).uploadReturnCtx(input)
-    let imgs: ImgInfo[] | false = false
+    const imgs = res[0] ? res[0] : false
-    if (needRestore) {
+    const backImgs = res[1] ? res[1] : false
-      const res = await uploader.setWebContents(webContents!).uploadReturnCtx(ctx ? ctx.processedInput : input, true)
+    let result: ImgInfo[] = []
-      imgs = res ? res.output : false
-    } else {
-      imgs = await uploader.setWebContents(webContents!).upload(input)
-    }
     if (imgs !== false) {
       const pasteStyle = db.get(configPaths.settings.pasteStyle) || IPasteStyle.MARKDOWN
       const deleteLocalFile = db.get(configPaths.settings.deleteLocalFile) || false
@@ -114,11 +109,18 @@ class GuiApi implements IGuiApi {
         await GalleryDB.getInstance().insert(imgs[i])
       }
       handleCopyUrl(pasteText.join('\n'))
-      webContents?.send('uploadFiles', imgs)
+      webContents?.send('uploadFiles')
       webContents?.send('updateGallery')
-      return imgs
+      result = imgs
     }
-    return []
+    if (backImgs !== false) {
+      for (const backImg of backImgs) {
+        await GalleryDB.getInstance().insert(backImg)
+      }
+      webContents?.send('uploadFiles')
+      webContents?.send('updateGallery')
+    }
+    return result
   }
 
   showNotification(

src/main/events/remotes/menu.ts

@@ -139,12 +139,16 @@ const buildMainPageMenu = (win: BrowserWindow) => {
 const buildSecondPicBedMenu = () => {
   const picBeds = getPicBeds().picBeds
   const secondUploader = picgo.getConfig(configPaths.picBed.secondUploader)
-  const defaultSecondUploaderId = picgo.getConfig(configPaths.picBed.secondUploaderId)
+  const defaultSecondUploaderConfig = picgo.getConfig(configPaths.picBed.secondUploaderConfig) as
+    | IUploaderConfig
+    | undefined
+  const defaultSecondUploaderId = defaultSecondUploaderConfig?._id || ''
+  const defaultSecondUploaderName = defaultSecondUploaderConfig?._configName || 'Default'
   const currentPicBedName = picBeds.find(item => item.type === secondUploader)?.name
   const picBedConfigList = picgo.getConfig<IUploaderConfig>('uploader')
   const currentPicBedMenuItem = [
     {
-      label: `${$t('CURRENT_SECOND_PICBED')} - ${currentPicBedName || 'None'}`,
+      label: `${$t('CURRENT_SECOND_PICBED')} - ${currentPicBedName || 'None'} - ${defaultSecondUploaderName}`,
       enabled: false,
     },
     {
@@ -169,16 +173,17 @@ const buildSecondPicBedMenu = () => {
                 type: 'checkbox',
                 checked: config._id === defaultSecondUploaderId && item.type === secondUploader,
                 click() {
-                  changeSecondUploader(item.type, config, config._id)
+                  changeSecondUploader(item.type, config)
                 },
               }
             })
           : undefined,
         click: !hasSubmenu
           ? function () {
-              picgo.saveConfig({
+              const current = picgo.getConfig(`picBed.${item.type}`)
-                [configPaths.picBed.secondUploader]: item.type,
+              if (current) {
-              })
+                changeSecondUploader(item.type, current)
+              }
             }
           : undefined,
       }

src/main/utils/getPicBeds.ts

@@ -27,7 +27,7 @@ const getPicBeds = () => {
       }
       return 0
     }) as IPicBedType[]
-  return { picBeds, defaultPicBed, defaultId, defaultConfigName }
+  return { picBeds, defaultPicBed, defaultId, defaultConfigName, defaultConfig }
 }
 
 export default getPicBeds

src/main/utils/handleUploaderConfig.ts

@@ -27,15 +27,10 @@ export const completeUploaderMetaConfig = (originData: IStringKeyMap, id?: strin
   }
 }
 
-export const changeSecondUploader = (type: string, config?: IStringKeyMap, id?: string) => {
+export const changeSecondUploader = (type: string, config?: IStringKeyMap) => {
   if (!type) {
     return
   }
-  if (id) {
-    picgo.saveConfig({
-      [configPaths.picBed.secondUploaderId]: id,
-    })
-  }
   if (config) {
     picgo.saveConfig({
       [configPaths.picBed.secondUploaderConfig]: config,

src/main/utils/uploadTaskQueue.ts

@@ -261,7 +261,7 @@ class UploadTaskQueueManager {
 
       const inserted = await GalleryDB.getInstance().insert(img)
 
-      windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles', [img])
+      windowManager.get(IWindowList.TRAY_WINDOW)?.webContents?.send('uploadFiles')
       if (windowManager.has(IWindowList.SETTING_WINDOW)) {
         windowManager.get(IWindowList.SETTING_WINDOW)!.webContents?.send('updateGallery')
       }

src/renderer/hooks/useGlobal.ts

@@ -10,12 +10,14 @@ interface getPicBedType {
   defaultPicBed: string
   defaultConfigName: string
   defaultId: string
+  defaultConfig: IStringKeyMap
 }
 
 const _picBeds = ref<IPicBedType[]>([])
 const _defaultPicBed = ref<string>('')
 const _defaultConfigName = ref<string>('')
 const _defaultPicBedId = ref<string>('')
+const _defaultConfigG = ref<IStringKeyMap>({})
 
 export function usePicBed() {
   const updatePicBeds = async () => {
@@ -25,6 +27,7 @@ export function usePicBed() {
       _defaultPicBed.value = result.defaultPicBed
       _defaultConfigName.value = result.defaultConfigName
       _defaultPicBedId.value = result.defaultId
+      _defaultConfigG.value = result.defaultConfig
     }
   }
   return {
@@ -32,6 +35,7 @@ export function usePicBed() {
     defaultPicBedG: readonly(_defaultPicBed),
     defaultConfigNameG: readonly(_defaultConfigName),
     defaultIdG: readonly(_defaultPicBedId),
+    defaultConfigG: readonly(_defaultConfigG),
     updatePicBeds,
   }
 }

src/renderer/i18n/locales/en.json

@@ -841,6 +841,7 @@
         "availablePlaceholdersTitle": "Use these placeholders to customize link format",
         "c1nToken": "C1N Token",
         "cfWorkerHost": "CF Worker Address",
+        "chooseSecondPicBedMode": "Choose Second Image Bed Mode",
         "chooseShowedPicBed": "Please select the image bed to display in the menu",
         "clipboardAndNotification": "Clipboard and Notification",
         "copySuccess": "Copy Successful: {content}",
@@ -888,6 +889,10 @@
           "year2": "Year, 2 Digits",
           "year4": "Year, 4 Digits"
         },
+        "secondPicBedMode": {
+          "backup": "Backup Mode",
+          "seperate": "Separate Mode"
+        },
         "setSecondPicBed": "Set Second Image Bed",
         "setSecondPicBedDesc": "Configure secondary image bed for backup",
         "shortUrlServer": "Short URL Service",

src/renderer/i18n/locales/zh-CN.json

@@ -836,6 +836,7 @@
         "availablePlaceholdersTitle": "使用以下占位符自定义链接格式",
         "c1nToken": "C1N Token",
         "cfWorkerHost": "CF Worker 地址",
+        "chooseSecondPicBedMode": "选择第二图床模式",
         "chooseShowedPicBed": "请选择显示在菜单的图床",
         "clipboardAndNotification": "剪贴板和通知",
         "copySuccess": "复制成功: {content}",
@@ -883,6 +884,10 @@
           "year2": "年份，2位数",
           "year4": "年份，4位数"
         },
+        "secondPicBedMode": {
+          "backup": "备份模式",
+          "seperate": "独立模式"
+        },
         "setSecondPicBed": "设置第二图床",
         "setSecondPicBedDesc": "配置用于备份的第二图床",
         "shortUrlServer": "短链接服务",

src/renderer/i18n/locales/zh-TW.json

@@ -836,6 +836,7 @@
         "availablePlaceholdersTitle": "使用以下占位符自定義鏈接格式",
         "c1nToken": "C1N Token",
         "cfWorkerHost": "CF Worker 地址",
+        "chooseSecondPicBedMode": "選擇第二圖床模式",
         "chooseShowedPicBed": "請選擇顯示在菜單的圖床",
         "clipboardAndNotification": "剪貼板和通知",
         "copySuccess": "複製成功: {content}",
@@ -883,6 +884,10 @@
           "year2": "年份，2位數",
           "year4": "年份，4位數"
         },
+        "secondPicBedMode": {
+          "backup": "備份模式",
+          "seperate": "獨立模式"
+        },
         "setSecondPicBed": "設置第二圖床",
         "setSecondPicBedDesc": "配置用於備份的第二圖床",
         "shortUrlServer": "短鏈接服務",

src/renderer/pages/PicGoSetting.vue

@@ -388,6 +388,18 @@
                   </svg>
                 </div>
               </div>
+
+              <div class="system-option-card">
+                <div class="system-option-header">
+                  <Settings2Icon :size="18" />
+                  <span>{{ t('pages.settings.upload.chooseSecondPicBedMode') }}</span>
+                </div>
+                <select v-model="currentSecondMode" class="form-select">
+                  <option v-for="item in secondModeList" :key="item.value" :value="item.value">
+                    {{ item.label }}
+                  </option>
+                </select>
+              </div>
             </div>
           </div>
 
@@ -1757,6 +1769,7 @@ import {
   RotateCcw,
   Server,
   Settings,
+  Settings2Icon,
   Store,
 } from 'lucide-vue-next'
 import { marked } from 'marked'
@@ -1810,6 +1823,11 @@ const languageList = [
   { label: 'English', value: 'en' },
 ]
 
+const secondModeList = [
+  { label: t('pages.settings.upload.secondPicBedMode.backup'), value: 'backup' },
+  { label: t('pages.settings.upload.secondPicBedMode.seperate'), value: 'seperate' },
+]
+
 const formOfSetting = ref<ISettingForm>({
   showUpdateTip: true,
   autoStart: false,
@@ -1900,6 +1918,12 @@ const addWatch = () => {
     )
   })
 
+  watch(currentSecondMode, newVal => {
+    if (newVal) {
+      saveConfig({ [configPaths.settings.secondPicBedMode]: newVal })
+    }
+  })
+
   watch(currentLanguage, newVal => {
     if (newVal) {
       handleLanguageChange(newVal)
@@ -1959,6 +1983,7 @@ function copyPlaceholder(placeholder: string) {
 }
 
 const currentLanguage = ref()
+const currentSecondMode = ref()
 const currentStartMode = ref()
 const currentShortUrlServer = ref()
 
@@ -2079,6 +2104,7 @@ async function initData() {
   formOfSetting.value.autoImportPicBed = initArray(settings.autoImportPicBed || [], [])
   currentLanguage.value = settings.language || 'zh-CN'
   currentStartMode.value = settings.startMode || ISartMode.QUIET
+  currentSecondMode.value = settings.secondPicBedMode || 'backup'
   if (osGlobal.value === 'darwin' && currentStartMode.value === ISartMode.MINI) {
     currentStartMode.value = ISartMode.QUIET
     saveConfig(configPaths.settings.startMode, ISartMode.QUIET)

src/renderer/pages/Upload.vue

@@ -86,7 +86,7 @@
         @drop.prevent="onDrop"
         @dragover.prevent="dragover = true"
         @dragleave.prevent="dragover = false"
-        @click="openUplodWindow"
+        @click="openUploadWindow"
       >
         <div class="upload-content">
           <div class="upload-icon">
@@ -709,12 +709,10 @@ const taskQueueStatus = reactive<IUploadTaskQueueStatus>({
 const filteredTasks = computed(() => {
   let tasks = taskQueueStatus.tasks
 
-  // Filter by status
   if (taskFilter.value !== 'all') {
     tasks = tasks.filter(t => t.status === taskFilter.value)
   }
 
-  // Filter by search query
   if (taskSearchQuery.value) {
     const query = taskSearchQuery.value.toLowerCase()
     tasks = tasks.filter(t => t.fileName.toLowerCase().includes(query))
@@ -823,8 +821,6 @@ function onDrop(e: DragEvent) {
 }
 
 function handleURLDrag(items: DataTransferItemList, dataTransfer: DataTransfer) {
-  // text/html
-  // Use this data to get a more precise URL
   const urlString = dataTransfer.getData(items[1].type)
   const urlMatch = urlString.match(/<img.*src="(.*?)"/)
   if (urlMatch) {
@@ -838,7 +834,7 @@ function handleURLDrag(items: DataTransferItemList, dataTransfer: DataTransfer)
   }
 }
 
-function openUplodWindow() {
+function openUploadWindow() {
   fileInput.value?.click()
 }
 

src/renderer/pages/css/UploadPage.css

@@ -58,7 +58,7 @@ html, body {
   align-items: center;
   gap: 0.5rem;
   flex-wrap: wrap;
-  max-width: calc(100% - 300px); /* Leave space for header-actions */
+  max-width: calc(100% - 300px);
 }
 
 .provider-button {
@@ -164,8 +164,6 @@ html, body {
 
 .picbed-badge.is-active {
   border-color: var(--color-accent);
-  color: var(--color-accent);
-  background: var(--color-accent-soft, rgb(59 130 246 / 10%));
   font-weight: 600;
 }
 
@@ -464,7 +462,6 @@ html, body {
 
 /* Quick Actions Card */
 .card-header {
-  border-bottom: 1px solid var(--color-border-secondary);
   padding: 1rem 1.5rem;
 }
 
@@ -605,7 +602,7 @@ html, body {
 .format-button {
   border: 1px solid var(--color-border);
   border-radius: var(--radius-md);
-  padding: 0.4rem 0.75rem;
+  padding: 0.5rem 0.75rem;
   font-size: 0.7rem;
   font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
   font-weight: 500;
@@ -637,7 +634,7 @@ html, body {
 
 .toggle-button {
   border: none;
-  padding: 0.625rem 0.875rem;
+  padding: 0.325rem 0.675rem;
   font-size: 0.8rem;
   font-family: inherit;
   font-weight: 500;

src/renderer/utils/configPaths.ts

@@ -172,6 +172,7 @@ export const configPaths = {
     autoImportPicBed: 'settings.autoImportPicBed',
     galleryPicBedFilter: 'settings.galleryPicBedFilter',
     enableSecondUploader: 'settings.enableSecondUploader',
+    secondPicBedMode: 'settings.secondPicBedMode',
   },
   needReload: 'needReload',
   picgoPlugins: 'picgoPlugins',