添加下载器和媒体服务器选项，重构相关组件以支持新功能，并更新国际化文本以提升用户体验

src/api/constants.ts

@@ -26,11 +26,6 @@ export const storageAttributes = [
     icon: 'mdi-server-network-outline',
     remote: true,
   },
-  {
-    type: 'custom',
-    icon: 'mdi-database',
-    remote: true,
-  },
 ]
 
 export const storageIconDict = storageAttributes.reduce((dict, item) => {
@@ -43,6 +38,46 @@ export const storageRemoteDict = storageAttributes.reduce((dict, item) => {
   return dict
 }, {} as Record<string, boolean>)
 
+export const downloaderOptions = [
+  {
+    value: 'qbittorrent',
+    title: i18n.global.t('setting.system.qbittorrent'),
+  },
+  {
+    value: 'transmission',
+    title: i18n.global.t('setting.system.transmission'),
+  },
+]
+
+export const downloaderDict = downloaderOptions.reduce((dict, item) => {
+  dict[item.value] = item.title
+  return dict
+}, {} as Record<string, string>)
+
+export const mediaServerOptions = [
+  {
+    value: 'emby',
+    title: i18n.global.t('setting.system.emby'),
+  },
+  {
+    value: 'jellyfin',
+    title: i18n.global.t('setting.system.jellyfin'),
+  },
+  {
+    value: 'plex',
+    title: i18n.global.t('setting.system.plex'),
+  },
+  {
+    value: 'trimemedia',
+    title: i18n.global.t('setting.system.trimeMedia'),
+  },
+]
+
+export const mediaServerDict = mediaServerOptions.reduce((dict, item) => {
+  dict[item.value] = item.title
+  return dict
+}, {} as Record<string, string>)
+
 export const innerFilterRules = [
   { title: i18n.global.t('filterRules.specSub'), value: ' SPECSUB ' },
   { title: i18n.global.t('filterRules.cnSub'), value: ' CNSUB ' },

src/components/cards/DirectoryCard.vue

@@ -33,8 +33,8 @@ const isCollapsed = ref(true)
 // 类型下拉字典
 const typeItems = computed(() => [
   { title: t('common.all'), value: '' },
-  { title: t('media.movie'), value: '电影' },
+  { title: t('mediaType.movie'), value: '电影' },
-  { title: t('media.tv'), value: '电视剧' },
+  { title: t('mediaType.tv'), value: '电视剧' },
 ])
 
 // 计算资源存储字典（整理方式为下载器时不能为远程存储）

src/components/cards/DownloaderCard.vue

@@ -9,6 +9,7 @@ import transmission_image from '@images/logos/transmission.png'
 import custom_image from '@images/logos/downloader.png'
 import { cloneDeep } from 'lodash-es'
 import { useI18n } from 'vue-i18n'
+import { downloaderDict } from '@/api/constants'
 
 // 获取i18n实例
 const { t } = useI18n()
@@ -173,11 +174,11 @@ onUnmounted(() => {
               />
               <span class="text-h6">{{ downloader.name }}</span>
             </div>
-            <div v-if="downloader.type != 'custom' && props.downloader.enabled" class="mt-1 flex flex-wrap text-sm">
+            <div v-if="downloaderDict[downloader.type] && props.downloader.enabled" class="mt-1 flex flex-wrap text-sm">
               <span class="me-2">{{ `↑ ${formatFileSize(upload_rate, 1)}/s ` }}</span>
               <span>{{ `↓ ${formatFileSize(download_rate, 1)}/s` }}</span>
             </div>
-            <div v-else-if="downloader.type == 'custom'" class="mt-1 flex flex-wrap text-sm">
+            <div v-else-if="!downloaderDict[downloader.type]" class="mt-1 flex flex-wrap text-sm">
               <span class="me-2">自定义下载器</span>
             </div>
           </div>
@@ -324,11 +325,20 @@ onUnmounted(() => {
               </VCol>
             </VRow>
             <VRow v-else>
+              <VCol cols="12" md="6">
+                <VTextField
+                  v-model="downloaderInfo.type"
+                  :label="t('downloader.type')"
+                  :hint="t('downloader.customTypeHint')"
+                  persistent-hint
+                  active
+                />
+              </VCol>
               <VCol cols="12" md="6">
                 <VTextField
                   v-model="downloaderInfo.name"
                   :label="t('downloader.name')"
-                  :placeholder="t('downloader.nameRequired')"
+                  :hint="t('downloader.nameRequired')"
                   persistent-hint
                   active
                 />

src/components/cards/MediaServerCard.vue

@@ -9,6 +9,7 @@ import custom_image from '@images/logos/mediaserver.png'
 import api from '@/api'
 import { cloneDeep } from 'lodash-es'
 import { useI18n } from 'vue-i18n'
+import { mediaServerDict } from '@/api/constants'
 
 // 获取i18n实例
 const { t } = useI18n()
@@ -186,12 +187,12 @@ onMounted(() => {
       <VCardText class="flex justify-space-between align-center gap-3">
         <div class="align-self-start flex-1">
           <div class="text-h6 mb-1">{{ mediaserver.name }}</div>
-          <div v-if="mediaserver.type != 'custom' && mediaserver.enabled" class="text-sm mt-5 flex flex-wrap">
+          <div v-if="mediaServerDict[mediaserver.type] && mediaserver.enabled" class="text-sm mt-5 flex flex-wrap">
             <span v-for="item in infoItems" :key="item.title" class="me-2 mb-1">
               <VIcon rounded :icon="item.avatar" class="me-1" />{{ item.amount }}
             </span>
           </div>
-          <div v-else-if="mediaserver.type == 'custom'" class="text-sm mt-5 flex flex-wrap">
+          <div v-else-if="!mediaServerDict[mediaserver.type]" class="text-sm mt-5 flex flex-wrap">
             <span class="me-2 mb-1">自定义媒体服务器</span>
           </div>
         </div>
@@ -453,11 +454,15 @@ onMounted(() => {
             <VRow v-else>
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="mediaServerInfo.name"
+                  v-model="mediaServerInfo.type"
-                  :label="t('common.name')"
+                  :label="t('mediaserver.type')"
-                  :placeholder="t('mediaserver.nameRequired')"
+                  :hint="t('mediaserver.customTypeHint')"
+                  persistent-hint
                 />
               </VCol>
+              <VCol cols="12" md="6">
+                <VTextField :label="t('common.name')" :hint="t('mediaserver.nameRequired')" persistent-hint />
+              </VCol>
             </VRow>
           </VForm>
         </VCardText>

src/components/cards/StorageCard.vue

@@ -15,6 +15,7 @@ import AlistConfigDialog from '../dialog/AlistConfigDialog.vue'
 import { useToast } from 'vue-toast-notification'
 import { isNullOrEmptyObject } from '@/@core/utils'
 import { useI18n } from 'vue-i18n'
+import { storageIconDict } from '@/api/constants'
 
 // 国际化
 const { t } = useI18n()
@@ -50,6 +51,9 @@ const storage_ref = ref(props.storage)
 // 自定义存储名称
 const customName = ref(props.storage.name)
 
+// 自定义存储类型
+const storageType = ref(props.storage.type)
+
 // 阿里云盘认证对话框
 const aliyunAuthDialog = ref(false)
 // 115网盘认证对话框
@@ -76,11 +80,11 @@ function openStorageDialog() {
     case 'alist':
       aListConfigDialog.value = true
       break
-    case 'custom':
+    case 'local':
-      customConfigDialog.value = true
+      $toast.info(t('storage.noConfigNeeded'))
       break
     default:
-      $toast.info(t('storage.noConfigNeeded'))
+      customConfigDialog.value = true
       break
   }
 }
@@ -98,10 +102,8 @@ const getIcon = computed(() => {
       return rclone_png
     case 'alist':
       return alist_png
-    case 'custom':
-      return custom_png
     default:
-      return storage_png
+      return custom_png
   }
 })
 
@@ -139,7 +141,9 @@ function handleDone() {
   rcloneConfigDialog.value = false
   aListConfigDialog.value = false
   customConfigDialog.value = false
+  // 更新存储
   storage_ref.value.name = customName.value
+  storage_ref.value.type = storageType.value
   emit('done', storage_ref.value)
 }
 
@@ -155,11 +159,11 @@ function onClose() {
 <template>
   <div>
     <VCard variant="tonal" @click="openStorageDialog">
-      <VDialogCloseBtn v-if="storage.type == 'custom'" @click="onClose" />
+      <VDialogCloseBtn v-if="storageIconDict[storage.type]" @click="onClose" />
       <VCardText class="flex justify-space-between align-center gap-3">
         <div class="align-self-start flex-1">
           <h5 class="text-h6 mb-1">{{ storage.name }}</h5>
-          <template v-if="storage.type != 'custom'">
+          <template v-if="storageIconDict[storage.type]">
             <div class="mb-3 text-sm" v-if="total">{{ formatBytes(used, 1) }} / {{ formatBytes(total, 1) }}</div>
             <div v-else-if="isNullOrEmptyObject(storage.config)">{{ t('storage.notConfigured') }}</div>
           </template>
@@ -210,6 +214,15 @@ function onClose() {
         <VDivider />
         <VCardText>
           <VRow>
+            <VCol cols="12" md="6">
+              <VTextField
+                v-model="storageType"
+                :label="t('storage.type')"
+                :hint="t('storage.customTypeHint')"
+                persistent-hint
+                active
+              />
+            </VCol>
             <VCol cols="12" md="6">
               <VTextField v-model="customName" :label="t('storage.name')" persistent-hint active />
             </VCol>

src/locales/en-US.ts

@@ -728,6 +728,8 @@ export default {
   },
   storage: {
     name: 'Name',
+    type: 'Type',
+    customTypeHint: 'Custom storage type, used for plugins and other scenarios',
     usedPercent: '{percent}% Used',
     noConfigNeeded: 'This storage type does not require configuration, please configure the directory directly!',
     notConfigured: 'Not Configured',
@@ -2085,6 +2087,7 @@ export default {
     name: 'Name',
     type: 'Type',
     enabled: 'Enabled',
+    customTypeHint: 'Custom downloader type, for plugin scenarios',
     default: 'Default',
     host: 'Host',
     username: 'Username',
@@ -2125,6 +2128,8 @@ export default {
     },
   },
   mediaserver: {
+    type: 'Type',
+    customTypeHint: 'Custom media server type, for plugin scenarios',
     enableMediaServer: 'Enable Media Server',
     nameRequired: 'Required; cannot be duplicated',
     serverAlias: 'Media server alias',

src/locales/zh-CN.ts

@@ -725,6 +725,8 @@ export default {
   },
   storage: {
     name: '名称',
+    type: '类型',
+    customTypeHint: '自定义存储类型，用于插件等场景',
     usedPercent: '已使用 {percent}%',
     noConfigNeeded: '此存储类型无需配置参数，请直接配置目录！',
     notConfigured: '未配置',
@@ -2061,6 +2063,7 @@ export default {
     name: '名称',
     type: '类型',
     enabled: '启用',
+    customTypeHint: '自定义下载器类型，用于插件等场景',
     default: '默认',
     host: '地址',
     username: '用户名',
@@ -2071,7 +2074,7 @@ export default {
     first_last_piece: '优先首尾文件',
     saveSuccess: '下载器设置保存成功',
     saveFailed: '下载器设置保存失败',
-    nameRequired: '名称不能为空',
+    nameRequired: '不能为空，且不能重名',
     nameDuplicate: '名称已存在',
     defaultChanged: '存在默认下载器，已替换',
   },
@@ -2101,8 +2104,10 @@ export default {
     },
   },
   mediaserver: {
+    type: '类型',
+    customTypeHint: '自定义媒体服务器类型，用于插件等场景',
     enableMediaServer: '启用媒体服务器',
-    nameRequired: '必填；不可与其他名称重名',
+    nameRequired: '必填，不可重名',
     serverAlias: '媒体服务器的别名',
     host: '地址',
     hostPlaceholder: 'http(s)://ip:port',

src/locales/zh-TW.ts

@@ -726,6 +726,8 @@ export default {
   },
   storage: {
     name: '名稱',
+    type: '類型',
+    customTypeHint: '自定義存儲類型，用於插件等場景',
     usedPercent: '已使用 {percent}%',
     noConfigNeeded: '此存儲類型無需配置參數，請直接配置目錄！',
     notConfigured: '未配置',
@@ -2062,6 +2064,7 @@ export default {
     title: '下載器',
     name: '名稱',
     type: '類型',
+    customTypeHint: '自定義下載器類型，用於插件等場景',
     enabled: '啟用',
     default: '預設',
     host: '地址',
@@ -2103,6 +2106,8 @@ export default {
     },
   },
   mediaserver: {
+    type: '類型',
+    customTypeHint: '自定義媒體伺服器類型，用於插件等場景',
     enableMediaServer: '啟用媒體伺服器',
     nameRequired: '必填；不可與其他名稱重名',
     serverAlias: '媒體伺服器的別名',

src/views/setting/AccountSettingSystem.vue

@@ -10,6 +10,7 @@ import MediaServerCard from '@/components/cards/MediaServerCard.vue'
 import { copyToClipboard } from '@/@core/utils/navigator'
 import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
 import { useI18n } from 'vue-i18n'
+import { downloaderOptions, mediaServerOptions } from '@/api/constants'
 
 // 国际化
 const { t } = useI18n()
@@ -535,11 +536,8 @@ onDeactivated(() => {
                 <VIcon icon="mdi-plus" />
                 <VMenu activator="parent" close-on-content-click>
                   <VList>
-                    <VListItem @click="addDownloader('qbittorrent')">
+                    <VListItem v-for="item in downloaderOptions" @click="addDownloader(item.value)">
-                      <VListItemTitle>{{ t('setting.system.qbittorrent') }}</VListItemTitle>
+                      <VListItemTitle>{{ item.title }}</VListItemTitle>
-                    </VListItem>
-                    <VListItem @click="addDownloader('transmission')">
-                      <VListItemTitle>{{ t('setting.system.transmission') }}</VListItemTitle>
                     </VListItem>
                     <VListItem @click="addDownloader('custom')">
                       <VListItemTitle>{{ t('setting.system.custom') }}</VListItemTitle>
@@ -586,17 +584,8 @@ onDeactivated(() => {
                 <VIcon icon="mdi-plus" />
                 <VMenu activator="parent" close-on-content-click>
                   <VList>
-                    <VListItem @click="addMediaServer('emby')">
+                    <VListItem v-for="item in mediaServerOptions" @click="addMediaServer(item.value)">
-                      <VListItemTitle>{{ t('setting.system.emby') }}</VListItemTitle>
+                      <VListItemTitle>{{ item.title }}</VListItemTitle>
-                    </VListItem>
-                    <VListItem @click="addMediaServer('jellyfin')">
-                      <VListItemTitle>{{ t('setting.system.jellyfin') }}</VListItemTitle>
-                    </VListItem>
-                    <VListItem @click="addMediaServer('plex')">
-                      <VListItemTitle>{{ t('setting.system.plex') }}</VListItemTitle>
-                    </VListItem>
-                    <VListItem @click="addMediaServer('trimemedia')">
-                      <VListItemTitle>{{ t('setting.system.trimeMedia') }}</VListItemTitle>
                     </VListItem>
                     <VListItem @click="addMediaServer('custom')">
                       <VListItemTitle>{{ t('setting.system.custom') }}</VListItemTitle>