feat: 重构开奖模块导航与面包屑,优化期号详情与列表展示

This commit is contained in:
2026-05-14 13:43:45 +08:00
parent afa592dd91
commit 000295ae2b
8 changed files with 287 additions and 72 deletions

View File

@@ -67,55 +67,61 @@ export function DrawDetailConsole({ drawId }: { drawId: string }) {
return (
<div className="space-y-6">
<Card>
<CardHeader>
<CardTitle className="text-lg"></CardTitle>
<Card className="overflow-hidden">
<CardHeader className="border-b bg-muted/30 pb-4">
<div className="flex flex-wrap items-center justify-between gap-3">
<div>
<CardTitle className="text-xl">{data.draw_no}</CardTitle>
<p className="mt-1 text-sm text-muted-foreground"></p>
</div>
<div className="flex flex-wrap items-center gap-2">
<DrawStatusBadge status={data.status} label={data.status} />
<DrawStatusBadge status={data.hall_preview_status} label={`大厅预览 ${data.hall_preview_status}`} />
</div>
</div>
</CardHeader>
<CardContent className="space-y-4">
<div className="flex flex-wrap items-center gap-2">
<span className="font-mono text-base font-semibold">{data.draw_no}</span>
<DrawStatusBadge status={data.status} label={`DB · ${data.status}`} />
<DrawStatusBadge
status={data.hall_preview_status}
label={`大厅预览 · ${data.hall_preview_status}`}
/>
<CardContent className="grid gap-6 p-6 lg:grid-cols-[minmax(0,1.2fr)_minmax(0,0.8fr)]">
<div className="space-y-4">
<div className="grid gap-4 sm:grid-cols-2">
<Field label="业务日">{data.business_date}</Field>
<Field label="流水序号">{data.sequence_no}</Field>
<Field label="开始时间">{formatDt(data.start_time)}</Field>
<Field label="封盘时间">{formatDt(data.close_time)}</Field>
<Field label="计划开奖">{formatDt(data.draw_time)}</Field>
<Field label="冷静期结束">{formatDt(data.cooling_end_time)}</Field>
</div>
<Separator />
<div className="grid gap-4 sm:grid-cols-2">
<Field label="结果来源">{data.result_source ?? "—"}</Field>
<Field label="当前结果版本">{data.current_result_version}</Field>
<Field label="结算版本">{data.settle_version}</Field>
<Field label="是否重开">{data.is_reopened ? "是" : "否"}</Field>
</div>
</div>
<Separator />
<div className="grid gap-4">
<Field label="业务日">{data.business_date}</Field>
<Field label="流水序号">{data.sequence_no}</Field>
<Field label="开始时间">{formatDt(data.start_time)}</Field>
<Field label="封盘时间">{formatDt(data.close_time)}</Field>
<Field label="计划开奖">{formatDt(data.draw_time)}</Field>
<Field label="冷静期结束">{formatDt(data.cooling_end_time)}</Field>
<Field label="结果来源">{data.result_source ?? "—"}</Field>
<Field label="当前结果版本">{data.current_result_version}</Field>
<Field label="结算版本">{data.settle_version}</Field>
<Field label="是否重开">{data.is_reopened ? "是" : "否"}</Field>
</div>
</CardContent>
</Card>
<Card>
<CardHeader>
<CardTitle className="text-base"></CardTitle>
</CardHeader>
<CardContent className="flex flex-col gap-4">
<div className="flex flex-wrap gap-6 text-sm">
<span>{data.result_batch_counts.total}</span>
<span className="text-amber-600 dark:text-amber-400">
{data.result_batch_counts.pending_review}
</span>
<span className="text-emerald-600 dark:text-emerald-400">
{data.result_batch_counts.published}
</span>
<div className="rounded-xl border bg-muted/20 p-4">
<p className="text-sm font-medium text-muted-foreground"></p>
<div className="mt-3 grid gap-3 text-sm">
<div className="flex items-center justify-between rounded-lg bg-background px-3 py-2">
<span></span>
<span className="font-semibold">{data.result_batch_counts.total}</span>
</div>
<div className="flex items-center justify-between rounded-lg bg-background px-3 py-2 text-amber-600 dark:text-amber-400">
<span></span>
<span className="font-semibold">{data.result_batch_counts.pending_review}</span>
</div>
<div className="flex items-center justify-between rounded-lg bg-background px-3 py-2 text-emerald-600 dark:text-emerald-400">
<span></span>
<span className="font-semibold">{data.result_batch_counts.published}</span>
</div>
</div>
<Link
href={`/admin/draws/${drawId}/finance`}
className={cn(buttonVariants({ variant: "outline", size: "sm" }), "mt-4 w-full")}
>
</Link>
</div>
<Link
href={`/admin/draws/${drawId}/finance`}
className={cn(buttonVariants({ variant: "outline", size: "sm" }), "w-fit")}
>
/
</Link>
</CardContent>
</Card>
</div>