/*
 * Creator:     ML
 * CreatDate:   
 * descripts：建卡登记 寻找病人
 * */
import React from 'react';
import { Form, Row, Col, Input,message,Select, Button, Modal, Table, Pagination } from 'antd';
import { $http } from '../../containers/config/https';
import './css/error.less';
import CommonPagination from 'components/pagination/index';

const FormItem = Form.Item;
const formItemNumber = {
  labelCol: { span: 4 },
  wrapperCol: { span: 20 },
}
const FindPatients = Form.create()(
  class FindPatients extends React.Component {
    constructor(props) {
      super(props)
      this.state = {
        number: '',//登记号/手机号码/证件号码/病人姓名
        total: 0,//表格总数据
        tableData: [],//表格数据
        parms: {},//单行信息
        page: 1,//页数
        pageSize: 10,//显示数
        loading: false,//确定按钮 loading
        visible: false,//查找病人弹窗
        rowId: "",//控制行高亮
        checkStaus: false,//是否点击行
        findInfo:'请输入查询条件',//查询提示信息
        size:"small",
        search:"", 

        inputBoxStatus: '', //输入框状态
      }
    }
    componentDidMount() {
      this.props.OnChildrefs(this);
      if(this.state.size=="small"){
        this.setState({
          pageSize:10
        })
      }else{
        this.setState({
          pageSize:50
        })
      }
    }
    handleOk = (e) => {
    }
    //默认显示带回的关联病人
    setValue=(value)=>{
      // console.log('接收到的',value)
      if(value==1){
        return
      }
      this.props.form.setFieldsValue({ number: value });
      this.setState({
        page:1,
        pageSize:this.state.pageSize
      },()=>{
        this.getTableData("search");
      })
      setTimeout(()=>{
        if(this.state.tableData&&this.state.tableData.length>0){
          this.setState({
          rowId: this.state.tableData[0].patNo,
          parms: this.state.tableData[0]
        })
        }
      },600)
    }
    showModal = () => {
      this.setState({
        visible: true,
      });
    }
    handleCancel = () => {
      // this.setState({ visible: false, checkStaus: false, tableData: [], loading: false, rowId: '', total: 0, page: 1, pageSize: 10 ,findInfo:'请输入查询条件'});
      this.setState({visible: false,})
    }
    //搜索框 值改变
    changeValue=()=>{
      this.setState({
        rowId:""
      })
    }
    //查询
    handleQuery = () => {
      this.setState({ page: 1, pageSize: this.state.pageSize }, () => {
        let { number } = this.state;
        this.getTableData("search");
      })
    }
    // 修改page和pageSize 跳转至---
    onChange = (page,) => {
      this.setState({ page: page, pageSize: this.state.pageSize }, () => {
        // 重新调用查询方法
        let { number, name } = this.state;
        this.getTableData();
      })
    }
    //下拉选择页数
    onShowSizeChange = (page, pageSize) => {
      this.setState({ page: 1, pageSize: pageSize }, () => {
        // 重新调用查询方法
        let { number, name } = this.state;
        this.getTableData("search");
      })
    }
    // 显示分页总条数
    showTotal(total) {
      return `共 ${total} 条`;
    }
    //点击Row
    onClickRow = (record) => {
      return {
        onClick: () => {
          // console.log("rerere",record)
          this.setState({
            parms: record,
            checkStaus: true
          })
          if (this.state.rowId === "") {
            this.setState({
              rowId: record.patNo,
            });
          } else {
            if (this.state.rowId !== record.patNo) {
              this.setState({
                rowId: record.patNo,
              });
            } else {
              this.setState({
                rowId: "",
                detailInfo: {},
              });
            }
          }

        },
        onDoubleClick: () => {
          console.log('进入双击方法');
          this.setState({
            rowId: record.patNo,
            parms: record,
            inputBoxStatus: 'Y',
            checkStaus: true
          }, () => {
            this.handleRow()
          })
          
        }
      };
    }
    //设置点击row颜色
    setRowClassName = (record) => {
      return record.patNo === this.state.rowId ? 'clickRowStyle' : '';
    }
    resetEditFieldData = () => {
      this.setState({
        rowId: "",
        detailInfo: {}
      });
    }
    // 请求列表数据
    getTableData = (info) => {
      let { page, pageSize, } = this.state;
      let data = {}
      data = {
        params: [{
          number: this.props.form.getFieldValue('number'),
        }],
        pagination: [{
          pageSize: pageSize,
          currentPage: page,
        }]
      }
      $http.post('urlS', this, {
        code: '03030004',
        data: data,
        success: function (res) {
          if (+res.errorCode === 0 && res.result) {
            for (var i = 0; i < res.result.Data.length; i++) {
              res.result.Data[i]["key"] = i + "find"
            }
            this.setState({
              search: info,
              tableData: res.result.Data, 
              total: res.result.TotalCount,
              rowId: res.result.Data&&res.result.Data.length!=0?res.result.Data[0].patNo:"",
              parms: res.result && res.result.Data && res.result.Data.length > 0 ? res.result.Data[0] : {},
              findInfo:res.result.Data&&res.result.Data.length==0?'未查询到满足条件的病人信息，请核对信息':''
            })
          } else {
          
          }
        }
      })
    }
    //选中行--确认
    handleRow = () => {
      this.handleCancel()
      this.props.handleParms(this.state.parms, this.state.inputBoxStatus)
    }
     //病人列表页面移动
    handleOnKeydown = (e) => {
      // console.log("----------",this.state.patientInfo)
      const {tableData} = this.state
      var e = window.event || e;
      let id = '';
      let oneArr = tableData&&tableData.length > 0 ? tableData : [];
      switch (e.keyCode) {
      case 13:
          e.preventDefault();
          if (this.state.rowId) {
            this.setState({
              visible: false,
            })
              let obj = {}
              for(var i = 0; i < oneArr.length; i++) {
                  if (oneArr[i].patNo === this.state.rowId) {
                      obj = i > 0 ? oneArr[i] : oneArr[0];
                      break;
                  }
              }
              // console.log("当前",obj)
              this.setState({
                visible: false,
                rowId: obj.patNo, 
                parms: obj,
                },()=>{
                  this.handleRow()
                })
                
              // this.checkNowData(obj)
              // this.confirmSelection(obj);
          } else {
              // message.info("请选择一条需要操作的数据")
          }
          break;
      case 38: //上
          if (this.state.rowId) {
              for(var i = 0; i < oneArr.length; i++) {
                  if (oneArr[i].patNo === this.state.rowId) {
                      id = i > 0 ? oneArr[i - 1].patNo : oneArr[0].patNo;
                      break;
                  }
              }
              this.setState({rowId: id})
          } else {
              this.setState({rowId: oneArr[0].patNo})
          }
          break;
      case 40: //下
          if (this.state.rowId) {
              for(let i = 0; i < oneArr.length; i++) {
                oneArr[i].disblock = false
                  if (oneArr[i].patNo === this.state.rowId) {
                      id = i + 1 >= oneArr.length ? oneArr[oneArr.length - 1].patNo : oneArr[i + 1].patNo;
                      break;
                  }
              }
              this.setState({rowId: id})
          } else {
              this.setState({rowId: oneArr[0].patNo})
          }
          break;
      }
  }
    render() {
      const { getFieldDecorator } = this.props.form;
      const { total, checkStaus, } = this.state
      const columns = [{
        key: '1',
        title: '病人ID',
        dataIndex: 'patNo',
        width: '15%',
        align: "center",
      }, {
        key: '2',
        title: '病人姓名',
        dataIndex: 'patName',
        width: '15%',
        align: 'center'
      }, {
        key: '3',
        title: '性别',
        dataIndex: 'patSexDesc',
        width: '8%',
        align: "center",
      }, {
        key: '4',
        title: '出生日期',
        dataIndex: 'patBirthDate',
        width: '15%',
        align: "center",
      }, {
        key: '5',
        title: '证件类型',
        dataIndex: 'patCredTypeDesc',
        width: '15%',
        align: "center",
      }, {
        key: '6',
        title: '证件号码',
        dataIndex: 'patCredNo',
        width: '20%',
        align: "center",
      }, {
        key: '7',
        title: '手机号码',
        dataIndex: 'patMobile',
        width: '20%',
        align: "center",
      }]
      return (
        <div
        tabIndex={1}
        onKeyDown={this.handleOnKeydown}
        style={{outline: 'none'}}
        >
        <Modal
          className='findPatients'
          width='1000px'
          visible={this.state.visible}
          title="查找病人"
          onOk={this.handleOk}
          onCancel={this.handleCancel}
          footer={[
            <Button key="submit" type="primary" loading={this.setState.loading} disabled={this.state.rowId==""} onClick={this.handleRow}>确定</Button>,
            <Button key="cancel" type="primary" loading={this.setState.loading} onClick={this.handleCancel}>取消</Button>,

          ]}>
          <div style={{ minHeight: '252px' }}>
            <Row>
              <Col span={12}>
                <FormItem label="病人信息" {...formItemNumber}>
                  {getFieldDecorator('number', {
                    initialValue:undefined,
                  })(
                    <Input allowClear placeholder='输入病人ID/姓名/证件号码/手机号码回车查询' onChange={this.changeValue} onPressEnter={this.handleQuery} autoFocus style={{ width: '84%', marginRight: '8px' }} />
                  )}
                </FormItem>
              </Col>
              <Col span={2} style={{ marginLeft: '-48px' }}>
                <FormItem >
                  {getFieldDecorator('checkInp', {
                    initialValue: undefined,
                    rules: [{ required: false, message: '' }],
                  })(
                    <Button style={{ background: 'rgba(66,185,131,1)', color: '#fff', }} onClick={this.handleQuery}>查询</Button>
                  )}
                </FormItem>
                </Col>
            </Row>
            <div

            >
              <Table
                pagination={false}
                columns={columns}
                dataSource={this.state.tableData}
                rowClassName={this.setRowClassName}
                onRow={this.onClickRow}
                rowKey={record => record.key}
                locale={{emptyText:this.state.findInfo}}
                style={{
                  marginTop: '12px', height: '496px',
                  overflow: 'auto'
                }}
              />
              {
                this.state.tableData&&this.state.tableData.length>0? <CommonPagination size={this.state.size} current={this.state.page} total={this.state.total} search={this.state.search}
                onShowSizeChange={this.onShowSizeChange.bind(this)} complete={true} dataSource={this.state.tableData}
                onChange={this.onChange.bind(this)} />:""
            }
            </div>
          </div>
        </Modal>
        </div>
      )
    }
  })
export default FindPatients    