OAFRONT4 清理票据中心PC展示

client/src/pages/invoice-pool/InvoiceDetailPanel.tsx

@@ -6,6 +6,8 @@ import { Button } from "../../components/ui/button";
 import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "../../components/ui/dialog";
 import { Input } from "../../components/ui/input";
 import { Textarea } from "../../components/ui/textarea";
+import { DateTextInput } from "../../components/common/DateTextInput";
+import { formatDisplayDate, formatDisplayDateTime } from "../../lib/displayFormat";
 import { formatInvoiceOcrErrorMessage } from "../../lib/invoiceOcr";
 
 export type InvoiceDetailPanelProps = {
@@ -186,7 +188,7 @@ export function InvoiceDetailPanel({
                 <span className="text-zinc-500">总金额：</span>
                 {detail.totalAmount ? new Intl.NumberFormat("zh-CN", { style: "currency", currency: "CNY" }).format(Number(detail.totalAmount)) : "-"}
               </div>
-              <div><span className="text-zinc-500">开票日期：</span>{detail.invoiceDate || "-"}</div>
+              <div><span className="text-zinc-500">开票日期：</span>{formatDisplayDate(detail.invoiceDate)}</div>
               <div><span className="text-zinc-500">文件名：</span>{detail.originalName || "-"}</div>
               <div className="col-span-2 flex flex-col gap-1">
                 <div>
@@ -335,7 +337,7 @@ export function InvoiceDetailPanel({
                         <div className="text-zinc-600 break-words">
                           来源: <strong className="font-medium text-zinc-800">{verificationProviderLabel(record.provider)}</strong> |
                           重试次数: <strong className="font-medium text-zinc-800">{record.attempts}</strong> |
-                          核验时间: <strong className="font-medium text-zinc-800">{record.requestedAt || "-"}</strong>
+                          核验时间: <strong className="font-medium text-zinc-800">{formatDisplayDateTime(record.requestedAt)}</strong>
                         </div>
                         {record.resultMessage ? <div className="mt-1 text-zinc-800 py-1 px-2 bg-zinc-50 rounded italic">{verificationMessage(record.resultMessage)}</div> : null}
                         {record.errorMessage ? <div className="mt-1 text-red-600 font-medium py-1 px-2 border border-red-100 bg-red-50 rounded">{verificationMessage(record.errorMessage)}</div> : null}
@@ -394,12 +396,11 @@ export function InvoiceDetailPanel({
                     <label className="text-xs font-medium text-zinc-600" htmlFor="invoiceDate">
                       开票日期
                     </label>
-                    <input
+                    <DateTextInput
                       className="input-std"
                       data-testid="invoice-edit-date"
                       id="invoiceDate"
                       onChange={(event) => setEditInvoiceDate(event.target.value)}
-                      type="date"
                       value={editInvoiceDate}
                     />
                   </div>

client/src/pages/invoice-pool/InvoiceListCard.tsx

@@ -5,6 +5,7 @@ import { TableSkeleton } from "../../components/common/TableSkeleton";
 import { Pagination } from "../../components/common/Pagination";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../../components/ui/dropdown-menu";
 import { Button } from "../../components/ui/button";
+import { formatDisplayDate } from "../../lib/displayFormat";
 import { formatInvoiceOcrErrorMessage } from "../../lib/invoiceOcr";
 
 export type InvoiceListCardProps = {
@@ -22,8 +23,13 @@ export type InvoiceListCardProps = {
 };
 
 function invoiceDisplayName(item: InvoicePoolListResponse["items"][number]) {
-  const invoiceNo = [item.invoiceCode, item.invoiceNumber].filter(Boolean).join("-");
-  return item.originalName || invoiceNo || "待识别票据";
+  if (item.originalName) return item.originalName;
+  if (item.invoiceCode || item.invoiceNumber) return "已识别票据";
+  return "待识别票据";
+}
+
+function invoiceNumberDisplay(item: InvoicePoolListResponse["items"][number]) {
+  return [item.invoiceCode, item.invoiceNumber].filter(Boolean).join("-") || "-";
 }
 
 export function InvoiceListCard({
@@ -85,7 +91,7 @@ export function InvoiceListCard({
                   <div className="flex items-start justify-between gap-3">
                     <div className="min-w-0">
                       <div className="truncate text-sm font-semibold text-zinc-900">{invoiceDisplayName(item)}</div>
-                      <div className="mt-1 text-xs text-zinc-500">{item.invoiceDate || "待识别"}</div>
+                      <div className="mt-1 text-xs text-zinc-500">{item.invoiceDate ? formatDisplayDate(item.invoiceDate) : "待识别"}</div>
                     </div>
                     <StatusBadge className="shrink-0" status={item.status} />
                   </div>
@@ -94,7 +100,7 @@ export function InvoiceListCard({
                     <div>
                       <div className="text-xs text-zinc-500">发票号码</div>
                       <div className="truncate font-medium text-zinc-900">
-                        {item.invoiceCode || "-"}-{item.invoiceNumber || "-"}
+                        {invoiceNumberDisplay(item)}
                       </div>
                     </div>
                     <div>
@@ -159,11 +165,11 @@ export function InvoiceListCard({
                     <tr className="table-row" data-testid="invoice-row" key={item.id}>
                       <td className="table-td">
                         <div className="max-w-[260px] truncate font-medium text-zinc-900">{invoiceDisplayName(item)}</div>
-                        <div className="mt-1 text-xs text-zinc-500">{item.invoiceDate || "待识别"}</div>
+                        <div className="mt-1 text-xs text-zinc-500">{item.invoiceDate ? formatDisplayDate(item.invoiceDate) : "待识别"}</div>
                       </td>
                       <td className="table-td"><StatusBadge status={item.status} /></td>
                       <td className="table-td font-medium text-zinc-900">
-                        {item.invoiceCode || "-"}-{item.invoiceNumber || "-"}
+                        {invoiceNumberDisplay(item)}
                       </td>
                       <td className="table-td">
                         {item.status === "pending_ocr" ? (