import * as React from "react";
import ShopListItem from '../commen/proItem';
import ProWrapper from '../commen/wrapper'
import MUtil from "../../../util/utils";
import DistriTimer from "../commen/timer";

const date = new Date().getTime();
const timerType = MUtil.timerType();

class OneSmallTwoBig extends React.Component<any, any> {
    state: any;

    constructor(props) {
        super(props);
        this.state = {
            style: {
                key: 'shop-product-wrapper' + new Date().getTime(),
            }
        }
    }

    componentDidMount(): void {

    }


    goBuy(data) {
        this.props.goBuy ? this.props.goBuy(data) : ''
    }

    render() {
        let source = this.props;
        let content = this.props.content;
        return (
            <div ref={this.state.key}>
                <ProWrapper className={'shop-product-wrapper-mix'} {...MUtil.initParams({}, source)}>
                    {
                        content && content.length > 0 ?
                            content.map((data, index) => (
                                <ShopListItem {...MUtil.initParams(data, source)}
                                              key={index}
                                              style={this.state.style}
                                              className={(index + 1) % 3 == 1 ? 'shop-pro-item-big' : 'shop-pro-item-small'}
                                              goBuy={this.goBuy.bind(this, data)}
                                              hideMarketNum={(index + 1) % 3 == 1 ? true : false}
                                >
                                    <DistriTimer {...MUtil.initParams(data, source)}
                                                 timerType={(index + 1) % 3 == 1 ? timerType.TIMER_BIG : timerType.TIMER_SMALL}
                                                 className={(index + 1) % 3 == 1 ? 'distri-timer-mix-big' : 'distri-timer-mix-small'}
                                                 tipText={(index + 1) % 3 == 1 ? '距活动结束仅剩' : '距结束'}
                                                 vars={(index + 1) % 3 == 1 ? ['name', 'join', 'tip', 'time'] : ['join', 'time']}
                                    ></DistriTimer>
                                </ShopListItem>
                            )) : ''
                    }
                </ProWrapper>
            </div>
        );
    }
}

export default OneSmallTwoBig;