feat(ops): show redeem records on benefit coupon detail

Reuse the same coupon redeem trace as order detail (primary/secondary, allocations).

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/admin-web/src/pages/BenefitCouponsPage.tsx

@@ -33,6 +33,34 @@ type Row = {
   order?: { orderNo: string } | null;
 };
 
+type CouponRedeemRecord = {
+  id: string;
+  redeemNo: string;
+  amount: number;
+  settleAmount: number;
+  couponAmount?: number;
+  role?: 'PRIMARY' | 'SECONDARY';
+  createdAt: string;
+  store?: { id: string; name: string; cityName?: string | null } | null;
+};
+
+type CouponRedeemSummary = {
+  couponNo: string;
+  totalAmount: number;
+  usedAmount: number;
+  balance: number;
+  status: string;
+  redeemCount: number;
+  redeemRecordSum: number;
+};
+
+type CouponDetail = Row & {
+  redeemSummary?: CouponRedeemSummary | null;
+  redeemRecords?: CouponRedeemRecord[];
+  user?: { userNo?: string; phone?: string | null };
+  order?: { orderNo?: string } | null;
+};
+
 export default function BenefitCouponsPage() {
   const [form] = Form.useForm();
   const [grantForm] = Form.useForm<AdminBenefitGrantRequest>();
@@ -50,8 +78,25 @@ export default function BenefitCouponsPage() {
     },
     [filters],
   );
-  const [detail, setDetail] = useState<Record<string, unknown> | null>(null);
+  const [detail, setDetail] = useState<CouponDetail | null>(null);
   const [drawerOpen, setDrawerOpen] = useState(false);
+  const [redeemDetail, setRedeemDetail] = useState<Record<string, unknown> | null>(null);
+  const [redeemDrawerOpen, setRedeemDrawerOpen] = useState(false);
+  const [redeemDetailLoading, setRedeemDetailLoading] = useState(false);
+
+  async function openRedeemDetail(redeemId: string) {
+    setRedeemDetailLoading(true);
+    setRedeemDrawerOpen(true);
+    try {
+      const res = await request<Record<string, unknown>>(`/admin/redeem-records/${redeemId}`);
+      setRedeemDetail(res);
+    } catch (e) {
+      message.error(e instanceof Error ? e.message : '加载核销详情失败');
+      setRedeemDrawerOpen(false);
+    } finally {
+      setRedeemDetailLoading(false);
+    }
+  }
 
   const columns: ColumnsType<Row> = [
     { title: '券号', dataIndex: 'couponNo', width: 200, ellipsis: false },
@@ -197,7 +242,7 @@ export default function BenefitCouponsPage() {
 
       <Drawer
         title="权益券详情"
-        width={560}
+        width={720}
         open={drawerOpen}
         onClose={() => setDrawerOpen(false)}
         extra={
@@ -218,25 +263,202 @@ export default function BenefitCouponsPage() {
         }
       >
         {detail && (
+          <>
+            <Descriptions column={1} bordered size="small">
+              <Descriptions.Item label="券号">{detail.couponNo}</Descriptions.Item>
+              <Descriptions.Item label="用户">{detail.user?.userNo ?? '—'}</Descriptions.Item>
+              <Descriptions.Item label="手机号">{detail.user?.phone ?? '—'}</Descriptions.Item>
+              <Descriptions.Item label="关联订单">{detail.order?.orderNo ?? '—'}</Descriptions.Item>
+              <Descriptions.Item label="总额">¥{Number(detail.totalAmount).toFixed(2)}</Descriptions.Item>
+              <Descriptions.Item label="余额">¥{Number(detail.balance).toFixed(2)}</Descriptions.Item>
+              <Descriptions.Item label="状态">
+                {COUPON_STATUS_LABELS[detail.status] || detail.status}
+              </Descriptions.Item>
+              <Descriptions.Item label="来源">{detail.sourceProduct}</Descriptions.Item>
+            </Descriptions>
+
+            <Typography.Title level={5} style={{ marginTop: 16, marginBottom: 8 }}>
+              权益核销
+            </Typography.Title>
+            {detail.redeemSummary ? (
+              <>
+                <Descriptions column={2} bordered size="small" style={{ marginBottom: 12 }}>
+                  <Descriptions.Item label="权益券号">{detail.redeemSummary.couponNo}</Descriptions.Item>
+                  <Descriptions.Item label="券状态">{detail.redeemSummary.status}</Descriptions.Item>
+                  <Descriptions.Item label="权益总额">
+                    ¥{Number(detail.redeemSummary.totalAmount).toFixed(2)}
+                  </Descriptions.Item>
+                  <Descriptions.Item label="已核销">
+                    <Typography.Text type="danger" strong>
+                      ¥{Number(detail.redeemSummary.usedAmount).toFixed(2)}
+                    </Typography.Text>
+                    <Typography.Text type="secondary" style={{ marginLeft: 8 }}>
+                      （{detail.redeemSummary.redeemCount} 笔核销单）
+                    </Typography.Text>
+                  </Descriptions.Item>
+                  <Descriptions.Item label="剩余余额">
+                    ¥{Number(detail.redeemSummary.balance).toFixed(2)}
+                  </Descriptions.Item>
+                  <Descriptions.Item label="核销单合计额">
+                    ¥{Number(detail.redeemSummary.redeemRecordSum).toFixed(2)}
+                    <Typography.Text type="secondary" style={{ marginLeft: 8 }}>
+                      （本券分摊合计）
+                    </Typography.Text>
+                  </Descriptions.Item>
+                </Descriptions>
+                <Table
+                  size="small"
+                  rowKey="id"
+                  pagination={false}
+                  locale={{ emptyText: '暂无关联核销单' }}
+                  dataSource={detail.redeemRecords ?? []}
+                  columns={[
+                    { title: '核销号', dataIndex: 'redeemNo', width: 160, ellipsis: true },
+                    {
+                      title: '角色',
+                      dataIndex: 'role',
+                      width: 70,
+                      render: (v: string | undefined) =>
+                        v === 'SECONDARY' ? <Tag color="orange">次券</Tag> : <Tag color="blue">主券</Tag>,
+                    },
+                    {
+                      title: '门店',
+                      dataIndex: ['store', 'name'],
+                      ellipsis: true,
+                      render: (v: string | undefined, row: CouponRedeemRecord) =>
+                        v ? `${v}${row.store?.cityName ? `（${row.store.cityName}）` : ''}` : '—',
+                    },
+                    {
+                      title: '本券分摊',
+                      dataIndex: 'couponAmount',
+                      width: 95,
+                      render: (v: number | undefined, row: CouponRedeemRecord) =>
+                        `¥${Number(v ?? row.amount).toFixed(2)}`,
+                    },
+                    {
+                      title: '核销总额',
+                      dataIndex: 'amount',
+                      width: 90,
+                      render: (v: number) => `¥${Number(v).toFixed(2)}`,
+                    },
+                    {
+                      title: '结算额',
+                      dataIndex: 'settleAmount',
+                      width: 90,
+                      render: (v: number) => `¥${Number(v).toFixed(2)}`,
+                    },
+                    {
+                      title: '时间',
+                      dataIndex: 'createdAt',
+                      width: 150,
+                      render: (v: string) => fmtTime(v),
+                    },
+                    {
+                      title: '操作',
+                      width: 70,
+                      render: (_: unknown, row: CouponRedeemRecord) => (
+                        <Button type="link" size="small" onClick={() => void openRedeemDetail(row.id)}>
+                          详情
+                        </Button>
+                      ),
+                    },
+                  ]}
+                />
+              </>
+            ) : (
+              <Typography.Text type="secondary">暂无核销摘要</Typography.Text>
+            )}
+          </>
+        )}
+      </Drawer>
+
+      <Drawer
+        title="核销单详情"
+        width={520}
+        open={redeemDrawerOpen}
+        onClose={() => {
+          setRedeemDrawerOpen(false);
+          setRedeemDetail(null);
+        }}
+        destroyOnClose
+      >
+        {redeemDetailLoading ? (
+          <Typography.Text type="secondary">加载中…</Typography.Text>
+        ) : redeemDetail ? (
           <Descriptions column={1} bordered size="small">
-            <Descriptions.Item label="券号">{String(detail.couponNo)}</Descriptions.Item>
-            <Descriptions.Item label="用户">
-              {String((detail.user as { userNo?: string } | undefined)?.userNo ?? '—')}
+            <Descriptions.Item label="核销号">{String(redeemDetail.redeemNo ?? '—')}</Descriptions.Item>
+            <Descriptions.Item label="核销额">
+              ¥{Number(redeemDetail.amount ?? 0).toFixed(2)}
             </Descriptions.Item>
-            <Descriptions.Item label="手机号">
-              {String((detail.user as { phone?: string } | undefined)?.phone ?? '—')}
+            <Descriptions.Item label="结算额">
+              ¥{Number(redeemDetail.settleAmount ?? 0).toFixed(2)}
+            </Descriptions.Item>
+            <Descriptions.Item label="时间">{fmtTime(String(redeemDetail.createdAt ?? ''))}</Descriptions.Item>
+            <Descriptions.Item label="用户">
+              {String((redeemDetail.user as { userNo?: string } | undefined)?.userNo ?? '—')}
+              {(redeemDetail.user as { phone?: string | null } | undefined)?.phone
+                ? ` / ${(redeemDetail.user as { phone?: string | null }).phone}`
+                : ''}
+            </Descriptions.Item>
+            <Descriptions.Item label="门店">
+              {String((redeemDetail.store as { name?: string } | undefined)?.name ?? '—')}
+              {(redeemDetail.store as { cityName?: string } | undefined)?.cityName
+                ? `（${(redeemDetail.store as { cityName?: string }).cityName}）`
+                : ''}
+            </Descriptions.Item>
+            <Descriptions.Item label="门店地址">
+              {String((redeemDetail.store as { address?: string } | undefined)?.address ?? '—')}
+            </Descriptions.Item>
+            <Descriptions.Item label="合伙人">
+              {String(
+                (redeemDetail.store as { partnerAccount?: { companyName?: string } } | undefined)
+                  ?.partnerAccount?.companyName ?? '—',
+              )}
+            </Descriptions.Item>
+            <Descriptions.Item label="权益券号">
+              {String((redeemDetail.coupon as { couponNo?: string } | undefined)?.couponNo ?? '—')}
             </Descriptions.Item>
             <Descriptions.Item label="关联订单">
-              {String((detail.order as { orderNo?: string } | null | undefined)?.orderNo ?? '—')}
+              {String(
+                (redeemDetail.coupon as { order?: { orderNo?: string } } | undefined)?.order?.orderNo ??
+                  '—',
+              )}
             </Descriptions.Item>
-            <Descriptions.Item label="总额">¥{String(detail.totalAmount)}</Descriptions.Item>
-            <Descriptions.Item label="余额">¥{String(detail.balance)}</Descriptions.Item>
-            <Descriptions.Item label="状态">
-              {COUPON_STATUS_LABELS[String(detail.status)] || String(detail.status)}
-            </Descriptions.Item>
-            <Descriptions.Item label="来源">{String(detail.sourceProduct)}</Descriptions.Item>
+            {Array.isArray(redeemDetail.allocations) &&
+            (redeemDetail.allocations as unknown[]).length > 0 ? (
+              <Descriptions.Item label="券分摊">
+                {(
+                  redeemDetail.allocations as Array<{
+                    couponNo?: string;
+                    orderNo?: string | null;
+                    amount?: number;
+                    sortOrder?: number;
+                  }>
+                )
+                  .map((a, idx) => {
+                    const role = idx === 0 ? '主' : '次';
+                    return `${role} ${a.couponNo ?? '—'}¥${Number(a.amount ?? 0).toFixed(2)}${
+                      a.orderNo ? `（订单 ${a.orderNo}）` : ''
+                    }`;
+                  })
+                  .join('；')}
+              </Descriptions.Item>
+            ) : null}
+            {redeemDetail.payout ? (
+              <Descriptions.Item label="门店结算单">
+                ¥{Number((redeemDetail.payout as { settleAmount?: number }).settleAmount ?? 0).toFixed(2)}
+                {' / '}
+                {String((redeemDetail.payout as { status?: string }).status ?? '—')}
+              </Descriptions.Item>
+            ) : null}
+            {redeemDetail.rating ? (
+              <Descriptions.Item label="评价">
+                服务 {(redeemDetail.rating as { serviceScore?: number }).serviceScore ?? '—'} 分 / 环境{' '}
+                {(redeemDetail.rating as { envScore?: number }).envScore ?? '—'} 分
+              </Descriptions.Item>
+            ) : null}
           </Descriptions>
-        )}
+        ) : null}
       </Drawer>
     </div>
   );