import React from 'react';
import Button from '../../components/CommonComponent/ButtonComponent/ButtonComponent'
import Clock from '../../components/CommonComponent/ClockComponent/ClockComponent'
import HeaderComponent from '../../components/CommonComponent/HeaderComponent/HeaderComponent'
import PopModel from '../../components/CommonComponent/PopupComponent/PopupMiddleComponent'

require('./index.css');

export default class FinishAskContainer extends React.Component{
    constructor(props){
        super(props);
        this.state = {
        }
        this.closeDoor = this.closeDoor.bind(this);
        this.selectTask = this.selectTask.bind(this);
        this.beginCloseDoor = this.beginCloseDoor.bind(this);
        this.judgeTask = this.judgeTask.bind(this);
    }

    componentWillMount(){
        this.props.endCountBack();
    }

    componentWillReceiveProps(nextProps){

    }

    selectTask(){
        console.log("selectTask")
        let {changePages} = this.props;
        changePages(CONFIG.showPage[9])
    }

    beginCloseDoor(){
        this.props.hidePopup()
        this.props.showOpenDoorPage();
    }

    closeDoor(){
        console.log("closeDoor");
        this.props.hidePopup();
        //任务完成，超时不确定
        let btnDom = <Button btnContainer={"btne5"} key={"finishcloseDoorBack1"} style={{'width':UTILPATH.getRemByPx(260)}} text={"确定"} option={this.beginCloseDoor}/>
        let clockDom = <Clock key={"finiscloseDoorhBack2"} totalTime={30}
                              style={{'width':UTILPATH.getRemByPx(260),'marginLeft':UTILPATH.getRemByPx(30),'borderRadius':UTILPATH.getRemByPx(10)}}
                              callback={this.beginCloseDoor}
        />;
        let popDom = <PopModel classNames={"popupExtClass"} popupText={"检测到店铺反常，请站出店铺，关闭店铺门后重新验证您的身份"} popupButtons={[btnDom,clockDom]}/>
        this.props.showPopup({popupChild:popDom});
        this.props.uploadErrs(2);
    }


    judgeTask(){
        console.log("judgeTask");
        this.props.hidePopup();
        //任务完成，超时不确定
        let btnDom = <Button btnContainer={"btne5"} key={"finishjudgeTaskBack1"} style={{'width':UTILPATH.getRemByPx(260)}} text={"确定"} option={this.beginCloseDoor}/>
        let clockDom = <Clock key={"finishjudgeTaskBack2"} totalTime={30}
                              style={{'width':UTILPATH.getRemByPx(260),'marginLeft':UTILPATH.getRemByPx(30),'borderRadius':UTILPATH.getRemByPx(10)}}
                              callback={this.closeDoor}
        />;
        let popDom = <PopModel popupText={"您的任务是否已结束"} popupButtons={[btnDom,clockDom]}/>
        this.props.showPopup({popupChild:popDom});
        this.props.uploadErrs(2);
    }

    render(){
        let {headerInfo} = this.props;
        return(
            <div>
                <HeaderComponent
                    showHeader={CONFIG.headerStatus[1]}
                    headerInfo={headerInfo}
                />
                <div className={"finishAskContainer"}>
                    <div className={"finishAskText font32"}>
                        <p>感谢您的故障问题处理工作！</p>
                        <p>您是否有其它任务</p>
                    </div>
                    <div className={"finishAskButtons"}>
                        <Button text={"有"} style={{marginTop:UTILPATH.getRemByPx(120),width:'100%'}} option={this.selectTask}/>
                        <Button text={"没有"} style={{marginTop:UTILPATH.getRemByPx(40),width:'100%'}} option={this.beginCloseDoor}/>
                        <Clock style={{'marginTop':UTILPATH.getRemByPx(40)}} totalTime={60}
                               callback={this.judgeTask}/>
                    </div>
                </div>
            </div>

        )
    }
}

FinishAskContainer.propTypes = {
};

FinishAskContainer.defaultProps = {
}