LP6 完善请假采购体验与审批说明

client/src/pages/MobileLeavePage.tsx

@@ -19,6 +19,11 @@ import { Button } from "../components/ui/button";
 import { Tabs, TabsList, TabsTrigger } from "../components/ui/tabs";
 import { PageScaffold } from "../components/patterns/PageScaffold";
 import { resolveErrorMessage } from "../lib/resolveErrorMessage";
+import {
+  formatApprovalHistoryTime,
+  resolveLeaveStatusHint,
+  workflowActionLabel,
+} from "../lib/approvalDisplay";
 
 type LeaveStatusFilter = "all" | LeaveRequestStatus;
 
@@ -27,6 +32,7 @@ const STATUS_TABS: Array<{ value: LeaveStatusFilter; label: string }> = [
   { value: "draft", label: "草稿" },
   { value: "reviewing", label: "审批中" },
   { value: "approved", label: "已通过" },
+  { value: "rejected", label: "已驳回" },
 ];
 
 const STATUS_LABEL: Record<LeaveRequestStatus, string> = {
@@ -85,6 +91,17 @@ function LeaveRecordCard({
       </div>
 
       {item.reason ? <p className="mt-3 line-clamp-2 text-sm text-zinc-500">{item.reason}</p> : null}
+      <div className="mt-3 rounded-lg bg-zinc-50 px-3 py-2 text-xs text-zinc-600" data-testid="mobile-leave-status-hint">
+        {resolveLeaveStatusHint(item)}
+      </div>
+      {item.approvalHistory.length ? (
+        <div className="mt-2 text-xs text-zinc-500">
+          最近审批：{workflowActionLabel(item.approvalHistory[0].action)}
+          {item.approvalHistory[0].comment ? ` · ${item.approvalHistory[0].comment}` : ""}
+          {" · "}
+          {formatApprovalHistoryTime(item.approvalHistory[0].createdAt)}
+        </div>
+      ) : null}
 
       {canEdit || canSubmit ? (
         <div className="mobile-two-action-grid mt-4">
@@ -403,7 +420,7 @@ export function MobileLeavePage() {
       <section className="mobile-card" data-testid="mobile-leave-records">
         <h3 className="text-base font-semibold text-zinc-900">请假记录</h3>
         <Tabs value={statusFilter} onValueChange={(value) => setStatusFilter(value as LeaveStatusFilter)}>
-          <TabsList className="mt-3 grid h-auto w-full grid-cols-4">
+          <TabsList className="mt-3 grid h-auto w-full grid-cols-5">
             {STATUS_TABS.map((item) => (
               <TabsTrigger key={item.value} value={item.value} data-testid={`mobile-leave-tab-${item.value}`}>
                 {item.label}