import type React from 'react'; import type { CSSProperties } from 'react'; /** * Total 区块下的单行项,支持多层级嵌套(如 Subtotal、Tax、Fee、Surcharge、Discount 等) */ export interface FinancialSummaryLineItem { /** 行标题 */ label: React.ReactNode; /** 金额,缺失时展示占位符(如 "—") */ value?: number | null; /** 子级明细 */ children?: FinancialSummaryLineItem[]; /** 稳定 key,建议传入以保证展开态稳定 */ key?: React.Key; /** 展示在 label 旁边的条目数,如 "3 items" */ itemsCount?: React.ReactNode; /** 提示 icon 的 tooltip 内容 */ infoTooltip?: React.ReactNode; } /** Collapse Body 单行(Figma 14256:5103 明细行:描述 + 金额 + 操作按钮) */ export interface FinancialSummaryCollapseBodyRow { label: React.ReactNode; amount?: React.ReactNode; action?: { label: React.ReactNode; onClick?: () => void; }; } /** * 支付记录项,作为「付款历史」下的明细行(label 可为 methodName · time 等) */ export interface FinancialSummaryPaymentItem { key?: React.Key; /** 支付方式名称(非 Collapse 模式或 bodyRows 未传时使用) */ methodName?: string; /** 支付金额 */ amount: number; /** 支付时间,可选(Collapse 头部) */ time?: string; /** 日期,可选(Collapse 头部,如 "30/08/2025") */ date?: string; /** 客户/操作人(Collapse 头部,如 "Customer" / "Staff: Jenny") */ customer?: React.ReactNode; /** 渠道/终端(Collapse 头部,如 "Online Store" / "Terminal 1100") */ channel?: React.ReactNode; /** 额外明细 */ detail?: React.ReactNode; /** Collapse 展开后 body 行(不传则用 methodName + amount 生成一行) */ bodyRows?: FinancialSummaryCollapseBodyRow[]; } /** * 退款记录项,作为「退款」下的明细行 */ export interface FinancialSummaryRefundItem { key?: React.Key; /** 退款说明 */ label?: React.ReactNode; /** 退款金额 */ amount: number; /** 退款时间,可选 */ time?: string; date?: string; customer?: React.ReactNode; channel?: React.ReactNode; /** 额外明细 */ detail?: React.ReactNode; /** Collapse body 行 */ bodyRows?: FinancialSummaryCollapseBodyRow[]; } /** * Total 区块数据结构 */ export interface FinancialSummaryTotalBlock { /** Total 汇总值,可选(可由子项聚合) */ value?: number | null; /** Total 下明细,支持多层级 */ children?: FinancialSummaryLineItem[]; } /** * 组件入参数据:Balance Due + Total + Paid + Refund */ export interface FinancialSummaryData { /** 最终应付金额,null 时显示占位符 */ balanceDue: number | null; /** Total 区块,无数据或不展示时可省略 */ total?: FinancialSummaryTotalBlock; /** 支付记录,无数据时不展示 Paid 区块 */ paid?: FinancialSummaryPaymentItem[]; /** 退款记录,无数据时不展示 Refund 区块 */ refund?: FinancialSummaryRefundItem[]; } /** * 金额格式化选项(与 @pisell/utils formatAmountWithOptions 对齐) */ export interface FinancialSummaryAmountFormatOptions { /** 货币符号,默认 '' */ currencySymbol?: string; /** 小数位数,默认 2 */ amountPrecision?: number; /** 是否使用千分位分隔符 */ useThousandsSeparator?: boolean; /** 整数是否隐藏 .00 */ hideDecimalForWholeNumbers?: boolean; } /** * PisellFinancialSummary 组件 Props */ export interface PisellFinancialSummaryProps extends FinancialSummaryAmountFormatOptions { /** 资金汇总数据 */ data: FinancialSummaryData; /** 是否显示 Total 区块,默认 true */ showTotal?: boolean; /** 是否显示 Paid 区块,默认 true */ showPaid?: boolean; /** 是否显示 Refund 区块,默认 true */ showRefund?: boolean; /** 是否在 label 旁显示 N items,默认 true */ showItemsCount?: boolean; /** 是否显示提示 icon,默认 true */ showInfoIcon?: boolean; /** 是否隐藏金额为 0 的行,默认 false */ hideZeroAmountRows?: boolean; /** 覆盖「Balance due」等多语言标题 */ titleBalanceDue?: React.ReactNode; /** 覆盖「Total」标题 */ titleTotal?: React.ReactNode; /** 覆盖「Paid」标题 */ titlePaid?: React.ReactNode; /** 覆盖「Refund」标题 */ titleRefund?: React.ReactNode; /** 数据缺失时展示的占位内容,默认 "—" */ missingValuePlaceholder?: React.ReactNode; /** 默认展开层级(0=仅首行,2=展开到二级见明细,3=展开到三级),默认 0 */ defaultExpandedLevel?: number; /** 根节点类名 */ className?: string; /** 根节点样式 */ style?: CSSProperties; }