/*
 * Creator:     ML
 * CreatDate:   2019-11-06
 * descripts：  科室挂号医生对照
 * */
import React from 'react';
import { Card, Divider, Row, Col, Select, Table, Popconfirm, Button, Input, message } from 'antd';
import store from 'store';
import { $http } from '../../../containers/config/https';
import "../style/index.less";
const Option = Select.Option;


class DepartmentContrastDoctor extends React.Component {
  constructor(props) {
    super(props)
    var userData = JSON.parse(sessionStorage.getItem('userData'))
    this.state = {
      docArr: [],
      toDocArr: [],
      rowId: "",
      leftData: [],
      rightRowId: "",
      rightData: [],
      regDoctor: "",
      doctorDec: "",
      selectedRowIds_O: [],
      btnStatus: true
    }
  }

  componentDidMount() {
    // var x = document.querySelectorAll(".ant-table-body");
    // for (var i = 0; i < x.length; i++) {
    //   x[i].style.height = store.getState().tableHeight.y + 'px';
    // }
    this.getleftContrasDoctor()
  }

  //获取挂号医生设置对照列表---左侧
  getleftContrasDoctor = (num) => {
    let data = {}
    data = {
      params: [{
        locID: this.props.locID,
        inputValue: num == "1" ? this.state.regDoctor : (num == "2" ? this.state.doctorDec : ""),
      }],
    }
    $http.post('urlS', this, {
      code: '03020058',
      data: data,
      success: function (res) {
        if (+res.errorCode === 0) {
          if (num == "1") {
            this.setState({
              leftData: res.Data
            })
          } else if (num == "2") {
            this.setState({
              rightData: res.Data,
              // selectedRowKeys_right: [],//对照医生seqNo
              // selectedRowIds_O:[],//对照医生id集
              btnStatus: true
            })
            this.getDocArrID(this.state.rowId)
          } else {
            this.setState({
              leftData: res.Data,
              rightData: res.Data
            })
          }
        }
      }, error: function () {

      }
    })
  }

  //保存对照
  saveCon = () => {
    let data = {}
    data = {
      params: [{
        locID: this.props.locID,
        regDocID: this.state.rowId || "",
        doctorID: this.state.selectedRowIds_O || [],
        updateUserID: sessionStorage.userData ? JSON.parse(sessionStorage.userData).userID : ""
      }],
    }
    $http.post('urlS', this, {
      code: '03040034',
      data: data,
      success: function (res) {
        if (+res.errorCode === 0) {
          message.success("对照成功")
          this.getleftContrasDoctor("1")
          this.setState({
            btnStatus: true
          })
        } else {

        }
      }, error: function () {

      }
    })
  }

  //清除对照
  delect = (regID) => {
    let data = {}
    data = {
      params: [{
        locID: this.props.locID,
        regDocID: regID || "",
        updateUserID: sessionStorage.userData ? JSON.parse(sessionStorage.userData).userID : ""
      }],
    }
    $http.post('urlS', this, {
      code: '03040035',
      data: data,
      success: function (res) {
        if (+res.errorCode === 0) {
          message.success("清除对照成功")
          this.getleftContrasDoctor("1")
          this.setState({
            btnStatus: true
          })
        } else {

        }
      }, error: function () {

      }
    })
  }

  //挂号医生模糊搜索
  handleRegDoc = (e) => {
    if (e) {
      this.setState({
        regDoctor: e.target.value
      })
      if (e.target.value.length == 0) {
        this.setState({
          regDoctor: ""
        })
      }
    }
  }

  //对照医生模糊搜索
  handleDoc = (e) => {
    if (e) {
      this.setState({
        doctorDec: e.target.value
      })
      if (e.target.value.length == 0) {
        this.setState({
          doctorDec: ""
        })
      }
    }
  }

  //获取医生对照医生id
  getDocArrID = (recordID) => {
    let data = {}
    data = {
      params: [{
        locID: this.props.locID,
        regDocID: recordID || "",
      }],
    }
    $http.post('urlS', this, {
      code: '03040033',
      data: data,
      success: function (res) {
        if (+res.errorCode === 0) {
          //对照医生
          let arr = []
          let arrID = []
          this.state.rightData.map((items, index) => {
            res.Data.map((item, i) => {
              if (item.doctorID == items.doctorID) {
                arr.push(index)
              }
              arrID.push(item.doctorID)
            })
          })
          this.setState({
            selectedRowKeys_right: arr,//对照医生seqNo
            selectedRowIds_O: arrID,//对照医生id集
          })
        } else {

        }
      }, error: function () {

      }
    })
  }

  //点击Row 左侧表格  挂号医生
  onClickRow = (record) => {
    return {
      onClick: () => {
        if (record.doctorID) {
          if (this.state.rowId === "") {
            this.setState({
              rowId: record.doctorID,
            });
            this.getDocArrID(record.doctorID)
          } else {
            if (this.state.rowId !== record.doctorID) {
              this.setState({
                rowId: record.doctorID,
              });
              this.getDocArrID(record.doctorID)
            } else {
              this.setState({
                rowId: "",
                selectedRowKeys_right: [],//对照医生seqNo
                selectedRowIds_O: [],//对照医生id集
              });
            }
          }
        }
      },
      onDoubleClick: () => {
        this.setState({
          rowId: "",
          selectedRowKeys_right: [],//对照医生seqNo
          selectedRowIds_O: [],//对照医生id集
        });
      }
    }
  }

  //设置点击row颜色 --左侧表格
  setRowClassName = (record) => {
    return record.doctorID === this.state.rowId ? 'clickRowStyle' : '';
  }

  render() {
    const { docArr, toDocArr } = this.state
    //左侧查询数据表
    const columns = [
      {
        align: "center",
        title: '工号',
        dataIndex: 'code',
        key: '1',
        width: 100,
      },
      {
        align: "center",
        width: 100,
        title: '姓名',
        dataIndex: 'descripts',
        key: '2',
      },
      {
        align: "center",
        width: 100,
        title: '职称',
        dataIndex: 'titleDesc',
        key: '3',
      },
      {
        align: "center",
        width: 100,
        title: '操作',
        dataIndex: '',
        key: '4',
        render: (text, record, index) => {
          return (
            <span>
              <Popconfirm title="清除不可恢复，你确定要清除对照吗?" onConfirm={(e) => this.delect(record.doctorID)} >
                <Button disabled={record.flag == "N"} type="primary" style={{ border: "0", background: "0", boxShadow: "0 0 0", color: (record.flag == "N" ? "rgba(0, 0, 0, 0.25)" : "#f5222d") }}>清除对照</Button>
              </Popconfirm>
            </span>
          )
        }
      },
    ];
    //右侧查询数据表
    const rightColumns = [
      {
        align: "center",
        title: '工号',
        dataIndex: 'code',
        key: '1',
        width: 100,
      },
      {
        align: "center",
        width: 100,
        title: '姓名',
        dataIndex: 'descripts',
        key: '2',
      },
      {
        align: "center",
        width: 100,
        title: '职称',
        dataIndex: 'titleDesc',
        key: '3',
      },
    ];
    //右侧选择
    const rowSelection_right = {
      selectedRowKeys: this.state.selectedRowKeys_right,
      onChange: (selectedRowKeys, selectedRows) => {
        let selectrow = "";
        let btnStatus = false;
        if (selectedRowKeys.length === 0) {
          btnStatus = true;
        } else {
          selectrow = selectedRowKeys[selectedRowKeys.length - 1];
        }
        let arr = []
        selectedRows.map((item, i) => {
          arr.push(item.doctorID)
        })
        this.setState({ btnStatus: btnStatus, selectedRowIds_O: arr, selectrow: selectrow, selectedRow_right: selectedRows, selectedRowKeys_right: selectedRowKeys }, () => {
        });
      },
      onSelectAll: (selected, selectedRows, changeRows) => {
        if (selectedRows.length > 0) {
          this.setState({
            btnStatus: false,
          })
        } else {
          this.setState({
            btnStatus: true,
          })
        }
        let arr = []
        selectedRows.map((item, i) => {
          arr.push(item.doctorID)
        })
        this.setState({ selectedRowIds_O: arr, selectedRow_right: selectedRows });
      },
      getCheckboxProps: record => ({
        disabled: this.state.rowId == "", // Column configuration not to be checked
        // name: record.name,
      }),
    };

    return <div className='departConDocDom' style={{ height: '100%' }}>
      <Row>
        <Col span={12}>
          <Card title="挂号医生">
            <Row>
              <Col span={12}>
                挂号医生
                <Input showSearch allowClear optionFilterProp="role" value={this.state.regDoctor} onChange={this.handleRegDoc} onPressEnter={() => this.getleftContrasDoctor("1")} placeholder='输入医生工号/姓名回车检索'>
                </Input>
              </Col>
              <Col span={12} style={{ textAlign: "right" }}>
                <Button disabled={this.state.btnStatus} onClick={this.saveCon}>保存对照</Button>
              </Col>
            </Row>
            <Row>
              <Table
                className="components-table-demo-nested"
                columns={columns}
                pagination={false}
                rowClassName={this.setRowClassName}
                onRow={this.onClickRow}
                rowKey={record => record.key}
                dataSource={this.state.leftData}
                scroll={{ x: 400, y: store.getState().tableHeight.y - 50 }}
                style={{ height: store.getState().tableHeight.y + 'px', overflow: (this.state.leftData && this.state.leftData.length > 0 ? "auto" : "hidden") }}
              />
            </Row>
          </Card>
        </Col>
        <Col span={12}>
          <Card title="对照医生">
            <Row>
              <Col span={10}>
                对照医生
                <Input allowClear value={this.state.doctorDec} onChange={this.handleDoc} onPressEnter={() => this.getleftContrasDoctor("2")} placeholder='输入医生工号/姓名回车检索'></Input>
              </Col>
            </Row>
            <Row className="rightDom">
              <Table
                className="components-table-demo-nested"
                columns={rightColumns}
                pagination={false}
                rowClassName={this.setRightRowClassName}
                onRow={this.onClickRightRow}
                rowKey={record => record.key}
                dataSource={this.state.rightData}
                rowSelection={rowSelection_right}
                disabled={this.state.rowId == ""}
                scroll={{ x: 300, y: store.getState().tableHeight.y - 50 }}
                style={{ height: store.getState().tableHeight.y + 'px', overflow: (this.state.rightData && this.state.rightData.length > 0 ? "auto" : "hidden") }}
              />
            </Row>
          </Card>
        </Col>
      </Row>
    </div>
  }
}
export default DepartmentContrastDoctor;