// 人员编辑
import React from 'react';
import { Select, Input, Row, Col, Button, Spin, Divider, Popconfirm, Switch, DatePicker, message, Icon, Form, Table, Collapse } from 'antd';


// 组件const
const { Option } = Select;
const Panel = Collapse.Panel;
const formItemLayout = {    // label 和input宽度
    labelCol: { span: 14 },
    wrapperCol: { span: 8, offset: 2 },
};

//专长table
const columnsExp = [{
    title: '专长内容',
    dataIndex: 'a',
    key: '1',
}, {
    title: '操作',
    key: 9,
    align: "center",
    width: 130,
    render: (text, record) => (
        <span>
            <Icon type="delete" style={{ color: 'rgba(240,65,52,1)' }}></Icon>
            <Popconfirm title="删除不可恢复，你确定要删除吗?" onConfirm={() => this.handleDelete(record)} >
                <span className='span' style={{ color: 'rgba(240,65,52,1)' }}>删除</span>
            </Popconfirm>
        </span>
    ),
}]

class OfficeStaffEdit extends React.Component {
    constructor({ props }) {
        super(props)
        this.state = {
            dataExp: [{}],   //专长table数据
        };
    }

    componentDidMount() {

    }

    render() {
        const { getFieldDecorator } = this.props.form;
        return (
            <div style={{ padding: 24 }}>
                <Form layout="vertical" className="depart-form" >
                    <Collapse defaultActiveKey={['1', '2']} >
                        <Panel header="用户信息" key="1">
                            <Row>
                                <Col span={18}>
                                    <Row>
                                        <Col span={2}>
                                            <span>工号:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>1025</span>
                                        </Col>
                                        <Col span={2}>
                                            <span>姓名:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>张三</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>用户名:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>XXX</span>
                                        </Col>
                                        <Col span={2}>
                                            <span>性别:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>男</span>
                                        </Col>
                                        <Col span={2}>
                                            <span>出生日期:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>2011-1-1</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>职称:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>副主任医师</span>
                                        </Col>
                                        <Col span={2}>
                                            <span>语言:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>中文</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>证件类型:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>居民身份证</span>
                                        </Col>
                                        <Col span={2}>
                                            <span>证件号码:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>XXXXXXXXXXXXXXXXXXXXXXXXXXX</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>人员角色:</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>XXXX</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>手机号码:18565614095</span>
                                        </Col>
                                        <Col span={4}>
                                            <span>18565614095</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>简介:</span>
                                        </Col>
                                        <Col span={22}>
                                            <span>擅长足踝部矫形、骨折、陈旧损伤等治疗，特别是拇外翻手术的治疗，包括软组织松解、截骨矫形等。擅长足踝部矫形、骨折、陈旧损伤等治疗，特别是拇外翻手术的治疗，包括软组织松解、截骨矫形等</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>人员类型:</span>
                                        </Col>
                                        <Col span={22}>
                                            <span>医师</span><span>医师</span><span>医师</span><span>医师</span><span>医师</span>
                                        </Col>
                                    </Row>
                                    <Row>
                                        <Col span={2}>
                                            <span>编辑权限:</span>
                                        </Col>
                                        <Col span={22}>
                                            <span>界面编辑</span><span>列编辑</span><span>编辑</span>
                                        </Col>
                                    </Row>
                                </Col>
                                <Col span={6}>
                                    <div><img src="" alt="人员照片" /></div>
                                </Col>
                            </Row>
                        </Panel>
                        <Panel header="科室配置" key="2">
                            <Row>
                                <Col span={2}>
                                    <span>人员专长:</span>
                                </Col>
                                <Col span={22}>
                                    <Select allowClear style={{ width: '150px' }} placeholder="人员专长">
                                        <Option value="0">1</Option>
                                        <Option value="1">2</Option>
                                        <Option value="2">3</Option>
                                    </Select>
                                    <span className="addHref">+添加其他联系方式</span>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={14} >
                                    <Table dataSource={this.state.dataExp} columns={columnsExp} pagination={false} />
                                </Col>
                            </Row>
                            <Row>
                                <Col span={2}>
                                    <span >可查看病人:</span>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="住院病人"  {...formItemLayout} className="labelR" >
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="门诊病人"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="急诊病人"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="只看本人病人"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={2}>
                                    <span >处方权等:</span>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="处方权"  {...formItemLayout} className="labelR" >
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="无医嘱权"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="无病历权"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="无诊断权"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="毒麻药品处方权"  {...formItemLayout} className="labelR">
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={2}>
                                    <span >状态:</span>
                                </Col>
                                <Col span={4}>
                                    <Form.Item label="可用"  {...formItemLayout} className="labelR" >
                                        {getFieldDecorator('ToOthHospItem', {
                                            valuePropName: 'checked',
                                            initialValue: false,
                                        })(
                                            <Switch checkedChildren="是" unCheckedChildren="否" />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={2}>
                                    <span >生效日期:</span>
                                </Col>
                                <Col span={4} className="dpW100">
                                    <Form.Item >
                                        {getFieldDecorator('LocTypeDr', {
                                            initialValue: '',
                                            rules: [{ required: true, message: '请选择生效日期' }]
                                        })(
                                            <DatePicker format='HH:mm' />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={2}>
                                    <span >失效日期:</span>
                                </Col>
                                <Col span={4} className="dpW100">
                                    <Form.Item >
                                        {getFieldDecorator('LocTypeDr', {
                                            initialValue: '',
                                            rules: [{ required: true, message: '请选择失效日期' }]
                                        })(
                                            <DatePicker format='HH:mm' />
                                        )}
                                    </Form.Item>
                                </Col>
                            </Row>
                        </Panel>
                    </Collapse>
                    <Row style={{ width: '100%', textAlign: 'center', marginTop: "30px" }}>
                        <Button onClick={this.handelSave} style={{ marginRight: '15px', background: 'rgba(66,185,131,1)', color: '#fff' }}>保存</Button>
                    </Row>
                </Form>
            </div>
        )
    }
}


const OfficeStaffEditFrom = Form.create()(OfficeStaffEdit);

export default OfficeStaffEditFrom