couponCenterDetail.vue 2.71 KB
<template>
    <div class="zj-main">
        <mt-header title="优惠券详情">
            <router-link to="/" slot="left">
                <mt-button icon="back"></mt-button>
            </router-link>
        </mt-header>
        <div class="coupon-center-detail">
            <div class="top">
                <div class="title">折扣券</div>
                <div class="num"><span class="big-num">9</span>折</div>
                <span class="double-line-left"></span><span class="double-line-right"></span>
            </div>
            <div class="middle">
                <div class="time">领用期限:2016-10-28 至 2016-11-28</div>
                <div class="use-if">
                    <span class="left">使用条件:</span>
                    <div class="right">
                        <p>&nbsp;1、只能在使用网店使用;</p>
                        <p>&nbsp;2、优惠券在使用期限内使用;</p>
                        <p>&nbsp;3、线上线下都可使用。</p>
                    </div>
                </div>
                <div class="use-if">
                    <span class="left">使用备注:</span>
                    <div class="right">
                        <p>&nbsp;1、只能在使用网店使用;</p>
                        <p>&nbsp;2、优惠券在使用期限内使用;</p>
                        <p>&nbsp;3、线上线下都可使用。</p>
                    </div>
                </div>
                <mt-cell title="适用网点" to="//github.com" is-link></mt-cell>
            </div>

        </div>
        <div class="coupon-center-detail-bottom">
            <div class="coupon-name-price">
                <div class="coupon-name">女鞋专用折扣券</div>
                <div class="coupon-price">599联盟币</div>
            </div>
            <div class="coupon-num-sale"><span class="num">库存:889个</span><span class="sale">销量:89</span></div>
            <div class="buy-number"><span>购买数量</span>
                <div class="mui-numbox">
                    <button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
                    <input class="mui-input-numbox" type="number" value="1" min="1" max="10">
                    <button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
                </div>
            </div>
        </div>
        <div class="exchange-button">立即兑换</div>
    </div>
</template>
<script type="text/ecmascript-6">
    export default {
        data() {
            return {}
        },
        components: {},
        methods: {},
        beforeRouteEnter(to, from, next) {
            next();
        },
        beforeRouteLeave(to, from, next) {
            next();
        }
    }
</script>