feat(settings): AccountSettingService

- 增加防抖。
- `card` 从父组件获取到的值改为深复制，解决 `card` 内修改数据，会直接导致在父组件中同步更新的问题。

src/components/cards/DownloaderCard.vue

@@ -6,6 +6,7 @@ import { useToast } from 'vue-toast-notification'
 import type { DownloaderInfo } from '@/api/types'
 import qbittorrent_image from '@images/logos/qbittorrent.png'
 import transmission_image from '@images/logos/transmission.png'
+import {cloneDeep} from "lodash";
 
 // 定义输入
 const props = defineProps({
@@ -44,9 +45,6 @@ const download_rate = ref(0)
 // 下载器详情弹窗
 const downloaderInfoDialog = ref(false)
 
-// 下载器名称
-const downloaderName = ref('')
-
 // 下载器详情
 const downloaderInfo = ref<DownloaderConf>({
   name: '',
@@ -84,21 +82,21 @@ async function loadDownloaderInfo() {
 
 // 打开详情弹窗
 function openDownloaderInfoDialog() {
-  downloaderInfo.value = props.downloader
-  downloaderName.value = props.downloader.name
+  // 深复制
+  downloaderInfo.value = cloneDeep(props.downloader)
   downloaderInfoDialog.value = true
 }
 
 // 保存详情数据
 function saveDownloaderInfo() {
   // 为空不保存，跳出警告框
-  if (!downloaderName.value) {
+  if (!downloaderInfo.value.name) {
     $toast.error('名称不能为空，请输入后再确定')
     return
   }
   // 重名判断
-  if (props.downloaders.some(item => item.name === downloaderName.value && item !== props.downloader)) {
-    $toast.error(`【${downloaderName.value}】已存在，请替换为其他名称`)
+  if (props.downloaders.some(item => item.name === downloaderInfo.value.name && item !== props.downloader)) {
+    $toast.error(`【${downloaderInfo.value.name}】已存在，请替换为其他名称`)
     return
   }
   // 默认下载器去重
@@ -106,14 +104,13 @@ function saveDownloaderInfo() {
     props.downloaders.forEach(item => {
       if (item.default && item !== props.downloader) {
         item.default = false
-        $toast.info(`【${item.name}】存在默认下载器，已替换成【${downloaderName.value}】`)
+        $toast.info(`【${item.name}】存在默认下载器，已替换成【${downloaderInfo.value.name}】`)
       }
     })
   }
   // 执行保存
   downloaderInfoDialog.value = false
-  downloaderInfo.value.name = downloaderName.value
-  emit('change', downloaderInfo.value)
+  emit('change', downloaderInfo.value, props.downloader.name)
   emit('done')
 }
 
@@ -192,7 +189,7 @@ onUnmounted(() => {
             <VRow v-if="downloaderInfo.type == 'qbittorrent'">
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="downloaderName"
+                  v-model="downloaderInfo.name"
                   label="名称"
                   placeholder="必填；不可与其他名称重名"
                   hint="下载器的别名"
@@ -270,7 +267,7 @@ onUnmounted(() => {
             <VRow v-if="downloaderInfo.type == 'transmission'">
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="downloaderName"
+                  v-model="downloaderInfo.name"
                   label="名称"
                   placeholder="必填；不可与其他名称重名"
                   hint="下载器的别名"

src/components/cards/MediaServerCard.vue

@@ -5,6 +5,7 @@ import emby_image from '@images/logos/emby.png'
 import jellyfin_image from '@images/logos/jellyfin.png'
 import plex_image from '@images/logos/plex.png'
 import api from '@/api'
+import { cloneDeep } from 'lodash'
 
 // 定义输入
 const props = defineProps({
@@ -56,9 +57,6 @@ const librariesOptions = ref<{ title: string; value: string | undefined }[]>([
 // 媒体服务器详情弹窗
 const mediaServerInfoDialog = ref(false)
 
-// 媒体服务器名称
-const mediaServerName = ref('')
-
 // 媒体服务器详情
 const mediaServerInfo = ref<MediaServerConf>({
   name: '',
@@ -70,8 +68,8 @@ const mediaServerInfo = ref<MediaServerConf>({
 // 打开详情弹窗
 function openMediaServerInfoDialog() {
   loadLibrary(props.mediaserver.name)
-  mediaServerInfo.value = props.mediaserver
-  mediaServerName.value = props.mediaserver.name
+  // 深复制
+  mediaServerInfo.value = cloneDeep(props.mediaserver)
   mediaServerInfoDialog.value = true
   if (!props.mediaserver.sync_libraries) {
     mediaServerInfo.value.sync_libraries = ['all']
@@ -81,19 +79,18 @@ function openMediaServerInfoDialog() {
 // 保存详情数据
 function saveMediaServerInfo() {
   // 为空不保存，跳出警告框
-  if (!mediaServerName.value) {
+  if (!mediaServerInfo.value.name) {
     $toast.error('名称不能为空，请输入后再确定')
     return
   }
   // 重名判断
-  if (props.mediaservers.some(item => item.name === mediaServerName.value && item !== props.mediaserver)) {
-    $toast.error(`【${mediaServerName.value}】已存在，请替换为其他名称`)
+  if (props.mediaservers.some(item => item.name === mediaServerInfo.value.name && item !== props.mediaserver)) {
+    $toast.error(`【${mediaServerInfo.value.name}】已存在，请替换为其他名称`)
     return
   }
   // 执行保存
   mediaServerInfoDialog.value = false
-  mediaServerInfo.value.name = mediaServerName.value
-  emit('change', mediaServerInfo.value)
+  emit('change', mediaServerInfo.value, props.mediaserver.name)
   emit('done')
 }
 
@@ -202,7 +199,7 @@ onMounted(() => {
             <VRow v-if="mediaServerInfo.type == 'emby'">
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="mediaServerName"
+                  v-model="mediaServerInfo.name"
                   label="名称"
                   placeholder="必填；不可与其他名称重名"
                   hint="媒体服务器的别名"
@@ -243,7 +240,7 @@ onMounted(() => {
             <VRow v-if="mediaServerInfo.type == 'jellyfin'">
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="mediaServerName"
+                  v-model="mediaServerInfo.name"
                   label="名称"
                   placeholder="必填；不可与其他名称重名"
                   hint="媒体服务器的别名"
@@ -284,7 +281,7 @@ onMounted(() => {
             <VRow v-if="mediaServerInfo.type == 'plex'">
               <VCol cols="12" md="6">
                 <VTextField
-                  v-model="mediaServerName"
+                  v-model="mediaServerInfo.name"
                   label="名称"
                   placeholder="必填；不可与其他名称重名"
                   hint="媒体服务器的别名"