import $ from 'yoho-jquery';
import Page from 'yoho-page';
class ConponController extends Page {
    constructor() {
        super();

        this.view = {
            filterBtn: $('.filter-btn'),
            filterItem: $('.filter-item'),
            showFilterBtn: $('.show-filter-btn'),
            couponSection: $('.coupon-section')
        };

        this.view.filterBtn.on('click', this.tapChange.bind(this));
        this.view.showFilterBtn.on('click', this.showFilter.bind(this));
        this.view.couponSection.on('click', '.show-intro-btn', this.showIntro.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');
        }
    }

    /**
     * 展示筛选器
     */
    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');
        }
    }

    /**
     * 展示优惠券介绍
     */
    showIntro(e) {
        let delegateTarget = $(e.delegateTarget);
        let couponIntro = delegateTarget.find('.coupon-intro');
        let showIntroIcon = delegateTarget.find('.show-intro-icon');

        if (couponIntro.hasClass('hide')) {
            couponIntro.removeClass('hide');
            showIntroIcon.removeClass('icon-down').addClass('icon-up');
        } else {
            couponIntro.addClass('hide');
            showIntroIcon.removeClass('icon-up').addClass('icon-down');
        }
    }
}

export default ConponController;