// 新增数据元属性
import React from 'react';
import { Form, Modal, Input, Row, Col, DatePicker, message, Select } from 'antd';
import Moment from 'moment';
import { $http } from 'containers/config/https';

let { Option } = Select;

class NewAttribute extends React.Component {
    constructor() {
        var userData = JSON.parse(sessionStorage.getItem('userData'));
        super();
        this.state = {
            userInfo: {},
            visible: false,
            flag: '',
            userData:userData,
            defID:'',
            attributeType:[],
        }
    }

    componentDidMount() {
        this.props.onRef(this);
        this.handelQueryType();
    }
    ///获取属性类型
    handelQueryType=()=>{
        let data = {
			params: [{
                type:'NationalAttributeType',
                language:this.state.userData.language,
            }]
		}
		$http.post('urlS', this, {
			code: "01010013",
			data: data,
			success: function (res) {
				if (+res.errorCode === 0) {
                    this.setState({
                        defID:res.defID,
                        attributeType: res.data,
                    })
				}
			}
		})
    }
    // 关闭弹窗
    handleCancel = () => {
        this.setState({ visible: false }, () => {
            if (this.state.flag === 'compile') {
                this.resetFields();
            }
        })
    }

    // 打开弹窗
    showModal = (obj) => {
        this.setState({
            visible: true,
            userInfo: obj.userInfo ? obj.userInfo : {},
            flag: obj && obj.flag ? obj.flag : 'add',
        }, () => {
            if (this.state.flag === 'compile') {
                this.resetFields();
            }
        })
    }

    // 保存
    handleCreate = () => {
        let { flag } = this.state;
        if (flag === 'compile') {
            this.handelSave('06010007', '编辑');
        } else {
            this.handelSave('06010006', '新增');
        }
    }

    handelSave = (code, msg) => {
        const { form: { validateFields } } = this.props;
        validateFields((errors, values) => {
            // 验证成功
            if (errors === null) {
                let data = {
                    params: []
                }
                let obj = JSON.parse(JSON.stringify(values));
                // 当增加时点击复制把ID值传给后天然后后台根据ID值去复制权限，编辑时则根据ID去保存修改
                if (msg === '编辑') {
                    obj.ID = this.state.userInfo.ID
                }
                // 将开关的值转化
                obj.startDate = obj.startDate ? Moment(obj.startDate).format("YYYY-MM-DD") : '';
                obj.stopDate = obj.stopDate ? Moment(obj.stopDate).format("YYYY-MM-DD") : '';

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

    // 重置表单
    resetFields() {
        this.props.form.resetFields();
    }

    render() {
        const { getFieldDecorator } = this.props.form;
        let { userInfo, visible, flag } = this.state;
        const formItemInput = {
            labelCol: { span: 9 },
            wrapperCol: { span: 15 }
        };

        // 目录ID
        let dataCatalogueIDOption = this.props.selectData && this.props.selectData.data && this.props.selectData.data.map((item, index) => {
            return (<Option key={index} value={item.ID} title={item.descripts} seatchprop={item.descripts + '^' + item.descriptsSPCode}>{item.descripts}</Option>)
        })
        let dataAttributeType=[]; 
        this.state.attributeType.map((item,index)=>{
            dataAttributeType.push(<Option key={index} value={item.value} title={item.descripts} seatchprop={item.descripts + '^' + item.descriptsSPCode}>{item.descripts}</Option>)
        })
        return (
            <Modal
                visible={visible}
                title={flag === 'add' ? '新增数据元属性' : '编辑数据元属性'}
                okText="保存"
                onCancel={this.handleCancel}
                onOk={this.handleCreate}
                width={600}
            >
                <Form className="form-item-align">
                    <Row>
                        <Col span={12}>
                            <Form.Item label="属性代码：" {...formItemInput}>
                                {getFieldDecorator('code', {
                                    initialValue: userInfo.code ? userInfo.code : undefined,
                                    rules: [{ required: true, message: '属性代码不能为空' }]
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="属性描述：" {...formItemInput}>
                                {getFieldDecorator('descripts', {
                                    initialValue: userInfo.descripts ? userInfo.descripts : undefined,
                                    rules: [{ required: true, message: '属性描述不能为空' }]
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <Form.Item label="属性内部代码：" {...formItemInput}>
                                {getFieldDecorator('internalCode', {
                                    initialValue: userInfo.internalCode ? userInfo.internalCode : undefined,
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="属性含义：" {...formItemInput}>
                                {getFieldDecorator('definition', {
                                    initialValue: userInfo.definition ? userInfo.definition : undefined,
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <Form.Item label="允许值：" {...formItemInput}>
                                {getFieldDecorator('dataRange', {
                                    initialValue: userInfo.dataRange ? userInfo.dataRange : undefined,
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="属性类型" {...formItemInput}>
                                {getFieldDecorator('type', {
                                    initialValue: userInfo.type ? userInfo.type : this.state.defID,
                                })(
                                    <Select
                                        showSearch optionFilterProp="seatchprop" allowClear
                                        style={{ width: '100%' }}
                                        placeholder="请选择"
                                    >
                                        {dataAttributeType}
                                    </Select>
                                )}
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <Form.Item label="国标版本：" {...formItemInput}>
                                {getFieldDecorator('standardVersion', {
                                    initialValue: userInfo.standardVersion ? userInfo.standardVersion : undefined,
                                })(
                                    <Input placeholder="请输入" />
                                )}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="数据元目录：" {...formItemInput}>
                                {getFieldDecorator('dataCatalogueID', {
                                    initialValue: userInfo.dataCatalogueID ? +userInfo.dataCatalogueID : undefined,
                                    rules: [{ required: true, message: '数据元目录不能为空' }]
                                })(
                                    <Select
                                        showSearch optionFilterProp="seatchprop" allowClear
                                        style={{ width: '100%' }}
                                        placeholder="请选择"
                                    >
                                        {dataCatalogueIDOption}
                                    </Select>
                                )}
                            </Form.Item>
                        </Col>
                    </Row>
                    <Row>
                        <Col span={12}>
                            <Form.Item label="生效日期：" {...formItemInput}>
                                {getFieldDecorator('startDate', {
                                    initialValue: userInfo.startDate ? Moment(userInfo.startDate) : undefined,
                                    rules: [{ required: true, message: '生效日期不能为空' }]
                                })(
                                    <DatePicker style={{ width: '100%' }} format="YYYY-MM-DD" allowClear />
                                )}
                            </Form.Item>
                        </Col>
                        <Col span={12}>
                            <Form.Item label="失效日期：" {...formItemInput}>
                                {getFieldDecorator('stopDate', {
                                    initialValue: userInfo.stopDate ? Moment(userInfo.stopDate) : undefined,
                                })(
                                    <DatePicker style={{ width: '100%' }} format="YYYY-MM-DD" allowClear />
                                )}
                            </Form.Item>
                        </Col>
                    </Row>

                </Form>
            </Modal>
        )
    }
};
const NewAttributeForm = Form.create()(NewAttribute);
export default NewAttributeForm;