import { message } from "antd/lib/index";
import { Layout,Descriptions, Tabs, Steps, Button, Popconfirm, Row, Col, Form, Input, Select, Table, Drawer ,Icon} from 'antd';
import React from 'react';
import { PlusOutlined } from '@ant-design/icons';
import ReactToPrint from "react-to-print";
import styles from '../HI/StepForm.css';
import config from "../../../config";
import XLSX from 'xlsx';
import { connect } from 'dva';
import moment from 'moment';
const { Header, Footer, Sider, Content } = Layout;
const TabPane = Tabs.TabPane;
const { TextArea } = Input;
const { Step } = Steps;
import {
    extend,
    extendRule,
    initFilter,
    initQueryFilter,
    getOnlyPropertyData,
    extendInclude,
    empty,
    getDataFieldValue, guid, initFilterGroup, extendGroupRule
} from "../../../utils/common";
import FormPage from '../../FormPage'
class PFApproveRole extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            title: '添加节点',
            data: {},
            userData: [],
            userPreData: [],
            userNextData: [],
            selectUserId: '',
            selectPreUserId:'',
            selectNextUserId:'',
        }
    };
    componentDidMount() {
        if (this.props.formCode)
            this.loadData();
    }

    componentWillReceiveProps(NextProps) {
        if (NextProps.formCode && this.props.formCode != NextProps.formCode) {
            this.loadData(NextProps.formCode);
        }
    }

    BtnClose = () => {
        if (typeof this.props.data.onCancel != "undefined" && typeof this.props.data.onCancel == 'function')
                this.props.data.onCancel();
    }

    selectChange = (e) => {
        this.setState({
            selectUserId: e
        })
    }
    selectPreChange = (e) => {
        this.setState({
            selectPreUserId: e
        })
    }
    selectNextChange = (e) => {
        this.setState({
            selectNextUserId: e
        })
    }
    onComplaint = (e) => {
        if (this.state.selectUserId === '') {
            message.error("请选择当前节点");
            return;
        }
        if (this.state.selectPreUserId === '' && this.state.selectNextUserId === '') {
            message.error("上一节点，下一节点，必须填写一个");
            return;
        }
        const json = initFilter(this.props.login.OrgId, null, '', 0, 1, this.state.selectUserId, this.state.selectPreUserId,this.state.selectNextUserId)
        this.props.dispatch({
            type: 'app/getDataByPost',
            url: 'PF/PFApprovalRole/AddApproveRoles',
            payload: json,
            onlyData: false,
            onComplete: (re) => {
                if (re && re.IsSuccessful) {
                    this.setState({
                        selectUserId: '',
                        selectPreUserId: '',
                        selectNextUserId: '',
                    });
                    this.BtnClose();
                    message.success("添加成功");
                } 
                // else {
                //     // message.error("转办失败");
                // }
            }
        })
    }
    loadData() {
        const jsonUser = initFilter(this.props.login.OrgId)
        jsonUser.Limit=1000;
        this.props.dispatch({
            type: 'app/getDataByPost',
            url: 'PF/ApprovalRole/OrderPaged',
            payload: jsonUser,
            onlyData: false,
            onComplete: (ret) => {
                if (ret) {
                    this.setState({
                        userData: ret.Data,
                        userPreData:ret.Data,
                        userNextData:ret.Data,
                    });
                }
            }
        });
    }

    render() {
        const { userData,userPreData,userNextData } = this.state;
        const formItemLayout = {
            labelCol: { span: 6 },
            wrapperCol: { span: 60 },
        };
        return (
            <Layout style={{backgroundColor:"#fff",marginLeft:"500px",marginTop:"200px"}}>
                 <Form layout="vertical" hideRequiredMark>
            <Row gutter={18}>
                <Col span={6}>
                    <Form.Item
                        label={'当前节点'}
                        {...formItemLayout}
                    >
                        <Select
                            showSearch
                            style={{ width: 200 }}
                            placeholder='选择当前节点'
                            onChange={this.selectChange}
                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                        >

                            {
                                userData
                                    ? userData.map(t => {
                                        return <Option value={t.ID} key={t.ID}>{t.NAME}</Option>
                                    }) : null
                            }
                        </Select>
                    </Form.Item>
                </Col>
                <Col span={6}>
                    <Form.Item
                        label={'上一节点'}
                        {...formItemLayout}
                    >
                        <Select
                            showSearch
                            style={{ width: 200 }}
                            placeholder='选择上一节点'
                            onChange={this.selectPreChange}
                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                        >

                            {
                                userPreData
                                    ? userPreData.map(t => {
                                        return <Option value={t.ID} key={t.ID}>{t.NAME}</Option>
                                    }) : null
                            }
                        </Select>
                    </Form.Item>
                </Col>
                <Col span={6}>
                    <Form.Item
                        label={'下一节点'}
                        {...formItemLayout}
                    >
                        <Select
                            showSearch
                            style={{ width: 200 }}
                            placeholder='选择下一节点'
                            onChange={this.selectNextChange}
                            filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
                        >

                            {
                                userNextData
                                    ? userNextData.map(t => {
                                        return <Option value={t.ID} key={t.ID}>{t.NAME}</Option>
                                    }) : null
                            }
                        </Select>
                    </Form.Item>
                </Col>
            </Row>
            <Row gutter={18}>
                <Col span={18} style={{ textAlign: 'center' }}>
                    <Form.Item span={4}>
                        <Button type="primary" htmlType="complaint" icon="issues-close" onClick={this.onComplaint}>确认添加</Button>
                    </Form.Item>
                </Col>
            </Row>
        </Form>
        </Layout>
        )
    }
}
export default connect(({ login, app }) => ({ login, app }))(Form.create()(PFApproveRole))