refactor(frontend): split large reimbursement and audit modules

web/src/views/TravelRequestDetailView.vue

@@ -102,6 +102,15 @@
                   placeholder="例如：去北京客户现场出差，拜访 XX 客户并处理项目验收事项"
                   aria-label="附加说明"
                 ></textarea>
+                <div v-if="detailNoteTags.length" class="detail-note-tag-list" aria-label="附加说明风险标签">
+                  <span
+                    v-for="tag in detailNoteTags"
+                    :key="tag"
+                    :class="['risk-note-tag', resolveRiskTagClass(tag)]"
+                  >
+                    {{ tag }}
+                  </span>
+                </div>
                 <div class="detail-note-editor-meta">
                   <span>仅草稿待提交状态可编辑，提交后将作为明确说明展示。</span>
                   <div class="detail-note-actions">
@@ -125,7 +134,18 @@
                   </div>
                 </div>
               </div>
-              <div v-else class="detail-note readonly">{{ detailNote }}</div>
+              <div v-else class="detail-note readonly">
+                <p>{{ detailNote }}</p>
+                <div v-if="detailNoteTags.length" class="detail-note-tag-list" aria-label="附加说明风险标签">
+                  <span
+                    v-for="tag in detailNoteTags"
+                    :key="tag"
+                    :class="['risk-note-tag', resolveRiskTagClass(tag)]"
+                  >
+                    {{ tag }}
+                  </span>
+                </div>
+              </div>
             </article>
 
             <article class="detail-card panel">
@@ -170,7 +190,13 @@
                   <tbody>
                     <template v-for="item in expenseItems" :key="item.id">
                       <tr :class="{ 'system-generated-row': item.isSystemGenerated }">
-                        <td class="expense-time col-time">
+                        <td :class="['expense-time col-time', { 'has-major-risk': isMajorExpenseRisk(item) }]">
+                          <i
+                            v-if="isMajorExpenseRisk(item)"
+                            class="mdi mdi-alert expense-risk-indicator"
+                            :title="resolveExpenseRiskIndicatorTitle(item)"
+                            :aria-label="resolveExpenseRiskIndicatorTitle(item)"
+                          ></i>
                           <template v-if="editingExpenseId === item.id">
                             <div class="cell-editor">
                               <input v-model="expenseEditor.itemDate" class="editor-input" type="date" />
@@ -408,6 +434,15 @@
                         <span>{{ card.label }}</span>
                         <strong>{{ card.title }}</strong>
                       </div>
+                      <div v-if="card.tags?.length" class="risk-card-tag-list" aria-label="风险标签">
+                        <span
+                          v-for="tag in card.tags"
+                          :key="tag"
+                          :class="['risk-note-tag', resolveRiskTagClass(tag)]"
+                        >
+                          {{ tag }}
+                        </span>
+                      </div>
                       <p class="risk-advice-point">{{ card.risk }}</p>
                       <div class="risk-advice-meta">
                         <div>
@@ -655,6 +690,68 @@
       </div>
     </ConfirmDialog>
 
+    <ConfirmDialog
+      :open="riskOverrideDialogOpen"
+      badge="重大风险"
+      badge-tone="danger"
+      :title="`当前存在 ${submitRiskWarnings.length} 条重大风险`"
+      description="如仍需提交审批，请逐条填写违规或超标原因，系统会写入附加说明并用于后续风险统计。"
+      cancel-text="返回整改"
+      confirm-text="保存原因并继续"
+      busy-text="保存中..."
+      confirm-tone="danger"
+      confirm-icon="mdi mdi-alert-circle-outline"
+      :busy="riskOverrideBusy"
+      @close="closeRiskOverrideDialog"
+      @confirm="confirmRiskOverrideReasons"
+    >
+      <div v-if="currentSubmitRiskWarning" class="risk-override-panel" aria-label="重大风险说明">
+        <div class="risk-override-nav">
+          <button
+            type="button"
+            class="risk-override-nav-btn"
+            :disabled="submitRiskWarnings.length <= 1 || riskOverrideBusy"
+            aria-label="上一条风险"
+            @click="goToPreviousSubmitRisk"
+          >
+            <i class="mdi mdi-chevron-left"></i>
+          </button>
+          <span>{{ riskOverrideIndexLabel }}</span>
+          <button
+            type="button"
+            class="risk-override-nav-btn"
+            :disabled="submitRiskWarnings.length <= 1 || riskOverrideBusy"
+            aria-label="下一条风险"
+            @click="goToNextSubmitRisk"
+          >
+            <i class="mdi mdi-chevron-right"></i>
+          </button>
+        </div>
+        <article :class="['risk-override-card', currentSubmitRiskWarning.tone]">
+          <div class="risk-override-card-head">
+            <span>{{ currentSubmitRiskWarning.label }}</span>
+            <strong>{{ currentSubmitRiskWarning.title }}</strong>
+          </div>
+          <p>{{ currentSubmitRiskWarning.risk }}</p>
+          <div class="risk-card-tag-list" aria-label="风险标签">
+            <span
+              v-for="tag in currentSubmitRiskWarning.tags"
+              :key="tag"
+              :class="['risk-note-tag', resolveRiskTagClass(tag)]"
+            >
+              {{ tag }}
+            </span>
+          </div>
+          <textarea
+            v-model="riskOverrideReasons[currentSubmitRiskWarning.id]"
+            maxlength="160"
+            placeholder="请说明为什么仍需提交，例如客户指定酒店、会议高峰、协议酒店满房等"
+            aria-label="违规提交原因"
+          ></textarea>
+        </article>
+      </div>
+    </ConfirmDialog>
+
     <ConfirmDialog
       :open="deleteDialogOpen"
       :badge="deleteActionLabel"
@@ -720,3 +817,4 @@
 <script src="./scripts/TravelRequestDetailView.js"></script>
 
 <style scoped src="../assets/styles/views/travel-request-detail-view.css"></style>
+<style scoped src="../assets/styles/views/travel-request-detail-view-part2.css"></style>