import React, { useEffect, useState } from 'react';
import { Drawer, Form, Input, notification, Row, Col, Button, Space} from 'antd';
import { CM_Event_OperateEventExtendPage, GetEventExtendPage} from '@/services/standingBook/api';
import { IdcardTwoTone } from '@ant-design/icons';
const AddViewModal = props => {
    const { callBackSubmit = () => { }, visible, onClose, maxLength, title2, obj, type } = props;
    const [id, setId]= useState('')

    const [form] = Form.useForm();
    const { Item } = Form;
    const { TextArea } = Input;

    const onSubmit = () => {
        let aa = title2;
        let bb = form.getFieldsValue().WebLabel;
        let cc = form.getFieldsValue().WebPage;
        let dd = form.getFieldsValue().WebParam;
        let ee = form.getFieldsValue().MobileLabel;
        let ff = form.getFieldsValue().MobilePage;
        let gg = form.getFieldsValue().MobileParam;
        if(type=='edit'){
            CM_Event_OperateEventExtendPage({
                ID: id,
                EventName: aa,
                WebLabel: bb,
                WebPage: cc,
                WebParam: dd,
                MobileLabel: ee,
                MobilePage: ff,
                MobileParam: gg,
            }).then(res => {
                if (res.msg === '') {
                    form.resetFields();
                    callBackSubmit();
                    notification.success({
                        message: '提示',
                        duration: 3,
                        description: '编辑成功',
                    });
                } else {
                    notification.error({
                        message: '提示',
                        duration: 3,
                        description: res.msg,
                    });
                }
            })
        }else{
            CM_Event_OperateEventExtendPage({
                ID: 0,
                EventName: aa,
                WebLabel: bb,
                WebPage: cc,
                WebParam: dd,
                MobileLabel: ee,
                MobilePage: ff,
                MobileParam: gg,
            }).then(res => {
                if (res.msg === '') {
                    form.resetFields();
                    callBackSubmit();
                    notification.success({
                        message: '提示',
                        duration: 3,
                        description: '添加成功',
                    });
                } else {
                    notification.error({
                        message: '提示',
                        duration: 3,
                        description: res.msg,
                    });
                }
            })
        }
        
        
    }
    useEffect(() => {
        console.log(type)
        if(type==='edit'){
            GetEventExtendPage({eventExtendPageId:obj}).then(res=>{
                console.log(res.data)
                form.setFieldsValue({...res.data})
                setId(res.data.ID)
            })
        }else if(type==='add'){
            form.resetFields();
        }
    }, [visible])
    return (
        <Drawer
            visible={visible}
            onClose={onClose}
            width="500px"
            title={type=='edit' ? '编辑事件辅助视图配置':'添加事件辅助视图配置'}
            footer={
                <Space>
                  <Button onClick={onSubmit} type="primary" >
                    确定
                  </Button>
                </Space>
              } 
        >
            <Form form={form} labelCol={{ span: 7 }} style={{ height: '24rem', overflowY: 'scroll' }}>
                <Row>
                    <Col span={23}>
                        <Item
                            label="前端标签"
                            name="WebLabel"
                            rules={[
                                {
                                    required: true,
                                    message: '请输入前端标签',
                                },
                            ]}
                        >
                            <Input style={{ width: '17rem' }} placeholder="请输入前端标签" />
                        </Item>
                    </Col>
                    <Col span={23}>
                        <Item
                            label="前端视图"
                            name="WebPage"
                            rules={[
                                {
                                    required: true,
                                    message: '请输入前端视图',
                                },
                            ]}
                        >
                            <Input style={{ width: '17rem' }} placeholder="请输入前端视图" />
                        </Item>
                    </Col>
                    <Col span={23}>
                        <Item
                            label="视图参数"
                            name="WebParam"
                        >
                            <TextArea style={{ width: '17rem' }} placeholder="请输入视图参数" />
                        </Item>
                    </Col>
                    <Col span={23}>
                        <Item
                            label="手持标签"
                            name="MobileLabel"
                        >
                            <Input style={{ width: '17rem' }} placeholder="请输入手持标签" />
                        </Item>
                    </Col>
                    <Col span={23}>
                        <Item
                            label="手持视图"
                            name="MobilePage"
                        >
                            <Input style={{ width: '17rem' }} placeholder="请输入手持视图" />
                        </Item>
                    </Col>
                    <Col span={23}>
                        <Item
                            label="手持参数"
                            name="MobileParam"
                        >
                            <TextArea style={{ width: '17rem' }} placeholder="请输入手持参数" />
                        </Item>
                    </Col>
                </Row>

            </Form>
        </Drawer>
    )
}
export default AddViewModal;