| | |
| | | <template> |
| | | <view class="box"> |
| | | <view class="box" v-if="info"> |
| | | <view class="item"> |
| | | <view class="item-a"> |
| | | <text class="item-a-num">8</text> |
| | | <text>满100可用</text> |
| | | <text class="item-a-num" v-if="info.couponType === 0">{{info.price}}</text> |
| | | <text class="item-a-num1" v-else-if="info.couponType === 1">{{info.price}}</text> |
| | | <text>满{{info.limitPrice}}可用</text> |
| | | </view> |
| | | <view class="item-b"> |
| | | <view class="item-b-left"> |
| | | <text>新客专享</text> |
| | | <text>2020.5.25 日到期</text> |
| | | <text>{{info.name}}</text> |
| | | <text>{{info.endDate.substring(0, 10)}} 日到期</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="info"> |
| | | <view class="info-item"> |
| | | <view class="info-item-label">使用时间</view> |
| | | <view class="info-item-val">2020.5.25 日到期</view> |
| | | <view class="info-item-val">{{info.endDate.substring(0, 10)}} 日到期</view> |
| | | </view> |
| | | <view class="info-item"> |
| | | <view class="info-item-label">适用对象</view> |
| | | <view class="info-item-val">支重轮、导轨</view> |
| | | <view class="info-item-val">{{info.relationInfoList.join('、')}}</view> |
| | | </view> |
| | | <view class="info-item"> |
| | | <view class="info-item-label">使用说明</view> |
| | | <view class="info-item-val">为确保顺利使用,请您留意: |
| | | ·有效期:每张优惠券均有明确的使用起止日期,过期自动失效,请及时使用。 |
| | | ·适用范围:券面会注明是否适用于全平台商品,或仅限指定品牌、品类、特定商品参与。请在券详情页或商品页核对“可用优惠”。 |
| | | 挑选心仪商品加入购物车。 |
| | | 进入结算页面,确认收货地址和商品信息。 |
| | | 在“支付信息”区域找到「优惠券」或「选择优惠」入口。 |
| | | 系统将自动筛选出当前订单可用的优惠券,请选择您希望使用的一张。 |
| | | 选择后,订单总额将立即更新,显示抵扣后的最终支付金额。 |
| | | 确认无误,完成支付即可。 |
| | | </view> |
| | | <view class="info-item-val">{{info.info}}</view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | |
| | | id: null, |
| | | info: null |
| | | }; |
| | | }, |
| | | onLoad(option) { |
| | | this.id = option.id |
| | | this.getDetails() |
| | | }, |
| | | methods: { |
| | | getDetails() { |
| | | this.$u.api.memberCouponDetail({ id: this.id }) |
| | | .then(res => { |
| | | if (res.code === 200) { |
| | | console.log(res) |
| | | this.info = res.data |
| | | } |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | |
| | | padding: 30rpx 0; |
| | | box-sizing: border-box; |
| | | border-bottom: 1rpx solid #E5E5E5; |
| | | &:last-child { |
| | | border-bottom: none !important; |
| | | } |
| | | .info-item-label { |
| | | font-weight: 500; |
| | | font-size: 32rpx; |
| | |
| | | color: #E4001D; |
| | | } |
| | | } |
| | | .item-a-num1 { |
| | | font-weight: 600; |
| | | font-size: 44rpx; |
| | | color: #E4001D; |
| | | &::after { |
| | | content: '折'; |
| | | font-weight: 600; |
| | | font-size: 24rpx; |
| | | color: #E4001D; |
| | | } |
| | | } |
| | | text { |
| | | font-weight: 400; |
| | | font-size: 24rpx; |