import $ from 'yoho-jquery';
import Page from 'yoho-page';

class SelectGiftCard extends Page {
    constructor(order) {
        super();
        this.order = order;
        this.orderInfo = order.orderInfo;

        this.selector = {
            rule: $('#rule'),
            page: $('.select-giftcard-page'),
            giftcard: $('.giftcard'),
            useGiftCardBtn: $('#useGiftCardBtn')
        };
        this.init();
        this.bindEvents();
    }

    init() {
        this.selector.page.css('min-height', () => {
            return $(window).height() - $('#yoho-header').height();
        });
    }

    bindEvents() {
        this.selector.giftcard.on('click', '.checkbox', this.checkboxClickHandle.bind(this));
        this.selector.useGiftCardBtn.on('click', this.useGiftCard.bind(this));
    }

    /**
     * 使用礼品卡
     */
    useGiftCard() {
        console.log('ok');
    }

    /**
     * 改变 使用 按钮状态
     */
    changeUseBtnStatus() {
        if (this.selector.giftcard.hasClass('checked')) {
            this.selector.useGiftCardBtn.addClass('active');
        } else {
            this.selector.useGiftCardBtn.removeClass('active');
        }
    }

    /**
     * 选择礼品卡
     */
    checkboxClickHandle(event) {
        let theGiftCard = $(event.delegateTarget);

        if (theGiftCard.hasClass('checked')) {
            theGiftCard.removeClass('checked');
        } else {
            theGiftCard.addClass('checked');
        }

        this.changeUseBtnStatus();
    }
}

export default SelectGiftCard;