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

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

web/src/components/charts/TrendChart.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="trend-chart">
     <div class="chart-legend">
-      <span><i style="background:#10b981"></i>申请量（单）</span>
-      <span><i style="background:#3b82f6"></i>审批完成量（单）</span>
-      <span><i style="background:#8b5cf6"></i>平均审批时长（小时）</span>
+      <span><i :style="{ background: chartColors.primary }"></i>申请量（单）</span>
+      <span><i :style="{ background: chartColors.blue }"></i>审批完成量（单）</span>
+      <span><i :style="{ background: chartColors.purple }"></i>平均审批时长（小时）</span>
     </div>
     <div class="chart-body">
       <Bar :data="chartData" :options="chartOptions" />
@@ -26,6 +26,7 @@ import {
   Legend
 } from 'chart.js'
 import { useAnimationProgress } from '../../composables/useAnimationProgress.js'
+import { useThemeColors } from '../../composables/useThemeColors.js'
 
 ChartJS.register(CategoryScale, LinearScale, BarElement, PointElement, LineElement, Filler, Tooltip, Legend)
 
@@ -42,6 +43,12 @@ const progress = useAnimationProgress([
   () => props.approved,
   () => props.avgHours
 ], 1200)
+const themeColors = useThemeColors()
+const chartColors = computed(() => ({
+  primary: themeColors.value.chartPrimary,
+  blue: themeColors.value.chartBlue,
+  purple: themeColors.value.chartPurple
+}))
 
 const scaleSeries = (series, decimals = 0) =>
   series.map((value) => Number((Number(value) * progress.value).toFixed(decimals)))
@@ -52,7 +59,7 @@ const chartData = computed(() => ({
     {
       label: '申请量（单）',
       data: scaleSeries(props.applications),
-      backgroundColor: '#10b981',
+      backgroundColor: chartColors.value.primary,
       borderRadius: 4,
       barPercentage: 0.6,
       categoryPercentage: 0.5,
@@ -61,7 +68,7 @@ const chartData = computed(() => ({
     {
       label: '审批完成量（单）',
       data: scaleSeries(props.approved),
-      backgroundColor: '#3b82f6',
+      backgroundColor: chartColors.value.blue,
       borderRadius: 4,
       barPercentage: 0.6,
       categoryPercentage: 0.5,
@@ -70,11 +77,11 @@ const chartData = computed(() => ({
     {
       label: '平均审批时长（小时）',
       data: scaleSeries(props.avgHours, 1),
-      borderColor: '#8b5cf6',
+      borderColor: chartColors.value.purple,
       backgroundColor: 'transparent',
       borderWidth: 2,
       pointBackgroundColor: '#ffffff',
-      pointBorderColor: '#8b5cf6',
+      pointBorderColor: chartColors.value.purple,
       pointBorderWidth: 2,
       pointRadius: 3,
       pointHoverRadius: 5,