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

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

web/src/views/OverviewView.vue

@@ -26,9 +26,13 @@
       <article class="panel dashboard-card trend-panel">
         <div class="card-head">
           <h3>报销申请与审批趋势 <i class="mdi mdi-information-outline"></i></h3>
-          <select v-model="activeTrendRange" class="card-select" aria-label="趋势时间范围">
-            <option v-for="range in trendRanges" :key="range">{{ range }}</option>
-          </select>
+          <EnterpriseSelect
+            v-model="activeTrendRange"
+            class="card-select"
+            :options="trendRanges"
+            aria-label="趋势时间范围"
+            size="small"
+          />
         </div>
 
         <TrendChart
@@ -52,17 +56,21 @@
           <h3>风险异常分布 <i class="mdi mdi-information-outline"></i></h3>
         </div>
         <DonutChart :items="riskLegend" :center-value="`${riskTotal}`" center-label="异常预警单" />
-        <p class="panel-note">* 近30天数据</p>
+        <p class="panel-note">* 近 30 天数据</p>
       </article>
     </div>
 
     <div class="content-grid bottom-grid">
       <article class="panel dashboard-card rank-panel">
         <div class="card-head">
-          <h3>部门报销排行（待处理金额） <i class="mdi mdi-information-outline"></i></h3>
-          <select v-model="activeDepartmentRange" class="card-select" aria-label="部门排行时间范围">
-            <option v-for="range in departmentRangeOptions" :key="range">{{ range }}</option>
-          </select>
+          <h3>部门报销排行（待处理金额）<i class="mdi mdi-information-outline"></i></h3>
+          <EnterpriseSelect
+            v-model="activeDepartmentRange"
+            class="card-select"
+            :options="departmentRangeOptions"
+            aria-label="部门排行时间范围"
+            size="small"
+          />
         </div>
 
         <BarChart :items="rankedDepartments" />
@@ -99,7 +107,7 @@
 
       <article class="panel dashboard-card budget-panel">
         <div class="card-head">
-          <h3>预算执行率（本月） <i class="mdi mdi-information-outline"></i></h3>
+          <h3>预算执行率（本月）<i class="mdi mdi-information-outline"></i></h3>
         </div>
 
         <GaugeChart
@@ -112,7 +120,6 @@
         <button type="button" class="text-link">查看详情 <i class="mdi mdi-chevron-right"></i></button>
       </article>
     </div>
-
   </section>
 </template>
 
@@ -121,6 +128,7 @@ import TrendChart from '../components/charts/TrendChart.vue'
 import DonutChart from '../components/charts/DonutChart.vue'
 import BarChart from '../components/charts/BarChart.vue'
 import GaugeChart from '../components/charts/GaugeChart.vue'
+import EnterpriseSelect from '../components/shared/EnterpriseSelect.vue'
 
 import { useOverviewView } from '../composables/useOverviewView.js'
 
@@ -128,8 +136,6 @@ defineProps({
   filteredRequests: { type: Array, required: true }
 })
 
-const emit = defineEmits(['ask'])
-
 const {
   activeDepartmentRange,
   activeTrend,