import { useRef, useState, useEffect } from 'react';
import { connect } from '@umijs/max';
import type { ActionType, ProFormInstance } from '@ant-design/pro-components';
import {
    ProFormText,
    ProFormRadio,
    ProForm,
    ProFormDateRangePicker
} from '@ant-design/pro-components';
import { ConfigProvider, Flex, Space, Modal, message, Row, Col } from 'antd';
import { PostCompanyVipmanage, GetCompanyVipInfo } from '@/apis/api';
import dayjs from "dayjs";


const selectfieldNames = { label: 'full_name', value: 'id' };

const PagesMainCompanyPostCreate: React.FC = ({ dispatch, dictModel, openModel, id }: any) => {
    const formRef = useRef<ProFormInstance>();
    const [openPreview, setOpenPreview] = useState(false);
    const [detail, setDetail] = useState<CompanyType.Vip | null>(null)

    useEffect(() => {
        setOpenPreview(openModel.openModal)
    }, [openModel.openModal])

    return (
        <>
            <ConfigProvider
                theme={{
                    token: {
                        colorPrimary: '#4FBE70',
                    }
                }}
            >

                <Modal
                    open={openPreview}
                    title='编辑VIP'
                    centered
                    maskClosable={false}
                    footer={null}
                    destroyOnClose
                    width={680}
                    onCancel={() => {
                        dispatch({ type: 'openModel/getOpenModal', payload: false })
                    }}
                >
                    <ProForm<CompanyType.Vip>
                        formRef={formRef}
                        request={async () => {
                            if (id) {
                                let res = await GetCompanyVipInfo({ id: id })
                                res.data.dateRange = [res.data.start_date ? res.data.start_date : null, res.data.end_date ? res.data.end_date : null]
                                return res.data;
                            }
                        }}
                        submitter={{
                            searchConfig: {
                                resetText: '取消',
                                submitText: '保存',
                            },
                            render: (_, dom) => { return <Flex justify='flex-end'> <Space>{dom}</Space></Flex> },
                            onReset: () => {
                                setDetail(null)
                                setOpenPreview(false)
                            }
                        }}
                        onFinish={async (values) => {
                            values.id = id;
                            values.start_date = values.dateRange && values.dateRange.length > 0 ? values.dateRange[0] : '';
                            values.end_date = values.dateRange && values.dateRange.length > 0 ? values.dateRange[1] : '';
                            delete values.dateRange;
                            let res = await PostCompanyVipmanage(values)
                            message.success('提交成功')
                            dispatch({ type: 'openModel/getOpenModal', payload: false })
                        }}
                    >
                        <Row gutter={[16, 16]}>
                            <Col span={6}>
                                <ProFormRadio.Group
                                    name="probation"
                                    label="见习基地"
                                    fieldProps={{
                                        buttonStyle: 'solid'
                                    }}
                                    options={[
                                        {
                                            label: '是',
                                            value: 1,
                                        },
                                        {
                                            label: '否',
                                            value: 2,
                                        }
                                    ]}
                                />
                            </Col>
                            <Col span={6}>
                                <ProFormRadio.Group
                                    name="famous"
                                    label="知名企业"
                                    fieldProps={{
                                        buttonStyle: 'solid'
                                    }}
                                    options={[
                                        {
                                            label: '是',
                                            value: 1,
                                        },
                                        {
                                            label: '否',
                                            value: 2,
                                        }
                                    ]}
                                />
                            </Col>
                            <Col span={24}>
                                <ProFormRadio.Group
                                    name="member_type"
                                    label="会员类型"
                                    fieldProps={{
                                        buttonStyle: 'solid'
                                    }}
                                    options={[
                                        {
                                            label: '试用申请中',
                                            value: 1,
                                        },
                                        {
                                            label: '试用正式',
                                            value: 2,
                                        },
                                        {
                                            label: '普通申请中',
                                            value: 3,
                                        },
                                        {
                                            label: '普通正式',
                                            value: 4,
                                        },
                                        {
                                            label: 'VIP申请中',
                                            value: 5,
                                        },
                                        {
                                            label: 'VIP正式',
                                            value: 6,
                                        }
                                    ]}
                                />
                            </Col>
                            <Col span={24}>
                                <ProFormRadio.Group
                                    name="member_status"
                                    label="会员状态"
                                    fieldProps={{
                                        buttonStyle: 'solid'
                                    }}
                                    options={[
                                        {
                                            label: '待审',
                                            value: 1,
                                        },
                                        {
                                            label: '正常',
                                            value: 2,
                                        },
                                        {
                                            label: '到期',
                                            value: 3,
                                        },
                                        {
                                            label: '推荐',
                                            value: 4,
                                        }
                                    ]}
                                />
                            </Col>
                            <Col span={12}>
                                <ProFormDateRangePicker
                                    name="dateRange"
                                    label="会员生效时间"
                                    placeholder={['会员生效时间', '会员失效时间']}
                                    fieldProps={{
                                        format: 'YYYY-MM-DD'
                                    }}

                                />
                            </Col>
                            <Col span={12}>
                                <ProFormText
                                    name="sale"
                                    label="业务员"
                                    placeholder="请输入业务员"
                                />
                            </Col>
                        </Row>

                    </ProForm>

                </Modal>
            </ConfigProvider>

        </>



    );
};



export default connect(({ dictModel, openModel }: any) => ({
    dictModel, openModel
}))(PagesMainCompanyPostCreate);