import React,{ Component } from 'react';
import style from './index.less';
import GeneralTreat from './GeneralTreat/index.jsx';
import DrugTreat from './DrugTreat/index.jsx';
import TreatDesc from '@components/TreatDesc'
import DrugInfo from '@components/TreatDesc/DrugInfo';
import Notify from '@commonComp/Notify'
import close from './img/close.png';
import generalIcon from './img/general.png';

import surgicalIcon from './img/surgical.png';

class Treat extends Component {
    constructor(props){
        super(props);
        this.hideTreat = this.hideTreat.bind(this);
        this.handlePrescription = this.handlePrescription.bind(this);
        this.handleDetermine = this.handleDetermine.bind(this);
    }

    hideTreat() {
        const { hideTreat,clearTreat } = this.props;
        clearTreat && clearTreat();
        hideTreat && hideTreat();
    }
    handlePrescription() {
        Notify.info('该功能即将上线，敬请期待。', 2000)
    }
    handleDetermine() {
        const { title, treatment } = this.props
        const { addScheme } = this.props
        addScheme && addScheme(title, treatment);
        this.hideTreat()
    }
    showDrugInfo() {
        const {  showDrugInfo } = this.props;
        showDrugInfo && showDrugInfo();
    }

    render(){
        const { generalTreat, treatment, surgeryTreat, selectDrug, drugInfo, treatDesc, setOtherRecommend, setDrugInfo, showDrug, showDrugInfo,hideDrugInfo, title} = this.props;
        return(
        <div className={style['treat-mask']}>
            <div  id='treatWrapper' className={style['treat-wrapper']}>
                
                <div className={style['treat-box']}>
                    <p className={style['treat-title']}>治疗方案 <img onClick={this.hideTreat} src={close}/></p>
                    <div className={style['treat-inner-box']}>
                        <GeneralTreat icon={generalIcon} title='一般治疗' titleBg='rgba(47,199,156,0.1)' filter='progid:DXImageTransform.Microsoft.gradient(startColorstr=#192FC79C,endColorstr=#192FC79C)' generalTreat={generalTreat}></GeneralTreat>
                        <DrugTreat treatment={ treatment } 
                                selectDrug={selectDrug} 
                                setOtherRecommend={ setOtherRecommend } 
                                showDrugInfo = {showDrugInfo}
                                setDrugInfo={ setDrugInfo }>
                        </DrugTreat>
                        <GeneralTreat icon={surgicalIcon} title='手术治疗' titleBg='#FAEAEA' generalTreat={surgeryTreat}></GeneralTreat>
                    </div>
                    <div className={style['bottom']}>
                        <span className={style['prescription-btn']} onClick={this.handlePrescription}>开处方</span> <span className={style['determine-btn']} onClick={this.handleDetermine}>确定</span>
                    </div>
                    
                </div>
                {treatDesc && <TreatDesc 
                    treatment={treatment} 
                    treatDesc={treatDesc} 
                    selectDrug={selectDrug} 
                    setDrugInfo={ setDrugInfo } 
                    showDrugInfo = {showDrugInfo}
                    showDrug = {showDrug}
                    >
                </TreatDesc>}
                {showDrug && drugInfo && <DrugInfo drugInfo = {drugInfo} hideDrugInfo = {hideDrugInfo}></DrugInfo>}
            </div>
            
        </div>
        )
    }
}

export default Treat;
