import React, { useEffect, useRef, useState } from "react";
import ProForm, { ProFormSelect, ProFormText, ProFormTextArea } from "@ant-design/pro-form";
import { Col, Drawer, FormInstance, Row, Table, Typography, Space, Button, Empty, Divider, Input, message, Select, Modal, Tooltip, ConfigProvider, DatePicker } from "antd";
import { connect } from "umi";
import { ActionType, ProTable } from "@ant-design/pro-components";
import { handleGetAPPLYAPPROVEList, handleGetBILLDETAILList, handleSynchroBILLDETAILList } from "@/pages/DigitalElectronics/service";
import moment from "moment";
import { encryptAES } from "@/utils/handleAes";
import { exportXlsxFromProColumnsExcelJS } from "@/utils/exportExcelFun";
import { getFieldEnum } from "@/pages/serverpartAssets/service";
import RealEstate from "@/pages/realEstate";
import { handleGetREALESTATEList } from "@/pages/realEstate/service";
import zhCN from 'antd/locale/zh_CN';
import dayjs from "dayjs";
import 'dayjs/locale/zh-cn';
import weekday from "dayjs/plugin/weekday";
import localeData from "dayjs/plugin/localeData";
import customParseFormat from 'dayjs/plugin/customParseFormat';
import updateLocale from 'dayjs/plugin/updateLocale';
dayjs.extend(updateLocale);
dayjs.updateLocale('zh-cn', {
    weekStart: 0,
});
dayjs.extend(weekday);
dayjs.extend(localeData);
dayjs.extend(customParseFormat);
const { Text } = Typography;

interface ConnectState {
    user: { data: any };
}

interface ParamsType {
    showDetail: boolean;
    setShowDetail: (v: boolean) => void;
    parentRow: any;
    setParentRow: (v: any) => void;
    parentTableRef?: any; // 父表格实例
    showType?: string; // 没值 开票审核页面   search 票据查询页面
}


const InvoiceDetail = ({ showDetail, setShowDetail, parentRow, setParentRow, parentTableRef, showType }: ParamsType) => {
    const realEstateRef = useRef<any>();
    const formRef = useRef<FormInstance<any>>();
    const detailActionRef = useRef<ActionType>();

    const { RangePicker } = DatePicker;
    // 保存的加载效果
    const [saveLoading, setSaveLoading] = useState<boolean>(false)
    // 明细表格默认隐藏的内容 
    const [columnsStateMap, setColumnsStateMap] = useState<any>({
        INVOICE_PRICE: { show: false },
        INVOICE_DISCOUNT: { show: false },
    });
    useEffect(() => {
        if (formRef.current) {
            if (parentRow) {
                formRef.current.setFieldsValue(parentRow);
            } else {
                formRef.current.resetFields();
            }
        }
    }, [parentRow]);
    const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
    // 判断是否进入了编辑状态 
    const [isEdit, setIsEdit] = useState(false);
    // 表格数据
    const [tableEditData, setTableEditData] = useState<any>();
    // 税率枚举列表
    const [taxRateList, setTaxRateList] = useState<any>();
    // 不动产信息
    const [realEstateData, setRealEstateData] = useState<any>();
    // 选择不动产的悬浮框
    const [selectRealEstateModal, setSelectRealEstateModal] = useState<any>();
    // 选择的不动产id
    const [selectRealEstateId, setSelectRealEstateId] = useState<any>();
    // 选择不动产的loading
    const [realEstateLoading, setRealEstateLoading] = useState<boolean>(false);
    // 当前发票明细 点击的行的信息
    const [currentRow, setCurrentRow] = useState<any>();
    // 解析不动产的枚举
    const [realEstateEnum, setRealEstateEnum] = useState<any>();
    // 判断当前的发票明细里面 有没有不动产
    const [haveRealEstate, setHaveRealEstate] = useState<boolean>(false)

    const detailColumns: any = [
        {
            title: "序号",
            dataIndex: "index",
            valueType: "index",
            align: 'center',
            width: 70,
            fixed: 'left'
        },
        {
            title: <div style={{ textAlign: 'center' }}>款项名称</div>,
            align: 'left',
            width: 200,
            dataIndex: "ITEM_NAME",
            ellipsis: true,
            fixed: 'left'
        },
        {
            title: <div style={{ textAlign: 'center' }}>税务代码</div>,
            align: 'left',
            width: 180,
            dataIndex: "TABLE_NAME",
            fixed: 'left',
            ellipsis: true,
            render: (_, record) => {
                const currentItem = tableEditData?.find((item: any) => item.BILLDETAIL_ID === record.BILLDETAIL_ID) || record;
                return isEdit ? <Input
                    key={record.BILLDETAIL_ID}
                    defaultValue={currentItem.TABLE_NAME} onBlur={(e: any) => {
                        let value: string = e.target.value || ""
                        let tableData: any = JSON.parse(JSON.stringify(tableEditData))
                        tableData.forEach((item: any) => {
                            if (item.BILLDETAIL_ID === record.BILLDETAIL_ID) {
                                item.TABLE_NAME = value
                            }
                        })
                        setTableEditData(tableData)
                    }} /> : currentItem.TABLE_NAME
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>租赁日期</div>,
            dataIndex: "LEASEDATE",
            width: 200,
            align: 'center',
            hideInTable: !haveRealEstate && showType === 'search',
            render: (_, record) => {
                const currentItem = tableEditData?.find((item: any) => item.BILLDETAIL_ID === record.BILLDETAIL_ID) || record;
                return isEdit ?
                    <ConfigProvider locale={zhCN}>
                        <RangePicker
                            defaultValue={[currentItem?.START_LEASEDATE ? dayjs(currentItem.START_LEASEDATE) : null, currentItem?.END_LEASEDATE ? dayjs(currentItem.END_LEASEDATE) : null]}
                            onChange={(e: any) => {
                                console.log('eee', e);
                                let [start, end] = [moment(e[0].$d).format('YYYY-MM-DD'), moment(e[1].$d).format('YYYY-MM-DD')]
                                console.log('2321321', [start, end]);

                                let tableData: any = JSON.parse(JSON.stringify(tableEditData))
                                console.log('tableDatatableData', tableData);
                                tableData.forEach((item: any) => {
                                    if (item.BILLDETAIL_ID === record.BILLDETAIL_ID) {
                                        item.START_LEASEDATE = start
                                        item.END_LEASEDATE = end
                                    }
                                })
                                setTableEditData(tableData)
                            }}
                        />
                    </ConfigProvider>
                    :
                    `${record?.START_LEASEDATE || ""}${record?.END_LEASEDATE ? `-${record?.END_LEASEDATE}` : ''}`
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>税率</div>,
            align: 'center',
            width: 70,
            fixed: 'left',
            dataIndex: "DUTY_PARAGRAPH",
            render: (_, record) => {
                const currentItem = tableEditData?.find((item: any) => item.BILLDETAIL_ID === record.BILLDETAIL_ID) || record;
                return isEdit ?
                    <Select
                        key={record.BILLDETAIL_ID}
                        style={{ width: '100%' }}
                        defaultValue={currentItem?.DUTY_PARAGRAPH ? currentItem?.DUTY_PARAGRAPH.toString() : ""}
                        options={taxRateList}
                        onChange={(e: any) => {
                            let value: string = e || ""
                            let tableData: any = JSON.parse(JSON.stringify(tableEditData))
                            tableData.forEach((item: any) => {
                                if (item.BILLDETAIL_ID === record.BILLDETAIL_ID) {
                                    item.DUTY_PARAGRAPH = value
                                }
                            })
                            setTableEditData(tableData)
                        }}
                    /> :
                    currentItem?.DUTY_PARAGRAPH ? `${currentItem?.DUTY_PARAGRAPH}%` : ""
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>商品条码</div>,
            align: 'left',
            width: 100,
            fixed: 'left',
            dataIndex: "ITEM_ID",
            ellipsis: true
        },
        {
            title: <div style={{ textAlign: 'center' }}>规格型号</div>,
            align: 'center',
            width: 80,
            dataIndex: "ITEM_RULE",
            ellipsis: true,
            render: (_, record) => {
                const currentItem = tableEditData?.find((item: any) => item.BILLDETAIL_ID === record.BILLDETAIL_ID) || record;
                return isEdit ? <Input
                    key={record.BILLDETAIL_ID}
                    defaultValue={currentItem.ITEM_RULE} onBlur={(e: any) => {
                        let value: string = e.target.value || ""
                        let tableData: any = JSON.parse(JSON.stringify(tableEditData))
                        tableData.forEach((item: any) => {
                            if (item.BILLDETAIL_ID === record.BILLDETAIL_ID) {
                                item.ITEM_RULE = value
                            }
                        })
                        setTableEditData(tableData)
                    }} /> : currentItem.ITEM_RULE
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>计量单位</div>,
            align: 'center',
            width: 80,
            dataIndex: "ITEM_UNIT",
            ellipsis: true,
            render: (_, record) => {
                const currentItem = tableEditData?.find((item: any) => item.BILLDETAIL_ID === record.BILLDETAIL_ID) || record;
                return isEdit ? <Input
                    key={record.BILLDETAIL_ID}
                    defaultValue={currentItem.ITEM_UNIT} onBlur={(e: any) => {
                        let value: string = e.target.value || ""
                        let tableData: any = JSON.parse(JSON.stringify(tableEditData))
                        tableData.forEach((item: any) => {
                            if (item.BILLDETAIL_ID === record.BILLDETAIL_ID) {
                                item.ITEM_UNIT = value
                            }
                        })
                        setTableEditData(tableData)
                    }} /> : currentItem.ITEM_UNIT
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>数量</div>,
            align: 'right',
            width: 60,
            valueType: 'digit',
            dataIndex: "INVOICE_COUNT"
        },
        {
            title: <div style={{ textAlign: 'center' }}>单价</div>,
            align: 'right',
            width: 80,
            valueType: 'digit',
            dataIndex: "INVOICE_PRICE"
        },
        {
            title: <div style={{ textAlign: 'center' }}>金额</div>,
            align: 'right',
            width: 80,
            valueType: 'digit',
            dataIndex: "INVOICE_AMOUNT"
        },
        {
            title: <div style={{ textAlign: 'center' }}>税额</div>,
            align: 'right',
            width: 80,
            valueType: 'digit',
            dataIndex: "INVOICE_TAX"
        },
        {
            title: <div style={{ textAlign: 'center' }}>折扣</div>,
            align: 'center',
            width: 80,
            dataIndex: "INVOICE_DISCOUNT"
        },
        {
            title: "不动产",
            dataIndex: "option",
            width: 70,
            align: 'center',
            hideInTable: !haveRealEstate && showType === 'search',
            render: (_: any, record: any) => {
                return record?.REALESTATE_ID ?
                    <a onClick={() => {
                        setCurrentRow(record)
                        setSelectRealEstateId([Number(record?.REALESTATE_ID)])
                        setSelectRealEstateModal(true)
                    }}>
                        {realEstateEnum && realEstateEnum[record?.REALESTATE_ID] ? realEstateEnum[record?.REALESTATE_ID] : record?.REALESTATE_ID}
                    </a> : showType === 'search' ? '' :
                        <Tooltip title={"选择不动产"}>
                            <Button type={'primary'} onClick={async () => {
                                console.log('选择不动产', record);
                                console.log('票据信息', parentRow);

                                setCurrentRow(record)
                                setSelectRealEstateModal(true)
                            }}>+</Button>
                        </Tooltip>

            }
        }
        // {
        //     title: <div style={{ textAlign: 'center' }}>操作时间</div>,
        //     align: 'center',
        //     width: 150,
        //     dataIndex: "OPERATE_DATE",
        //     render: (_, record) => {
        //         return record?.OPERATE_DATE ? moment(record?.OPERATE_DATE).format('YYYY-MM-DD HH:mm:ss') : ""
        //     }
        // },
    ];

    const approveColumns: any = [
        {
            title: <div style={{ textAlign: 'center' }}>环节名称</div>,
            width: 200,
            align: 'center',
            dataIndex: "ACTINST_NAME",
        },
        {
            title: <div style={{ textAlign: 'center' }}>票据状态</div>,
            width: 150,
            dataIndex: "APPROVE_STATE",
            align: 'center',
            valueType: 'select',
            fieldProps: {
                options: [
                    { label: "填写中", value: 1000 },
                    { label: "待审核", value: 2000 },
                    { label: "开票中", value: 9000 },
                    { label: "手动开票", value: 9100 },
                    { label: "已开票", value: 9200 },
                    { label: "红冲申请中", value: 9990 },
                    { label: "已红冲", value: 9999 }
                ]
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>审批人</div>,
            dataIndex: "STAFF_NAME",
            align: 'center',
            width: 150,
        },
        {
            title: <div style={{ textAlign: 'center' }}>审批时间</div>,
            dataIndex: "APPROVE_DATE",
            align: 'center',
            width: 150,
            render: (_, record) => {
                return record?.APPROVE_DATE ? moment(record?.APPROVE_DATE).format('YYYY-MM-DD HH:mm:ss') : "-"
            }
        },
        {
            title: <div style={{ textAlign: 'center' }}>审批意见</div>,
            dataIndex: "APPROVE_INFO",
            ellipsis: true
        }
    ];

    // 不动产列表配置
    const realEstateColumns: any = [
        {
            title: "服务区名称",
            dataIndex: "SERVERPART_NAME",
            hideInSearch: true,
            ellipsis: true,
            width: 180,
            align: 'center'
        },
        {
            title: "不动产类型",
            dataIndex: "REALESTATE_TYPE",
            width: 150,
            valueType: "select",
            align: 'center',
            valueEnum: {
                1000: "房屋租赁",
                2000: "车辆资产",
            }
        },
        {
            title: "产权证号",
            dataIndex: "ESTATE_IDENTITY",
            hideInSearch: true,
            ellipsis: true,
            width: 150,
            align: 'center',
        },
        {
            title: "资料编码",
            dataIndex: "SPECIALINDUSTRY_NUMBER",
            hideInSearch: true,
            ellipsis: true,
            width: 150,
            align: 'center',
        },
        {
            title: "省份名称",
            dataIndex: "PROVINCE_NAME",
            hideInSearch: true,
            ellipsis: true,
            width: 150,
            align: 'center'
        },
        {
            title: "城市名称",
            dataIndex: "CITY_NAME",
            hideInSearch: true,
            ellipsis: true,
            width: 150,
            align: 'center'
        },
        {
            title: "详细地址",
            dataIndex: "REALESTATE_ADDRESS",
            hideInSearch: true,
            ellipsis: true,
            width: 180,
            align: 'center'
        },
        {
            title: "是否跨地",
            dataIndex: "CROSS_CITYSIGN",
            hideInSearch: true,
            ellipsis: true,
            width: 120,
            align: 'center',
            render: (_: any, record: any) => {
                return record?.CROSS_CITYSIGN ? "是" : "否"
            }
        },
        {
            title: "面积单位",
            dataIndex: "AREA_UNIT",
            hideInSearch: true,
            ellipsis: true,
            width: 120,
            align: 'center',
            valueType: "select",
            valueEnum: {
                1: "平方千米",
                2: "平方米",
                3: "公顷",
                4: "亩",
                5: "h㎡",
                6: "k㎡",
                7: "㎡"
            }
        },
        {
            title: "租赁期限",
            dataIndex: "LEASEDATE",
            hideInSearch: true,
            ellipsis: true,
            width: 250,
            align: 'center',
            render: (_: any, record: any) => {
                return `${record?.START_LEASEDATE || ""}${record?.END_LEASEDATE ? `-${record?.END_LEASEDATE}` : ''}`
            }
        }
    ]

    // 保存税务代码触发的事件
    const handleSaveTaxCode = async () => {
        // 当前的表格数据
        let newreqResult: any = {
            name: "",
            value: encryptAES(JSON.stringify({ list: tableEditData }))
        }
        setSaveLoading(true)

        const data = await handleSynchroBILLDETAILList(newreqResult)
        setSaveLoading(false)
        if (data.Result_Code === 100) {
            message.success('同步成功！')
            setIsEdit(false)
            detailActionRef.current?.reload()
        } else {
            message.error(data.Result_Desc)
        }
    }

    // 拿到选择的不动产 给表格显示
    const handleGetSelectRealEstate = (data: any) => {
        setRealEstateData(data)
    }
    // 获取到这个服务区的全部 不动产信息 并给枚举的解析赋值
    const handleGetThisServerpartRealEstateData = async () => {
        const req: any = {
            searchParameter: {
                SERVERPART_IDS: "",
                REALESTATE_STATE: 1
            },
            PageIndex: 1,
            PageSize: 999999,
        }
        let newReq: any = {
            name: "",
            value: encryptAES(JSON.stringify(req))
        }
        const data: any = await handleGetREALESTATEList(newReq)
        console.log('datadatadata', data);
        let obj: any = {}
        if (data && data.length > 0) {
            data.forEach((item: any) => {
                obj[item.REALESTATE_ID] = item.ESTATE_IDENTITY
            })
        }
        setRealEstateEnum(obj)
        return data
    }

    return (
        <Drawer
            width="90%"
            open={showDetail}
            title="票据详情"
            onClose={() => {
                setShowDetail(false);
                setParentRow(undefined);
                setIsEdit(false)
                setTableEditData(null)
            }}
            bodyStyle={{ padding: '0 24px 24px' }}
            destroyOnClose
        >
            {/* 统一 labelCol 宽度：通过 formProps 设置 */}
            <ProForm
                formRef={formRef}
                submitter={false}
                layout="horizontal"
                formProps={{ labelCol: { span: 8 } }}
            >
                {/* 第一行：三列（每列 span=8） */}
                <Divider orientation="left">票据基本信息</Divider>
                <Row gutter={16}>
                    <Col span={8}>
                        <ProFormSelect name="BILL_TYPE" label="票据类型" readonly fieldProps={{
                            options: [
                                { label: "专票", value: 1000 },
                                { label: "普票", value: 2000 },
                                { label: "红票", value: 3000 }
                            ]
                        }} />
                        <ProFormText name="SERVERPART_NAME" label="服务区" readonly />
                        <ProFormText name="BILL_TAXAMOUNT" label="含税开票金额" readonly />
                        <ProFormText name="BILL_PERSON" label="开票申请人" readonly />

                    </Col>

                    <Col span={8}>
                        <ProFormText name="BILL_NO" label="票据编号" readonly />
                        <ProFormText name="SERIAL_NO" label="流水号" readonly />
                        <ProFormText name="BILL_AMOUNT" label="除税开票金额" readonly />
                        <ProFormText name="BILL_DATE" label="申请日期" readonly />

                    </Col>

                    <Col span={8}>
                        <ProFormText name="ORIBILL_NO" label="原单据号" readonly />
                        <ProFormSelect name="BILL_STATE" label="票据状态" readonly fieldProps={{
                            options: [
                                { label: "填写中", value: 1000 },
                                { label: "待审核", value: 2000 },
                                { label: "开票中", value: 9000 },
                                { label: "已开票", value: 9200 },
                                { label: "红冲申请中", value: 9990 },
                                { label: "已红冲", value: 9999 }
                            ]
                        }} />
                        <ProFormText name="TAX_PRICE" label="开票税金" readonly />
                        <ProFormText name="ACCOUNTED_DATE" label="开票日期" readonly />
                        {/* <ProFormText name="INTERBANK_NO" label="联行号" readonly /> */}
                        {/* <ProFormText name="TAXPAYER_CODE" label="纳税人识别号" readonly /> */}
                    </Col>
                </Row>
                <Divider orientation="left">收票方</Divider>
                {/* 第二行 */}
                <Row gutter={16}>
                    <Col span={8}>
                        <ProFormText name="MERCHANTS_NAME" label="商户名称" readonly />
                        <ProFormText name="MERCHANTS_ADDRESS" label="购方地址" readonly />
                        <ProFormText name="RECEIVE_EMAIL" label="收票邮箱" readonly />

                    </Col>


                    <Col span={8}>
                        <ProFormText name="TAXPAYER_IDENTIFYCODE" label="统一信用代码" readonly />
                        <ProFormText name="MERCHANTS_TEL" label="购方电话" readonly />

                        <ProFormText
                            name="DOWNLOAD_URL"
                            label="发票图片"
                            readonly
                            fieldProps={{
                                value: parentRow?.DOWNLOAD_URL ? (
                                    <a
                                        href={parentRow.DOWNLOAD_URL}
                                        target="_blank"
                                        rel="noopener noreferrer"
                                        style={{ color: '#1890ff', textDecoration: 'none' }}
                                    >
                                        查看发票图片
                                    </a>
                                ) : '',
                            }}
                        />
                    </Col>


                    <Col span={8}>
                        <ProFormText name="BANK_NAME" label="开户银行" readonly />
                        <ProFormText name="BANK_ACCOUNT" label="银行账号" readonly />

                    </Col>
                </Row>

                <Row gutter={16}>
                    <Col span={24}>
                        <ProFormTextArea
                            name="BILL_DESC"
                            label="备注"
                            readonly
                            fieldProps={{
                                autoSize: true,
                            }}
                        />
                    </Col>
                </Row>

                {/* 发票明细 */}
                <div style={{ marginTop: 24 }}>
                    <Space direction="vertical" style={{ width: '100%' }}>
                        <Text strong>发票明细</Text>
                        {
                            selectRealEstateModal ? '' :
                                <ProTable
                                    actionRef={detailActionRef}
                                    search={false}
                                    columns={detailColumns}
                                    bordered
                                    scroll={{ x: "100%", y: '500px' }}
                                    // pagination={false}
                                    pagination={{
                                        defaultPageSize: 100,
                                        pageSizeOptions: ['100', '200', '500', '1000'],
                                    }}
                                    request={async () => {
                                        // 调用一次  获取这个服务区里面的全部 不动产信息
                                        handleGetThisServerpartRealEstateData()

                                        // 拿到发票明细
                                        const billDetail = await handleGetBILLDETAILList({
                                            SearchParameter: {
                                                BILL_ID: parentRow?.BILL_ID
                                            },
                                            PageIndex: 1,
                                            PageSize: 999999,
                                            SortStr: "BILLDETAIL_ID"
                                        })

                                        if (billDetail && billDetail.length > 0) {
                                            setTableEditData(billDetail)
                                            setReqDetailList(billDetail)
                                            console.log('billDetailbillDetailbillDetail', billDetail);

                                            // 因为要给原先的  不动产信息赋值租赁时间  所以先取出全部的 不动产id
                                            let allREALESTATE_ID: string = ''
                                            billDetail.forEach((item: any) => {
                                                if (item.REALESTATE_ID) {
                                                    if (allREALESTATE_ID) {
                                                        allREALESTATE_ID += `,${item.REALESTATE_ID}`
                                                    } else {
                                                        allREALESTATE_ID = `${item.REALESTATE_ID}`
                                                    }
                                                }
                                            })
                                            console.log('allREALESTATE_IDallREALESTATE_ID', allREALESTATE_ID);

                                            // 看看有没有不动产信息  
                                            if (allREALESTATE_ID) {
                                                setHaveRealEstate(true)
                                            } else {
                                                setHaveRealEstate(false)
                                            }

                                            // 请求到的当前的全部不动产信息
                                            const req: any = {
                                                searchParameter: {
                                                    REALESTATE_IDS: allREALESTATE_ID,
                                                    REALESTATE_STATE: 1
                                                },
                                                PageIndex: 1,
                                                PageSize: 999999,
                                            }
                                            let newReq: any = {
                                                name: "",
                                                value: encryptAES(JSON.stringify(req))
                                            }
                                            const data: any = await handleGetREALESTATEList(newReq)

                                            // 然后去找一样的不动产id  去匹配上 租赁时间的值
                                            billDetail.forEach((item: any) => {
                                                data.forEach((subItem: any) => {
                                                    if (Number(item.REALESTATE_ID) === Number(subItem.REALESTATE_ID) && !item.START_LEASEDATE && !item.END_LEASEDATE) {
                                                        item.START_LEASEDATE = subItem.START_LEASEDATE
                                                        item.END_LEASEDATE = subItem.END_LEASEDATE
                                                    }
                                                })
                                            })

                                            console.log('最终的结果 ', billDetail);
                                            return { data: billDetail, success: true }
                                        }
                                        return { data: [], success: true }
                                    }}
                                    columnsState={{
                                        value: columnsStateMap,
                                        onChange: setColumnsStateMap,
                                    }}
                                    toolbar={{
                                        actions: [
                                            <>
                                                {
                                                    parentRow?.BILL_STATE <= 2000 ?
                                                        <>
                                                            {
                                                                isEdit && parentRow?.BILL_STATE < 9000 ?
                                                                    <>
                                                                        <Button type="primary" loading={saveLoading} style={{ marginRight: '4px' }} onClick={() => {
                                                                            handleSaveTaxCode()
                                                                        }}>保存</Button>
                                                                        <Button onClick={() => {
                                                                            setIsEdit(false)
                                                                        }}>取消</Button>
                                                                    </> :
                                                                    <Button type="primary" onClick={() => {
                                                                        setIsEdit(true)
                                                                    }}>编辑表格</Button>
                                                            }
                                                        </> : ""
                                                }
                                            </>,
                                            <Button type={'primary'} onClick={async () => {
                                                exportXlsxFromProColumnsExcelJS(detailColumns,
                                                    reqDetailList,
                                                    `${parentRow?.BILL_NO}发票明细`,
                                                    {
                                                        // topTitle: `历史销售单品报表`, // 顶部大标题
                                                        // footerMaker: currentUser?.Name,
                                                        // footerMakerTime: moment().format('YYYY-MM-DD HH:mm:ss'),
                                                        // footerStatsTime: `${searchParams?.StartDate}-${searchParams?.EndDate}`
                                                    }
                                                )
                                            }}>导出excel</Button>
                                        ]
                                    }}
                                />
                        }

                    </Space>
                </div>

                {/* 不动产信息 */}
                {/* <div style={{ marginTop: 24 }}>
                    <Space direction="vertical" style={{ width: '100%' }}>
                        <Text strong>不动产信息</Text>
                    </Space>
                    <div>
                        <ProTable
                            actionRef={detailActionRef}
                            search={false}
                            columns={realEstateColumns}
                            bordered
                            scroll={{ x: "100%", y: '500px' }}
                            pagination={false}
                            // dataSource={realEstateData}
                            request={async () => {
                                if (selectRealEstateId && selectRealEstateId.length > 0) {
                                    const req: any = {
                                        searchParameter: {
                                            REALESTATE_IDS: selectRealEstateId.toString()
                                        },
                                        PageIndex: 1,
                                        PageSize: 999999,
                                    }
                                    let newReq: any = {
                                        name: "",
                                        value: encryptAES(JSON.stringify(req))
                                    }
                                    const data: any = await handleGetREALESTATEList(newReq)
                                    if (data && data.length > 0) {
                                        return { data, success: true }
                                    }
                                    return { data: [], success: true }
                                } else {
                                    return { data: [], success: true }
                                }
                            }}
                            columnsState={{
                                value: columnsStateMap,
                                onChange: setColumnsStateMap,
                            }}
                            toolbar={{
                                actions: [
                                    <>
                                        {
                                            parentRow?.BILL_STATE <= 2000 ?
                                                <Button type={'primary'} onClick={async () => {
                                                    // 点击开的时候判断一下 当前是否已经有选择的不动产内容了 有的话 要带回去给表格默认勾选
                                                    // let rowKey: any = []
                                                    // if (realEstateData && realEstateData.length > 0) {
                                                    //     rowKey = realEstateData.map((item: any) => item.REALESTATE_ID)
                                                    // }
                                                    // setSelectRealEstateId(rowKey)
                                                    setSelectRealEstateModal(true)
                                                }}>选择不动产</Button> : ''
                                        }
                                    </>
                                ]
                            }}
                        />
                    </div>
                </div> */}

                {/* 审批意见 */}
                <div style={{ marginTop: 24 }}>
                    <Space direction="vertical" style={{ width: '100%' }}>
                        <Text strong>审批意见</Text>

                        <ProTable
                            search={false}
                            columns={approveColumns}
                            options={false}
                            bordered
                            request={async () => {
                                // 拿个税率的枚举
                                const taxRateLabel: any = await getFieldEnum({ FieldExplainField: 'DUTY_PARAGRAPH', notformate: true })
                                setTaxRateList(taxRateLabel)

                                const req: any = {
                                    SearchParameter: {
                                        APPROVE_TYPE: parentRow?.BILL_ID,// 票的id
                                        APPROVE_DESC: "T_BILL"
                                    },
                                    PageIndex: 1,
                                    PageSize: 999999,
                                    SortStr: "APPROVE_DATE desc"
                                }
                                let reqData: any = {
                                    name: "",
                                    value: encryptAES(JSON.stringify(req))
                                }

                                const data = await handleGetAPPLYAPPROVEList(reqData)
                                if (data && data.length > 0) {
                                    return { data, success: true }
                                }
                                return { data: [], success: true }
                            }}
                        />
                    </Space>
                </div>



            </ProForm>


            {/* 不动产的悬浮框  */}
            <Modal
                width={'90%'}
                title={"选择不动产"}
                open={selectRealEstateModal}
                destroyOnClose
                onCancel={() => {
                    setSelectRealEstateModal(false)
                }}
                confirmLoading={realEstateLoading}
                bodyStyle={{
                    height: '700px', // 你可以根据需要调整高度
                    overflowY: 'auto',
                }}
                footer={showType === 'search' ? '' : <div>
                    <Button onClick={() => {
                        setSelectRealEstateModal(false)
                    }}>取消</Button>
                    <Button loading={realEstateLoading} style={{ marginLeft: '8px' }} type={'primary'} onClick={async () => {
                        // 已经开票申请了的 就不能改变不动产数据了
                        // if (parentRow?.BILL_STATE > 2000) {
                        //     setCurrentRow(undefined)
                        //     setSelectRealEstateModal(false)
                        //     setRealEstateLoading(false)
                        //     return
                        // }


                        // let data = realEstateRef?.current?.selectRowDetail
                        let data: any = []

                        let nowSelectKey: any = realEstateRef?.current?.selectRowKey
                        let nowTableData: any = realEstateRef?.current?.tableData
                        if (nowTableData && nowTableData.length > 0) {
                            nowTableData.forEach((item: any) => {
                                if (item.REALESTATE_ID === nowSelectKey[0]) {
                                    data = [item]
                                }
                            })
                        }

                        console.log('datadasds', data);
                        // 开始保存内容
                        handleGetSelectRealEstate(data)
                        if (tableEditData && tableEditData.length > 0) {
                            setRealEstateLoading(true)
                            let list: any = JSON.parse(JSON.stringify(tableEditData))
                            let idList: any = []
                            // 因为 我们选择的 租赁开始结束时间在  data 中
                            // 但是实际的list 是来自tableEditData  所以得根据id拼进去  造一个对应id 对应的 租赁时间的对象
                            let leaseObj: any = {}
                            if (data && data.length > 0) {
                                idList = data.map((item: any) => Number(item.REALESTATE_ID))
                                data.forEach((item: any) => {
                                    leaseObj[item.REALESTATE_ID] = {
                                        START_LEASEDATE: item.START_LEASEDATE,
                                        END_LEASEDATE: item.END_LEASEDATE
                                    }
                                })
                            }
                            console.log('leaseObjleaseObj', leaseObj);

                            list.forEach((item: any) => {
                                if (item.REALESTATE_ID === currentRow?.REALESTATE_ID) {
                                    item.REALESTATE_ID = idList && idList.length > 0 ? Number(idList.toString()) : ""
                                    item.START_LEASEDATE = leaseObj[item.REALESTATE_ID]?.START_LEASEDATE
                                    item.END_LEASEDATE = leaseObj[item.REALESTATE_ID]?.END_LEASEDATE
                                }
                            })
                            setSelectRealEstateId(idList)
                            console.log('listlistlist', list);

                            let newreqResult: any = {
                                name: "",
                                value: encryptAES(JSON.stringify({ list: list }))
                            }
                            const res: any = await handleSynchroBILLDETAILList(newreqResult)
                            if (res.Result_Code === 100) {
                                message.success('同步成功！')
                                detailActionRef.current?.reload()
                                setCurrentRow(undefined)
                                if (parentTableRef) {
                                    parentTableRef.current?.reload()
                                }
                            } else {
                                message.error(data.Result_Desc)
                            }
                        }
                        setSelectRealEstateModal(false)
                        setRealEstateLoading(false)
                    }}>确定</Button>
                </div>}
                onOk={async () => {

                }}
            >
                <RealEstate serverPartId={parentRow?.SERVERPART_ID} isComponent={true} onRef={realEstateRef} selectRealEstateId={selectRealEstateId} parentRow={currentRow} showType={'search'} />
            </Modal>
        </Drawer>
    );
};

export default connect(({ user }: ConnectState) => ({ currentUser: user.data }))(InvoiceDetail);