From 5711285a770b1a485fd3fbfe5acfbd30f6e8a11e Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Tue, 27 May 2025 17:46:51 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=A4=9A=E4=B8=AA=E5=8D=A1?=
 =?UTF-8?q?=E7=89=87=E7=BB=84=E4=BB=B6=EF=BC=8C=E7=BB=9F=E4=B8=80=E6=A0=87?=
 =?UTF-8?q?=E9=A2=98=E6=96=87=E6=9C=AC=E4=B8=BA=E2=80=9C=E9=85=8D=E7=BD=AE?=
 =?UTF-8?q?=E2=80=9D=EF=BC=8C=E6=B7=BB=E5=8A=A0=E5=9B=BE=E6=A0=87=E4=BB=A5?=
 =?UTF-8?q?=E6=8F=90=E5=8D=87=E7=94=A8=E6=88=B7=E4=BD=93=E9=AA=8C=EF=BC=8C?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=BE=93=E5=85=A5=E6=A1=86=E6=8F=90=E7=A4=BA?=
 =?UTF-8?q?=E4=BF=A1=E6=81=AF=EF=BC=8C=E7=A1=AE=E4=BF=9D=E4=B8=80=E8=87=B4?=
 =?UTF-8?q?=E6=80=A7=E5=92=8C=E5=8F=AF=E8=AF=BB=E6=80=A7=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/cards/DownloaderCard.vue       |  2 +-
 src/components/cards/MediaServerCard.vue      | 44 +++++++++++++++++--
 .../cards/NotificationChannelCard.vue         | 40 ++++++++++++++++-
 3 files changed, 80 insertions(+), 6 deletions(-)

diff --git a/src/components/cards/DownloaderCard.vue b/src/components/cards/DownloaderCard.vue
index 7c22296f..7edb722a 100644
--- a/src/components/cards/DownloaderCard.vue
+++ b/src/components/cards/DownloaderCard.vue
@@ -205,7 +205,7 @@ onUnmounted(() => {
           <template #prepend>
             <VIcon icon="mdi-download" class="me-2" />
           </template>
-          <VCardTitle>{{ t('downloader.title') }}</VCardTitle>
+          <VCardTitle>{{ t('common.config') }}</VCardTitle>
           <VCardSubtitle>{{ props.downloader.name }}</VCardSubtitle>
         </VCardItem>
         <VDialogCloseBtn v-model="downloaderInfoDialog" />
diff --git a/src/components/cards/MediaServerCard.vue b/src/components/cards/MediaServerCard.vue
index 3c3509f1..3aee6633 100644
--- a/src/components/cards/MediaServerCard.vue
+++ b/src/components/cards/MediaServerCard.vue
@@ -211,7 +211,14 @@ onMounted(() => {
       max-width="40rem"
       :fullscreen="!display.mdAndUp.value"
     >
-      <VCard :title="`${props.mediaserver.name} - ${t('common.config')}`">
+      <VCard>
+        <VCardItem class="py-2">
+          <template #prepend>
+            <VIcon icon="mdi-cog" class="me-2" />
+          </template>
+          <VCardTitle>{{ t('common.config') }}</VCardTitle>
+          <VCardSubtitle>{{ props.mediaserver.name }}</VCardSubtitle>
+        </VCardItem>
         <VDialogCloseBtn v-model="mediaServerInfoDialog" />
         <VDivider />
         <VCardText>
@@ -230,6 +237,7 @@ onMounted(() => {
                   :hint="t('mediaserver.serverAlias')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -240,6 +248,7 @@ onMounted(() => {
                   :hint="t('mediaserver.hostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-server"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -250,6 +259,7 @@ onMounted(() => {
                   :hint="t('mediaserver.playHostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-play-network"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -259,6 +269,7 @@ onMounted(() => {
                   :hint="t('mediaserver.embyApiKeyHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12">
@@ -273,6 +284,7 @@ onMounted(() => {
                   persistent-hint
                   active
                   append-inner-icon="mdi-refresh"
+                  prepend-inner-icon="mdi-library"
                   @click:append-inner="loadLibrary(mediaServerInfo.name)"
                 />
               </VCol>
@@ -286,6 +298,7 @@ onMounted(() => {
                   :hint="t('mediaserver.serverAlias')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -296,6 +309,7 @@ onMounted(() => {
                   :hint="t('mediaserver.hostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-server"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -306,6 +320,7 @@ onMounted(() => {
                   :hint="t('mediaserver.playHostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-play-network"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -315,6 +330,7 @@ onMounted(() => {
                   :hint="t('mediaserver.jellyfinApiKeyHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12">
@@ -329,6 +345,7 @@ onMounted(() => {
                   persistent-hint
                   active
                   append-inner-icon="mdi-refresh"
+                  prepend-inner-icon="mdi-library"
                   @click:append-inner="loadLibrary(mediaServerInfo.name)"
                 />
               </VCol>
@@ -342,6 +359,7 @@ onMounted(() => {
                   :hint="t('mediaserver.serverAlias')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -352,6 +370,7 @@ onMounted(() => {
                   :hint="t('mediaserver.hostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-server"
                 />
               </VCol>
               <VCol cols="12">
@@ -362,10 +381,16 @@ onMounted(() => {
                   :hint="t('mediaserver.playHostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-play-network"
                 />
               </VCol>
               <VCol cols="12" md="6">
-                <VTextField v-model="mediaServerInfo.config.username" :label="t('mediaserver.username')" active />
+                <VTextField
+                  v-model="mediaServerInfo.config.username"
+                  :label="t('mediaserver.username')"
+                  active
+                  prepend-inner-icon="mdi-account"
+                />
               </VCol>
               <VCol cols="12" md="6">
                 <VTextField
@@ -373,6 +398,7 @@ onMounted(() => {
                   v-model="mediaServerInfo.config.password"
                   :label="t('mediaserver.password')"
                   active
+                  prepend-inner-icon="mdi-lock"
                 />
               </VCol>
               <VCol cols="12">
@@ -387,6 +413,7 @@ onMounted(() => {
                   persistent-hint
                   active
                   append-inner-icon="mdi-refresh"
+                  prepend-inner-icon="mdi-library"
                   @click:append-inner="loadLibrary(mediaServerInfo.name)"
                 />
               </VCol>
@@ -400,6 +427,7 @@ onMounted(() => {
                   :hint="t('mediaserver.serverAlias')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -410,6 +438,7 @@ onMounted(() => {
                   :hint="t('mediaserver.hostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-server"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -420,6 +449,7 @@ onMounted(() => {
                   :hint="t('mediaserver.playHostHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-play-network"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -429,6 +459,7 @@ onMounted(() => {
                   :hint="t('mediaserver.plexTokenHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12">
@@ -443,6 +474,7 @@ onMounted(() => {
                   persistent-hint
                   active
                   append-inner-icon="mdi-refresh"
+                  prepend-inner-icon="mdi-library"
                   @click:append-inner="loadLibrary(mediaServerInfo.name)"
                 />
               </VCol>
@@ -454,10 +486,16 @@ onMounted(() => {
                   :label="t('mediaserver.type')"
                   :hint="t('mediaserver.customTypeHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-cog"
                 />
               </VCol>
               <VCol cols="12" md="6">
-                <VTextField :label="t('common.name')" :hint="t('mediaserver.nameRequired')" persistent-hint />
+                <VTextField
+                  :label="t('common.name')"
+                  :hint="t('mediaserver.nameRequired')"
+                  persistent-hint
+                  prepend-inner-icon="mdi-label"
+                />
               </VCol>
             </VRow>
           </VForm>
diff --git a/src/components/cards/NotificationChannelCard.vue b/src/components/cards/NotificationChannelCard.vue
index d9f32d62..cf11636c 100644
--- a/src/components/cards/NotificationChannelCard.vue
+++ b/src/components/cards/NotificationChannelCard.vue
@@ -148,8 +148,15 @@ function onClose() {
       max-width="40rem"
       :fullscreen="!display.mdAndUp.value"
     >
-      <VCard :title="`${props.notification.name} - ${t('notification.config')}`">
-        <VDialogCloseBtn v-model="notificationInfoDialog" />
+      <VCard>
+        <VCardItem class="py-2">
+          <template #prepend>
+            <VIcon icon="mdi-cog" class="me-2" />
+          </template>
+          <VCardTitle>{{ t('common.config') }}</VCardTitle>
+          <VCardSubtitle>{{ props.notification.name }}</VCardSubtitle>
+        </VCardItem>
+        <VDialogCloseBtn @click="notificationInfoDialog = false" />
         <VDivider />
         <VCardText>
           <VForm>
@@ -167,6 +174,7 @@ function onClose() {
                   clearable
                   chips
                   persistent-hint
+                  prepend-inner-icon="mdi-bell-outline"
                 />
               </VCol>
             </VRow>
@@ -178,6 +186,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -186,6 +195,7 @@ function onClose() {
                   :label="t('notification.wechat.corpId')"
                   :hint="t('notification.wechat.corpIdHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-domain"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -194,6 +204,7 @@ function onClose() {
                   :label="t('notification.wechat.appId')"
                   :hint="t('notification.wechat.appIdHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-application"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -202,6 +213,7 @@ function onClose() {
                   :label="t('notification.wechat.appSecret')"
                   :hint="t('notification.wechat.appSecretHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -210,6 +222,7 @@ function onClose() {
                   :label="t('notification.wechat.proxy')"
                   :hint="t('notification.wechat.proxyHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-server-network"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -218,6 +231,7 @@ function onClose() {
                   :label="t('notification.wechat.token')"
                   :hint="t('notification.wechat.tokenHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key-variant"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -226,6 +240,7 @@ function onClose() {
                   :label="t('notification.wechat.encodingAesKey')"
                   :hint="t('notification.wechat.encodingAesKeyHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-lock"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -235,6 +250,7 @@ function onClose() {
                   :placeholder="t('notification.wechat.adminsPlaceholder')"
                   :hint="t('notification.wechat.adminsHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-account-supervisor"
                 />
               </VCol>
             </VRow>
@@ -246,6 +262,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -254,6 +271,7 @@ function onClose() {
                   :label="t('notification.telegram.token')"
                   :hint="t('notification.telegram.tokenHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -262,6 +280,7 @@ function onClose() {
                   :label="t('notification.telegram.chatId')"
                   :hint="t('notification.telegram.chatIdHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-chat"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -271,6 +290,7 @@ function onClose() {
                   :placeholder="t('notification.telegram.usersPlaceholder')"
                   :hint="t('notification.telegram.usersHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-account-group"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -280,6 +300,7 @@ function onClose() {
                   :placeholder="t('notification.telegram.adminsPlaceholder')"
                   :hint="t('notification.telegram.adminsHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-account-supervisor"
                 />
               </VCol>
             </VRow>
@@ -291,6 +312,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -300,6 +322,7 @@ function onClose() {
                   :placeholder="t('notification.slack.oauthTokenPlaceholder')"
                   :hint="t('notification.slack.oauthTokenHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -309,6 +332,7 @@ function onClose() {
                   :placeholder="t('notification.slack.appTokenPlaceholder')"
                   :hint="t('notification.slack.appTokenHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-application"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -318,6 +342,7 @@ function onClose() {
                   :placeholder="t('notification.slack.channelPlaceholder')"
                   :hint="t('notification.slack.channelHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-pound"
                 />
               </VCol>
             </VRow>
@@ -329,6 +354,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -337,6 +363,7 @@ function onClose() {
                   :label="t('notification.synologychat.webhook')"
                   :hint="t('notification.synologychat.webhookHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-webhook"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -345,6 +372,7 @@ function onClose() {
                   :label="t('notification.synologychat.token')"
                   :hint="t('notification.synologychat.tokenHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
             </VRow>
@@ -356,6 +384,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -364,6 +393,7 @@ function onClose() {
                   :label="t('notification.vocechat.host')"
                   :hint="t('notification.vocechat.hostHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-server"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -372,6 +402,7 @@ function onClose() {
                   :label="t('notification.vocechat.apiKey')"
                   :hint="t('notification.vocechat.apiKeyHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-key"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -381,6 +412,7 @@ function onClose() {
                   :placeholder="t('notification.vocechat.channelIdPlaceholder')"
                   :hint="t('notification.vocechat.channelIdHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-pound"
                 />
               </VCol>
             </VRow>
@@ -392,6 +424,7 @@ function onClose() {
                   :placeholder="t('notification.name')"
                   :hint="t('notification.nameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -400,6 +433,7 @@ function onClose() {
                   :label="t('notification.webpush.username')"
                   :hint="t('notification.webpush.usernameHint')"
                   persistent-hint
+                  prepend-inner-icon="mdi-account"
                 />
               </VCol>
             </VRow>
@@ -411,6 +445,7 @@ function onClose() {
                   :hint="t('notification.customTypeHint')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-cog"
                 />
               </VCol>
               <VCol cols="12" md="6">
@@ -420,6 +455,7 @@ function onClose() {
                   :hint="t('notification.nameRequired')"
                   persistent-hint
                   active
+                  prepend-inner-icon="mdi-label"
                 />
               </VCol>
             </VRow>