import { connect } from "umi";
import type { ConnectState } from "@/models/connect";
import ProForm, { FormInstance, ProFormDigit, ProFormSelect, ProFormText, ProFormTextArea, ProFormTreeSelect } from "@ant-design/pro-form";
import { useImperativeHandle, useRef, useState } from "react";
import { Button, Col, Drawer, Row } from "antd";
import { handleGetBusinessManDetail, handleGetNestingOwnerUnitList } from "../service";
import { getFieldEnum } from "@/services/options";
import { PlusOutlined } from "@ant-design/icons";
import MerchatsTable from "../../Merchats";

type DetailProps = {
    onRef: any
    currentRow: any
    selectShopRef?: any
    currentUser?: any
    handleGetShopData: any
    pageType?: any
}
const AddForm = ({ onRef, currentRow, selectShopRef, currentUser, handleGetShopData, pageType }: DetailProps) => {

    const MerchatsTableRef = useRef<any>()
    const formRef = useRef<FormInstance>();
    // 表格的详情
    const [formDetail, setFormDetail] = useState<any>()
    // 客户单位后面点击的加号出现的抽屉
    const [onShowSelect, setOnShowSelect] = useState<boolean>(false)

    useImperativeHandle(onRef, () => ({
        formRef,
        formDetail
    }));

    return (
        <div>
            <ProForm
                formRef={formRef}
                layout={'horizontal'}
                submitter={false}
                request={async () => {
                    if (currentRow?.OWNERUNIT_ID) {
                        const data = await handleGetBusinessManDetail({ BusinessManId: currentRow?.OWNERUNIT_ID })
                        console.log('data312312', data);
                        let obj: any = data.Result_Data
                        // 原数据
                        obj.PROVINCE_CODE = obj.PROVINCE_CODE.toString()
                        obj.OWNERUNIT_NATURE = obj.OWNERUNIT_NATURE.toString()
                        setFormDetail(data.Result_Data)

                        selectShopRef.current?.handleShopSelected(obj?.ShopList)
                        await selectShopRef.current?.handleGetTreeData(obj?.PROVINCE_CODE)

                        return data.Result_Data
                    }
                    // 左边选择门店的内容 因为需要拿到这边的省份数据 如果一起掉 它本身的会顶掉实际的 所以就在这儿掉
                    selectShopRef.current?.handleGetTreeData(currentUser?.ProvinceCode)
                    return {}
                }}
            >
                <Row>
                    <Col span={24}>
                        <ProFormTreeSelect
                            name="OWNERUNIT_PID"
                            label="父级业主"
                            request={async () => {
                                const data = await handleGetNestingOwnerUnitList({ ShowStatus: true })
                                return data
                            }}
                            fieldProps={{
                                fieldNames: {
                                    label: 'OWNERUNIT_NAME',
                                    value: 'OWNERUNIT_ID',
                                    children: 'children'
                                },
                                allowClear: true,
                                showSearch: true
                            }}
                            initialValue={currentRow?.OWNERUNIT_PID ? currentRow?.OWNERUNIT_PID : currentUser?.ProvinceCode === '734100' ? 275 : ''}
                        />
                    </Col>

                    <Col span={24}>
                        <ProFormSelect
                            name="PROVINCE_CODE"
                            label="所属省份"
                            rules={[
                                {
                                    required: true,
                                    message: '请选择所属省份',
                                }
                            ]}
                            request={async () => {
                                return await getFieldEnum({
                                    // 这里要手动添加枚举字段（从下面这些字典中选择一个）：服务区内码[ServerpartIds]
                                    FieldExplainField: 'PROVINCE_CODE',
                                    notformate: true,
                                });
                            }}
                            fieldProps={{
                                onChange: (e: any) => {
                                    console.log('e', e);
                                    console.log('selectShopRef.current?', selectShopRef.current);

                                    selectShopRef.current?.handleGetTreeData(e)
                                }
                            }}
                            initialValue={currentUser?.ProvinceCode || '734100'}
                        />
                    </Col>

                    <Col span={24}>
                        <ProFormSelect
                            name="OWNERUNIT_NATURE"
                            label="单位性质"
                            request={async () => {
                                return await getFieldEnum({
                                    // 这里要手动添加枚举字段（从下面这些字典中选择一个）：服务区内码[ServerpartIds]
                                    FieldExplainField: 'OWNERUNIT_NATURE',
                                    notformate: true,
                                });
                            }}
                            initialValue={'2000'}
                        />
                    </Col>
                    <Col span={20}>
                        <ProFormText
                            name="OWNERUNIT_NAME"
                            label="客户单位"
                            rules={[
                                {
                                    required: true,
                                    message: '请输入客户单位',
                                }
                            ]}
                        />
                    </Col>
                    <Col span={4}>
                        <Button style={{ marginLeft: '24px' }} type={"primary"} icon={<PlusOutlined />} onClick={() => {
                            setOnShowSelect(true)
                        }}></Button>
                    </Col>

                    <Col span={24}>
                        <ProFormText
                            name="OWNERUNIT_EN"
                            label="客户简称"
                        />
                    </Col>
                    <Col span={24}>
                        <ProFormDigit
                            name="OWNERUNIT_INDEX"
                            label="排序字段"
                        />
                    </Col>
                    <Col span={24}>
                        <ProFormTextArea
                            name="OWNERUNIT_DESC"
                            label="备注说明"
                        />
                    </Col>

                </Row>

            </ProForm>

            <Drawer
                width="80%"
                visible={onShowSelect}
                onClose={() => {
                    setOnShowSelect(false)
                }}
                destroyOnClose
                title={'经营商户列表'}
                closable={false}
                bodyStyle={{ backgroundColor: "#f9f9f9", padding: 16 }}
                footer={<div style={{ width: '100%', display: 'flex', alignItems: 'center', justifyContent: 'flex-end' }}>
                    <Button type={'primary'} onClick={() => {
                        setOnShowSelect(false)
                        let res: any = MerchatsTableRef.current?.selectRow
                        console.log('res', res);
                        if (res) {
                            formRef.current?.setFieldsValue({ OWNERUNIT_NAME: res })
                        }
                    }}>确认</Button>
                </div>}
            >
                <MerchatsTable isComponent={true} onRef={MerchatsTableRef} />
            </Drawer>
        </div>
    )
}

export default connect(({ user, }: ConnectState) => ({
    currentUser: user.currentUser,
}))(AddForm);
