index.jsx 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. import React, { Component } from "react";
  2. import styles from "./index.less";
  3. import { Notify,DelToast} from '@commonComp';
  4. import $ from 'jquery';
  5. import checkOff from '@common/images/check_off.png';
  6. import checkOn from '@common/images/check_on.png';
  7. class SlidePic extends Component {
  8. constructor(props) {
  9. super(props);
  10. this.state = {
  11. show:false,
  12. activeInd:false,
  13. activeName:'',
  14. canEdit:true,
  15. style:''
  16. };
  17. this.handleDel = this.handleDel.bind(this);
  18. this.handleCancel = this.handleCancel.bind(this);
  19. this.delConfirm = this.delConfirm.bind(this);
  20. this.setEdit = this.setEdit.bind(this);
  21. this.handleBlur = this.handleBlur.bind(this);
  22. this.checkOnOff = this.checkOnOff.bind(this);
  23. }
  24. componentDidMount() {
  25. $(document).click((event) => {
  26. if($(event.target).attr("id")!='addClose'&&$(event.target).attr("id")!='delTit'){
  27. this.setState({
  28. activeInd:false
  29. })
  30. }
  31. });
  32. }
  33. // shouldComponentUpdate(nextProps,nextState){
  34. // console.log(this.props.item.time , nextProps.item.time,nextState)
  35. // if(this.props.item.time == nextProps.item.time){
  36. // return false
  37. // }
  38. // return true
  39. // }
  40. handleDel(time){
  41. const {handleDelClick,item} = this.props;
  42. this.setState({
  43. activeInd:true,
  44. activeName:item.uniqueName,
  45. })
  46. handleDelClick&&handleDelClick(1,time);
  47. }
  48. handleCancel(){
  49. this.setState({
  50. activeInd:false,
  51. activeName:''
  52. })
  53. }
  54. delConfirm(item){
  55. const {handleDelConfirm,handlePush} = this.props;
  56. handleDelConfirm&&handleDelConfirm(item);
  57. Notify.success("删除成功");
  58. handlePush && handlePush({mode:8}); //右侧推送
  59. this.setState({
  60. activeInd:false,
  61. activeName:''
  62. })
  63. }
  64. handleInput(e,item,sign){
  65. const {setTipValue} = this.props
  66. console.log(item,e.target.value)
  67. setTipValue(item,e.target.value,sign)
  68. }
  69. handleBlur(){
  70. const {handlePush} = this.props;
  71. $('.canEdit').attr('disabled','disabled')
  72. handlePush && handlePush({mode:8}); //右侧推送
  73. }
  74. checkOnOff(item){
  75. const {checkOnOff,handlePush} = this.props
  76. checkOnOff(item)
  77. handlePush && handlePush({mode:8}); //右侧推送
  78. }
  79. setEdit(e){
  80. $('.canEdit').blur().attr('disabled','disabled')
  81. $(e.target).removeAttr('disabled').focus()
  82. }
  83. render() {
  84. const {item,time} = this.props;
  85. const {canEdit,activeInd,activeName,value,style} = this.state;
  86. return (
  87. <li key={item.time} className={`${styles.slideLi} clearfix`}>
  88. <img className={styles.imgCheck} src={item.check?checkOn:checkOff} onClick={()=>this.checkOnOff(item)} alt=""/>
  89. <span className={styles.bigname}>{item.name}</span>
  90. <span className={styles.smallname}>{item.flg == 5?'药品':item.flg == 6?'手术/操作':'输血'}</span>
  91. <span className={styles.edit}>
  92. {
  93. item.flg == 5||item.flg == 8?
  94. <input disabled='disabled' type="text"
  95. class="canEdit"
  96. onDoubleClick={(e)=>this.setEdit(e)}
  97. style={{color:'#333'}}
  98. placeholder={item.flg == 5?'(填写用法计量)':'(填写用量)'}
  99. autoComplete="off"
  100. value={item.value}
  101. onInput={(e)=>{this.handleInput(e,item,2)}}
  102. onBlur={()=>{this.handleBlur()}}
  103. />:null
  104. }
  105. </span>
  106. <span className={styles.pass}>
  107. <input disabled="disabled" type="text"
  108. class="canEdit"
  109. onDoubleClick={(e)=>this.setEdit(e)}
  110. style={{color:'#333'}}
  111. placeholder='时间'
  112. autoComplete="off"
  113. value={item.time}
  114. onChange={(e)=>{this.handleInput(e,item,1)}}
  115. onBlur={(e)=>{this.handleBlur();}}
  116. />
  117. </span>
  118. <span id="addClose" className={styles.partDel} onClick={()=>{this.handleDel(item.time)}}></span>
  119. <DelToast show={time==item.time&&activeInd?true:false}
  120. name={activeName}
  121. right={'-34px'}
  122. top={'30px'}
  123. cancel={this.handleCancel}
  124. confirm={()=>{this.delConfirm(item)}}/>
  125. </li>
  126. );
  127. }
  128. }
  129. export default SlidePic;