import { formatCurrency } from '@/utils/format';
import { ProCard } from '@ant-design/pro-components';

type IInvoicerStatisticCardProps = {
	/** 开票方统计 */
	title: string;
	/** 车次 */
	count: number;
	/** 金额 */
	amount: number;
	/** 颜色 */
	color: string;
};
/** 开票方统计卡片组件 */
export default function InvoicerStatisticCard(
	props: IInvoicerStatisticCardProps,
) {
	const { title, count, amount, color } = props;
	return (
		<ProCard bordered style={{ backgroundColor: color + '10' }}>
			<div style={{ fontSize: 14, fontWeight: 500, marginBottom: 8, color }}>
				{title}
			</div>
			<div style={{ display: 'flex', justifyContent: 'space-between' }}>
				<div>
					<div style={{ fontSize: 12, color: '#999' }}>车次</div>
					<div style={{ fontSize: 20, fontWeight: 600 }}>{count}</div>
				</div>
				<div style={{ textAlign: 'right' }}>
					<div style={{ fontSize: 12, color: '#999' }}>开票金额</div>
					<div style={{ fontSize: 20, fontWeight: 600 }}>
						{formatCurrency(amount)}
					</div>
				</div>
			</div>
		</ProCard>
	);
}
