import React, { Component } from "react";
import style from "./index.less";
import printImg from '@common/images/icon_print_blue.png';
import preview from '@common/images/preview.png';
import saveHistory from '@common/images/saveHistory.png';
import PrintPreviewContainer from '@containers/PrintPreviewContainer';
import PreviewContainer from '@containers/PreviewContainer';
import { ConfirmModal, Notify } from '@commonComp';
import { changeVisible } from '@store/actions/tabTemplate';
import {getAllDataList,getAllDataStringList} from '@utils/tools';
import store from '@store';


class Operation extends Component {
  constructor(props) {
    super(props)
    this.state = {
      title: '',
      visible: false,
      okText: '',
      borderColor: '',
      okColor: '',
      oKBg: '',
      msg: '',
      type: '',
      zIndex:40
    }
    this.showPrint = this.showPrint.bind(this);
    this.closePrint = this.closePrint.bind(this);
    this.showPreview = this.showPreview.bind(this);
    this.closePreview = this.closePreview.bind(this);
    this.saveAll = this.saveAll.bind(this);
    this.clearAll = this.clearAll.bind(this);
    this.saveHis = this.saveHis.bind(this);
    this.keypress = this.keypress.bind(this);
  }

  showPrint() {
    this.setState({
      zIndex:240
    })
    this.props.showPrintPreview()
  }

  closePrint() {
    this.setState({
      zIndex:40
    })
    this.props.closePrintPreview()
  }


  showPreview() {
    this.setState({
      zIndex:240
    })
    this.props.showPreview()
  }

  closePreview() {
    this.setState({
      zIndex:40
    })
    this.props.closePreview()
  }

  saveAll(type) {
    let flg = this.keepHistory();
    if(flg){
      this.setState({
        type: type,
        visible: true,
        okText: '保存',
        borderColor: '#3B9ED0',
        okColor: '#fff',
        oKBg: '#3B9ED0',
        msg: <p className={style['msg']}>是否保存该病历？</p>
      })
    }
  }
  keepHistory(){
    let baseList = store.getState();
    let jsonStr = getAllDataStringList(baseList);
    if(JSON.parse(jsonStr.chief).length == 1 && JSON.parse(jsonStr.chief)[0].trim() ==''){
        Notify.info('主诉不能为空');
        return false;
    }else if(jsonStr.chief && JSON.parse(jsonStr.chief).length < 1){
        Notify.info('主诉不能为空');
        return false;
    }else if(!jsonStr.diag || jsonStr.diag.trim().length < 1){
        Notify.info('诊断不能为空');
        return false;
    }else{
      return true;
    }
  }
  clearAll(type) {
    let flg = this.isClear();
    if(flg){
      this.setState({
        type: type,
        visible: true,
        okText: '清除',
        borderColor: 'red',
        okColor: 'red',
        oKBg: '#fff',
        msg: <p className={style['msg']}>是否清空所有内容？</p>
      })
    }
  }
  isClear(){
    let baseList = store.getState();
    let jsonData = getAllDataList(baseList);
    let jsonStr = getAllDataStringList(baseList);
    if (      //结构化和文本数据都为空
      JSON.stringify(jsonData.advice) == '{}' &&
      jsonData.chief.length < 1 &&
      jsonData.diag.length < 1 &&
      jsonData.vital.length < 1 &&
      jsonData.other.length < 1 &&
      jsonData.pacs.length < 1 &&
      jsonData.present.length < 1 &&
      jsonData.lis.labelList.length < 1 &&
      jsonData.lis.getExcelDataList.length < 1 &&
      JSON.stringify(jsonData.advice) == '{}' && 
      jsonStr.chief == '[]' && 
      jsonStr.present == '[]' && 
      jsonStr.other == '[]' && 
      jsonData.vital.length < 1 && 
      jsonData.diag.length < 1 && 
      jsonData.pacs.length < 1 && 
      jsonData.lis.labelList.length < 1 && 
      jsonData.lis.getExcelDataList.length < 1
    ) {
      Notify.info('当前页面数据已清空');
      return false;
    }else{
      return true;
    }
  }
  onchange(val) {
    this.setState({
      title: val
    })
  }
  keypress(e) {
    if (e.keyCode == 13) {
      this.makeSure()
      store.dispatch(changeVisible(false))
    }
  }
  saveHis(type) {
    let flg = this.getAllData()
    if(flg){
      this.setState({
        visible: true,
        title: '',
        type: type,
        okText: '保存',
        borderColor: '#3B9ED0',
        okColor: '#fff',
        oKBg: '#3B9ED0',
        msg: this.changeTitle()
      })
    }
  }
  getAllData(){
    let baseList = store.getState();
    let jsonData = getAllDataList(baseList);
    let jsonStr = getAllDataStringList(baseList);
    let whichSign = baseList.typeConfig.typeConfig;
    let activeItemData = baseList.tabTemplate.activeItem;
    // let preview = (activeItemData.preview).split('-').join('');
    // console.log(activeItemData.dataJson,4545554)
    // console.log(JSON.stringify(jsonData),4545554)
    if (whichSign == 0) {
      if (activeItemData && JSON.stringify(activeItemData) != '{}' && (activeItemData.dataJson == JSON.stringify(jsonData)) && (JSON.stringify(jsonStr) == JSON.stringify(JSON.parse(activeItemData.preview)))) {
        Notify.info('该模板已保存');
        return false;
      }else if (
        JSON.stringify(jsonData.advice) == '{}' &&
        jsonData.chief.length < 1 &&
        jsonData.diag.length < 1 &&
        jsonData.vital.length < 1 &&
        jsonData.other.length < 1 &&
        jsonData.pacs.length < 1 &&
        jsonData.present.length < 1 &&
        jsonData.lis.labelList.length < 1 &&
        jsonData.lis.getExcelDataList.length < 1
      ) {
        Notify.info('模板数据不能为空');
        return false;
      }else{
        return true;
      }
    } else if(whichSign == 1) {
      if (activeItemData && JSON.stringify(activeItemData) != '{}' && (JSON.stringify(jsonStr) == JSON.stringify(JSON.parse(activeItemData.preview)))) {
        Notify.info('该模板已保存');
        return false;
      }else if (JSON.stringify(jsonData.advice) == '{}' && 
          jsonStr.chief == '[]' && 
          jsonStr.present == '[]' && 
          jsonStr.other == '[]' && 
          jsonData.vital.length < 1 && 
          jsonData.diag.length < 1 && 
          jsonData.pacs.length < 1 && 
          jsonData.lis.labelList.length < 1 && 
          jsonData.lis.getExcelDataList.length < 1
        ) {
        Notify.info('模板数据不能为空');
        return false;
      }else{
        return true;
      }
    }else{
      return true;
    }
  }
  changeTitle() {
    return <div className={style['box']}>
      <input className={style['ipt']}
        placeholder="请输入模板名称"
        type="text"
        maxLength='30'
        onChange={(e) => {
          let val = e.target.value
          if (e.target.value.length > 30) {
            e.target.value = val.substring(0, 30)
            this.onchange(val.substring(0, 30))
          } else {
            this.onchange(e.target.value)
          }
        }}
        onKeyPress={e => this.keypress(e)}
      />
      <div className={style['line']}></div>
    </div>
  }
  makeSure() {
    const { save, clear, saveDataAll } = this.props;
    const { type } = this.state;
    if (type == 1) {
      this.setState({ visible: false, title: '' })
      save();
    } else if (type == 2) {
      this.setState({ visible: false, title: '' })
      clear();
    } else if (type == 3) {
      if (this.state.title.trim() == '') {
        Notify.error('请输入模板名称')
        return;
      }
      saveDataAll(this.state.title);
      this.setState({ visible: false, title: '' });
    }
  }
  render() {
    const { showPrint, closePrint, showPreview, closePreview } = this;
    const { visible, preVisible } = this.props.print;
    const {zIndex} = this.state;

    return <div className={style['container']} style={{zIndex:zIndex}}>
      <button className={style['button']} onClick={showPrint}><img src={printImg} /> 打印病历</button>
      <button className={style['preButton']} onClick={showPreview}><img src={preview} /> 预览</button>
      <button className={style['preButton']} onClick={() => { this.saveHis(3) }}><img src={saveHistory} /> 保存病历模板</button>
      <button className={style['saveButton']} onClick={() => { this.saveAll(1) }}>保存</button>
      <button className={`${style['clearButton']} ${style['saveButton']}`} onClick={() => { this.clearAll(2) }}>清除</button>
      <PrintPreviewContainer visible={visible} onClose={closePrint} />
      <PreviewContainer visible={preVisible} onClose={closePreview} />
      <ConfirmModal
        visible={this.state.visible}
        confirm={() => { this.makeSure() }}
        close={() => { this.setState({ visible: false, title: '' }) }}
        cancel={() => { this.setState({ visible: false, title: '' }) }}
        okText={this.state.okText}
        okBorderColor={this.state.borderColor}
        okColor={this.state.okColor}
        oKBg={this.state.oKBg}
      >
        {this.state.msg}
      </ConfirmModal>
    </div>;
  }
}

export default Operation;
