page.hbs 4.49 KB
<div class="coupon-new-page">
    <div class="filter-box">
        <span class="filter-btn-box">
            <span class="filter-btn no-used active">未使用({{couponNum.notuse}}+)</span>
            <span class="iconfont icon-down show-filter-btn"></span>
        </span>
        <span class="filter-btn-box">
            <span class="filter-btn used">已使用({{couponNum.use}}</span>
        </span>
        <span class="filter-btn-box">
            <span class="filter-btn invalid">已失效({{couponNum.overtime}}</span>
        </span>
    </div>
    <div class="filter-item hide">
        {{#pageData.filters}}
            <button data-id="{{filter_id}}">{{filter_name}}</button>
        {{/ pageData.filters}}
    </div>
    <div class="exchange-box">
        <input type="text" placeholder="请输入优惠券码">
        <button>兑换</button>
    </div>
    <div class="coupon-list" id="couponList">
        {{#pageData.couponList}}
        <section class="coupon-section" data-code="{{coupon_code}}" data-id="{{coupon_id}}">
            <div class="coupon">
                <div class="coupon-left">
                    <p class="value">¥<span>{{coupon_value}}</span></p>
                    <p class="threshold">满499可用</p>
                </div>
                <div class="coupon-right">
                    <p class="title"><span class="type-shop">[{{catalog_name}}]</span> {{coupon_name}}</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <button class="use-now">立即使用</button>
                <span class="top-tip"></span>
            </div>
            <ul class="coupon-intro hide">
                {{#pageData.couponList.notes}}
                <li>{{.}}</li>
                {{/ pageData.couponList.notes}}
            </ul>
        </section>
        {{/ pageData.couponList}}
        <section class="coupon-section">
            <div class="coupon invalid-coupon">
                <div class="coupon-left">
                    <p class="value">¥
                        <span>100</span>
                    </p>
                    <p class="threshold">满499可用</p>
                </div>
                <div class="coupon-right">
                    <p class="title">
                        <span class="">[活动券]</span> Adidas Origins店铺使用</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <div class="stamp"></div>
            </div>
            <ul class="coupon-intro hide">
                <li>全场通用,特例商品暂不支持使用优惠券</li>
                <li>可以与其他类型叠加使用,同店铺只能使用一张,不同店铺真的可 以叠加使用。</li>
            </ul>
        </section>
        <section class="coupon-section">
            <div class="coupon freight-coupon">
                <div class="coupon-left">
                    <span>普通</span>
                </div>
                <div class="coupon-right">
                    <p class="title">
                        <span class="">[运费券]</span> Adidas Origins店铺使用</p>
                    <p class="time">2018.1.12-2018.5.20</p>
                    <p>
                        <span class="show-intro-btn">使用说明</span>
                        <span class="iconfont icon-down show-intro-btn show-intro-arrow"></span>
                    </p>
                    <span class="tip"></span>
                </div>
                <button class="use-now">立即使用</button>
                <span class="top-tip"></span>
            </div>
            <ul class="coupon-intro hide">
                <li>全场通用,特例商品暂不支持使用优惠券</li>
                <li>可以与其他类型叠加使用,同店铺只能使用一张,不同店铺真的可 以叠加使用。</li>
            </ul>
        </section>
    </div>
    <div class="no-conpon-now hide">
        <div class="icon-not"></div>
        <p>暂无优惠券</p>
    </div>
</div>