// 新增/修改其他自定义数据
import React from 'react';
import { $http } from 'containers/config/https';
import { Modal, Form, Input, Switch, message } from 'antd';

const FormItem = Form.Item;

class OtherCustomData extends React.Component {
	state = { 
		visible: false,
		userInfo: {},
		flag: 'add'
	};

	componentDidMount() {
		this.props.onRef(this);
	}

	// 显示弹出层
	showModal = (data, flag) => {
		this.resetFields();
		this.setState({
			visible: true,
			userInfo: data,
			flag
		});
	}

	// 取消
	handleCancel = () => {
		this.setState({
			visible: false,
		});
	}
	
	// 重置表单
	resetFields() {
		this.props.form.resetFields();
	}

	// 确定
	handleCreate = () => {
		console.log('111')
		let {userInfo, flag} = this.state;
		const { form: { validateFields } } = this.props;
        validateFields((errors, values) => {
            // 验证成功
            if (errors === null) {
                let data = {
                    params: []
				}
				
				values.ID = flag === 'add' ? undefined : userInfo.ID;
				values.listBoxOrNot = values.listBoxOrNot === true ? 'Y' : 'N';
				values.radioOrNot = values.radioOrNot === true ? 'Y' : 'N';
				values.checkBoxOrNot = values.checkBoxOrNot === true ? 'Y' : 'N';

                // 处理需要传递的obj
                data.params.push(values);
                $http.post('urlADS', this, {
                    code: flag === 'add' ? '06010037' : '06010038',
                    data: data,
                    success: function (res) { 
                        if (+res.errorCode === 0) {
                          // 提示
                          message.success(`${flag === 'add' ? '新增' : '修改'}成功`);
                          // 新增或编辑成功重置form表单
                          this.resetFields();
                          // 关闭弹框
                          this.handleCancel();
                          // 刷新列表数据
                          this.props.handleQuery();
                        }
                    }
                })
            }
        });
	}

	render() {
		const { getFieldDecorator } = this.props.form;
		let {userInfo, flag, visible} = this.state;
		return (
			<Modal
				visible={visible}
				title={`${flag === 'add' ? '新增' : '修改'}自定义数据`}
				okText="确定"
				onCancel={this.handleCancel}
				onOk={this.handleCreate}
			>
				<Form layout="vertical">
					<FormItem label="代码">
						{getFieldDecorator('code', {
							initialValue: userInfo.code ? userInfo.code: undefined,
							rules: [{ required: true, message: '代码不能为空' }]
						})(
							<Input placeholder="请输入代码" className='input' />
						)}
					</FormItem>
					<FormItem label="描述">
						{getFieldDecorator('descripts', {
							initialValue:userInfo.descripts ? userInfo.descripts: undefined,
							rules: [{ required: true, message: '描述不能为空' }]
						})(
							<Input placeholder="请输入描述" className='input' />
						)}
					</FormItem>
					<FormItem label="是否下拉框数据标志">
						{getFieldDecorator('listBoxOrNot', {
							valuePropName: 'checked',
							initialValue: userInfo.listBoxOrNot === "Y" ? true : false,
						})(
							<Switch checkedChildren="是" unCheckedChildren="否" />
						)}
					</FormItem>
					<FormItem label="是否单选框数据标志">
						{getFieldDecorator('radioOrNot', {
							valuePropName: 'checked',
							initialValue: userInfo.radioOrNot === "Y" ? true : false,
						})(
							<Switch checkedChildren="是" unCheckedChildren="否" />
						)}
					</FormItem>
					<FormItem label="是否复选框标志">
						{getFieldDecorator('checkBoxOrNot', {
							valuePropName: 'checked',
							initialValue: userInfo.checkBoxOrNot === "Y" ? true : false,
						})(
							<Switch checkedChildren="是" unCheckedChildren="否" />
						)}
					</FormItem>
				</Form>
			</Modal>
		);
	}
}
const OtherCustomDataForm = Form.create()(OtherCustomData);
export default OtherCustomDataForm;