import React, { useState, useMemo, useRef, useEffect } from 'react';
import DrawerPro from '@/components/DrawerPro';
import AutoTable from '@/components/AutoTable';
import PremButton from '@/components/PremButton';
import getcolumns from './columns';
import { doFetch } from '@/utils/doFetch';
import { useRequest } from "ahooks";
import { Divider, Tabs, ProDescriptions, message } from "antd";
import dayjs from 'dayjs';
import Leaseterminformation from "./Leaseterminformation";
const Costanalysis = () => {
    let actionRef = useRef(), formRef = useRef(), boxRef = useRef();
    const [drawer, setdrawer] = useState({
        open: false,
    }),
        [extraparams, setextraparams] = useState({}),
        [activeKey, catk] = useState('item-1');
    const { run, loading, runAsync } = useRequest(doFetch, {
        manual: true,
        onSuccess: (res, params) => {
            if (res?.code == "0000") {
                actionRef?.current?.reload();
                setdrawer((s) => ({
                    ...s,
                    open: false,
                }));
            }
        },
    });
    const columns = useMemo(() => {
        let defcolumn = getcolumns(setdrawer, activeKey)?.filter(it => it.key == activeKey)?.[0]?.columns ?? [];
        return defcolumn.concat({
            title: '操作',
            valueType: 'option',
            width: activeKey == 'item-1' ? 260 : 100,
            render: (text, row, _, action) => rightExtra(text, row, _, action),
        });
    }, [activeKey]);
    const rightExtra = (text, row, _, action) => {
        return [
            activeKey == 'item-1' && <PremButton
                key='confirm'
                btn={{
                    size: 'small',
                    onClick: async () => {
                        let res = await doFetch({ url: '/lease/umContractEquipment/queryBeforeCollection', params: { id: row.id } });
                        if (res?.data?.data?.waitNum == 0) {
                            message.warning('该设备需回款的租期已全部回款,无需再次回款!')
                        } else {
                            setdrawer((s) => ({
                                ...s,
                                open: true,
                                item: { ...row, waitNum: res?.data?.data?.waitNum, isColl: res?.data?.data?.isColl },
                                val: 'confirm',
                                title: '回款确认',
                                fields: [
                                    {
                                        title: '本期是否回款',
                                        dataIndex: 'isColl',
                                        key: 'isColl',
                                        fieldProps: {
                                            disabled: true
                                        },
                                        colProps: { span: 8 },
                                    },
                                    {
                                        title: '剩余回款期数',
                                        dataIndex: 'waitNum',
                                        key: 'waitNum',
                                        fieldProps: {
                                            disabled: true
                                        },
                                        colProps: { span: 8 },
                                    },
                                    {
                                        title: '本次回款期数',
                                        dataIndex: 'collNum',
                                        key: 'collNum',
                                        valueType: 'digit',
                                        colProps: { span: 8 },
                                        precision: 0,
                                        formItemProps: { rules: [{ required: true, message: '此项为必填项' }] }
                                    },
                                    {
                                        title: '回款形式',
                                        dataIndex: 'collType',
                                        key: 'collType',
                                        valueType: 'select',
                                        options: [
                                            { label: '现金', value: 1 },
                                            { label: '银行承兑', value: 2 },
                                        ],
                                        colProps: { span: 8 },
                                        formItemProps: { rules: [{ required: true, message: '此项为必填项' }] },
                                    },
                                ]
                            }));
                        }
                    },
                }}
            >
                回款确认
            </PremButton>,
            activeKey == 'item-1' && <PremButton
                key='reduction'
                btn={{
                    size: 'small',
                    onClick: async () => {

                    },
                }}
            >
                租金减免
            </PremButton>,
            <PremButton
                key='invoicing'
                btn={{
                    size: 'small',
                    onClick: async () => {

                    },
                }}
            >
                开票记录
            </PremButton>
        ]
    };

    return <div ref={boxRef}>
        <AutoTable
            pagetitle={<h3 className="page-title">费用分析</h3>}
            columns={columns}
            path={activeKey == 'item-1' ? '/lease/umContractEquipment/queryNoAnalysis' : '/lease/umContractEquipment/queryYesAnalysis'}
            actionRef={actionRef}
            resizeable={false}
            bordered={false}
            x={2500}
            extraparams={extraparams}
            onTabChange={(key) => {
                catk(key);
            }}
            activeTabKey={activeKey}
            tabList={getcolumns()}
        />


        <DrawerPro
            {...drawer}
            fields={drawer.fields}
            params={{ id: drawer?.item?.id }}
            defaultFormValue={drawer?.item ?? {}}
            placement="right"
            onClose={() => {
                setdrawer((s) => ({
                    ...s,
                    open: false,
                }));
            }}
        >
            <Leaseterminformation drawer={drawer} boxRef={boxRef} />
        </DrawerPro>
    </div>
}
export default Costanalysis;