86 lines
3.0 KiB
TypeScript
86 lines
3.0 KiB
TypeScript
import { AnswerUiView, type AnswerUiBlock } from "@/features/agent";
|
|
import { Card, CardContent, CardHeader } from "@/shared/ui/card";
|
|
import { FloatingWindow } from "@/shared/ui/floating-window";
|
|
import type { InvestigationMapTarget } from "../api/investigation-report";
|
|
|
|
type Props = {
|
|
blocks: AnswerUiBlock[];
|
|
records: Array<Record<string, unknown>>;
|
|
reviewing: boolean;
|
|
onLocateTargets?: (targets: InvestigationMapTarget[]) => Promise<unknown>;
|
|
};
|
|
|
|
export function PresentationBusinessResults({
|
|
blocks,
|
|
records,
|
|
reviewing,
|
|
onLocateTargets
|
|
}: Props) {
|
|
if (!blocks.length && !records.length) return null;
|
|
return (
|
|
<section aria-label="展示结果" className="min-w-0 space-y-3">
|
|
{blocks.map((block) => (
|
|
<AnswerUiView
|
|
key={block.block_id}
|
|
block={block}
|
|
disabled={reviewing}
|
|
onLocate={
|
|
onLocateTargets && !reviewing
|
|
? (target) =>
|
|
onLocateTargets(
|
|
target.feature_ids.map((feature_id) => ({
|
|
source_id: target.layer,
|
|
feature_id
|
|
}))
|
|
)
|
|
: undefined
|
|
}
|
|
/>
|
|
))}
|
|
{!blocks.length && records.length ? (
|
|
<Card className="border-border shadow-none">
|
|
<CardHeader className="flex-row items-center justify-between gap-2 space-y-0 p-3 pb-2">
|
|
<h3 className="text-xs font-semibold">调查数据 · {records.length} 条</h3>
|
|
<FloatingWindow title="调查数据摘要" triggerLabel="放大查看表格 调查数据摘要">{() => <PresentationRecordTable records={records} />}</FloatingWindow>
|
|
</CardHeader>
|
|
<CardContent className="overflow-x-auto px-3 pb-3 pt-0">
|
|
<PresentationRecordTable records={records} />
|
|
</CardContent>
|
|
</Card>
|
|
) : null}
|
|
</section>
|
|
);
|
|
}
|
|
|
|
function PresentationRecordTable({ records }: { records: Array<Record<string, unknown>> }) {
|
|
return (
|
|
<table className="w-full text-left text-[11px] leading-5">
|
|
<caption className="sr-only">调查数据摘要</caption>
|
|
<thead>
|
|
<tr className="border-b">
|
|
<th className="py-1 pr-3 font-medium">类型</th>
|
|
<th className="py-1 pr-3 font-medium">对象</th>
|
|
<th className="py-1 font-medium">来源</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{records.map((record, index) => (
|
|
<tr key={index} className="border-b last:border-0">
|
|
<td className="break-all py-1.5 pr-3">{String(record.record_type)}</td>
|
|
<td className="break-all py-1.5 pr-3">
|
|
{String(
|
|
record.element_id ??
|
|
record.device_id ??
|
|
record.action_id ??
|
|
record.item ??
|
|
`记录 ${index + 1}`
|
|
)}
|
|
</td>
|
|
<td className="break-all py-1.5">{String(record.origin)}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
);
|
|
}
|