feat(web): update views

- AppShellRouteView.vue: update app shell route view
- AuditView.vue: update audit view
- EmployeeManagementView.vue: update employee management view
- PoliciesView.vue: update policies view
- RequestsView.vue: update requests view
- TravelReimbursementCreateView.vue: update travel form view
- TravelRequestDetailView.vue: update travel detail view

web/src/views/RequestsView.vue

@@ -1,7 +1,7 @@
 <template>
   <section class="travel-page">
     <article class="travel-list panel">
-      <nav class="status-tabs" aria-label="差旅报销状态">
+      <nav class="status-tabs" aria-label="个人报销状态">
         <button
           v-for="tab in tabs"
           :key="tab"
@@ -17,7 +17,7 @@
         <div class="filter-set">
           <div class="list-search">
             <i class="mdi mdi-magnify"></i>
-            <input type="search" placeholder="搜索申请人、单号、费用类型..." />
+            <input v-model="listKeyword" type="search" placeholder="搜索单号、事由、报销类型..." />
           </div>
 
           <div class="date-range-filter" :class="{ open: datePopover }">
@@ -61,48 +61,64 @@
       <p class="hint"><i class="mdi mdi-information-outline"></i> 点击任意行可查看单据详情</p>
 
       <div class="table-wrap">
-        <table>
+        <div v-if="loading" class="table-state">
+          <i class="mdi mdi-loading mdi-spin"></i>
+          <strong>正在加载真实报销数据</strong>
+          <p>列表将直接展示后端返回的个人报销单据。</p>
+        </div>
+
+        <div v-else-if="error" class="table-state error">
+          <i class="mdi mdi-alert-circle-outline"></i>
+          <strong>报销列表加载失败</strong>
+          <p>{{ error }}</p>
+          <button class="retry-btn" type="button" @click="emit('reload')">重新加载</button>
+        </div>
+
+        <div v-else-if="showEmpty" class="table-state empty">
+          <i class="mdi mdi-inbox-arrow-down-outline"></i>
+          <strong>{{ emptyState.title }}</strong>
+          <p>{{ emptyState.desc }}</p>
+        </div>
+
+        <table v-else>
           <colgroup>
             <col class="col-id">
-            <col class="col-reason">
-            <col class="col-city">
-            <col class="col-period">
+            <col class="col-type">
+            <col class="col-title">
+            <col class="col-occurred">
             <col class="col-apply">
             <col class="col-amount">
             <col class="col-node">
             <col class="col-approval">
-            <col class="col-travel">
           </colgroup>
           <thead>
             <tr>
               <th>单号</th>
-              <th>出差事由</th>
-              <th>出差城市</th>
-              <th>出差时间</th>
+              <th>报销类型</th>
+              <th>报销事由</th>
+              <th>发生时间</th>
               <th>申请时间</th>
-              <th>申请金额</th>
+              <th>金额</th>
               <th>当前节点</th>
               <th>审批状态</th>
-              <th>商旅状态</th>
             </tr>
           </thead>
           <tbody>
             <tr v-for="row in visibleRows" :key="row.id" @click="emit('ask', row)">
-              <td><strong class="doc-id">{{ row.id }}</strong></td>
+              <td><strong class="doc-id">{{ row.documentNo || row.id }}</strong></td>
+              <td><span class="type-tag" :class="row.typeTone">{{ row.typeLabel }}</span></td>
               <td>{{ row.reason }}</td>
-              <td>{{ row.city }}</td>
-              <td>{{ row.period }}</td>
+              <td>{{ row.occurredDisplay }}</td>
               <td>{{ row.applyTime }}</td>
-              <td>{{ row.amount }}</td>
+              <td>{{ row.amountDisplay }}</td>
               <td>{{ row.node }}</td>
               <td><span class="status-tag" :class="row.approvalTone">{{ row.approval }}</span></td>
-              <td><span class="status-tag" :class="row.travelTone">{{ row.travel }}</span></td>
             </tr>
           </tbody>
         </table>
       </div>
 
-      <footer class="list-foot">
+      <footer v-if="showTable" class="list-foot">
         <span class="page-summary">共 {{ totalCount }} 条，目前第 {{ currentPage }} 页</span>
         <div class="pager" aria-label="分页">
           <button class="page-nav" type="button" :disabled="currentPage === 1" aria-label="上一页" @click="currentPage--"><i class="mdi mdi-chevron-left"></i></button>