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

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

web/src/views/DocumentsCenterView.vue

@@ -232,24 +232,7 @@
             <i class="mdi mdi-chevron-right"></i>
           </button>
         </div>
-        <div class="page-size-wrap">
-          <button class="page-size" type="button" @click="pageSizeOpen = !pageSizeOpen">
-            {{ pageSize }} 条/页 <i class="mdi mdi-chevron-down"></i>
-          </button>
-          <div v-if="pageSizeOpen" class="page-size-dropdown" role="listbox">
-            <button
-              v-for="size in pageSizes"
-              :key="size"
-              type="button"
-              role="option"
-              :aria-selected="pageSize === size"
-              :class="{ active: pageSize === size }"
-              @click="changePageSize(size)"
-            >
-              {{ size }} 条/页
-            </button>
-          </div>
-        </div>
+        <EnterpriseSelect v-model="pageSize" class="page-size-select" :options="pageSizeOptions" size="small" @change="changePageSize" />
       </footer>
     </article>
   </section>
@@ -258,6 +241,7 @@
 <script setup>
 import { computed, onMounted, ref, watch } from 'vue'
 
+import EnterpriseSelect from '../components/shared/EnterpriseSelect.vue'
 import TableEmptyState from '../components/shared/TableEmptyState.vue'
 import TableLoadingState from '../components/shared/TableLoadingState.vue'
 import { mapExpenseClaimToRequest } from '../composables/useRequests.js'
@@ -321,7 +305,7 @@ const FILTER_CONFIG_BY_SCOPE = {
     showDocumentType: false
   }
 }
-const pageSizes = [10, 20, 50]
+const pageSizeOptions = [10, 20, 50].map((size) => ({ label: `${size} 条/页`, value: size }))
 const documentTypeOptions = [
   { value: DOCUMENT_TYPE_ALL, label: '单据类型' },
   { value: DOCUMENT_TYPE_APPLICATION, label: '申请单' },
@@ -356,7 +340,6 @@ const appliedStart = ref('')
 const appliedEnd = ref('')
 const currentPage = ref(1)
 const pageSize = ref(20)
-const pageSizeOpen = ref(false)
 const archiveRows = ref([])
 const approvalRows = ref([])
 const supportingLoading = ref(false)
@@ -519,7 +502,7 @@ const emptyState = computed(() => {
       icon: 'mdi mdi-file-sign-outline',
       actionLabel: '',
       actionIcon: '',
-      tone: 'emerald',
+      tone: 'theme',
       artLabel: 'APPLY',
       tips: ['申请、报销、审批与归档统一在此查看', '申请批准后可继续发起报销']
     }
@@ -534,7 +517,7 @@ const emptyState = computed(() => {
     icon: filtered ? 'mdi mdi-magnify-scan' : 'mdi mdi-file-document-multiple-outline',
     actionLabel: '',
     actionIcon: '',
-    tone: 'emerald',
+    tone: 'theme',
     artLabel: filtered ? 'FILTER' : 'DOCS',
     tips: ['单据中心已接入当前报销单据', '归档视角会同步已归档数据']
   }
@@ -724,7 +707,6 @@ function handleEmptyAction() {
 
 function changePageSize(size) {
   pageSize.value = size
-  pageSizeOpen.value = false
   currentPage.value = 1
 }
 
@@ -782,14 +764,12 @@ watch(
   [activeScopeTab, activeStatusTab, activeDocumentType, activeScene, listKeyword, appliedStart, appliedEnd],
   () => {
     currentPage.value = 1
-    pageSizeOpen.value = false
   }
 )
 
 watch(activeFilterConfig, () => {
   openFilterKey.value = ''
   datePopover.value = false
-  pageSizeOpen.value = false
 
   if (!showDocumentTypeFilter.value) {
     activeDocumentType.value = DOCUMENT_TYPE_ALL