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

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

web/src/data/metrics.js

@@ -3,7 +3,7 @@ export const metricBlueprints = [
     key: 'pendingCount',
     label: '待审批单据',
     unit: '单',
-    accent: '#10b981',
+    accent: 'var(--theme-primary)',
     icon: 'mdi mdi-file-document-outline',
     trend: 'down',
     change: '12.5%',
@@ -12,7 +12,7 @@ export const metricBlueprints = [
   {
     key: 'pendingAmount',
     label: '待处理金额',
-    accent: '#3b82f6',
+    accent: 'var(--chart-blue)',
     icon: 'mdi mdi-wallet',
     trend: 'up',
     change: '8.3%',
@@ -22,7 +22,7 @@ export const metricBlueprints = [
     key: 'avgSla',
     label: '平均审批时长',
     unit: 'h',
-    accent: '#8b5cf6',
+    accent: 'var(--chart-purple)',
     icon: 'mdi mdi-clock-outline',
     trend: 'down',
     change: '14.8%',
@@ -32,7 +32,7 @@ export const metricBlueprints = [
     key: 'autoPassRate',
     label: '自动审单通过率',
     unit: '%',
-    accent: '#16a34a',
+    accent: 'var(--success)',
     icon: 'mdi mdi-shield-outline',
     trend: 'up',
     change: '6.2%',
@@ -42,7 +42,7 @@ export const metricBlueprints = [
     key: 'riskCount',
     label: '异常预警单',
     unit: '单',
-    accent: '#ef4444',
+    accent: 'var(--danger)',
     icon: 'mdi mdi-alert',
     trend: 'up',
     change: '16.7%',
@@ -52,7 +52,7 @@ export const metricBlueprints = [
     key: 'slaRate',
     label: 'SLA 达成率',
     unit: '%',
-    accent: '#10b981',
+    accent: 'var(--success)',
     icon: 'mdi mdi-check-circle',
     trend: 'up',
     change: '3.1%',
@@ -84,17 +84,17 @@ export const trendSeries = {
 }
 
 export const spendByCategory = [
-  { name: '机票', value: 182000, color: '#16a34a' },
-  { name: '酒店', value: 146000, color: '#3b82f6' },
-  { name: '火车/用车', value: 78600, color: '#f59e0b' },
-  { name: '餐补及杂费', value: 55000, color: '#8b5cf6' }
+  { name: '机票', value: 182000, color: 'var(--theme-primary)' },
+  { name: '酒店', value: 146000, color: 'var(--chart-blue)' },
+  { name: '火车/用车', value: 78600, color: 'var(--chart-amber)' },
+  { name: '餐补及杂费', value: 55000, color: 'var(--chart-purple)' }
 ]
 
 export const exceptionMix = [
-  { name: '住宿超标', value: 5, color: '#ef4444' },
-  { name: '重复报销', value: 3, color: '#f59e0b' },
-  { name: '行程缺失', value: 3, color: '#8b5cf6' },
-  { name: '发票异常', value: 3, color: '#3b82f6' }
+  { name: '住宿超标', value: 5, color: 'var(--danger)' },
+  { name: '重复报销', value: 3, color: 'var(--warning)' },
+  { name: '行程缺失', value: 3, color: 'var(--chart-purple)' },
+  { name: '发票异常', value: 3, color: 'var(--chart-blue)' }
 ]
 
 export const departmentRangeOptions = ['本周', '本月', '本季度']