refactor: 自动转存功能重构

web/pages/admin/site-config.vue

@@ -14,79 +14,125 @@
       </n-button>
     </div>
 
-    <!-- 配置表单 -->
+        <!-- 配置表单 -->
     <n-card>
-      <n-form
-        ref="formRef"
-        :model="configForm"
-        :rules="rules"
-        label-placement="left"
-        label-width="auto"
-        require-mark-placement="right-hanging"
+      <!-- 顶部Tabs -->
+      <n-tabs
+        v-model:value="activeTab"
+        type="line"
+        animated
+        class="mb-6"
       >
-        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
-          <!-- 网站标题 -->
-          <n-form-item label="网站标题" path="site_title">
-            <n-input
-              v-model:value="configForm.site_title"
-              placeholder="请输入网站标题"
-            />
-          </n-form-item>
+        <n-tab-pane name="basic" tab="基本信息">
+          
+          <n-form
+            ref="formRef"
+            :model="configForm"
+            :rules="rules"
+            label-placement="left"
+            label-width="auto"
+            require-mark-placement="right-hanging"
+          >
+            <div class="space-y-6">
+              <!-- 网站标题 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">网站标题</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">网站的主要标识，显示在浏览器标签页和搜索结果中</span>
+                </div>
+                <n-input
+                  v-model:value="configForm.site_title"
+                  placeholder="请输入网站标题"
+                />
+              </div>
 
-          <!-- 网站描述 -->
-          <n-form-item label="网站描述" path="site_description">
-            <n-input
-              v-model:value="configForm.site_description"
-              placeholder="请输入网站描述"
-            />
-          </n-form-item>
+              <!-- 网站描述 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">网站描述</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">网站的简要介绍，用于SEO和社交媒体分享</span>
+                </div>
+                <n-input
+                  v-model:value="configForm.site_description"
+                  placeholder="请输入网站描述"
+                />
+              </div>
 
-          <!-- 关键词 -->
-          <n-form-item label="关键词" path="keywords">
-            <n-input
-              v-model:value="configForm.keywords"
-              placeholder="请输入关键词，用逗号分隔"
-            />
-          </n-form-item>
+              <!-- 关键词 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">关键词</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">用于SEO优化，多个关键词用逗号分隔</span>
+                </div>
+                <n-input
+                  v-model:value="configForm.keywords"
+                  placeholder="请输入关键词，用逗号分隔"
+                />
+              </div>
 
-          <!-- 版权信息 -->
-          <n-form-item label="版权信息" path="copyright">
-            <n-input
-              v-model:value="configForm.copyright"
-              placeholder="请输入版权信息"
-            />
-          </n-form-item>
+              <!-- 版权信息 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">版权信息</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">网站底部的版权声明信息</span>
+                </div>
+                <n-input
+                  v-model:value="configForm.copyright"
+                  placeholder="请输入版权信息"
+                />
+              </div>
+            </div>
+          </n-form>
+        </n-tab-pane>
 
-          <!-- 维护模式 -->
-          <n-form-item label="维护模式" path="maintenance_mode">
-            <n-switch v-model:value="configForm.maintenance_mode" />
-            <template #help>
-              开启后网站将显示维护页面
-            </template>
-          </n-form-item>
 
-          <!-- 开启注册 -->
-          <n-form-item label="开启注册" path="enable_register">
-            <n-switch v-model:value="configForm.enable_register" />
-            <template #help>
-              开启后用户才能注册新账号，关闭后注册页面将显示"当前系统已关闭注册功能"
-            </template>
-          </n-form-item>
 
-          <!-- 违禁词 -->
-          <n-form-item label="违禁词" path="forbidden_words" class="md:col-span-2">
-            <n-input
-              v-model:value="configForm.forbidden_words"
-              placeholder="请输入违禁词，用逗号分隔"
-              type="textarea"
-              :rows="4"
-            />
-            <template #help>
-              包含这些词汇的资源将被过滤
-            </template>
-          </n-form-item>
-        </div>
-      </n-form>
+        <n-tab-pane name="security" tab="安全设置">
+          
+          <n-form
+            ref="formRef"
+            :model="configForm"
+            :rules="rules"
+            label-placement="left"
+            label-width="auto"
+            require-mark-placement="right-hanging"
+          >
+            <div class="space-y-6">
+              <!-- 维护模式 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">维护模式</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">开启后网站将显示维护页面，暂停用户访问</span>
+                </div>
+                <n-switch v-model:value="configForm.maintenance_mode" />
+              </div>
+
+              <!-- 违禁词 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">违禁词</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">包含这些词汇的资源将被过滤，多个词汇用逗号分隔</span>
+                </div>
+                <n-input
+                  v-model:value="configForm.forbidden_words"
+                  placeholder="请输入违禁词，用逗号分隔"
+                  type="textarea"
+                  :rows="4"
+                />
+              </div>
+
+              <!-- 开启注册 -->
+              <div class="space-y-2">
+                <div class="flex items-center space-x-2">
+                  <label class="text-base font-semibold text-gray-800 dark:text-gray-200">开启注册</label>
+                  <span class="text-xs text-gray-500 dark:text-gray-400">开启后用户才能注册新账号，关闭后注册页面将显示"当前系统已关闭注册功能"</span>
+                </div>
+                <n-switch v-model:value="configForm.enable_register" />
+              </div>
+            </div>
+          </n-form>
+        </n-tab-pane>
+      </n-tabs>
     </n-card>
   </div>
 </template>
@@ -101,6 +147,7 @@ definePageMeta({
 const notification = useNotification()
 const formRef = ref()
 const saving = ref(false)
+const activeTab = ref('basic')
 
 // 配置表单数据
 const configForm = ref<{
@@ -111,6 +158,8 @@ const configForm = ref<{
   maintenance_mode: boolean
   enable_register: boolean
   forbidden_words: string
+  enable_sitemap: boolean
+  sitemap_update_frequency: string
 }>({
   site_title: '',
   site_description: '',
@@ -118,9 +167,13 @@ const configForm = ref<{
   copyright: '',
   maintenance_mode: false,
   enable_register: false, // 新增：开启注册开关
-  forbidden_words: ''
+  forbidden_words: '',
+  enable_sitemap: false,
+  sitemap_update_frequency: 'daily'
 })
 
+
+
 // 表单验证规则
 const rules = {
   site_title: {
@@ -150,7 +203,9 @@ const fetchConfig = async () => {
         copyright: response.copyright || '',
         maintenance_mode: response.maintenance_mode || false,
         enable_register: response.enable_register || false, // 新增：获取开启注册开关
-        forbidden_words: response.forbidden_words || ''
+        forbidden_words: response.forbidden_words || '',
+        enable_sitemap: response.enable_sitemap || false,
+        sitemap_update_frequency: response.sitemap_update_frequency || 'daily'
       }
     }
   } catch (error) {
@@ -178,7 +233,9 @@ const saveConfig = async () => {
       copyright: configForm.value.copyright,
       maintenance_mode: configForm.value.maintenance_mode,
       enable_register: configForm.value.enable_register, // 新增：保存开启注册开关
-      forbidden_words: configForm.value.forbidden_words
+      forbidden_words: configForm.value.forbidden_words,
+      enable_sitemap: configForm.value.enable_sitemap,
+      sitemap_update_frequency: configForm.value.sitemap_update_frequency
     })
     
     notification.success({