"use client";

import { useCallback, useEffect, useRef, useState } from "react";
import { ArrowRight } from "lucide-react";
import { useTranslation } from "react-i18next";
import { toast } from "sonner";

import {
  getSettlementBill,
  postSettlementBillAdjustment,
  postSettlementBillBadDebtWriteOff,
  postSettlementBillConfirm,
  postSettlementBillPayment,
  type RebateAllocationRow,
  type SettlementBillRow,
  type SettlementBillPaymentRow,
  type DownlineShareBreakdown,
} from "@/api/admin-agent-settlement";
import { AdminLoadingState } from "@/components/admin/admin-loading-state";
import { formatAdminMinorDecimal, parseAdminMajorToMinor, parseSignedAdminMajorToMinor } from "@/lib/money";
import { formatDashboardMoneyMinor } from "@/modules/dashboard/use-dashboard-analytics";
import {
  SettlementBillAmountBreakdown,
  SettlementBillSummaryHeader,
} from "@/modules/settlement/settlement-bill-breakdown";
import { describeBillPaymentDirection } from "@/modules/settlement/settlement-bill-display";
import { settlementBillOperableByBoundAgent } from "@/modules/settlement/settlement-bill-operable";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { useConfirmAction } from "@/hooks/use-confirm-action";
import { LotteryApiBizError } from "@/types/api/errors";

type AgentBillDetailProps = {
  billId: number;
  currencyCode: string;
  canManage?: boolean;
  canFinanceAdjustments?: boolean;
  boundAgent?: { id: number } | null;
  focusSection?: "confirm" | "payment" | null;
  onUpdated?: () => void;
};

export function AgentBillDetail({
  billId,
  currencyCode,
  canManage = true,
  canFinanceAdjustments = false,
  boundAgent = null,
  focusSection = null,
  onUpdated,
}: AgentBillDetailProps): React.ReactElement {
  const { t } = useTranslation(["agents", "settlementCenter", "common"]);
  const [bill, setBill] = useState<SettlementBillRow | null>(null);
  const [payments, setPayments] = useState<SettlementBillPaymentRow[]>([]);
  const [rebateAllocations, setRebateAllocations] = useState<RebateAllocationRow[]>([]);
  const [downlineShares, setDownlineShares] = useState<DownlineShareBreakdown | null>(null);
  const [loading, setLoading] = useState(true);
  const [loadErr, setLoadErr] = useState<string | null>(null);
  const [payAmount, setPayAmount] = useState("");
  const [payMethod, setPayMethod] = useState("");
  const [payProof, setPayProof] = useState("");
  const [adjustAmount, setAdjustAmount] = useState("");
  const [adjustReason, setAdjustReason] = useState("");
  const [badDebtReason, setBadDebtReason] = useState("");
  const [rebateDetailsOpen, setRebateDetailsOpen] = useState(false);
  const [advancedOpen, setAdvancedOpen] = useState(false);
  const confirmRef = useRef<HTMLDivElement>(null);
  const paymentRef = useRef<HTMLDivElement>(null);
  const paymentIdempotencyKeyRef = useRef<string | null>(null);
  const adjustmentIdempotencyKeyRef = useRef<string | null>(null);
  const badDebtIdempotencyKeyRef = useRef<string | null>(null);
  const { request: requestConfirm, ConfirmDialog, busy: confirmBusy } = useConfirmAction();

  const createIdempotencyKey = useCallback((prefix: string): string => {
    const random =
      typeof crypto !== "undefined" && typeof crypto.randomUUID === "function"
        ? crypto.randomUUID()
        : Math.random().toString(36).slice(2, 10);
    return `${prefix}-${billId}-${Date.now()}-${random}`;
  }, [billId]);

  useEffect(() => {
    paymentIdempotencyKeyRef.current = null;
    adjustmentIdempotencyKeyRef.current = null;
    badDebtIdempotencyKeyRef.current = null;
  }, [billId]);

  const load = useCallback(async () => {
    setLoading(true);
    setLoadErr(null);
    try {
      const data = await getSettlementBill(billId);
      setBill(data.bill);
      setPayments(data.payments ?? []);
      setRebateAllocations(data.rebate_allocations ?? []);
      setDownlineShares(data.downline_shares ?? null);
      setPayAmount(formatAdminMinorDecimal(data.bill.unpaid_amount ?? 0, currencyCode));
    } catch (e) {
      setBill(null);
      setPayments([]);
      setRebateAllocations([]);
      setDownlineShares(null);
      setLoadErr(e instanceof LotteryApiBizError ? e.message : t("loadFailed", { ns: "common" }));
    } finally {
      setLoading(false);
    }
  }, [billId, currencyCode, t]);

  useEffect(() => {
    void load();
  }, [load]);

  useEffect(() => {
    if (loading || !bill) {
      return;
    }
    const target =
      focusSection === "payment"
        ? paymentRef.current
        : focusSection === "confirm"
          ? confirmRef.current
          : null;
    if (target) {
      target.scrollIntoView({ behavior: "smooth", block: "nearest" });
    }
  }, [bill, focusSection, loading]);

  if (loading && !bill) {
    return <AdminLoadingState />;
  }

  if (loadErr || !bill) {
    return (
      <div className="space-y-3 py-4">
        <p className="text-sm text-destructive">{loadErr ?? t("loadFailed", { ns: "common" })}</p>
        <Button type="button" size="sm" variant="outline" onClick={() => void load()}>
          {t("retry", { ns: "common", defaultValue: "重试" })}
        </Button>
      </div>
    );
  }

  const direction = describeBillPaymentDirection(bill, t);
  const canOperateBill = canManage && settlementBillOperableByBoundAgent(bill, boundAgent);
  const locked = ["confirmed", "partial_paid", "settled", "overdue"].includes(bill.status);
  const paymentTitle = direction.ownerOwes
    ? t("settlementBills.submitReceipt", { defaultValue: "登记收款" })
    : t("settlementBills.submitPayout", { defaultValue: "登记付款" });
  const paymentSubmit = direction.ownerOwes
    ? t("settlementBills.submitReceipt", { defaultValue: "确认收款" })
    : t("settlementBills.submitPayout", { defaultValue: "确认付款" });
  const canWriteOff =
    canFinanceAdjustments &&
    bill.unpaid_amount > 0 &&
    ["confirmed", "partial_paid", "overdue"].includes(bill.status) &&
    !["adjustment", "reversal", "bad_debt"].includes(bill.bill_type);
  const primaryAction =
    bill.status === "pending_confirm"
      ? {
          title: t("settlementCenter:billDisplay.actionPendingConfirmTitle", {
            defaultValue: "当前应确认账单",
          }),
          description: t("settlementCenter:billDisplay.actionPendingConfirmDesc", {
            defaultValue: "确认金额和双方无误后，账单会进入待收付。",
          }),
          button: t("settlementBills.confirm", { defaultValue: "确认账单" }),
          onClick: () => confirmRef.current?.scrollIntoView({ behavior: "smooth", block: "nearest" }),
        }
      : ["confirmed", "partial_paid", "overdue"].includes(bill.status) && bill.unpaid_amount > 0
        ? {
            title: t("settlementCenter:billDisplay.actionAwaitingPaymentTitle", {
              defaultValue: "当前应登记收付",
            }),
            description: t("settlementCenter:billDisplay.actionAwaitingPaymentDesc", {
              defaultValue: "按谁付谁登记线下收付；未结清可分多次登记。",
            }),
            button: paymentTitle,
            onClick: () => paymentRef.current?.scrollIntoView({ behavior: "smooth", block: "nearest" }),
          }
        : bill.status === "settled"
          ? {
              title: t("settlementCenter:billDisplay.actionSettledTitle", {
                defaultValue: "本账单已结清",
              }),
              description: t("settlementCenter:billDisplay.actionSettledDesc", {
                defaultValue: "如需复核，可查看下方结算明细和收付记录。",
              }),
              button: null,
              onClick: null,
            }
          : {
              title: t("settlementCenter:billDisplay.actionReviewTitle", {
                defaultValue: "请复核账单状态",
              }),
              description: t("settlementCenter:billDisplay.actionReviewDesc", {
                defaultValue: "如金额或方向有差异，可通过调账、冲正或坏账处理。",
              }),
              button: null,
              onClick: null,
            };
  const rebateAllocationSummary = (() => {
    const groups: Record<string, { key: string; label: string; shareRate: number; amount: number; rows: number; rule: string }> = {};
    rebateAllocations.forEach((row) => {
      const label = row.participant_label ?? (row.participant_type === 'platform' ? 'Platform' : `${row.participant_type}#${row.participant_id}`);
      const key = `${row.participant_type}:${row.participant_id}`;
      const current = groups[key];
      if (current) {
        current.amount += row.allocated_amount;
        current.rows += 1;
        return;
      }
      groups[key] = {
        key,
        label,
        shareRate: row.actual_share_rate,
        amount: row.allocated_amount,
        rows: 1,
        rule: row.allocation_rule,
      };
    });
    return Object.values(groups).sort((a, b) => b.amount - a.amount || a.label.localeCompare(b.label, 'zh-CN'));
  })();

  const rebateTotalAmount = rebateAllocationSummary.reduce((s, r) => s + r.amount, 0);

  const rebateDetailByTicket = (() => {
    const groups: Record<number, { rebateRecordId: number; rows: typeof rebateAllocations }> = {};
    rebateAllocations.forEach((row) => {
      const rid = row.rebate_record_id;
      if (!groups[rid]) groups[rid] = { rebateRecordId: rid, rows: [] };
      groups[rid].rows.push(row);
    });
    return Object.values(groups);
  })();

  const showActionError = (err: unknown, fallback: string): void => {
    toast.error(err instanceof LotteryApiBizError ? err.message : fallback);
  };

  const requestConfirmBill = (): void => {
    requestConfirm({
      title: t("settlementBills.confirmBillTitle", { defaultValue: "确认账单？" }),
      description: t("settlementBills.confirmBillDescription", {
        defaultValue: "确认后账单会进入待收付状态，请确认金额与双方无误。",
      }),
      confirmLabel: t("settlementBills.confirm", { defaultValue: "确认账单" }),
      confirmVariant: "default",
      onConfirm: async () => {
        try {
          await postSettlementBillConfirm(billId);
          await load();
          await onUpdated?.();
          toast.success(t("settlementBills.confirmed", { defaultValue: "已确认" }));
        } catch (err: unknown) {
          showActionError(
            err,
            t("settlementBills.confirmFailed", { defaultValue: "确认账单失败" }),
          );
        }
      },
    });
  };

  const requestPayment = (): void => {
    const amount = parseAdminMajorToMinor(payAmount, currencyCode);
    if (amount === null || amount <= 0) {
      toast.error(t("settlementBills.paymentAmountInvalid", { defaultValue: "请输入大于 0 的有效金额" }));
      return;
    }
    if (amount > bill.unpaid_amount) {
      toast.error(t("settlementBills.paymentAmountTooLarge", { defaultValue: "收付金额不能超过未结金额" }));
      return;
    }

    if (!paymentIdempotencyKeyRef.current) {
      paymentIdempotencyKeyRef.current = createIdempotencyKey("pay");
    }
    const idempotencyKey = paymentIdempotencyKeyRef.current;
    requestConfirm({
      title: t("settlementBills.paymentConfirmTitle", { defaultValue: "确认登记收付？" }),
      description: t("settlementBills.paymentConfirmDescription", {
        defaultValue: "这会写入收付记录并更新账单已付/未结金额，请确认金额与方向无误。",
      }),
      confirmLabel: paymentSubmit,
      confirmVariant: "default",
      onConfirm: async () => {
        try {
          await postSettlementBillPayment(billId, {
            amount,
            method: payMethod.trim() || undefined,
            proof: payProof.trim() || undefined,
            idempotency_key: idempotencyKey,
          });
          paymentIdempotencyKeyRef.current = null;
          await load();
          await onUpdated?.();
          toast.success(t("settlementBills.paid", { defaultValue: "已登记收付" }));
        } catch (err: unknown) {
          showActionError(
            err,
            t("settlementBills.paymentFailed", { defaultValue: "登记收付失败" }),
          );
        }
      },
    });
  };

  const requestBadDebtWriteOff = (): void => {
    const reason = badDebtReason.trim();
    if (!reason) {
      toast.error(t("settlementBills.badDebtReasonRequired", { defaultValue: "请填写核销原因" }));
      return;
    }

    if (!badDebtIdempotencyKeyRef.current) {
      badDebtIdempotencyKeyRef.current = createIdempotencyKey("bd");
    }
    const idempotencyKey = badDebtIdempotencyKeyRef.current;
    requestConfirm({
      title: t("settlementBills.badDebtConfirmTitle", { defaultValue: "确认核销坏账？" }),
      description: t("settlementBills.badDebtConfirmDescription", {
        defaultValue: "核销会把未结金额归档为坏账记录，这类资金动作需要确认原因无误。",
      }),
      confirmLabel: t("settlementBills.confirmBadDebt", { defaultValue: "确认核销" }),
      confirmVariant: "destructive",
      onConfirm: async () => {
        try {
          await postSettlementBillBadDebtWriteOff(billId, { reason, idempotency_key: idempotencyKey });
          badDebtIdempotencyKeyRef.current = null;
          await load();
          await onUpdated?.();
          toast.success(t("settlementBills.badDebtDone", { defaultValue: "已核销坏账" }));
        } catch (err: unknown) {
          showActionError(
            err,
            t("settlementBills.badDebtFailed", { defaultValue: "核销坏账失败" }),
          );
        }
      },
    });
  };

  const requestAdjustment = (): void => {
    const amount = parseSignedAdminMajorToMinor(adjustAmount, currencyCode);
    const reason = adjustReason.trim();
    if (amount === null || amount === 0) {
      toast.error(t("settlementBills.adjustmentAmountInvalid", { defaultValue: "请输入非 0 的有效金额" }));
      return;
    }
    if (!reason) {
      toast.error(t("settlementBills.adjustmentReasonRequired", { defaultValue: "请填写补差/冲正原因" }));
      return;
    }

    if (!adjustmentIdempotencyKeyRef.current) {
      adjustmentIdempotencyKeyRef.current = createIdempotencyKey("adj");
    }
    const idempotencyKey = adjustmentIdempotencyKeyRef.current;
    requestConfirm({
      title: t("settlementBills.adjustmentConfirmTitle", { defaultValue: "确认创建补差/冲正单？" }),
      description: t("settlementBills.adjustmentConfirmDescription", {
        defaultValue: "提交后会生成独立调账单，需要后续确认与收付；请确认正负方向和原因无误。",
      }),
      confirmLabel: t("settlementBills.createAdjustment", { defaultValue: "创建补差单" }),
      confirmVariant: amount < 0 ? "destructive" : "default",
      onConfirm: async () => {
        try {
          await postSettlementBillAdjustment(billId, {
            amount,
            adjustment_type: amount < 0 ? "reversal" : "adjustment",
            reason,
            idempotency_key: idempotencyKey,
          });
          adjustmentIdempotencyKeyRef.current = null;
          setAdjustAmount("");
          setAdjustReason("");
          toast.success(t("settlementBills.adjustmentCreated", { defaultValue: "已创建补差单" }));
          await onUpdated?.();
        } catch (err: unknown) {
          showActionError(
            err,
            t("settlementBills.adjustmentFailed", { defaultValue: "创建补差单失败" }),
          );
        }
      },
    });
  };

  return (
    <>
    <ConfirmDialog />
    <div className="flex flex-col gap-5 text-sm">
      <div className="flex flex-col gap-3 rounded-xl border border-primary/20 bg-primary/5 p-4 shadow-sm sm:flex-row sm:items-center sm:justify-between">
        <div className="min-w-0">
          <p className="font-semibold tracking-tight text-primary">{primaryAction.title}</p>
          <p className="mt-1 text-xs leading-relaxed text-muted-foreground">{primaryAction.description}</p>
        </div>
        {primaryAction.button && primaryAction.onClick ? (
          <Button
            type="button"
            size="sm"
            className="w-full shrink-0 sm:w-auto"
            onClick={primaryAction.onClick}
          >
            {primaryAction.button}
          </Button>
        ) : null}
      </div>
      <SettlementBillSummaryHeader bill={bill} currencyCode={currencyCode} />
      <SettlementBillAmountBreakdown
        bill={bill}
        currencyCode={currencyCode}
        downlineShares={downlineShares}
      />

      {payments.length > 0 ? (
        <div className="space-y-2 rounded-xl border border-border/70 p-4">
          <p className="font-medium">
            {t("settlementBills.paymentsHistory", { defaultValue: "收付记录" })}
          </p>
          <ul className="space-y-1.5 text-muted-foreground">
            {payments.map((p) => (
              <li key={p.id} className="flex justify-between gap-2">
                <span>
                  {p.method
                    ? `${p.method}`
                    : t("settlementCenter:billDisplay.payment", { defaultValue: "收付" })}
                  {p.remark ? ` · ${p.remark}` : ""}
                </span>
                <span className="shrink-0 tabular-nums">
                  {formatDashboardMoneyMinor(p.amount, currencyCode)}
                </span>
              </li>
            ))}
          </ul>
        </div>
      ) : null}

      {rebateAllocations.length > 0 ? (
          <div className="space-y-3 rounded-xl border border-border/70 bg-card p-5 shadow-sm">
            <div className="flex items-baseline justify-between">
              <p className="font-semibold tracking-tight">
                {t("settlementBills.rebateAllocations", { defaultValue: "回水分摊" })}
              </p>
              <span className="text-xs text-muted-foreground/70">
                {t("settlementCenter:billDisplay.rebateAllocationsHint", {
                  defaultValue: "各层级承担明细",
                })}
              </span>
            </div>

            {/* 汇总表格 */}
            <div className="rounded-lg border border-border/50 overflow-hidden">
              <table className="w-full text-sm">
                <thead>
                  <tr className="bg-muted/30 text-xs text-muted-foreground">
                    <th className="px-3 py-1.5 text-left font-medium">
                      {t("settlementCenter:billDisplay.rebateAllocParticipant", { defaultValue: "参与方" })}
                    </th>
                    <th className="px-3 py-1.5 text-right font-medium">
                      {t("settlementCenter:billDisplay.rebateAllocRate", { defaultValue: "占成" })}
                    </th>
                    <th className="px-3 py-1.5 text-right font-medium">
                      {t("settlementCenter:billDisplay.rebateAllocAmount", { defaultValue: "分摊金额" })}
                    </th>
                  </tr>
                </thead>
                <tbody>
                  {rebateAllocationSummary.map((row) => {
                    const pct = rebateTotalAmount > 0
                      ? Math.round((row.amount / rebateTotalAmount) * 100)
                      : 0;
                    return (
                      <tr key={row.key} className="border-t border-border/40">
                        <td className="px-3 py-2 font-medium text-foreground">{row.label}</td>
                        <td className="px-3 py-2 text-right tabular-nums text-muted-foreground">
                          {row.shareRate > 0 ? `${row.shareRate}%` : "—"}
                        </td>
                        <td className="px-3 py-2 text-right tabular-nums text-foreground">
                          {formatDashboardMoneyMinor(row.amount, currencyCode)}
                          <span className="ml-1 text-xs text-muted-foreground/60">({pct}%)</span>
                        </td>
                      </tr>
                    );
                  })}
                  {rebateAllocationSummary.length > 1 ? (
                    <tr className="border-t border-border/60 bg-muted/20">
                      <td className="px-3 py-1.5 text-xs font-medium text-muted-foreground">
                        {t("settlementCenter:billDisplay.rebateAllocTotal", { defaultValue: "合计" })}
                      </td>
                      <td className="px-3 py-1.5" />
                      <td className="px-3 py-1.5 text-right text-xs font-semibold tabular-nums text-foreground">
                        {formatDashboardMoneyMinor(rebateTotalAmount, currencyCode)}
                      </td>
                    </tr>
                  ) : null}
                </tbody>
              </table>
            </div>

            {/* 按注单分组展开 */}
            {rebateDetailByTicket.length > 1 ? (
              <>
                <button
                  type="button"
                  className="text-xs font-medium text-primary underline-offset-4 hover:underline"
                  onClick={() => setRebateDetailsOpen((open) => !open)}
                >
                  {rebateDetailsOpen
                    ? t("settlementCenter:billDisplay.hideRawRebateAllocations", {
                        defaultValue: "收起按注单明细",
                      })
                    : t("settlementCenter:billDisplay.showRawRebateAllocations", {
                        defaultValue: "展开按注单明细 ({{count}})",
                        count: rebateDetailByTicket.length,
                      })}
                </button>

                {rebateDetailsOpen ? (
                  <div className="max-h-[320px] space-y-2 overflow-y-auto rounded-lg border border-dashed border-border/70 p-3">
                    {rebateDetailByTicket.map((group, idx) => (
                      <div key={group.rebateRecordId} className="space-y-1 rounded-md bg-muted/10 p-2">
                        <p className="text-[11px] font-medium text-muted-foreground/70">
                          {t("settlementCenter:billDisplay.rebateAllocTicket", { defaultValue: "注单" })} #{idx + 1}
                        </p>
                        {group.rows.map((row) => (
                          <div key={row.id} className="flex justify-between gap-2 text-xs text-muted-foreground">
                            <span>
                              {row.participant_label ?? (row.participant_type === 'platform' ? 'Platform' : `#${row.participant_id}`)}
                              {row.actual_share_rate > 0 ? (
                                <span className="ml-1 text-muted-foreground/50">({row.actual_share_rate}%)</span>
                              ) : null}
                            </span>
                            <span className="shrink-0 tabular-nums text-foreground">
                              {formatDashboardMoneyMinor(row.allocated_amount, currencyCode)}
                            </span>
                          </div>
                        ))}
                      </div>
                    ))}
                  </div>
                ) : null}
              </>
            ) : null}
          </div>
        ) : null}

      {canOperateBill && bill.status === "pending_confirm" ? (
        <div
          ref={confirmRef}
          className="space-y-3 rounded-xl border border-primary/20 bg-primary/5 p-5 shadow-sm"
        >
          <p className="font-semibold tracking-tight text-primary">
            {t("settlementBills.confirm", { defaultValue: "确认账单" })}
          </p>
          <Button
            type="button"
            className="w-full sm:w-auto sm:min-w-[10rem]"
            disabled={confirmBusy}
            onClick={requestConfirmBill}
          >
            {t("settlementBills.confirm", { defaultValue: "确认账单" })}
          </Button>
        </div>
      ) : null}

      {canOperateBill && ["confirmed", "partial_paid", "overdue"].includes(bill.status) && bill.unpaid_amount > 0 ? (
          <div
            ref={paymentRef}
            className="space-y-4 rounded-xl border border-border/70 bg-card p-5 shadow-sm"
          >
            <div className="space-y-2">
              <div className="flex flex-wrap items-center justify-between gap-2">
                <p className="font-semibold tracking-tight">{paymentTitle}</p>
                <span className="rounded-full bg-amber-500/10 px-2.5 py-0.5 text-xs font-medium text-amber-600 dark:bg-amber-500/20 dark:text-amber-400">
                  {t("settlementCenter:columns.unpaid", { defaultValue: "未结" })}{" "}
                  {formatDashboardMoneyMinor(bill.unpaid_amount, currencyCode)}
                </span>
              </div>
              <div className="flex flex-wrap items-center gap-1 text-[13px] text-muted-foreground">
                <span className="font-medium text-foreground/80">{direction.payer}</span>
                <ArrowRight className="size-3.5 shrink-0" aria-hidden />
                <span className="font-medium text-foreground/80">{direction.payee}</span>
              </div>
            </div>
            <div className="grid gap-4 mt-2">
              <div className="space-y-1.5">
                <Label className="text-muted-foreground">{t("settlementBills.paymentAmount", { defaultValue: "收付金额" })}</Label>
                <Input
                  value={payAmount}
                  onChange={(e) => setPayAmount(e.target.value)}
                  inputMode="decimal"
                  placeholder={formatAdminMinorDecimal(bill.unpaid_amount, currencyCode)}
                  className="bg-background/50 transition-colors focus:bg-background"
                />
              </div>
              <div className="space-y-1.5">
                <Label className="text-muted-foreground">{t("settlementBills.paymentMethod", { defaultValue: "收付方式" })}</Label>
                <Input
                  value={payMethod}
                  onChange={(e) => setPayMethod(e.target.value)}
                  placeholder={t("settlementBills.paymentMethodPlaceholder", {
                    defaultValue: "例如：现金 / 银行转账",
                  })}
                  className="bg-background/50 transition-colors focus:bg-background"
                />
              </div>
              <div className="space-y-1.5">
                <Label className="text-muted-foreground">{t("settlementBills.paymentProof", { defaultValue: "凭证/备注" })}</Label>
                <Input
                  value={payProof}
                  onChange={(e) => setPayProof(e.target.value)}
                  placeholder={t("settlementBills.paymentProofPlaceholder", {
                    defaultValue: "可填写流水号、截图说明或备注",
                  })}
                  className="bg-background/50 transition-colors focus:bg-background"
                />
              </div>
            </div>
            <Button
              type="button"
              className="w-full mt-2"
              disabled={confirmBusy}
              onClick={requestPayment}
            >
              {paymentSubmit}
            </Button>
          </div>
        ) : null}

      {canWriteOff || (canFinanceAdjustments && locked) ? (
        <div className="rounded-xl border border-dashed border-border/70">
          <button
            type="button"
            className="flex w-full items-center justify-between px-4 py-3 text-left text-sm font-medium"
            onClick={() => setAdvancedOpen((open) => !open)}
          >
            {t("settlementCenter:billDisplay.advancedActions", {
              defaultValue: "调账 / 坏账",
            })}
            <span className="text-xs text-muted-foreground">{advancedOpen ? "−" : "+"}</span>
          </button>
          {advancedOpen ? (
            <div className="space-y-4 border-t border-border/70 px-4 py-4">
              {canWriteOff ? (
                <div className="space-y-3 rounded-lg border border-destructive/20 bg-destructive/5 p-4">
                  <p className="font-medium text-destructive">
                    {t("settlementBills.badDebtWriteOff", { defaultValue: "坏账核销" })}
                  </p>
                  <div className="space-y-1.5">
                    <Label className="text-destructive/90">
                      {t("settlementBills.badDebtReason", { defaultValue: "核销原因" })}
                    </Label>
                    <Input
                      value={badDebtReason}
                      onChange={(e) => setBadDebtReason(e.target.value)}
                      placeholder={t("settlementBills.badDebtReasonPlaceholder", {
                        defaultValue: "例如：客户失联、确认坏账",
                      })}
                      className="border-destructive/30"
                    />
                  </div>
                  <Button
                    type="button"
                    variant="destructive"
                    size="sm"
                    disabled={confirmBusy}
                    onClick={requestBadDebtWriteOff}
                  >
                    {t("settlementBills.confirmBadDebt", { defaultValue: "确认核销" })}
                  </Button>
                </div>
              ) : null}
              {canFinanceAdjustments && locked ? (
                <div className="space-y-3">
                  <p className="font-medium">
                    {t("settlementBills.adjustment", { defaultValue: "补差/冲正单" })}
                  </p>
                  <div className="space-y-1.5">
                    <Label className="text-muted-foreground">
                      {t("settlementBills.adjustmentAmount", { defaultValue: "调整金额（可负）" })}
                    </Label>
                    <Input
                      value={adjustAmount}
                      onChange={(e) => setAdjustAmount(e.target.value)}
                      inputMode="decimal"
                      placeholder={t("settlementBills.adjustmentAmountPlaceholder", {
                        defaultValue: "例如：35.20 或 -10.00",
                      })}
                    />
                  </div>
                  <div className="space-y-1.5">
                    <Label className="text-muted-foreground">
                      {t("settlementBills.adjustmentReason", { defaultValue: "调整原因" })}
                    </Label>
                    <Input
                      value={adjustReason}
                      onChange={(e) => setAdjustReason(e.target.value)}
                      placeholder={t("settlementBills.adjustmentReasonPlaceholder", {
                        defaultValue: "例如：人工复核补差、冲正错账",
                      })}
                    />
                  </div>
                  <Button
                    type="button"
                    variant="outline"
                    size="sm"
                    disabled={confirmBusy}
                    onClick={requestAdjustment}
                  >
                    {t("settlementBills.createAdjustment", { defaultValue: "创建补差单" })}
                  </Button>
                </div>
              ) : null}
            </div>
          ) : null}
        </div>
      ) : null}
    </div>
    </>
  );
}
