import React from 'react';
import { Modal, Form, Input, InputNumber, Select, Radio, Table, DatePicker, Space, Row, Col, Card } from 'kts-components-antd-x4';
import type { ColumnsType } from 'kts-components-antd-x4/es/table';
import { Button } from 'kts-xui';
import { v4 as uuidv4 } from 'uuid';
import moment from 'moment';
import './index.less';

/** 合计行 */
export interface IDifferenceTotal {
    /** 凭证合计金额总计 */
    voucherTotal: number;

    /** 本次扣除金额总计 */
    deductTotal: number;
}

/** 明细行 */
export interface IDifferenceRow {

    /** 唯一标识 */
    $index?: string;

    /** 合计金额 */
    voucherTotalAmt?: number;

    /** 本次扣除金额 */
    currentDeductAmt?: number;

    /** 凭证类型 */
    voucherType?: string;

    /** 凭证号码 */
    deductVoucherNo?: string;

    /** 开具日期 */
    issueDate?: string;

    /** 备注 */
    remark?: string;

    /** 来源 */
    source?: string;
}

export interface IData {

    /** 申报项目代码 */
    projectCode?: string;

    /** 凭证合计金额总计 */
    voucherTotal: number;

    /** 本次扣除金额总计 */
    deductTotal: number;

    /** 明细数据 */
    rows?: IDifferenceRow[];
}

export interface IDifferenceInputModalProps {
    /** 是否可见 */
    open?: boolean;

    /** 合计 */
    total?: IDifferenceTotal;

    /** 点击取消 */
    onCancel?: () => void;

    value?: IData;

    /** 点击确定 */
    onOk?: (data: IData) => void;
}

/** 数据来源枚举 */
export enum DataSrcEnum {
    /** 手工录入 */
    MANUAL = 1,
    /** 勾选录入 */
    CHECK = 2,
    /** 模板录入 */
    TEMPLATE = 3,
}

export const dataSrcOptions = [
    { value: DataSrcEnum.MANUAL, label: '手工录入' },
    { value: DataSrcEnum.CHECK, label: '勾选录入' },
    { value: DataSrcEnum.TEMPLATE, label: '模板录入' },
];

/** 静态的表格列定义（表头按参考图，待确认） */
const columns: ColumnsType<IDifferenceRow> = [
    { title: '序号', dataIndex: 'sortNumber', key: 'sortNumber', width: 55, fixed: 'left', render: (text, record, index) => index + 1 },
    { title: '合计金额', dataIndex: 'voucherTotalAmt', key: 'voucherTotalAmt', width: 90, align: 'right', render: (text) => text ? text.toFixed(2) : '0.00' },
    { title: '扣除金额', dataIndex: 'currentDeductAmt', key: 'currentDeductAmt', width: 90, align: 'right', render: (text) => text ? text.toFixed(2) : '0.00' },
    { title: '凭证类型', dataIndex: 'voucherType', key: 'voucherType', width: 110, render: (text) => voucherTypeOptions.find((item) => item.value === text)?.label },
    // { title: '数电票号码', dataIndex: 'xxx', key: 'xxx', width: 110 },
    { title: '凭证代码', dataIndex: 'deductVoucherCode', key: 'deductVoucherCode', width: 80 },
    // { title: '发票号码', dataIndex: 'invoiceNumber', key: 'invoiceNumber', width: 80 },
    { title: '凭证号码', dataIndex: 'deductVoucherNo', key: 'deductVoucherNo', width: 80 },
    { title: '开具日期', dataIndex: 'issueDate', key: 'issueDate', width: 120, render: (text) => text ? moment(text).format('YYYY-MM-DD') : '' },
    { title: '备注', dataIndex: 'remark', key: 'remark', width: 80 },
    { title: '来源', dataIndex: 'dataSrc', key: 'dataSrc', width: 80, render: (text) => dataSrcOptions.find((item) => item.value === text)?.label },
];

/** 凭证类型候枚举 */
enum VoucherType {
    /** 专用发票 */
    SPECIAL_INVOICE = '10',
    /** 普通发票 */
    COMMON_INVOICE = '11',
    /** 海关进口增值税专用缴款书 */
    CUSTOMS_IMPORT_VAT_PAYMENT_BOOK = '12',
    /** 航空运输电子客票行程单 */
    AIR_TRANSPORT_ELECTRONIC_TICKET = '13',
    /** 铁路电子客票 */
    RAILWAY_ELECTRONIC_TICKET = '14',
    /** 税收完税证明（契税） */
    TAX_PAYMENT_CERTIFICATE = '15',
    /** 中央非税收入统一票据（土地出让金） */
    CENTRAL_NON_TAX_REVENUE_UNIFIED_RECEIPT = '16',
    /** 财政票据 */
    FINANCIAL_BILL = '05',
    /** 法院裁决书 */
    COURT_DECISION = '06',
    /** 其他扣除凭证 */
    OTHER_DEDUCTION_VOUCHER = '09',
}

/** 凭证类型候选项 */
const voucherTypeOptions = [
    { value: VoucherType.SPECIAL_INVOICE, label: '专用发票' },
    { value: VoucherType.COMMON_INVOICE, label: '普通发票' },
    { value: VoucherType.CUSTOMS_IMPORT_VAT_PAYMENT_BOOK, label: '海关进口增值税专用缴款书' },
    { value: VoucherType.AIR_TRANSPORT_ELECTRONIC_TICKET, label: '航空运输电子客票行程单' },
    { value: VoucherType.RAILWAY_ELECTRONIC_TICKET, label: '铁路电子客票' },
    { value: VoucherType.TAX_PAYMENT_CERTIFICATE, label: '税收完税证明（契税）' },
    { value: VoucherType.CENTRAL_NON_TAX_REVENUE_UNIFIED_RECEIPT, label: '中央非税收入统一票据（土地出让金）' },
    { value: VoucherType.FINANCIAL_BILL, label: '财政票据' },
    { value: VoucherType.COURT_DECISION, label: '法院裁决书' },
    { value: VoucherType.OTHER_DEDUCTION_VOUCHER, label: '其他扣除凭证' },
];

/** 凭证类型候 - 规则字典 */
const voucherTypeRules: Record<string, Record<string, { required: boolean }[]>> = {
    // 专用发票
    [VoucherType.SPECIAL_INVOICE]: {
        'deductVoucherNo': [{ required: true }],
        'issueDate': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 普通发票
    [VoucherType.COMMON_INVOICE]: {
        'deductVoucherNo': [{ required: true }],
        'issueDate': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 海关进口增值税专用缴款书
    [VoucherType.CUSTOMS_IMPORT_VAT_PAYMENT_BOOK]: {
        'deductVoucherNo': [{ required: true }],
        'issueDate': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 航空运输电子客票行程单
    [VoucherType.AIR_TRANSPORT_ELECTRONIC_TICKET]: {
        'deductVoucherNo': [{ required: true }],
        'issueDate': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 铁路电子客票
    [VoucherType.RAILWAY_ELECTRONIC_TICKET]: {
        'deductVoucherNo': [{ required: true }],
        'issueDate': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 税收完税证明（契税）
    [VoucherType.TAX_PAYMENT_CERTIFICATE]: {
        'deductVoucherNo': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 中央非税收入统一票据（土地出让金）
    [VoucherType.CENTRAL_NON_TAX_REVENUE_UNIFIED_RECEIPT]: {
        'deductVoucherCode': [{ required: true }],
        'deductVoucherNo': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 财政票据
    [VoucherType.FINANCIAL_BILL]: {
        'deductVoucherNo': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 法院裁决书
    [VoucherType.COURT_DECISION]: {
        'deductVoucherNo': [{ required: true }],
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
    },

    // 其他扣除凭证
    [VoucherType.OTHER_DEDUCTION_VOUCHER]: {
        'voucherTotalAmt': [{ required: true }],
        'currentDeductAmt': [{ required: true }],
        'remark': [{ required: true }],
    },
}


/** 静态的申报项目名称候选项 */
const projectOptions = [
    { value: 'KC0209', label: '小规模纳税人销售其取得(不含自建)的不动产(不含个人销售购买的住房)' },
    { value: 'KC0210', label: '一般纳税人销售其取得(不含自建)的2016年4月30日前取得的不动产' },
    { value: 'KC0211', label: '房地产开发企业销售房地产项目' },
    { value: 'KC0212', label: '银行业金融机构、金融资产管理公司中的增值税一般纳税人处置抵债不动产' },
];

/**
 * 差额录入弹窗（静态）
 */
export function DifferenceInputModal(props: IDifferenceInputModalProps) {
    const { open = true, onCancel, onOk } = props;
    const [form] = Form.useForm();
    const [dataSource, setDataSource] = React.useState<IDifferenceRow[]>([]);
    const voucherType: VoucherType = Form.useWatch('voucherType', form) || form.getFieldValue('voucherType');
    const [projectCode, setProjectCode] = React.useState<string>('');

    /** 扣除额 (明细汇总) */
    const deductTotal = React.useMemo(() => {
        return dataSource.reduce((acc, curr) => acc + (curr.currentDeductAmt || 0), 0);
    }, [dataSource]);

    /** 合计金额（明细汇总） */
    const voucherTotal = React.useMemo(() => {
        return dataSource.reduce((acc, curr) => acc + (curr.voucherTotalAmt || 0), 0);
    }, [dataSource]);

    const total = props.total || { voucherTotal: 0, deductTotal: 0 };

    const onFinish = React.useCallback((values: any) => {
        setDataSource([...dataSource, { ...values, $index: uuidv4(), dataSrc: DataSrcEnum.MANUAL }]);
        form.resetFields();
    }, [dataSource, form]);

    React.useEffect(() => {
        console.log('DifferenceInputModal props.value ===>', props.value)
        if (open) {
            form.resetFields();
            setDataSource(props.value?.rows || []);
            setProjectCode(props.value?.projectCode || '');
        }
    }, [open, props.value]);

    return (
        <Modal
            title="差额录入"
            destroyOnClose={true}
            width={1000}
            open={open}
            onCancel={onCancel}
            footer={
                <Space align="end" className="kts-difference-modal-footer">
                    <Button onClick={onCancel}>取消</Button>
                    <Button type="primary" onClick={() => onOk?.({ voucherTotal, deductTotal, rows: dataSource, projectCode })}>
                        确定
                    </Button>
                </Space>
            }
        >
            <div className="kts-difference-modal">
                {/* 顶部：含税销售额、扣除额、申报项目名称 */}
                <div className="kts-difference-modal-top">
                    <Form layout='horizontal' className="kts-difference-modal-top-form" labelCol={{ flex: '100px' }}>
                        <Row>
                            <Col span={12} >
                                <Form.Item label="含税销售额" className="kts-difference-modal-item">
                                    <InputNumber style={{ width: '100%' }} disabled placeholder="请输入含税销售额" value={voucherTotal || 0} />
                                </Form.Item>
                            </Col>

                            <Col span={12} >
                                <Form.Item label="扣除额" className="kts-difference-modal-item">
                                    <InputNumber style={{ width: '100%' }} disabled placeholder="请输入扣除额" value={deductTotal || 0} />
                                </Form.Item>
                            </Col>

                            <Col span={24} >
                                <Form.Item label="申报项目名称" className="kts-difference-modal-item">
                                    <Select options={projectOptions} placeholder="请选择申报项目名称"
                                        onChange={(value) => { setProjectCode(value) }}
                                        value={projectCode}
                                    />
                                </Form.Item>
                            </Col>

                            <Col span={24} >
                                <Form.Item label="录入方式" className="kts-difference-modal-item">
                                    <Radio.Group
                                        value={'manual'}
                                        optionType='button'
                                        options={[
                                            { label: '手工录入', value: 'manual' },
                                            { label: '勾选录入', value: '1', disabled: true },
                                            { label: '模板录入', value: '2', disabled: true },
                                        ]}
                                    />
                                </Form.Item>
                            </Col>
                        </Row>
                    </Form>
                </div>

                {/* 凭证明细录入 */}
                <Card className="kts-difference-modal-form" bodyStyle={{ padding: '20px 20px 10px 0' }} >
                    <Form form={form} layout="horizontal" labelCol={{ flex: '110px' }} onFinish={onFinish}>
                        <Row className="kts-difference-modal-row">
                            <Col span={24 / 3} >
                                <Form.Item name='voucherType' label="凭证类型" className="kts-difference-modal-cell" rules={[{ required: true, message: '请选择凭证类型' }]}>
                                    <Select options={voucherTypeOptions} placeholder="请选择凭证类型" />
                                </Form.Item>
                            </Col>

                            {/* <Col span={24 / 3} >
                                <Form.Item name='' label="数电票号码" className="kts-difference-modal-cell" >
                                    <Input placeholder="请输入数电票号码" />
                                </Form.Item>
                            </Col> */}

                            <Col span={24 / 3} >
                                <Form.Item name='issueDate' label="开具时间" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['issueDate']}
                                >
                                    <DatePicker style={{ width: '100%' }} placeholder="请输入开具时间" />
                                </Form.Item>
                            </Col>

                            <Col span={24 / 3} >
                                <Form.Item name='deductVoucherNo' label="凭证号码" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['deductVoucherNo']}
                                >
                                    <Input placeholder="请输入凭证号码" />
                                </Form.Item>
                            </Col>

                            <Col span={24 / 3} >
                                <Form.Item name='deductVoucherCode' label="凭证代码" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['deductVoucherCode']}
                                >
                                    <Input placeholder="请输入凭证代码" />
                                </Form.Item>
                            </Col>

                            {/* <Col span={24 / 3} >
                                <Form.Item name='invoiceNumber' label="发票号码" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['invoiceNumber']}
                                >
                                    <Input placeholder="请输入发票号码" />
                                </Form.Item>
                            </Col> */}

                            <Col span={24 / 3} >
                                <Form.Item name='voucherTotalAmt' label="凭证合计金额" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['voucherTotalAmt']}
                                >
                                    <InputNumber style={{ width: '100%' }} placeholder="请输入凭证合计金额" />
                                </Form.Item>
                            </Col>

                            <Col span={24 / 3} >
                                <Form.Item name='currentDeductAmt' label="本次扣除金额" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['currentDeductAmt']}
                                >
                                    <InputNumber style={{ width: '100%' }} placeholder="请输入本次扣除金额" />
                                </Form.Item>
                            </Col>

                            <Col span={24 / 3} >
                                <Form.Item name='remark' label="备注" className="kts-difference-modal-cell"
                                    rules={voucherTypeRules[voucherType]?.['remark']}
                                >
                                    <Input placeholder="请输入备注" />
                                </Form.Item>
                            </Col>

                            <Col span={24} >
                                <div style={{ display: 'flex', justifyContent: 'center', gap: 10 }} >
                                    <Button type='primary' size='small' onClick={() => form.resetFields()}>清楚</Button>
                                    <Button type='primary' size='small' onClick={() => form.submit()}>添加并继续</Button>
                                </div>
                            </Col>
                        </Row>
                    </Form>
                </Card >

                {/* 合计 */}
                <div className="kts-difference-modal-total" style={{ marginTop: 30 }}>
                    <span className="kts-difference-modal-total-item">
                        凭证合计金额总计：<b>{total.voucherTotal.toFixed(2)}</b> 元
                    </span>
                    <span className="kts-difference-modal-total-item">
                        本次扣除金额总计：<b>{total.deductTotal.toFixed(2)}</b> 元
                    </span>
                </div>

                {/* 明细列表 */}
                <Table
                    className="kts-difference-modal-table"
                    bordered
                    size="small"
                    rowKey="voucherNo"
                    columns={[...columns, {
                        title: '操作',
                        dataIndex: 'action',
                        key: 'action',
                        width: 80,
                        fixed: 'right',
                        render: (text, record) => <Button type='link' size='small' onClick={() => setDataSource(dataSource.filter((item) => item.$index !== record.$index))}>删除</Button>,
                    }]}
                    dataSource={dataSource}
                    scroll={{ x: 1000 }}
                    pagination={{
                        pageSize: 10,
                        total: dataSource.length,
                        showSizeChanger: false,
                        showQuickJumper: false,
                        showTotal: (total) => `共 ${total} 条`,
                    }}
                />
            </div>
        </Modal>
    );
}

export default DifferenceInputModal;