refactor(web): update view scripts

- AuditView.js: update audit view logic
- EmployeeManagementView.js: update employee management logic
- RequestsView.js: update requests view logic
- TravelRequestDetailView.js: update travel detail view logic

web/src/views/scripts/EmployeeManagementView.js

@@ -1,6 +1,7 @@
 import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 import ConfirmDialog from '../../components/shared/ConfirmDialog.vue'
+import TableEmptyState from '../../components/shared/TableEmptyState.vue'
 import { useToast } from '../../composables/useToast.js'
 import { disableEmployee, fetchEmployeeMeta, fetchEmployees, updateEmployee } from '../../services/employees.js'
 
@@ -201,7 +202,8 @@ function buildEmployeeSummary(employees) {
 export default {
   name: 'EmployeeManagementView',
   components: {
-    ConfirmDialog
+    ConfirmDialog,
+    TableEmptyState
   },
   emits: ['overview-change'],
   setup(_, { emit }) {
@@ -311,6 +313,40 @@ export default {
     })
 
     const hasActiveFilters = computed(() => activeFilterTokens.value.length > 0)
+    const hasEmployeeFilters = computed(() => {
+      return activeTab.value !== DEFAULT_STATUS_TABS[0] || hasActiveFilters.value
+    })
+    const employeeEmptyState = computed(() => {
+      if (!employees.value.length) {
+        return {
+          eyebrow: '员工台账',
+          title: '员工目录暂时还是空的',
+          desc: '当前环境还没有同步任何员工档案。完成目录接入后，这里会展示员工基础信息、角色和状态。',
+          icon: 'mdi mdi-account-group-outline',
+          actionLabel: '重新加载',
+          actionIcon: 'mdi mdi-refresh',
+          tone: 'sky',
+          artLabel: 'PEOPLE',
+          tips: ['支持按部门、职级和角色统一维护', '点击列表行即可进入档案和权限详情']
+        }
+      }
+
+      return {
+        eyebrow: hasEmployeeFilters.value ? '筛选结果为空' : '员工状态为空',
+        title: hasEmployeeFilters.value ? '当前条件下没有匹配员工' : `“${activeTab.value}”里暂时没有员工`,
+        desc: hasEmployeeFilters.value
+          ? '可以切回“全部员工”，或者清空关键词、部门、职级和角色条件后再试。'
+          : '这个状态标签下目前还没有记录，你可以切换到其他状态继续查看。',
+        icon: hasEmployeeFilters.value ? 'mdi mdi-account-search-outline' : 'mdi mdi-badge-account-horizontal-outline',
+        actionLabel: hasEmployeeFilters.value ? '清空筛选' : '查看全部员工',
+        actionIcon: hasEmployeeFilters.value ? 'mdi mdi-filter-remove-outline' : 'mdi mdi-format-list-bulleted',
+        tone: hasEmployeeFilters.value ? 'emerald' : 'slate',
+        artLabel: hasEmployeeFilters.value ? 'FILTER' : 'STATUS',
+        tips: hasEmployeeFilters.value
+          ? ['关键词、部门、职级和角色条件会叠加生效', '也可以直接搜索姓名、工号或岗位']
+          : ['员工状态统计会按真实目录数据自动更新', '停用员工仍会保留在台账中便于追溯']
+      }
+    })
 
     watch(
       employeeSummary,
@@ -343,6 +379,15 @@ export default {
       pageSizeOpen.value = false
     }
 
+    function handleEmployeeEmptyAction() {
+      if (!employees.value.length) {
+        loadEmployees().catch(() => {})
+        return
+      }
+
+      resetFilters()
+    }
+
     function changePageSize(size) {
       pageSize.value = size
       pageSizeOpen.value = false
@@ -641,6 +686,7 @@ export default {
       roleOptions,
       employees,
       visibleEmployees,
+      employeeEmptyState,
       searchKeyword,
       selectedDepartment,
       selectedGrade,
@@ -655,9 +701,11 @@ export default {
       roleFilterOptions,
       activeFilterTokens,
       hasActiveFilters,
+      hasEmployeeFilters,
       totalCount,
       totalPages,
       resetFilters,
+      handleEmployeeEmptyAction,
       openEmployeeDetail,
       closeEmployeeDetail,
       closeDisableDialog,