Add uuid dependency and implement KV storage support in settings and data provider components. Enhance server settings with site key configuration and improve data handling for new KV providers.

src/components/settings/cards/DataProviderSettingsCard.vue

@@ -2,7 +2,7 @@
   <settings-card title="数据源设置" icon="mdi-database-cog">
     <v-list>
       <!-- 服务器模式设置 -->
-      <template v-if="currentProvider === 'server'">
+      <template v-if="currentProvider === 'server' || currentProvider === 'kv-server'">
         <v-list-item>
           <template #prepend>
             <v-icon icon="mdi-lan-connect" class="mr-3" />
@@ -17,7 +17,7 @@
       </template>
 
       <!-- IndexedDB设置 -->
-      <template v-if="currentProvider === 'indexedDB'">
+      <template v-if="currentProvider === 'indexedDB' || currentProvider === 'kv-local'">
         <v-list-item>
           <template #prepend>
             <v-icon icon="mdi-database" class="mr-3" />
@@ -39,7 +39,32 @@
             <v-btn variant="tonal" @click="exportData"> 导出 </v-btn>
           </template>
         </v-list-item>
+
+        <!-- 显示机器ID，仅对KV本地存储有效 -->
+        <v-list-item v-if="currentProvider === 'kv-local'">
+          <template #prepend>
+            <v-icon icon="mdi-identifier" class="mr-3" />
+          </template>
+          <v-list-item-title>本机唯一标识符</v-list-item-title>
+          <v-list-item-subtitle v-if="machineId">{{ machineId }}</v-list-item-subtitle>
+          <v-list-item-subtitle v-else>正在加载...</v-list-item-subtitle>
+        </v-list-item>
+
+        <!-- 数据迁移，仅对KV本地存储有效 -->
+        <v-list-item v-if="currentProvider === 'kv-local'">
+          <template #prepend>
+            <v-icon icon="mdi-database-import" class="mr-3" />
+          </template>
+          <v-list-item-title>迁移旧数据</v-list-item-title>
+          <v-list-item-subtitle>将旧的存储格式数据转移到新的KV存储</v-list-item-subtitle>
+          <template #append>
+            <v-btn :loading="migrateLoading" variant="tonal" @click="migrateData">
+              迁移
+            </v-btn>
+          </template>
+        </v-list-item>
       </template>
+
       <v-list-item>
         <template #prepend>
           <v-icon icon="mdi-lan-connect" class="mr-3" />
@@ -50,7 +75,22 @@
             查看
           </v-btn>
         </template>
-      </v-list-item> <v-list-item>
+      </v-list-item>
+
+      <v-list-item>
+        <template #prepend>
+          <v-icon icon="mdi-database-sync" class="mr-3" />
+        </template>
+        <v-list-item-title>高级数据迁移工具</v-list-item-title>
+        <v-list-item-subtitle>更强大的数据迁移工具，支持从本地或服务器迁移到KV存储</v-list-item-subtitle>
+        <template #append>
+          <v-btn variant="tonal" color="primary" to="/datamigration">
+            打开
+          </v-btn>
+        </template>
+      </v-list-item>
+
+      <v-list-item>
         <template #prepend>
           <v-icon icon="mdi-lan-connect" class="mr-3" />
         </template>
@@ -82,6 +122,8 @@
 import SettingsCard from "@/components/SettingsCard.vue";
 import { getSetting } from "@/utils/settings";
 import axios from "axios";
+import { getMachineId } from "@/utils/providers/kvProvider";
+
 export default {
   name: "DataProviderSettingsCard",
   components: { SettingsCard },
@@ -94,6 +136,8 @@ export default {
       confirmTitle: "",
       confirmMessage: "",
       confirmAction: null,
+      machineId: null,
+      migrateLoading: false,
     };
   },
 
@@ -101,6 +145,21 @@ export default {
     currentProvider() {
       return getSetting("server.provider");
     },
+
+    isKvProvider() {
+      return this.currentProvider === 'kv-local' || this.currentProvider === 'kv-server';
+    }
+  },
+
+  async created() {
+    // 如果是KV本地存储，获取机器ID
+    if (this.currentProvider === 'kv-local') {
+      try {
+        this.machineId = await getMachineId();
+      } catch (error) {
+        console.error("获取机器ID失败:", error);
+      }
+    }
   },
 
   methods: {
@@ -109,9 +168,17 @@ export default {
       this.serverchecktime = new Date();
       try {
         const domain = getSetting("server.domain");
+        const siteKey = getSetting("server.siteKey");
+
+        // Prepare headers including site key if available
+        const headers = { Accept: "application/json" };
+        if (siteKey) {
+          headers['x-site-key'] = siteKey;
+        }
+
         const response = await axios.get(`${domain}/api/test`, {
           method: "GET",
-          headers: { Accept: "application/json" },
+          headers
         });
 
         if (response.data.status === "success") {
@@ -160,6 +227,13 @@ export default {
         await window.indexedDB.deleteDatabase(DBName);
         this.$message.success("清除成功", "数据库缓存已清除");
         this.confirmDialog = false;
+
+        // 如果是KV提供者，需要刷新页面以生成新的UUID
+        if (this.isKvProvider) {
+          setTimeout(() => {
+            window.location.reload();
+          }, 1500);
+        }
       } catch (error) {
         this.$message.error("清除失败", error.message);
       }
@@ -214,6 +288,12 @@ export default {
       }
     },
 
+    async migrateData() {
+      this.migrateLoading = true;
+      this.$router.push('/datamigration');
+      this.migrateLoading = false;
+    },
+
     handleConfirm() {
       if (this.confirmAction) {
         this.confirmAction();

src/components/settings/cards/ServerSettingsCard.vue

@@ -2,11 +2,32 @@
   <settings-card title="数据源设置" icon="mdi-database" :loading="loading">
     <v-form>
       <setting-item setting-key="server.provider" title="数据提供者" />
-      <v-divider class="my-2" />
-      <setting-item setting-key="server.domain" title="服务器域名" />      <v-divider class="my-2" />
 
+      <v-alert v-if="isKvProvider" type="info" variant="tonal" class="my-2">
+        <v-alert-title>KV 存储系统</v-alert-title>
+        <p>KV存储系统使用本机唯一标识符(UUID)来区分不同设备的数据。</p>
+        <p v-if="currentProvider === 'kv-server'">
+          服务器端点格式: <code>http(s)://服务器域名/</code><br>
+          在服务器域名处仅填写基础URL，不需要任何路径。
+        </p>
+      </v-alert>
+
+      <v-divider class="my-2" />
+      <setting-item setting-key="server.domain" title="服务器域名" />
+      <v-divider class="my-2" />
       <setting-item setting-key="server.classNumber" title="班号" />
-     
+      <v-divider class="my-2" />
+      <setting-item setting-key="server.siteKey" title="网站令牌">
+        <template #description>
+          用于后端验证请求的安全令牌。如需要，请从系统管理员获取。
+        </template>
+      </setting-item>
+      <v-alert v-if="useServer" type="info" variant="tonal" class="my-2">
+        <v-icon icon="mdi-information-outline" class="mr-2"></v-icon>
+        <span>网站令牌将作为 <code>x-site-key</code> 请求头发送给服务器，用于验证请求的合法性。如果您的服务器需要此验证，请在上方输入有效的令牌。</span>
+      </v-alert>
+      <v-divider class="my-2" />
+      <setting-item setting-key="device.uuid" title="设备UUID" />
     </v-form>
   </settings-card>
 </template>
@@ -14,19 +35,27 @@
 <script>
 import SettingsCard from "@/components/SettingsCard.vue";
 import SettingItem from "@/components/settings/SettingItem.vue";
+import { getSetting } from "@/utils/settings";
+
 export default {
   name: "ServerSettingsCard",
-  components: { SettingsCard },
+  components: { SettingsCard, SettingItem },
   props: {
     loading: Boolean,
   },
   data() {
-    
-
-    return {
-     
-    };
+    return {};
   },
-  
+  computed: {
+    currentProvider() {
+      return getSetting("server.provider");
+    },
+    isKvProvider() {
+      return this.currentProvider === 'kv-local' || this.currentProvider === 'kv-server';
+    },
+    useServer() {
+      return this.currentProvider === 'server' || this.currentProvider === 'kv-server';
+    }
+  }
 };
 </script>