fix;提交、

2026-07-19 22:16:55 +08:00
parent 76270b20bf
commit 792b543ba8
34 changed files with 2310 additions and 398 deletions
@@ -0,0 +1,68 @@
+import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import {
+  INVOICE_KIND_LABELS,
+  INVOICE_STATUS_LABELS,
+  INVOICE_TITLE_TYPE_LABELS,
+  type InvoiceDto,
+} from '@dukang/shared-types';
+import SubPageHeader from '../components/SubPageHeader';
+import { request } from '../lib/api';
+
+export default function InvoiceListPage() {
+  const navigate = useNavigate();
+  const [items, setItems] = useState<InvoiceDto[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    request<{ items: InvoiceDto[] }>('USER_H5', '/trade/invoices?pageSize=50')
+      .then((res) => setItems(res.items ?? []))
+      .catch(() => setItems([]))
+      .finally(() => setLoading(false));
+  }, []);
+
+  return (
+    <div className="after-sale-page">
+      <SubPageHeader title="我的发票" onBack={() => navigate(-1)} />
+      <main className="after-sale-body">
+        {loading ? (
+          <p className="after-sale-empty">加载中…</p>
+        ) : items.length === 0 ? (
+          <div className="after-sale-empty-box">
+            <p className="after-sale-empty">暂无发票申请</p>
+            <button type="button" className="after-sale-primary" onClick={() => navigate('/invoices/apply')}>
+              申请发票
+            </button>
+          </div>
+        ) : (
+          <div className="after-sale-order-list">
+            {items.map((inv) => (
+              <div key={inv.id} className="after-sale-order-item after-sale-ticket-card">
+                <div className="after-sale-ticket-head">
+                  <span>
+                    {INVOICE_TITLE_TYPE_LABELS[inv.titleType]} · {INVOICE_KIND_LABELS[inv.invoiceKind]}
+                  </span>
+                  <span className="after-sale-ticket-status">
+                    {INVOICE_STATUS_LABELS[inv.status]}
+                  </span>
+                </div>
+                <p className="after-sale-order-no">{inv.titleName}</p>
+                <p className="after-sale-order-meta">
+                  {inv.invoiceNo} · 订单 {inv.orderNo ?? inv.orderId}
+                </p>
+                {inv.status === 'ISSUED' && inv.fileUrl ? (
+                  <a className="after-sale-file-link" href={inv.fileUrl} target="_blank" rel="noreferrer">
+                    查看/下载发票
+                  </a>
+                ) : null}
+              </div>
+            ))}
+            <button type="button" className="after-sale-primary" onClick={() => navigate('/invoices/apply')}>
+              申请发票
+            </button>
+          </div>
+        )}
+      </main>
+    </div>
+  );
+}