import React from 'react'
import Util from '../../../util/utils'

const marketType = Util.marketType();
let timerPrice
class ShopTimer extends React.Component<any, any> {
    constructor(props) {
        super(props);
        this.calcNum = this.calcNum.bind(this);
        this.calcTimer = this.calcTimer.bind(this);
        this.state = {
            vars: ['name', 'join', 'tip', 'time'],
            id: 'timer' + new Date().getTime() + Math.random() * 10000,
            remainTime: null,
            timers:{
                day: "00",
                hours: "00",
                minute: "00",
                second: "00",
                msecond: "0"
            }
        }
    }

    componentDidMount(): void {
        let data = this.props.data;
        // console.log(data)

        //  let remainTime1 = this.props.data.liveInfo;
        // console.log(remainTime1)
        if (data.endTime) {
            let remainTime = data.endTime - new Date().getTime();
            this.calcTimer(remainTime / 1000);
            this.setState({
                remainTime: remainTime
            })

        }
        // if (data.liveInfo) {
        //     let remainTime = data.liveInfo.endTime - new Date().getTime();
        //
        //     this.calcTimer(remainTime / 1000);
        //
        //     this.setState({
        //         remainTime: remainTime,
        //
        //     })
           // this.calcTimer1()
            // console.log(this.state.remainTime)
            // this.chaneTime(remainTime/1000,this.state.id)
        // }

    }

    // calcTimer1(time) {
    //     time = time * 10
        // timerPrice = setInterval(() => {
        //     let dateDate = time
        //     if (dateDate < 1) {
        //         clearInterval(timerPrice)
        //         this.props.clearActiveFn()
        //     } else {
        //         let priceDateObj = this.state.timer
                // if (dateDate / 86400 > 0) {
                //     priceDateObj["day"] = parseInt(dateDate / 86400)
                //     dateDate = dateDate % 86400
                // }
                // if (dateDate / 36000 > 0) {
                //     priceDateObj["hours"] = this.addZero(parseInt(dateDate / 36000))
                //     dateDate = dateDate % 36000
                // }
                // if (dateDate / 600 > 0 && parseInt(dateDate / 36000) <= 0) {
                //     priceDateObj["minute"] = this.addZero(parseInt(dateDate / 600))
                //     priceDateObj["second"] = this.addZero(parseInt((dateDate % 600) / 10))
                //     priceDateObj["msecond"] = parseInt((dateDate % 600) % 10)
                // }

                // console.log(priceDateObj)
        //         this.setState({
        //             // priceDate:dateStr,
        //
        //             timer: priceDateObj
        //         })
        //     }
        //
        //     time--
        // }, 100)

    // }
    componentWillReceiveProps(nextProps: Readonly<any>, nextContext: any): void {
        if (nextProps.data.endTime != this.props.data.endTime) {
            if (nextProps.data && nextProps.data.endTime) {
                let data = nextProps.data;
                let remainTime = data.endTime - new Date().getTime();
                this.calcTimer(remainTime / 1000);
                this.setState({
                    remainTime: remainTime
                })
            }
        }
    }
    componentWillUnmount() {
        // this.cl
    }

    lookMore() {
        this.props.lookMore();
    }

    calcTimer(remainTime) {


        Util.calcTimerNew(remainTime, this.state.id);

        // this.chaneTime(remainTime,this.state.id)


    }
    // addZero(num) {
    //     if (num < 10) {
    //         num = "0" + num
    //     }
    //     return num
    // }

    calcNum(num) {
        let numNum = Util.calcNum(num);
        return numNum;
    }
    // chaneTime( time,id,flag=1){
    //     if (flag == 1) {
    //         time = time * 1000;
    //     }
    //     if (isNaN(time)) {
    //         time = 0;
    //     }
    //     // let day: any = Math.floor(remainTime / (24 * 60 * 60 * 1000));
    //     let day: any = 0;
    //     let hour: any = Math.floor((time - day * 24 * 60 * 60 * 1000) / (60 * 60 * 1000));
    //     let minute: any = Math.floor((time - day * 24 * 60 * 60 * 1000 - hour * 60 * 60 * 1000) / (60 * 1000));
    //     let second: any = Math.floor((time - day * 24 * 60 * 60 * 1000 - hour * 60 * 60 * 1000 - minute * 60 * 1000) / 1000);
    //     let msecond: any = Math.floor((time - day * 24 * 60 * 60 * 1000 - hour * 60 * 60 * 1000 - minute * 60 * 1000 - second * 1000) / 100);
    //
    //     if (isNaN(day) || day <= 0) {
    //         day = 0;
    //     }
    //     if (isNaN(hour) || hour <= 0) {
    //         hour = 0;
    //     }
    //     if (isNaN(minute) || minute <= 0) {
    //         minute = 0;
    //     }
    //     if (isNaN(second) || second <= 0) {
    //         second = 0;
    //     }
    //     if (isNaN(msecond) || msecond <= 0) {
    //         msecond = 0;
    //     }
    //     if (String(hour).length < 2) {
    //         hour = '0' + String(hour);
    //     }
    //     if (String(minute).length < 2) {
    //         minute = '0' + String(minute);
    //     }
    //     if (String(second).length < 2) {
    //         second = '0' + String(second);
    //     }
    //     msecond = String(msecond);
    //     let data = {
    //         day: day,
    //         hour: hour,
    //         minute: minute,
    //         second: second,
    //         msecond: msecond
    //     };
    //     console.log(data)
    //     let t = this.state.timers;
    //     t.day = data.day;
    //     t.hours=data.hour;
    //     t.minute = data.minute;
    //     t.second = data.second;
    //     t.msecond = data.msecond
    //     this.setState({
    //         timers:t
    //     })
    //     console.log(this.state.timers)
    // }

    render() {
        let data = this.props.data;
        let vars = data.vars ? data.vars : this.state.vars;
        let className = 'shop-small-timer-wrapper';
        let timerType = data.timerType;
        let start = data.liveInfo;
        if (timerType == 'big') {
            className = 'shop-big-timer-wrapper';
        }
        if (data.limitTime == 1) {
            return (
                <div className={className + ' shop-timer-wrapper-livegood'}>
                    {
                        vars.indexOf('name') != -1 ?
                            <span className={'shop-timer-name'}>直播</span> : ''
                    }

                    {
                        data.showPartNum == 1 && vars.indexOf('join') != -1 ?
                            <span className={'shop-timer-num'}>已购买{this.calcNum(data.totleSales)}件</span> : ''
                    }

                    {
                        data.limitTime == 1 ?
                            <span className={'shop-timer-remaintime'}>
                                {
                                    vars.indexOf('tip') != -1 ?
                                        data.startTime > new Date().getTime() && data.status == 102 ?
                                            "" :
                                            <span
                                                className={'shop-timer-remaintime-tip'}>{data.tipText ? data.tipText : '距直播结束仅剩'}</span>
                                        : ''
                                }
                                {
                                    vars.indexOf('time') != -1 ?
                                        data.startTime > new Date().getTime() && data.status == 102 ?
                                            <span className={'shop-timer-remaintime-show'}>
                                                <p className={'shop-timer-show-date'}>
                                                    {new Date(data.startTime).getMonth() + 1}月
                                                    {new Date(data.startTime).getDate()}日
                                                </p>
                                                <p className={'shop-timer-show-time'}>
                                                    {new Date(data.startTime).getHours()}:{new Date(data.startTime).getMinutes()}开播</p>
                                            </span> :
                                            <span className={'shop-timer-remaintime-con ' + this.state.id}
                                                  id={this.state.id}>
                                                <span className={'shop-timer-time-hour'}>{this.state.timers.hours}</span>:
                                                <span className={'shop-timer-time-minute'}>{this.state.timers.minute}</span>:
                                                <span className={'shop-timer-time-second'}>{this.state.timers.second}</span>:
                                                <span className={'shop-timer-time-msecond'}>{this.state.timers.msecond}</span>

                                            </span>

                                        : ''
                                }
                        </span> : ''
                    }
                </div>
            );
        } else {
            return null;
        }

    }
}

export default ShopTimer;