增加公共下载进度、增加接收SKU、密钥分别存放

frontend-vue/src/pages/brand/components/BrandApiSecretSettingsButton.vue

@@ -5,33 +5,33 @@
       <span>密钥设置</span>
     </button>
 
-    <el-dialog v-model="dialogVisible" width="560px" class="secret-settings-dialog" :append-to-body="true">
+    <el-dialog v-model="dialogVisible" width="620px" class="secret-settings-dialog" :append-to-body="true">
       <template #header>
         <div class="dialog-header">
           <div class="dialog-title">密钥设置</div>
-          <div class="dialog-subtitle">按当前登录用户保存在本机，外观专利和货源查询共用同一个 Coze 接口密钥。</div>
+          <div class="dialog-subtitle">按当前登录用户保存在本机，外观专利和货源查询分别使用独立的 Coze 接口密钥。</div>
         </div>
       </template>
 
       <div class="secret-settings-body">
-        <section class="secret-card">
+        <section v-for="config in secretConfigs" :key="config.key" class="secret-card">
           <div class="secret-card-head">
             <div>
-              <div class="secret-card-title">通用 Coze 密钥</div>
-              <div class="secret-card-desc">用于外观专利检测和货源查询。</div>
+              <div class="secret-card-title">{{ config.title }}</div>
+              <div class="secret-card-desc">{{ config.description }}</div>
             </div>
             <button
-              v-if="secretState.exists"
+              v-if="secretStates[config.key].exists"
               type="button"
               class="link-danger"
-              @click="clearSecret"
+              @click="clearSecret(config.key)"
             >
               清空
             </button>
           </div>
 
           <input
-            v-model="secretState.value"
+            v-model="secretStates[config.key].value"
             class="secret-input"
             type="password"
             placeholder="请输入 Coze 接口密钥"
@@ -43,14 +43,16 @@
             <div class="retention-label">保留时长</div>
             <div class="retention-options">
               <label v-for="option in retentionOptions" :key="option.value" class="retention-option">
-                <input v-model="secretState.retention" type="radio" :value="option.value" />
+                <input v-model="secretStates[config.key].retention" type="radio" :value="option.value" />
                 <span>{{ option.label }}</span>
               </label>
             </div>
           </div>
 
           <div class="secret-meta">
-            <span v-if="secretState.exists">{{ formatRetentionText(secretState.retention, secretState.expiresAt) }}</span>
+            <span v-if="secretStates[config.key].exists">
+              {{ formatRetentionText(secretStates[config.key].retention, secretStates[config.key].expiresAt) }}
+            </span>
             <span v-else>当前未保存</span>
           </div>
         </section>
@@ -73,6 +75,7 @@ import {
   clearStoredApiSecret,
   getStoredApiSecretSnapshot,
   saveStoredApiSecret,
+  type ApiSecretModuleKey,
   type ApiSecretRetention,
 } from '@/shared/utils/api-secret-store'
 
@@ -93,16 +96,36 @@ const retentionOptions: Array<{ value: ApiSecretRetention; label: string }> = [
   { value: 'forever', label: '长期保留' },
 ]
 
-const secretState = ref<SecretState>(emptySecretState())
+const secretConfigs: Array<{ key: ApiSecretModuleKey; title: string; description: string }> = [
+  {
+    key: 'appearance-patent',
+    title: '外观专利密钥',
+    description: '仅用于外观专利检测。',
+  },
+  {
+    key: 'similar-asin',
+    title: '货源查询密钥',
+    description: '仅用于货源查询。',
+  },
+]
+
+const secretStates = ref<Record<ApiSecretModuleKey, SecretState>>({
+  'appearance-patent': emptySecretState(),
+  'similar-asin': emptySecretState(),
+})
 
 function loadStates() {
-  const snapshot = getStoredApiSecretSnapshot()
-  secretState.value = {
-    value: snapshot.value,
-    retention: snapshot.retention,
-    expiresAt: snapshot.expiresAt,
-    exists: snapshot.exists,
+  const nextStates = { ...secretStates.value }
+  for (const config of secretConfigs) {
+    const snapshot = getStoredApiSecretSnapshot(config.key)
+    nextStates[config.key] = {
+      value: snapshot.value,
+      retention: snapshot.retention,
+      expiresAt: snapshot.expiresAt,
+      exists: snapshot.exists,
+    }
   }
+  secretStates.value = nextStates
 }
 
 function emptySecretState(): SecretState {
@@ -127,14 +150,17 @@ function formatRetentionText(retention: ApiSecretRetention, expiresAt: number |
   return `有效期至 ${year}-${month}-${day} ${hour}:${minute}`
 }
 
-function clearSecret() {
-  clearStoredApiSecret()
+function clearSecret(moduleKey: ApiSecretModuleKey) {
+  clearStoredApiSecret(moduleKey)
   loadStates()
   ElMessage.success('已清空密钥')
 }
 
 function saveAll() {
-  saveStoredApiSecret(secretState.value.value, secretState.value.retention)
+  for (const config of secretConfigs) {
+    const state = secretStates.value[config.key]
+    saveStoredApiSecret(config.key, state.value, state.retention)
+  }
   loadStates()
   dialogVisible.value = false
   ElMessage.success('密钥设置已保存')
@@ -242,6 +268,9 @@ loadStates()
   display: flex;
   flex-direction: column;
   gap: 14px;
+  max-height: 62vh;
+  overflow-y: auto;
+  padding-right: 4px;
 }
 
 .secret-card {