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

class SelectCouponController extends Page {
    constructor() {
        super();

        this.view = {
            filterBtn: $('.filter-btn'),
            coupon: $('.coupon'),
            checkbox: $('.checkbox'),
            tipBox: $('.tip-box'),
            tipClose: $('.tip-close'),
            showFilterBtn: $('.show-filter-btn'),
            filterItem: $('.filter-item')
        };

        this.view.filterBtn.on('click', this.tapChange.bind(this));
        this.view.coupon.on('click', '.checkbox', this.check.bind(this));
        this.view.tipClose.on('click', this.closeTip.bind(this));
        this.view.showFilterBtn.on('click', this.showFilter.bind(this));
    }

    /**
     * tab 切换
     */
    tapChange(event) {
        let itemClicked = $(event.currentTarget);

        if (itemClicked.hasClass('active')) {
            itemClicked.removeClass('active');
        } else {
            this.view.filterBtn.removeClass('active');
            itemClicked.addClass('active');
        }
    }

    /**
     * 优惠券勾选处理
     */
    check(e) {
        let theCoupon = $(e.currentTarget);

        if (theCoupon.hasClass('icon-cb-radio')) {
            theCoupon.removeClass('icon-cb-radio').addClass('icon-radio');
        } else {
            theCoupon.removeClass('icon-radio').addClass('icon-cb-radio');
        }
    }

    /**
     * 关闭提示框
     */
    closeTip() {
        this.view.tipBox.hide();
    }

    /**
     * 展示筛选器
     */
    showFilter() {
        if (this.view.filterItem.hasClass('hide')) {
            this.view.filterItem.removeClass('hide');
            this.view.showFilterBtn.removeClass('icon-down').addClass('icon-up');
        } else {
            this.view.filterItem.addClass('hide');
            this.view.showFilterBtn.removeClass('icon-up').addClass('icon-down');
        }
    }
}

export default SelectCouponController;