feat: 添加货币管理功能，更新国际化支持，移除报表相关代码

src/modules/reconcile/reconcile-console.tsx

@@ -9,19 +9,15 @@ import {
   getAdminReconcileJobs,
   postAdminReconcileJob,
 } from "@/api/admin-reconcile";
+import { getAdminPlayers } from "@/api/admin-player";
+import { AdminDateRangeField } from "@/components/admin/admin-date-range-field";
 import { AdminListPaginationFooter } from "@/components/admin/admin-list-pagination-footer";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
 import {
   Table,
   TableBody,
@@ -30,11 +26,12 @@ import {
   TableHeader,
   TableRow,
 } from "@/components/ui/table";
-import { Textarea } from "@/components/ui/textarea";
 import { useAdminDateTimeFormatter } from "@/hooks/use-admin-datetime-formatter";
 import { adminHasAnyPermission } from "@/lib/admin-permissions";
+import { cn } from "@/lib/utils";
 import { useAdminProfile } from "@/stores/admin-session";
 import { LotteryApiBizError } from "@/types/api/errors";
+import type { AdminPlayerRow } from "@/types/api/admin-player";
 import type {
   AdminReconcileItemsData,
   AdminReconcileJobListData,
@@ -43,12 +40,7 @@ import type {
 const MANAGE = ["prd.wallet_reconcile.manage"] as const;
 
 /** 与后端 reconcile_type 对齐；扩展时在 API 与下拉同步增加 */
-const RECONCILE_TYPE_OPTIONS = [{ value: "wallet_transfer", label: "walletTransfer" }] as const;
-
-function reconcileTypeLabel(slug: string, t: (key: string) => string): string {
-  const hit = RECONCILE_TYPE_OPTIONS.find((o) => o.value === slug);
-  return hit ? t(hit.label) : slug;
-}
+const RECONCILE_TYPE = "wallet_transfer" as const;
 
 function jobStatusLabel(status: string, t: (key: string) => string): string {
   switch (status) {
@@ -76,34 +68,13 @@ function itemStatusLabel(status: string, t: (key: string) => string): string {
   }
 }
 
-function toIsoFromDatetimeLocal(local: string): string | null {
-  const t = local.trim();
-  if (t === "") {
-    return null;
+function reconcileTypeLabel(type: string, t: (key: string) => string): string {
+  switch (type) {
+    case "wallet_transfer":
+      return t("reconcileTypeWalletTransfer");
+    default:
+      return type;
   }
-  const d = new Date(t);
-  if (Number.isNaN(d.getTime())) {
-    return null;
-  }
-  return d.toISOString();
-}
-
-function scopeLinesToItems(
-  raw: string,
-): NonNullable<Parameters<typeof postAdminReconcileJob>[0]["items"]> | undefined {
-  const lines = raw
-    .split(/\r?\n/)
-    .map((s) => s.trim())
-    .filter(Boolean);
-  if (lines.length === 0) {
-    return undefined;
-  }
-  return lines.map((side_a_ref) => ({
-    side_a_ref,
-    side_b_ref: null,
-    difference_amount: 0,
-    status: "pending_check",
-  }));
 }
 
 export function ReconcileConsole(): React.ReactElement {
@@ -116,18 +87,21 @@ export function ReconcileConsole(): React.ReactElement {
   const [jobsLoading, setJobsLoading] = useState(true);
   const [jobsErr, setJobsErr] = useState<string | null>(null);
   const [page, setPage] = useState(1);
-  const [perPage, setPerPage] = useState(25);
+  const [perPage, setPerPage] = useState(10);
 
   const [selectedId, setSelectedId] = useState<number | null>(null);
+  const [detailOpen, setDetailOpen] = useState(false);
   const [items, setItems] = useState<AdminReconcileItemsData | null>(null);
   const [itemsPage, setItemsPage] = useState(1);
-  const [itemsPerPage, setItemsPerPage] = useState(50);
+  const [itemsPerPage, setItemsPerPage] = useState(10);
   const [itemsLoading, setItemsLoading] = useState(false);
 
-  const [reconcileType, setReconcileType] = useState<string>(RECONCILE_TYPE_OPTIONS[0].value);
-  const [periodStartLocal, setPeriodStartLocal] = useState("");
-  const [periodEndLocal, setPeriodEndLocal] = useState("");
-  const [scopeLines, setScopeLines] = useState("");
+  const [dateFrom, setDateFrom] = useState("");
+  const [dateTo, setDateTo] = useState("");
+  const [playerSearch, setPlayerSearch] = useState("");
+  const [playerResults, setPlayerResults] = useState<AdminPlayerRow[]>([]);
+  const [playerLoading, setPlayerLoading] = useState(false);
+  const [selectedPlayer, setSelectedPlayer] = useState<AdminPlayerRow | null>(null);
   const [submitting, setSubmitting] = useState(false);
 
   const loadJobs = useCallback(async () => {
@@ -176,35 +150,59 @@ export function ReconcileConsole(): React.ReactElement {
     });
   }, [loadItems]);
 
+  const loadPlayers = useCallback(async (keyword: string) => {
+    const q = keyword.trim();
+    if (q === "") {
+      setPlayerResults([]);
+      return;
+    }
+    setPlayerLoading(true);
+    try {
+      const data = await getAdminPlayers({ page: 1, per_page: 8, keyword: q });
+      setPlayerResults(data.items);
+    } catch {
+      setPlayerResults([]);
+    } finally {
+      setPlayerLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    const q = playerSearch.trim();
+    if (q === "") {
+      return;
+    }
+    const timer = window.setTimeout(() => {
+      void loadPlayers(q);
+    }, 250);
+    return () => window.clearTimeout(timer);
+  }, [loadPlayers, playerSearch]);
+
   async function onCreate(): Promise<void> {
-    if (!periodStartLocal.trim() || !periodEndLocal.trim()) {
+    if (!dateFrom.trim() || !dateTo.trim()) {
       toast.error(t("periodRequired"));
       return;
     }
-    const periodStartIso = toIsoFromDatetimeLocal(periodStartLocal);
-    const periodEndIso = toIsoFromDatetimeLocal(periodEndLocal);
-    if (periodStartIso == null || periodEndIso == null) {
-      toast.error(t("periodInvalid"));
-      return;
-    }
-    if (new Date(periodStartIso).getTime() > new Date(periodEndIso).getTime()) {
+    if (dateFrom > dateTo) {
       toast.error(t("periodOrderInvalid"));
       return;
     }
 
-    const itemsPayload = scopeLinesToItems(scopeLines);
-
     setSubmitting(true);
     try {
       await postAdminReconcileJob({
-        reconcile_type: reconcileType,
-        period_start: periodStartIso,
-        period_end: periodEndIso,
-        items: itemsPayload,
+        reconcile_type: RECONCILE_TYPE,
+        date_from: dateFrom,
+        date_to: dateTo,
+        player_id: selectedPlayer ? selectedPlayer.id : null,
       });
       toast.success(t("createSuccess"));
       setPage(1);
-      setScopeLines("");
+      setDateFrom("");
+      setDateTo("");
+      setPlayerSearch("");
+      setSelectedPlayer(null);
+      setPlayerResults([]);
       await loadJobs();
     } catch (e) {
       toast.error(e instanceof LotteryApiBizError ? e.message : t("createFailed"));
@@ -215,6 +213,7 @@ export function ReconcileConsole(): React.ReactElement {
 
   const jm = jobs?.meta;
   const im = items?.meta;
+  const selectedJob = jobs?.items.find((job) => job.id === selectedId) ?? null;
 
   return (
     <div className="flex w-full max-w-none flex-col gap-6">
@@ -222,65 +221,104 @@ export function ReconcileConsole(): React.ReactElement {
         <Card className="admin-list-card">
           <CardHeader className="admin-list-header">
             <CardTitle className="admin-list-title">{t("createTitle")}</CardTitle>
-            <CardDescription className="mt-1">{t("createDesc")}</CardDescription>
           </CardHeader>
           <CardContent className="admin-list-content pt-4">
-            <div className="grid gap-4 lg:grid-cols-[minmax(220px,0.9fr)_minmax(180px,0.7fr)_minmax(180px,0.7fr)_auto] lg:items-end">
+            <div className="grid gap-4 lg:grid-cols-[minmax(220px,0.9fr)_minmax(220px,0.95fr)_auto] lg:items-end">
               <div className="grid gap-1.5">
-              <Label htmlFor="rc-type">{t("reconcileType")}</Label>
-              <Select
-                modal={false}
-                value={reconcileType}
-                onValueChange={(v) => {
-                  if (v != null && v !== "") {
-                    setReconcileType(v);
-                  }
-                }}
-              >
-                <SelectTrigger id="rc-type" className="w-full">
-                  <SelectValue>{reconcileTypeLabel(reconcileType, t)}</SelectValue>
-                </SelectTrigger>
-                <SelectContent align="start">
-                  {RECONCILE_TYPE_OPTIONS.map((o) => (
-                    <SelectItem key={o.value} value={o.value}>
-                      {t(o.label)}
-                    </SelectItem>
-                  ))}
-                </SelectContent>
-              </Select>
+                <Label htmlFor="rc-type">{t("reconcileType")}</Label>
+                <Input id="rc-type" value={t("reconcileTypeFixed")} readOnly className="bg-muted/30" />
               </div>
               <div className="grid gap-1.5">
-                <Label htmlFor="rc-start">{t("startTime")}</Label>
-                <Input
-                  id="rc-start"
-                  type="datetime-local"
-                  value={periodStartLocal}
-                  onChange={(e) => setPeriodStartLocal(e.target.value)}
-                />
-              </div>
-              <div className="grid gap-1.5">
-                <Label htmlFor="rc-end">{t("endTime")}</Label>
-                <Input
-                  id="rc-end"
-                  type="datetime-local"
-                  value={periodEndLocal}
-                  onChange={(e) => setPeriodEndLocal(e.target.value)}
+                <AdminDateRangeField
+                  id="rc-date-range"
+                  label={t("dateRange")}
+                  from={dateFrom}
+                  to={dateTo}
+                  onRangeChange={({ from, to }) => {
+                    setDateFrom(from);
+                    setDateTo(to);
+                  }}
                 />
               </div>
               <Button type="button" className="w-full lg:w-auto" onClick={() => void onCreate()} disabled={submitting}>
                 {submitting ? t("submitting") : t("createTask")}
               </Button>
             </div>
-            <div className="grid gap-1.5">
-              <Label htmlFor="rc-scope">{t("scope")}</Label>
-              <Textarea
-                id="rc-scope"
-                value={scopeLines}
-                onChange={(e) => setScopeLines(e.target.value)}
-                rows={3}
-                placeholder={t("scopePlaceholder")}
-                className="min-h-20 text-sm"
+            <div className="grid gap-1.5 pt-4">
+              <Label htmlFor="rc-player-search">{t("playerSearch")}</Label>
+              <Input
+                id="rc-player-search"
+                value={playerSearch}
+                onChange={(e) => setPlayerSearch(e.target.value)}
+                placeholder={t("playerSearchPlaceholder")}
               />
+              {selectedPlayer ? (
+                <div className="flex items-center justify-between gap-3 rounded-lg border bg-muted/20 px-3 py-2 text-sm">
+                  <div className="min-w-0">
+                    <div className="truncate font-medium text-foreground">
+                      {selectedPlayer.site_player_id}
+                      {selectedPlayer.nickname ? ` · ${selectedPlayer.nickname}` : ""}
+                      {selectedPlayer.username ? ` · ${selectedPlayer.username}` : ""}
+                    </div>
+                  </div>
+                  <Button
+                    type="button"
+                    size="sm"
+                    variant="outline"
+                    onClick={() => {
+                      setSelectedPlayer(null);
+                      setPlayerSearch("");
+                      setPlayerResults([]);
+                    }}
+                  >
+                    {t("playerClear")}
+                  </Button>
+                </div>
+              ) : null}
+              {playerSearch.trim() !== "" || playerResults.length > 0 || playerLoading ? (
+                <div className="rounded-lg border bg-background">
+                  <div className="max-h-56 overflow-y-auto">
+                    {playerLoading ? (
+                      <div className="px-3 py-2 text-sm text-muted-foreground">{t("loadingPlayers")}</div>
+                    ) : playerResults.length === 0 ? (
+                      <div className="px-3 py-2 text-sm text-muted-foreground">{t("playerNoResults")}</div>
+                    ) : (
+                      <div className="divide-y">
+                        {playerResults.map((player) => {
+                          const active = selectedPlayer?.id === player.id;
+                          return (
+                            <button
+                              key={player.id}
+                              type="button"
+                              className={cn(
+                                "flex w-full items-start justify-between gap-3 px-3 py-2.5 text-left text-sm transition-colors hover:bg-muted/25",
+                                active && "bg-muted/30",
+                              )}
+                              onClick={() => {
+                                setSelectedPlayer(player);
+                                setPlayerSearch(player.site_player_id);
+                              }}
+                            >
+                              <div className="min-w-0">
+                                <div className="truncate font-medium text-foreground">
+                                  {player.site_player_id}
+                                  {player.nickname ? ` · ${player.nickname}` : ""}
+                                </div>
+                                <div className="truncate text-xs text-muted-foreground">
+                                  {player.username ?? "—"} · {player.site_code}
+                                </div>
+                              </div>
+                              <span className="shrink-0 text-xs text-muted-foreground">
+                                {active ? t("playerSelectedShort") : t("playerChoose")}
+                              </span>
+                            </button>
+                          );
+                        })}
+                      </div>
+                    )}
+                  </div>
+                </div>
+              ) : null}
             </div>
           </CardContent>
         </Card>
@@ -292,7 +330,6 @@ export function ReconcileConsole(): React.ReactElement {
         <CardHeader className="admin-list-header flex flex-row flex-wrap items-end justify-between gap-4">
           <div>
             <CardTitle className="admin-list-title">{t("jobsTitle")}</CardTitle>
-            <CardDescription className="mt-1.5">{t("jobsDesc")}</CardDescription>
           </div>
           <Button type="button" variant="secondary" size="sm" onClick={() => void loadJobs()}>
             {t("refresh")}
@@ -309,37 +346,37 @@ export function ReconcileConsole(): React.ReactElement {
                 <Table id="reconcile-jobs-table">
                   <TableHeader>
                     <TableRow>
-                      <TableHead className="w-24">{t("table.id", { ns: "common" })}</TableHead>
-                      <TableHead>{t("jobNo")}</TableHead>
+                      <TableHead className="sticky left-0 z-20 w-24 bg-muted/20 shadow-[1px_0_0_rgba(203,213,225,0.7)]">
+                        {t("table.id", { ns: "common" })}
+                      </TableHead>
+                      <TableHead className="sticky left-24 z-20 min-w-[14rem] bg-muted/20 shadow-[1px_0_0_rgba(203,213,225,0.7)]">
+                        {t("jobNo")}
+                      </TableHead>
                       <TableHead>{t("type")}</TableHead>
                       <TableHead>{t("status")}</TableHead>
                       <TableHead>{t("period")}</TableHead>
                       <TableHead>{t("createdAt")}</TableHead>
+                      <TableHead className="sticky right-0 z-20 w-28 bg-muted/20 text-center shadow-[-1px_0_0_rgba(203,213,225,0.7)]">
+                        {t("operate")}
+                      </TableHead>
                     </TableRow>
                   </TableHeader>
                   <TableBody>
                     {jobs.items.length === 0 ? (
                       <TableRow>
-                        <TableCell colSpan={6} className="text-muted-foreground">
+                        <TableCell colSpan={7} className="text-muted-foreground">
                           {t("states.noData", { ns: "common" })}
                         </TableCell>
                       </TableRow>
                     ) : (
                       jobs.items.map((row) => (
-                        <TableRow
-                          key={row.id}
-                          className={
-                            selectedId === row.id
-                              ? "bg-muted/60 cursor-pointer"
-                              : "cursor-pointer hover:bg-muted/40"
-                          }
-                          onClick={() => {
-                            setSelectedId(row.id);
-                            setItemsPage(1);
-                          }}
-                        >
-                          <TableCell className="tabular-nums">{row.id}</TableCell>
-                          <TableCell className="font-mono text-xs">{row.job_no}</TableCell>
+                        <TableRow key={row.id}>
+                          <TableCell className="sticky left-0 z-10 bg-card tabular-nums shadow-[1px_0_0_rgba(226,232,240,0.9)]">
+                            {row.id}
+                          </TableCell>
+                          <TableCell className="sticky left-24 z-10 min-w-[14rem] bg-card font-mono text-xs shadow-[1px_0_0_rgba(226,232,240,0.9)]">
+                            {row.job_no}
+                          </TableCell>
                           <TableCell className="text-sm">{reconcileTypeLabel(row.reconcile_type, t)}</TableCell>
                           <TableCell>
                             <Badge variant="secondary">{jobStatusLabel(row.status, t)}</Badge>
@@ -353,6 +390,20 @@ export function ReconcileConsole(): React.ReactElement {
                           <TableCell className="whitespace-nowrap font-mono text-[11px] text-muted-foreground">
                             {formatTs(row.created_at)}
                           </TableCell>
+                          <TableCell className="sticky right-0 z-10 bg-card text-center shadow-[-1px_0_0_rgba(226,232,240,0.9)]">
+                            <Button
+                              type="button"
+                              size="sm"
+                              variant="outline"
+                              onClick={() => {
+                                setSelectedId(row.id);
+                                setItemsPage(1);
+                                setDetailOpen(true);
+                              }}
+                            >
+                              {t("view")}
+                            </Button>
+                          </TableCell>
                         </TableRow>
                       ))
                     )}
@@ -379,23 +430,41 @@ export function ReconcileConsole(): React.ReactElement {
         </CardContent>
       </Card>
 
-      {selectedId != null ? (
-        <Card className="admin-list-card">
-          <CardHeader className="admin-list-header">
-            <CardTitle className="admin-list-title">{t("detailsTitle")}</CardTitle>
-            <CardDescription className="font-mono text-xs">#{selectedId}</CardDescription>
-          </CardHeader>
-          <CardContent className="admin-list-content pt-4">
+      <Dialog
+        open={detailOpen}
+        onOpenChange={(open) => {
+          setDetailOpen(open);
+          if (!open) {
+            setSelectedId(null);
+            setItems(null);
+          }
+        }}
+      >
+        <DialogContent
+          showCloseButton
+          className="flex h-[min(86vh,780px)] !max-w-[min(920px,calc(100vw-2rem))] flex-col gap-0 overflow-hidden p-0"
+        >
+          <DialogHeader className="shrink-0 space-y-1 border-b bg-background px-5 py-4 pr-12">
+            <DialogTitle className="text-base">{t("detailsTitle")}</DialogTitle>
+            <DialogDescription className="font-mono text-xs">
+              {selectedJob ? `${selectedJob.job_no} · #${selectedJob.id}` : selectedId != null ? `#${selectedId}` : ""}
+            </DialogDescription>
+          </DialogHeader>
+          <div className="min-h-0 flex-1 overflow-y-auto overscroll-contain bg-muted/15 px-5 py-4">
             {itemsLoading && !items ? (
               <p className="text-sm text-muted-foreground">{t("states.loading", { ns: "common" })}</p>
             ) : null}
             {items ? (
               <>
-                {items.job_no ? (
-                  <p className="font-mono text-sm text-muted-foreground">{t("jobNo")} {items.job_no}</p>
-                ) : null}
-            <div className="admin-table-shell">
-              <Table id={`reconcile-items-table-${selectedId ?? "none"}`}>
+                <div className="mb-3 flex flex-wrap items-center gap-2 text-sm text-muted-foreground">
+                  <span>{t("jobNo")} {items.job_no}</span>
+                  <span>·</span>
+                  <span>{t("status")} {selectedJob ? jobStatusLabel(selectedJob.status, t) : "—"}</span>
+                  <span>·</span>
+                  <span>{t("period")} {selectedJob ? `${selectedJob.period_start ? formatTs(selectedJob.period_start) : "—"} ~ ${selectedJob.period_end ? formatTs(selectedJob.period_end) : "—"}` : "—"}</span>
+                </div>
+                <div className="rounded-lg border bg-background">
+                  <Table id={`reconcile-items-table-${selectedId ?? "none"}`}>
                     <TableHeader>
                       <TableRow>
                         <TableHead className="w-20">{t("table.id", { ns: "common" })}</TableHead>
@@ -427,25 +496,27 @@ export function ReconcileConsole(): React.ReactElement {
                   </Table>
                 </div>
                 {im ? (
-                  <AdminListPaginationFooter
-                    selectId="reconcile-items-per-page"
-                    total={im.total}
-                    page={im.current_page}
-                    lastPage={Math.max(1, im.last_page)}
-                    perPage={im.per_page}
-                    loading={itemsLoading}
-                    onPerPageChange={(n) => {
-                      setItemsPerPage(n);
-                      setItemsPage(1);
-                    }}
-                    onPageChange={setItemsPage}
-                  />
+                  <div className="pt-4">
+                    <AdminListPaginationFooter
+                      selectId="reconcile-items-per-page"
+                      total={im.total}
+                      page={im.current_page}
+                      lastPage={Math.max(1, im.last_page)}
+                      perPage={im.per_page}
+                      loading={itemsLoading}
+                      onPerPageChange={(n) => {
+                        setItemsPerPage(n);
+                        setItemsPage(1);
+                      }}
+                      onPageChange={setItemsPage}
+                    />
+                  </div>
                 ) : null}
               </>
             ) : null}
-          </CardContent>
-        </Card>
-      ) : null}
+          </div>
+        </DialogContent>
+      </Dialog>
     </div>
   );
 }