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


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);

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

    return (
        <>
            <ConfigProvider
                theme={{
                    token: {
                        colorPrimary: '#4FBE70',
                    }, components: {
                        Segmented: {
                            itemSelectedBg: '#19be6e',
                            itemSelectedColor: '#ffffff'
                        },
                    },
                }}
            >

                <Modal
                    open={openPreview}
                    title='变更点数'
                    centered
                    maskClosable={false}
                    footer={null}
                    destroyOnClose
                    width={480}
                    onCancel={() => {
                        dispatch({ type: 'openModel/getOpenFeeModal', payload: false })
                    }}
                >
                    <ProForm<CompanyType.fee>
                        request={async () => {
                            if (id) {
                                let res = await GetCompanyVipInfo({ id: id })
                                res.data.fee = res.data.balance_fee
                                return res.data;
                            }
                        }}
                        formRef={formRef}
                        submitter={{
                            searchConfig: {
                                resetText: '取消',
                                submitText: '保存',
                            },
                            render: (_, dom) => { return <Flex justify='flex-end'> <Space>{dom}</Space></Flex> },
                            onReset: () => {
                                setOpenPreview(false)
                            }
                        }}
                        onFinish={async (values) => {
                            values.id = id;
                            let res = await PostCompanyFeechange(values)
                            message.success('提交成功')
                            dispatch({ type: 'openModel/getOpenFeeModal', payload: false })
                        }}
                    >
                        <ProFormDigit
                            label="点数值"
                            placeholder="点数值"
                            name="fee"
                            min={0}
                            rules={[{ required: true, message: '请输入点数值' }]}
                        />
                        <ProFormRadio.Group
                            name="change_type"
                            label="变更类型"
                            fieldProps={{
                                buttonStyle: 'solid'
                            }}
                            options={[
                                {
                                    label: '增加',
                                    value: 1,
                                },
                                {
                                    label: '扣减',
                                    value: 2,
                                }
                            ]}
                            rules={[{ required: true, message: '请选择变更类型' }]}

                        />

                        <ProFormText
                            name="remark"
                            label="备注说明"
                            placeholder="备注说明"
                            rules={[{ required: true, message: '请输入备注说明' }]}
                        />

                    </ProForm>

                </Modal>
            </ConfigProvider>

        </>



    );
};



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