From d927f01da02de511c6ec8f67590ce640275b586f Mon Sep 17 00:00:00 2001
From: LIghtJUNction <lightjunction.me@gmail.com>
Date: Sat, 28 Mar 2026 14:12:36 +0800
Subject: [PATCH] fix(dashboard): Vuetify 4 compatibility fixes

- Replace deprecated v-chip-text with span (PersonaForm)
- Replace deprecated v-tab-item with v-window-item (ExtensionPage, InstalledPluginsTab, MarketPluginsTab)
- Replace deprecated v-row dense with density="compact" (SessionManagementPage, InstalledPluginsTab)
- Add missing hasUnsavedChanges field to ConfigPage data()
- Add missing i18n key editPersona (en-US, zh-CN)

Fixes multiple Vue warnings about failed component resolution and deprecated Vuetify props.
---
 .../src/components/shared/PersonaForm.vue     |  4 ++--
 .../src/i18n/locales/en-US/core/shared.json   |  1 +
 .../src/i18n/locales/zh-CN/core/shared.json   |  1 +
 dashboard/src/views/ConfigPage.vue            |  1 +
 dashboard/src/views/ExtensionPage.vue         | 12 +++++------
 dashboard/src/views/SessionManagementPage.vue | 20 +++++++++----------
 .../views/extension/InstalledPluginsTab.vue   |  6 +++---
 .../src/views/extension/MarketPluginsTab.vue  |  4 ++--
 8 files changed, 26 insertions(+), 23 deletions(-)

diff --git a/dashboard/src/components/shared/PersonaForm.vue b/dashboard/src/components/shared/PersonaForm.vue
index dba704355..2ecf3eda6 100644
--- a/dashboard/src/components/shared/PersonaForm.vue
+++ b/dashboard/src/components/shared/PersonaForm.vue
@@ -138,9 +138,9 @@
                           >
                             <v-icon start size="small"> mdi-server </v-icon>
                             {{ server.name }}
-                            <v-chip-text v-if="server.tools" class="ml-1">
+                            <span v-if="server.tools" class="ml-1">
                               ({{ server.tools.length }})
-                            </v-chip-text>
+                            </span>
                           </v-chip>
                         </div>
                       </div>
diff --git a/dashboard/src/i18n/locales/en-US/core/shared.json b/dashboard/src/i18n/locales/en-US/core/shared.json
index beb486b30..059ec04ec 100644
--- a/dashboard/src/i18n/locales/en-US/core/shared.json
+++ b/dashboard/src/i18n/locales/en-US/core/shared.json
@@ -60,6 +60,7 @@
     "confirmSelection": "Confirm Selection",
     "selectPersonaPool": "Select Persona Pool...",
     "rootFolder": "All Personas",
+    "editPersona": "Edit Persona",
     "emptyFolder": "This folder is empty"
   },
   "personaQuickPreview": {
diff --git a/dashboard/src/i18n/locales/zh-CN/core/shared.json b/dashboard/src/i18n/locales/zh-CN/core/shared.json
index fd064e2e4..7a8232bb6 100644
--- a/dashboard/src/i18n/locales/zh-CN/core/shared.json
+++ b/dashboard/src/i18n/locales/zh-CN/core/shared.json
@@ -60,6 +60,7 @@
     "confirmSelection": "确认选择",
     "selectPersonaPool": "选择人格池...",
     "rootFolder": "全部人格",
+    "editPersona": "编辑人格",
     "emptyFolder": "此文件夹为空"
   },
   "personaQuickPreview": {
diff --git a/dashboard/src/views/ConfigPage.vue b/dashboard/src/views/ConfigPage.vue
index e9b71c231..3a5bf7561 100644
--- a/dashboard/src/views/ConfigPage.vue
+++ b/dashboard/src/views/ConfigPage.vue
@@ -441,6 +441,7 @@ export default {
       // 未保存的更改状态
       // 存储原始配置
       originalConfigData: null,
+      hasUnsavedChanges: false,
     };
   },
 
diff --git a/dashboard/src/views/ExtensionPage.vue b/dashboard/src/views/ExtensionPage.vue
index d6697327a..17eb7369a 100644
--- a/dashboard/src/views/ExtensionPage.vue
+++ b/dashboard/src/views/ExtensionPage.vue
@@ -162,7 +162,7 @@ const {
           <InstalledPluginsTab :state="pageState" />
 
           <!-- 指令面板标签页内容 -->
-          <v-tab-item v-show="activeTab === 'components'">
+          <v-window-item v-show="activeTab === 'components'">
             <div class="mb-4 pt-4 pb-4">
               <div class="d-flex align-center flex-wrap" style="gap: 12px">
                 <h2 class="text-h2 mb-0">{{ tm("tabs.handlersOperation") }}</h2>
@@ -177,10 +177,10 @@ const {
                 <ComponentPanel :active="activeTab === 'components'" />
               </v-card-text>
             </v-card>
-          </v-tab-item>
+          </v-window-item>
 
           <!-- 已安装的 MCP 服务器标签页内容 -->
-          <v-tab-item v-show="activeTab === 'mcp'">
+          <v-window-item v-show="activeTab === 'mcp'">
             <div class="mb-4 pt-4 pb-4">
               <div class="d-flex align-center flex-wrap" style="gap: 12px">
                 <h2 class="text-h2 mb-0">
@@ -197,10 +197,10 @@ const {
                 <McpServersSection />
               </v-card-text>
             </v-card>
-          </v-tab-item>
+          </v-window-item>
 
           <!-- Skills 标签页内容 -->
-          <v-tab-item v-show="activeTab === 'skills'">
+          <v-window-item v-show="activeTab === 'skills'">
             <div class="mb-4 pt-4 pb-4">
               <div class="d-flex align-center flex-wrap" style="gap: 12px">
                 <h2 class="text-h2 mb-0">{{ tm("tabs.skills") }}</h2>
@@ -215,7 +215,7 @@ const {
                 <SkillsSection />
               </v-card-text>
             </v-card>
-          </v-tab-item>
+          </v-window-item>
 
           <!-- 插件市场标签页内容 -->
           <MarketPluginsTab :state="pageState" />
diff --git a/dashboard/src/views/SessionManagementPage.vue b/dashboard/src/views/SessionManagementPage.vue
index 19823f7ce..b488e34e4 100644
--- a/dashboard/src/views/SessionManagementPage.vue
+++ b/dashboard/src/views/SessionManagementPage.vue
@@ -14,7 +14,7 @@
           <v-chip size="small" class="ml-1"
             >{{ totalItems }} {{ tm("customRules.rulesCount") }}</v-chip
           >
-          <v-row class="me-4 ms-4" dense>
+          <v-row class="me-4 ms-4" density="compact">
             <v-text-field
               v-model="searchQuery"
               prepend-inner-icon="mdi-magnify"
@@ -241,7 +241,7 @@
           </v-chip>
         </v-card-title>
         <v-card-text>
-          <v-row dense>
+          <v-row density="compact">
             <v-col cols="12" md="6" lg="3">
               <v-select
                 v-model="batchScope"
@@ -302,7 +302,7 @@
               </v-select>
             </v-col>
           </v-row>
-          <v-row dense class="mt-3">
+          <v-row density="compact" class="mt-3">
             <v-col cols="12" class="d-flex justify-end">
               <v-btn
                 color="primary"
@@ -370,7 +370,7 @@
           </v-btn>
         </v-card-title>
         <v-card-text v-if="groups.length > 0">
-          <v-row dense>
+          <v-row density="compact">
             <v-col
               v-for="group in groups"
               :key="group.id"
@@ -440,7 +440,7 @@
               hide-details
               class="mb-4"
             ></v-text-field>
-            <v-row dense>
+            <v-row density="compact">
               <!-- 左侧：可选会话 -->
               <v-col cols="5">
                 <div class="text-subtitle-2 mb-2">
@@ -650,7 +650,7 @@
                 </h3>
               </div>
 
-              <v-row dense>
+              <v-row density="compact">
                 <v-col cols="12">
                   <v-checkbox
                     v-model="serviceConfig.session_enabled"
@@ -707,7 +707,7 @@
                 </h3>
               </div>
 
-              <v-row dense>
+              <v-row density="compact">
                 <v-col cols="12">
                   <v-select
                     v-model="providerConfig.chat_completion"
@@ -767,7 +767,7 @@
                 </h3>
               </div>
 
-              <v-row dense>
+              <v-row density="compact">
                 <v-col cols="12">
                   <v-select
                     v-model="serviceConfig.persona_id"
@@ -812,7 +812,7 @@
                 </h3>
               </div>
 
-              <v-row dense>
+              <v-row density="compact">
                 <v-col cols="12">
                   <v-select
                     v-model="pluginConfig.disabled_plugins"
@@ -860,7 +860,7 @@
                 </h3>
               </div>
 
-              <v-row dense>
+              <v-row density="compact">
                 <v-col cols="12">
                   <v-select
                     v-model="kbConfig.kb_ids"
diff --git a/dashboard/src/views/extension/InstalledPluginsTab.vue b/dashboard/src/views/extension/InstalledPluginsTab.vue
index a60827401..cde85179c 100644
--- a/dashboard/src/views/extension/InstalledPluginsTab.vue
+++ b/dashboard/src/views/extension/InstalledPluginsTab.vue
@@ -268,7 +268,7 @@ const pinnedPlugins = computed(() => {
 </script>
 
 <template>
-  <v-tab-item v-show="activeTab === 'installed'">
+  <v-window-item v-show="activeTab === 'installed'">
     <div class="mb-4 pt-4 pb-4">
       <div class="d-flex align-center flex-wrap" style="gap: 12px">
         <h2 class="text-h2 mb-0">{{ tm("titles.installedAstrBotPlugins") }}</h2>
@@ -371,7 +371,7 @@ const pinnedPlugins = computed(() => {
               <h3 class="text-h6 mb-0">{{ tm("titles.pinnedPlugins") }}</h3>
             </div>
 
-            <v-row class="mt-3 relative" dense align="center" style="gap: 12px">
+            <v-row class="mt-3 relative" density="compact" align="center" style="gap: 12px">
               <template v-if="!pinnedPlugins || pinnedPlugins.length === 0">
                 <v-col v-for="n in 4" :key="n" cols="auto" />
               </template>
@@ -849,7 +849,7 @@ const pinnedPlugins = computed(() => {
         </button>
       </template>
     </v-tooltip>
-  </v-tab-item>
+  </v-window-item>
 </template>
 
 <style scoped>
diff --git a/dashboard/src/views/extension/MarketPluginsTab.vue b/dashboard/src/views/extension/MarketPluginsTab.vue
index 012cba4d5..d7cac3154 100644
--- a/dashboard/src/views/extension/MarketPluginsTab.vue
+++ b/dashboard/src/views/extension/MarketPluginsTab.vue
@@ -180,7 +180,7 @@ const marketCategorySelectItems = computed(() =>
 </script>
 
 <template>
-  <v-tab-item v-show="activeTab === 'market'">
+  <v-window-item v-show="activeTab === 'market'">
     <div class="mb-6 pt-4 pb-4">
       <div class="d-flex align-center" style="gap: 12px">
         <div class="d-flex align-center" style="gap: 12px; min-width: 0">
@@ -393,7 +393,7 @@ const marketCategorySelectItems = computed(() =>
         </div>
       </v-expand-transition>
     </div>
-  </v-tab-item>
+  </v-window-item>
 </template>
 
 <style scoped>