jiuyiUniapp/jiuyi2/pages/shop/coupon.vue

51 lines
1.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script setup>
// 优惠券
</script>
<template>
<view class="app">
<view class="list plr20">
<view class="item mtb20 bfff br20" v-for="(item,index) in 10" :key="index">
<view class="main rows ptb25 plr25">
<!-- 左边 名称 有效期 -->
<view class="col">
<view class="name c333 f32">平台限时活动三花聚顶优惠券</view>
<view class="time mt15 c999 f24">有效期至2024.08.06</view>
</view>
<view class="info tac">
<view class="price df aife">
<text class="f40 cFF9B27"></text>
<text class="f72 cFF9B27">10</text>
</view>
<view class="type f28 cFF9B27">无门槛</view>
</view>
</view>
<!--省略号分割线 -->
<view class="dividing-line"></view>
<!-- 底部 -->
<view class="bottom rows ptb25 plr25">
<!-- 左边描述 -->
<view class="info oh f1 rows">
<view :class="'thd'">优惠卷介绍优惠卷介绍优惠卷介绍优惠卷...</view>
<uni-icons type="down" color="#ccc" />
</view>
<!-- 右边使用按钮 -->
<view class="btn primary fs0 plr30 ml30" @click="useCoupon(coupon)">去使用</view>
</view>
</view>
</view>
<view class="fill" style="height: 30rpx;"></view>
</view>
</template>
<style scoped lang="scss">
// ...分割线
.dividing-line {
border-bottom: 2rpx dashed #ddd;
}
</style>