feat(web): 优化差旅详情、风险建议卡片与文档中心交互

- 拆分阶段风险建议卡片样式到独立文件
- 完善差旅申请审批对话框与详情视图交互
- 调整文档中心列表共享样式与状态筛选
- 同步应用外壳、视图初始化与系统状态 composables

web/src/components/shared/ConfirmDialog.vue

@@ -31,16 +31,27 @@
               class="shared-confirm-btn cancel"
               :disabled="busy"
               @click="handleCancel"
-            >
-              {{ cancelText }}
-            </button>
-            <button
-              type="button"
-              class="shared-confirm-btn confirm"
-              :class="confirmTone"
-              :disabled="busy"
-              @click="$emit('confirm')"
-            >
+            >
+              {{ cancelText }}
+            </button>
+            <button
+              v-if="secondaryText"
+              type="button"
+              class="shared-confirm-btn secondary"
+              :class="secondaryTone"
+              :disabled="busy"
+              @click="$emit('secondary')"
+            >
+              <i v-if="secondaryIcon" :class="secondaryIcon"></i>
+              <span>{{ secondaryText }}</span>
+            </button>
+            <button
+              type="button"
+              class="shared-confirm-btn confirm"
+              :class="confirmTone"
+              :disabled="busy || confirmDisabled"
+              @click="$emit('confirm')"
+            >
               <i v-if="confirmIcon" :class="busy ? 'mdi mdi-loading mdi-spin' : confirmIcon"></i>
               <span>{{ busy ? busyText : confirmText }}</span>
             </button>
@@ -60,18 +71,22 @@ const props = defineProps({
   badgeTone: { type: String, default: 'info' },
   title: { type: String, required: true },
   description: { type: String, default: '' },
-  cancelText: { type: String, default: '取消' },
-  confirmText: { type: String, default: '确认' },
+  cancelText: { type: String, default: '取消' },
+  secondaryText: { type: String, default: '' },
+  secondaryTone: { type: String, default: 'warning' },
+  secondaryIcon: { type: String, default: '' },
+  confirmText: { type: String, default: '确认' },
   busyText: { type: String, default: '处理中...' },
   confirmTone: { type: String, default: 'primary' },
   confirmIcon: { type: String, default: '' },
+  confirmDisabled: { type: Boolean, default: false },
   busy: { type: Boolean, default: false },
   closeOnMask: { type: Boolean, default: true },
   size: { type: String, default: 'default' },
   actionsAlign: { type: String, default: 'end' }
 })
 
-const emit = defineEmits(['close', 'cancel', 'confirm'])
+const emit = defineEmits(['close', 'cancel', 'secondary', 'confirm'])
 const instance = getCurrentInstance()
 
 const titleId = computed(() => `shared-confirm-title-${instance?.uid || 'dialog'}`)
@@ -213,15 +228,33 @@ function handleCancel() {
   transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease;
 }
 
-.shared-confirm-btn.cancel {
-  border: 1px solid #d7e0ea;
-  background: rgba(255, 255, 255, 0.92);
-  color: #475569;
-}
-
-.shared-confirm-btn.confirm {
-  border: 1px solid transparent;
-  color: #fff;
+.shared-confirm-btn.cancel {
+  border: 1px solid #d7e0ea;
+  background: rgba(255, 255, 255, 0.92);
+  color: #475569;
+}
+
+.shared-confirm-btn.secondary {
+  border: 1px solid rgba(245, 158, 11, 0.28);
+  background: rgba(255, 251, 235, 0.92);
+  color: #b45309;
+}
+
+.shared-confirm-btn.secondary.primary {
+  border-color: rgba(var(--theme-primary-rgb, 58, 124, 165), 0.28);
+  background: var(--theme-primary-soft);
+  color: var(--theme-primary-active);
+}
+
+.shared-confirm-btn.secondary.danger {
+  border-color: rgba(var(--danger-rgb), 0.24);
+  background: var(--danger-soft);
+  color: var(--danger-hover);
+}
+
+.shared-confirm-btn.confirm {
+  border: 1px solid transparent;
+  color: #fff;
 }
 
 .shared-confirm-btn.confirm.primary {
@@ -238,10 +271,15 @@ function handleCancel() {
   border-color: rgba(var(--theme-primary-rgb, 58, 124, 165), 0.3);
   color: var(--theme-primary-active);
 }
-
-.shared-confirm-btn.confirm:hover:not(:disabled) {
-  transform: translateY(-1px);
-}
+
+.shared-confirm-btn.secondary:hover:not(:disabled) {
+  border-color: rgba(245, 158, 11, 0.42);
+  background: rgba(254, 243, 199, 0.96);
+}
+
+.shared-confirm-btn.confirm:hover:not(:disabled) {
+  transform: translateY(-1px);
+}
 
 .shared-confirm-btn:disabled {
   cursor: not-allowed;