🐛 Fix(custom): fix formatobjmap save issue and optimize ux

src/main/utils/handleUploaderConfig.ts

@@ -136,7 +136,6 @@ export const duplicateUploaderConfig = (type: string, id: string, newName: strin
   }
 
   const updatedConfigList = [...configList, duplicatedConfig]
-  console.log('updatedConfigList', updatedConfigList)
 
   picgo.saveConfig({
     [`uploader.${type}.configList`]: updatedConfigList,

src/renderer/components/ImageProcessSetting.vue

@@ -161,9 +161,8 @@
                 <PerPicbedSetting
                   v-if="!configId"
                   :map-field="compressForm.formatConvertObjMap"
-                  :default-value="defaultCompressSetting.formatConvertObj"
+                  :default-value="'{}'"
                   field-name="formatConvertObj"
-                  :global-value="compressForm.formatConvertObj"
                   input-type="text"
                   text-placeholder="{}"
                   @map-change="
@@ -1125,10 +1124,9 @@ function saveSkipProcessConfig() {
 
 function saveCompressConfig() {
   const cleanFullMap: Record<string, any> = {}
-  Object.entries(compressForm.value.formatConvertObjMap || {}).forEach(([picbedType, jsonString]) => {
+  Object.entries(compressForm.value.formatConvertObjMap || {}).forEach(([picbedType, value]) => {
     try {
-      const parsedObj = JSON.parse(jsonString as string)
+      const cleanedObj = cleanFormatConvertObj(value)
-      const cleanedObj = cleanFormatConvertObj(parsedObj)
 
       if (Object.keys(cleanedObj).length > 0) {
         cleanFullMap[picbedType] = cleanedObj
@@ -1188,12 +1186,35 @@ async function initData() {
     } catch (_error) {
       cleanedObj = {}
     }
+    compress.formatConvertObj = cleanedObj
+    formatConvertObjStr.value = JSON.stringify(cleanedObj)
+    const cleanFullMap: Record<string, any> = {}
+    if (compress.formatConvertObjMap) {
+      Object.entries(compress.formatConvertObjMap).forEach(([picbedType, value]) => {
+        try {
+          if (typeof value === 'object') {
+            const cleanedObj = cleanFormatConvertObj(value)
+            if (Object.keys(cleanedObj).length > 0) {
+              cleanFullMap[picbedType] = cleanedObj
+            }
+          } else if (typeof value === 'string') {
+            const parsedObj = JSON.parse(value)
+            const cleanedObj = cleanFormatConvertObj(parsedObj)
+            if (Object.keys(cleanedObj).length > 0) {
+              cleanFullMap[picbedType] = cleanedObj
+            }
+          } else {
+            cleanFullMap[picbedType] = {}
+          }
+        } catch (_error) {}
+      })
+    }
+    compress.formatConvertObjMap = cleanFullMap
     saveConfig(configPaths.buildIn.compress, {
       ...compress,
       formatConvertObj: cleanedObj,
+      formatConvertObjMap: cleanFullMap,
     })
-    compress.formatConvertObj = cleanedObj
-    formatConvertObjStr.value = JSON.stringify(cleanedObj)
     compressForm.value = { ...compressForm.value, ...compress }
   }
   if (watermark) {
@@ -1213,12 +1234,29 @@ async function initData() {
 
 function safeSetMapValue(form: any, fieldName: string, picbedType: string, value: any, defaultValue: any) {
   const mapFieldName = `${fieldName}Map`
+  if (fieldName === 'formatConvertObj') {
+    value = value || '{}'
+    let parsedObj = {}
+    try {
+      parsedObj = JSON.parse(value)
+      const cleanedObj = cleanFormatConvertObj(parsedObj)
+      if (JSON.stringify(cleanedObj) !== JSON.stringify(parsedObj)) {
+        value = JSON.stringify(cleanedObj)
+      }
+    } catch (_error) {
+      return
+    }
+  }
   if (!form[mapFieldName]) {
     form[mapFieldName] = {}
   }
   if (value === defaultValue) {
     delete form[mapFieldName][picbedType]
   } else {
+    if (fieldName === 'formatConvertObj') {
+      form[mapFieldName][picbedType] = JSON.parse(value)
+      return
+    }
     form[mapFieldName][picbedType] = value
   }
 }

src/renderer/components/PerPicbedSetting.vue

@@ -8,7 +8,13 @@
     </div>
 
     <div v-if="showSettings" class="map-settings-panel">
-      <h4>{{ t('pages.imageProcess.perPicBed.description') }}</h4>
+      <h4>
+        {{
+          t('pages.imageProcess.perPicBed.defaultValue', {
+            value: globalValue !== undefined ? globalValue : defaultValue,
+          })
+        }}
+      </h4>
       <div class="picbed-settings-grid">
         <div v-for="picbed in availablePicbeds" :key="picbed.type" class="picbed-setting-item">
           <label class="picbed-name">{{ picbed.name }}</label>
@@ -113,6 +119,7 @@ import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 import { usePicBed } from '@/hooks/useGlobal'
+import { getRawData } from '@/utils/common'
 
 const { t } = useI18n()
 const { picBedG } = usePicBed()
@@ -130,7 +137,7 @@ interface RadioOption {
 const {
   mapField,
   defaultValue,
-  globalValue,
+  globalValue = undefined,
   inputType,
   rangeMin = 0,
   rangeMax = 100,
@@ -147,7 +154,7 @@ interface Props {
   mapField: Record<string, any> | undefined
   defaultValue: any
   fieldName: string
-  globalValue: any
+  globalValue?: any
   inputType: 'checkbox' | 'range' | 'number' | 'text' | 'color' | 'select' | 'radio'
   rangeMin?: number
   rangeMax?: number
@@ -175,7 +182,10 @@ const availablePicbeds = computed(() => {
 
 function getMapValue(mapObj: Record<string, any> | undefined, picbedType: string, defaultValue: any) {
   if (!mapObj) return defaultValue
-  return mapObj[picbedType] !== undefined ? mapObj[picbedType] : globalValue !== undefined ? globalValue : defaultValue
+  const rawMapObj = getRawData(mapObj)
+  const value =
+    rawMapObj[picbedType] !== undefined ? rawMapObj[picbedType] : globalValue !== undefined ? globalValue : defaultValue
+  return typeof value === 'object' ? JSON.stringify(getRawData(value)) : value
 }
 
 function handleMapChange(picbedType: string, value: any) {

src/renderer/hooks/useGlobal.ts

@@ -19,7 +19,6 @@ const _defaultPicBedId = ref<string>('')
 
 export function usePicBed() {
   const updatePicBeds = async () => {
-    console.log('Updating pic beds in global hook...')
     const result = await window.electron.triggerRPC<getPicBedType>(IRPCActionType.MAIN_GET_PICBED)
     if (result) {
       _picBeds.value = result.picBeds

src/renderer/i18n/locales/en.json

@@ -104,6 +104,7 @@
       },
       "generalSettings": "General",
       "perPicBed": {
+        "defaultValue": "Default Value: {value}",
         "description": "Configure settings for each PicBed individually",
         "title": "Per-PicBed Settings"
       },

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

@@ -104,6 +104,7 @@
       },
       "generalSettings": "常规",
       "perPicBed": {
+        "defaultValue": "默认值: {value}",
         "description": "为每个图床单独配置设置",
         "title": "图床独立设置"
       },

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

@@ -104,6 +104,7 @@
       },
       "generalSettings": "常規",
       "perPicBed": {
+        "defaultValue": "默認值: {value}",
         "description": "為每個圖床單獨配置設置",
         "title": "圖床獨立設置"
       },

src/renderer/manage/pages/BucketPage.vue

@@ -3033,7 +3033,6 @@ function toggleCopyDropdown(index: number, event?: MouseEvent) {
 
       const container = bucketContainerRef.value
       const containerRect = container?.getBoundingClientRect()
-      console.log('containerRect', containerRect)
       const dropdownWidth = 160
       const shouldShowLeft =
         rect.right > viewportWidth - dropdownWidth ||

src/renderer/pages/Plugin.vue

@@ -465,7 +465,6 @@ function _getSearchResult(val: string) {
   fetch(`https://registry.npmjs.com/-/v1/search?text=${val}`)
     .then(async (res: Response) => {
       const data = await res.json()
-      console.log(data)
       pluginList.value = data.objects
         .filter((item: INPMSearchResultObject) => {
           return strictSearch.value

src/renderer/utils/getLatestVersion.ts

@@ -7,8 +7,6 @@ export const getLatestVersion = async (): Promise<string> => {
       throw new Error(`HTTP error! status: ${response.status}`)
     }
     const normalList = await response.json()
-    console.log('Fetched latest version info: ', normalList)
-    console.log('Latest version is: ', normalList[0].name)
     return normalList[0].name
   } catch (err) {
     console.error('Error fetching latest version: ', err)