style: 全局 UI 主题皮肤重构与样式模块化

引入 Element Plus 主题定制和主题皮肤 composable，将全局
样式拆分为组件级独立 CSS 文件（侧边栏、顶栏、工作台等），
统一色彩变量和间距规范，重构所有视图和组件样式以适配新
主题系统，优化图表和知识图谱组件视觉表现，提取审计和差
旅报销相关子组件。

web/src/composables/useSettings.js

@@ -1,6 +1,7 @@
 import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
 
 import { useSystemState } from './useSystemState.js'
+import { useThemeSkin } from './useThemeSkin.js'
 import { fetchSettings, saveSettings } from '../services/settings.js'
 import { useToast } from './useToast.js'
 import {
@@ -28,6 +29,12 @@ import {
 export function useSettings() {
   const { toast } = useToast()
   const { companyProfile, currentUser, updateCompanyProfilePreview } = useSystemState()
+  const {
+    activeThemeSkin,
+    activeThemeSkinId,
+    setThemeSkin,
+    themeSkinOptions
+  } = useThemeSkin()
 
   const buildResolvedDefaults = () => buildDefaultState(companyProfile.value, currentUser.value)
   const pageState = ref(mergeState(buildResolvedDefaults(), readStoredSettings()))
@@ -40,6 +47,11 @@ export function useSettings() {
   const logLevels = LOG_LEVELS
   const providerOptions = PROVIDER_OPTIONS
   const sessionRetentionOptions = SESSION_RETENTION_OPTIONS
+  const archiveCycleOptions = [
+    { label: '按天归档', value: 'daily' },
+    { label: '按周归档', value: 'weekly' },
+    { label: '按月归档', value: 'monthly' }
+  ]
 
   const sectionStatus = computed(() => computeSectionStatus(pageState.value))
   const completedSectionCount = computed(() => Object.values(sectionStatus.value).filter(Boolean).length)
@@ -293,6 +305,14 @@ export function useSettings() {
     })
   }
 
+  function selectThemeSkin(skinId) {
+    setThemeSkin(skinId)
+  }
+
+  function saveAppearanceSection() {
+    toast('界面皮肤已应用到当前浏览器。')
+  }
+
   async function saveLlmSection() {
     const llmForm = pageState.value.llmForm
     const modelConfigs = [
@@ -391,6 +411,11 @@ export function useSettings() {
       return
     }
 
+    if (activeSection.value === 'appearance') {
+      saveAppearanceSection()
+      return
+    }
+
     if (activeSection.value === 'session') {
       await saveSessionSection()
       return
@@ -460,6 +485,9 @@ export function useSettings() {
   return {
     activeSection,
     activeSectionConfig,
+    activeThemeSkin,
+    activeThemeSkinId,
+    archiveCycleOptions,
     activateSection,
     clearRenderSecretMask,
     completedSectionCount,
@@ -473,7 +501,9 @@ export function useSettings() {
     saveActiveSection,
     sectionStatus,
     sections,
+    selectThemeSkin,
     selectSessionRetentionDays,
+    themeSkinOptions,
     toggleSessionRetentionPicker,
     closeSessionRetentionPicker,
     toggleBoolean,