feat(admin): expose s3 backup as module

frontend/src/views/admin/SystemSettings.vue

@@ -46,9 +46,6 @@
             @file-select="handleDataFileSelect"
           />
 
-          <!-- S3 备份 -->
-          <S3BackupSection id="section-s3-backup" />
-
           <!-- 网络代理 -->
           <ProxyConfigSection
             id="section-proxy"
@@ -270,7 +267,6 @@ import { useScheduledTasks } from './system-settings/composables/useScheduledTas
 // Section components
 import SiteInfoSection from './system-settings/SiteInfoSection.vue'
 import DataManagementSection from './system-settings/DataManagementSection.vue'
-import S3BackupSection from './system-settings/S3BackupSection.vue'
 import ProxyConfigSection from './system-settings/ProxyConfigSection.vue'
 import BasicConfigSection from './system-settings/BasicConfigSection.vue'
 import RequestLogSection from './system-settings/RequestLogSection.vue'
@@ -289,7 +285,6 @@ const proxyNodesStore = useProxyNodesStore()
 const tocItems = [
   { id: 'section-site-info', label: '站点信息' },
   { id: 'section-data-mgmt', label: '数据管理' },
-  { id: 'section-s3-backup', label: 'S3 备份' },
   { id: 'section-proxy', label: '网络代理' },
   { id: 'section-basic', label: '基础配置' },
   { id: 'section-request-log', label: '请求记录' },

frontend/src/views/admin/modules/S3BackupSettings.vue

@@ -1,31 +1,38 @@
 <template>
-  <CardSection
-    title="S3 备份"
-    description="按导出范围备份到 S3-compatible 存储"
-  >
-    <template #actions>
-      <div class="flex items-center gap-2">
-        <Button
-          variant="outline"
-          size="sm"
-          :disabled="backupRunDisabled"
-          @click="backup.runS3BackupNow"
-        >
-          <Play class="w-3.5 h-3.5 mr-1.5" />
-          {{ backup.running.value ? '提交中...' : '立即备份' }}
-        </Button>
-        <Button
-          size="sm"
-          :disabled="backup.saving.value || !backup.hasChanges.value"
-          @click="backup.saveS3BackupConfig"
-        >
-          <Save class="w-3.5 h-3.5 mr-1.5" />
-          {{ backup.saving.value ? '保存中...' : '保存' }}
-        </Button>
-      </div>
-    </template>
+  <PageContainer>
+    <PageHeader
+      title="S3 备份"
+      description="按导出范围备份到 S3-compatible 存储"
+    />
 
-    <div class="space-y-5">
+    <CardSection
+      title="备份配置"
+      description="配置自动备份周期、对象存储连接和保留策略"
+      class="mt-6"
+    >
+      <template #actions>
+        <div class="flex items-center gap-2">
+          <Button
+            variant="outline"
+            size="sm"
+            :disabled="backupRunDisabled"
+            @click="backup.runS3BackupNow"
+          >
+            <Play class="w-3.5 h-3.5 mr-1.5" />
+            {{ backup.running.value ? '提交中...' : '立即备份' }}
+          </Button>
+          <Button
+            size="sm"
+            :disabled="backup.saving.value || !backup.hasChanges.value"
+            @click="backup.saveS3BackupConfig"
+          >
+            <Save class="w-3.5 h-3.5 mr-1.5" />
+            {{ backup.saving.value ? '保存中...' : '保存' }}
+          </Button>
+        </div>
+      </template>
+
+      <div class="space-y-5">
       <div class="flex items-center justify-between rounded-lg border border-border p-4">
         <div class="flex items-center gap-3 min-w-0">
           <div class="w-9 h-9 rounded-lg bg-primary/10 text-primary flex items-center justify-center shrink-0">
@@ -395,8 +402,9 @@
           </div>
         </div>
       </div>
-    </div>
-  </CardSection>
+      </div>
+    </CardSection>
+  </PageContainer>
 </template>
 
 <script setup lang="ts">
@@ -418,7 +426,7 @@ import SelectItem from '@/components/ui/select-item.vue'
 import SelectTrigger from '@/components/ui/select-trigger.vue'
 import SelectValue from '@/components/ui/select-value.vue'
 import Switch from '@/components/ui/switch.vue'
-import { CardSection } from '@/components/layout'
+import { CardSection, PageContainer, PageHeader } from '@/components/layout'
 import {
   useS3BackupConfig,
   type S3BackupConfig,