newICSS/src/components/WrapModalBody/WrapModalTableSon/index.jsx

import React from "react";
import style from "../index.less";
import check_circle from '../img/check-circle.png';
import check_right from '../img/check-right.png';
import {getStatusImg} from '@utils/tools';

class WrapModalTableSon extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      msg:'选中异常值数据'
    }
    this.getImgPath = this.getImgPath.bind(this)
    this.selectWaring = this.selectWaring.bind(this)
    this.allCheckImportIns = this.allCheckImportIns.bind(this)
    this.selectOneCheck = this.selectOneCheck.bind(this)
  }
  selectOneCheck(name,groupName,item){
    const {selectOneCheck,allCheck} = this.props
    selectOneCheck&&selectOneCheck(name,groupName,item)
    
    setTimeout(() => {
      console.log(allCheck,78787)
    }, 1000);
  }
  getImgPath(name,groupName,item){
    const { checkedList } = this.props;
    let num = 0;
    for(let k = 0;k < checkedList.length;k++){
      let tmpLis = checkedList[k];
      if(tmpLis == name){
        return <img className={style.check} onClick={()=>this.selectOneCheck(name,groupName,item)} src={check_right} alt="" />
      }else{
        ++num
      }
    }
    if(num == checkedList.length){
      return <img className={style.check} onClick={()=>this.selectOneCheck(name,groupName,item)} src={check_circle} alt="" />
    }
  }
  selectWaring(){
    let tmpMsg = this.state.msg
    const { selectWaring,hospitalSonInspect,checkedList,allCheck } = this.props;
    // console.log(checkedList)
    // let tmpAll = false,num=0;
    // if(hospitalSonInspect&&hospitalSonInspect.lisExcelWrapper){
    //   for(let i = 0;i < hospitalSonInspect.lisExcelWrapper.length;i++){
    //     for(let j = 0;j < checkedList.length;j++){
    //       if(hospitalSonInspect.lisExcelWrapper[i].itemName == checkedList[j]&&hospitalSonInspect.lisExcelWrapper[i].type!=0){
    //         num++
    //       }
          
    //     }
    //   }
    // }
    // console.log(num,'sssssssssssssss')
    // this.setState({
    //   msg:(num == 0)?'取消选中异常值数据集':'选中异常值数据'
    // },()=>{
    //   selectWaring&&selectWaring()
    // })
    this.setState({
      msg:tmpMsg=='取消选中异常值数据集'?'选中异常值数据':'取消选中异常值数据集'
    })
    selectWaring&&selectWaring()
  }
  allCheckImportIns(){
    const { allCheckImportIns,allCheck } = this.props;
    if(!allCheck){
      this.setState({
        msg:'取消选中异常值数据集'
      })
    }else{
      this.setState({
        msg:'选中异常值数据'
      })
    }
    allCheckImportIns&&allCheckImportIns()
  }
  render() {
    const { hospitalSonInspect,allCheck } = this.props;
    return <div className={style['modalTable']}>
      <div className={style.sonTitle}>
        <span>组名称 : {hospitalSonInspect.groupName}</span><span className={style.btn} onClick={this.selectWaring}>{this.state.msg}</span>
      </div>
      <div className={`${style.SonTable}`}>
        <table>
          <tr className={style.head}>
            <td className={`${style.fst}`} onClick={this.allCheckImportIns}><img className={style.check} src={allCheck?check_right:check_circle} alt="" />全选</td>
            <td className={`${style.sec}`}>编号</td>
            <td className={`${style.trd}`}>项目名称</td>
            <td className={`${style.four}`}>结果</td>
            <td className={`${style.fif}`}>单位</td>
            <td className={`${style.six}`}>参考值</td>
            <td className={`${style.sev}`} style={{display:(hospitalSonInspect && hospitalSonInspect.lisExcelWrapper && hospitalSonInspect.lisExcelWrapper.length)>5?'':'none'}}></td>
          </tr>
        </table>
      </div>
      <div className={`${style.parentTable} ${style.parentTables} ${style.SonTable}`}>
        <table>
          {/* {type-0正常1异常2上升3下降} */}
          {
            hospitalSonInspect && hospitalSonInspect.lisExcelWrapper && hospitalSonInspect.lisExcelWrapper.map((item, idx) => {
              return <tr>
                <td className={`${style.fst}`}>
                  {
                    this.getImgPath(item.itemName,hospitalSonInspect.groupName,item)
                  }
                </td>
                <td className={`${style.sec}`}>{idx+1}</td>
                <td title={item.itemName} className={`${style.trd}`}>{item.itemName}</td>
                <td title={item.value} className={`${style.four}`}>
                  {
                    getStatusImg(item.type,item.value,1)
                  }
                </td>
                <td title={item.unit} className={`${style.fif}`}>{item.unit}</td>
                <td title={`${item.min}-${item.max}`} className={`${style.six}`}>{item.min}-{item.max}</td>
              </tr>
            })
          }
        </table>
      </div>
    </div>
  }
}

export default WrapModalTableSon;