From 75dace2dee4b8a49f8a804d8aaaa0e208560a06a Mon Sep 17 00:00:00 2001
From: Soulter <905617992@qq.com>
Date: Tue, 18 Mar 2025 00:16:47 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=88=20perf:=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE=E9=A1=B5=E7=9A=84=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/shared/AstrBotConfig.vue   | 64 +++++++++++--------
 dashboard/src/views/ConfigPage.vue            |  5 +-
 2 files changed, 37 insertions(+), 32 deletions(-)

diff --git a/dashboard/src/components/shared/AstrBotConfig.vue b/dashboard/src/components/shared/AstrBotConfig.vue
index 39d5812dc..84d3fadcc 100644
--- a/dashboard/src/components/shared/AstrBotConfig.vue
+++ b/dashboard/src/components/shared/AstrBotConfig.vue
@@ -1,9 +1,6 @@
 <template>
     <div style="margin-bottom: 6px;" v-if="iterable && metadata[metadataKey]?.type === 'object'">
         <v-list-item-title style="font-weight: bold;">
-            <v-chip color="primary" label size="x-small" class="mb-1">
-                object
-            </v-chip>
             {{ metadata[metadataKey]?.description }} ({{ metadataKey }})
         </v-list-item-title>
         <v-list-item-subtitle style="font-size: 12px;">
@@ -13,26 +10,22 @@
         </v-list-item-subtitle>
     </div>
 
-    <v-card-text style="padding: 12px;">
+    <v-card-text style="padding: 0px;">
         <div v-for="(val, key, index) in iterable" :key="key" style="margin-bottom: 0.5px;"
             v-if="metadata[metadataKey]?.type === 'object' || metadata[metadataKey]?.config_template">
 
             <div v-if="metadata[metadataKey].items[key]?.type === 'object'" style="padding-left: 16px;">
                 <div v-if="metadata[metadataKey].items[key] && !metadata[metadataKey].items[key]?.invisible"
-                    style="border: 1px solid #e0e0e0; padding: 8px; margin-bottom: 16px; border-radius: 10px;">
+                    style="border: 1px solid #e0e0e0; padding: 8px; margin-bottom: 16px; border-radius: 10px; margin-top: 16px">
                     <AstrBotConfig :metadata="metadata[metadataKey].items" :iterable="iterable[key]" :metadataKey=key>
                     </AstrBotConfig>
                 </div>
             </div>
 
-            <v-row v-else style="margin: 0;">
-                <v-col cols="6">
+            <v-row v-else style="margin: 0; align-items: center;">
+                <v-col cols="6" style="padding: 0px;">
                     <v-list-item>
                         <v-list-item-title style="font-size: 14px; font-weight: bold;">
-                            <v-chip v-if="!metadata[metadataKey].items[key]?.invisible" color="primary" label
-                                size="x-small" class="mb-1">{{
-                                    metadata[metadataKey].items[key]?.type }}
-                            </v-chip>
                             {{ metadata[metadataKey].items[key]?.description + '(' + key + ')' }}
                         </v-list-item-title>
 
@@ -45,7 +38,14 @@
                     </v-list-item>
                 </v-col>
 
-                <v-col cols="6">
+                <v-col cols="1">
+                    <v-chip v-if="!metadata[metadataKey].items[key]?.invisible" color="primary" label size="x-small"
+                        class="mb-1">{{
+                            metadata[metadataKey].items[key]?.type }}
+                    </v-chip>
+                </v-col>
+
+                <v-col cols="5">
                     <div style="width: 100%;" v-if="metadata[metadataKey].items[key]">
                         <v-select
                             v-if="metadata[metadataKey].items[key]?.options && !metadata[metadataKey].items[key]?.invisible"
@@ -76,23 +76,19 @@
                         <v-text-field v-model="iterable[key]" :label="key" variant="outlined" dense></v-text-field>
                     </div>
                 </v-col>
-                <v-divider class="mb-4" style="border-color: #ccc; margin-left: -18px; margin-right: -18px;"
-                    v-if="index !== Object.keys(iterable).length - 1"></v-divider>
+
             </v-row>
 
+            <v-divider style="border-color: #ccc;" v-if="index !== Object.keys(iterable).length - 1"></v-divider>
+
         </div>
         <div v-else>
 
-            <v-row>
-                <v-col cols="6">
+            <v-row style="margin: 0; align-items: center;">
+                <v-col cols="6" style="padding: 0px;">
                     <v-list-item>
                         <v-list-item-title style="font-size: 14px; font-weight: bold">
-                            <v-chip v-if="!metadata[metadataKey]?.invisible" color="primary" label size="x-small"
-                                class="mb-1">{{
-                                    metadata[metadataKey]?.type }}
-                            </v-chip>
                             {{ metadata[metadataKey]?.description + '(' + metadataKey + ')' }}
-                            
                         </v-list-item-title>
 
                         <v-list-item-subtitle style="font-size: 12px;">
@@ -101,23 +97,35 @@
                         </v-list-item-subtitle>
                     </v-list-item>
                 </v-col>
-                <v-col cols="6">
+
+                <v-col cols="1">
+                    <v-chip v-if="!metadata[metadataKey]?.invisible" color="primary" label size="x-small"
+                        class="mb-1">{{
+                            metadata[metadataKey]?.type }}
+                    </v-chip>
+                </v-col>
+
+                <v-col cols="5">
                     <div style="width: 100%;">
                         <v-select v-if="metadata[metadataKey]?.options && !metadata[metadataKey]?.invisible"
                             v-model="iterable[metadataKey]" variant="outlined" :items="metadata[metadataKey]?.options"
-                            dense :disabled="metadata[metadataKey]?.readonly" density="compact"></v-select>
+                            dense :disabled="metadata[metadataKey]?.readonly" density="compact" flat hide-details
+                            single-line></v-select>
                         <v-text-field
                             v-else-if="metadata[metadataKey]?.type === 'string' && !metadata[metadataKey]?.invisible"
-                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact"></v-text-field>
+                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact" flat hide-details
+                            single-line></v-text-field>
                         <v-text-field
                             v-else-if="(metadata[metadataKey]?.type === 'int' || metadata[metadataKey]?.type === 'float') && !metadata[metadataKey]?.invisible"
-                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact"></v-text-field>
+                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact" flat hide-details
+                            single-line></v-text-field>
                         <v-textarea
                             v-else-if="metadata[metadataKey]?.type === 'text' && !metadata[metadataKey]?.invisible"
-                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact"></v-textarea>
+                            v-model="iterable[metadataKey]" variant="outlined" dense density="compact" flat hide-details
+                            single-line></v-textarea>
                         <v-switch
                             v-else-if="metadata[metadataKey]?.type === 'bool' && !metadata[metadataKey]?.invisible"
-                            v-model="iterable[metadataKey]" color="primary"></v-switch>
+                            v-model="iterable[metadataKey]" color="primary" hide-details></v-switch>
                         <ListConfigItem
                             v-else-if="metadata[metadataKey]?.type === 'list' && !metadata[metadataKey]?.invisible"
                             :value="iterable[metadataKey]" />
@@ -125,7 +133,7 @@
                 </v-col>
             </v-row>
 
-            <v-divider class="mb-4" style="border-color: #ddd; margin-left: -18px; margin-right: -18px;"></v-divider>
+            <v-divider style="border-color: #ddd;"></v-divider>
         </div>
     </v-card-text>
 </template>
diff --git a/dashboard/src/views/ConfigPage.vue b/dashboard/src/views/ConfigPage.vue
index 55d6e8e33..37d740a3c 100644
--- a/dashboard/src/views/ConfigPage.vue
+++ b/dashboard/src/views/ConfigPage.vue
@@ -44,11 +44,8 @@ import config from '@/config';
             <div v-if="metadata[key]['metadata'][key2]?.config_template"
               v-show="key2 !== 'platform' && key2 !== 'provider'" style="border: 1px solid #e0e0e0; padding: 8px; margin-bottom: 16px; border-radius: 10px">
               <!-- 带有 config_template 的配置项 -->
-              <v-list-item-title>
+              <v-list-item-title style="font-weight: bold;">
                 {{ metadata[key]['metadata'][key2]['description'] }} ({{ key2 }})
-                <v-chip color="primary" label size="x-small" class="mb-1">
-                  object
-                </v-chip>
               </v-list-item-title>
               <v-tabs style="margin-top: 16px;" align-tabs="left" color="deep-purple-accent-4"