From ce06ca62a0dd65d4a8fb57126948449c804ad77e Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期二, 19 五月 2026 19:40:08 +0800
Subject: [PATCH] 提交
---
small-program/pages/luggage-storage/luggage-storage.vue | 482 ++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 452 insertions(+), 30 deletions(-)
diff --git a/small-program/pages/luggage-storage/luggage-storage.vue b/small-program/pages/luggage-storage/luggage-storage.vue
index 26fb854..3196ab5 100644
--- a/small-program/pages/luggage-storage/luggage-storage.vue
+++ b/small-program/pages/luggage-storage/luggage-storage.vue
@@ -64,11 +64,7 @@
</view>
</view>
<view v-if="receiveAddr" class="store-cell-copy-addr">
- <text class="store-cell-title">{{ receiveAddr.name }}</text>
- <view class="store-cell-subtitle-container">
- <image src="/static/icon/home_ic_location3@2x.png" mode="widthFix"></image>
- <text class="store-cell-subtitle">{{ receiveAddr.addr }}</text>
- </view>
+ <text class="store-cell-title">{{ receiveAddr.addr }}</text>
</view>
</view>
</view>
@@ -90,7 +86,7 @@
<input v-model="form.mobile" class="form-input" :class="{ 'filled-input': form.mobile }" type="number" placeholder="璇疯緭鍏ユ敹浠朵汉鐢佃瘽" placeholder-style="color: #B2B2B2;" />
</view>
<view class="form-row dashed-row">
- <text class="form-label">棰勮鍒板簵鏃堕棿</text>
+ <text class="form-label">鍒板簵瀵勫瓨鏃堕棿</text>
<view class="row-picker" @click="showArriveTimePicker = true">
<text :class="form.arriveTime ? 'picker-value-text' : 'placeholder-text'">{{ form.arriveTime || '璇烽�夋嫨' }}</text>
<u-icon name="arrow-right" size="18" color="#222222"></u-icon>
@@ -98,7 +94,7 @@
</view>
<view class="form-row no-border">
<text class="form-label">棰勮鍙栦欢鏃堕棿</text>
- <view class="row-picker" @click="showPickupTimePicker = true">
+ <view class="row-picker" @click="openPickupTimePicker">
<text :class="form.pickupTime ? 'picker-value-text' : 'placeholder-text'">{{ form.pickupTime || '璇烽�夋嫨' }}</text>
<u-icon name="arrow-right" size="18" color="#222222"></u-icon>
</view>
@@ -108,9 +104,10 @@
:show="showArriveTimePicker"
v-model="arriveTimeValue"
mode="datetime"
+ :minDate="Date.now()"
confirmText="纭畾"
cancelText="鍙栨秷"
- title="閫夋嫨棰勮鍒板簵鏃堕棿"
+ title="閫夋嫨鍒板簵瀵勫瓨鏃堕棿"
@confirm="confirmArriveTime"
@cancel="showArriveTimePicker = false"
@close="showArriveTimePicker = false"
@@ -119,6 +116,7 @@
:show="showPickupTimePicker"
v-model="pickupTimeValue"
mode="datetime"
+ :minDate="pickupMinDate"
confirmText="纭畾"
cancelText="鍙栨秷"
title="閫夋嫨棰勮鍙栦欢鏃堕棿"
@@ -167,7 +165,7 @@
<text class="section-title">鐗╁搧淇℃伅</text>
</view>
<view class="required-wrap">
- <text class="section-required goods-required-text" :style="{ color: form.goodTypeName ? '#111111' : '#B2B2B2' }">{{ form.goodTypeName || '蹇呴�夛紝璇烽�夋嫨' }}</text>
+ <text class="section-required goods-required-text" :style="{ color: form.goodTypeName ? '#111111' : 'red' }">{{ form.goodTypeName || '蹇呴�夛紝璇烽�夋嫨' }}</text>
<u-icon name="arrow-right" size="12" color="#A8AFBA"></u-icon>
</view>
</view>
@@ -175,9 +173,9 @@
<view class="upload-box" @click="chooseAndUploadImage(9)">
<image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
</view>
- <view v-for="(item, index) in uploadedImages" :key="index" class="uploaded-box" @click="deleteImage(index)">
+ <view v-for="(item, index) in uploadedImages" :key="index" class="uploaded-box">
<image class="uploaded-image" :src="item.url" mode="aspectFill"></image>
- <text class="uploaded-delete" @click="deleteImage(index)">鍒犻櫎</text>
+ <text class="uploaded-delete" @click.stop="deleteImage(index)">鍒犻櫎</text>
</view>
</view>
</view>
@@ -221,6 +219,18 @@
</view>
<view class="section-card simple-card">
+ <view class="form-row" @click="selectCoupon">
+ <text class="form-label">骞冲彴浼樻儬鍒�</text>
+ <view class="form-value-wrap">
+ <view style="display: flex; flex-direction: column; align-items: flex-end;">
+ <text :class="selectedCoupon && selectedCoupon.value > 0 ? 'coupon-value-red' : 'form-value-placeholder'">{{ selectedCoupon && selectedCoupon.value > 0 ? '-锟�' + selectedCoupon.value.toFixed(2) : '閫夋嫨浼樻儬鍒�' }}</text>
+ </view>
+ <u-icon name="arrow-right" size="14" color="#999999"></u-icon>
+ </view>
+ </view>
+ </view>
+
+ <view class="section-card simple-card">
<view class="form-row no-border">
<text class="form-label">澶囨敞</text>
<input v-model="form.remark" class="form-input" :class="{ 'filled-input': form.remark }" type="text" placeholder="璇疯緭鍏�" placeholder-style="color: #B2B2B2;" placeholder-class="input-placeholder" />
@@ -229,6 +239,59 @@
</view>
</scroll-view>
+
+ <!-- 浼樻儬鍒搁�夋嫨寮圭獥 -->
+ <u-popup :show="showCouponPopup" mode="bottom" round="24" :closeOnClickOverlay="true" @close="showCouponPopup = false">
+ <view class="coupon-popup-wrap">
+ <view class="coupon-popup-head">
+ <text class="coupon-popup-title">閫夋嫨浼樻儬鍒�</text>
+ <view class="coupon-popup-close" @tap="showCouponPopup = false">
+ <u-icon name="close" size="28" color="#999999"></u-icon>
+ </view>
+ </view>
+ <scroll-view scroll-y class="coupon-list-scroll">
+ <view
+ v-for="(coupon, index) in couponList"
+ :key="index"
+ class="coupon-item"
+ :class="{ active: selectedCouponIndex === index }"
+ @click="toggleCoupon(index)"
+ >
+ <!-- 涓婂崐閮ㄥ垎 -->
+ <view class="coupon-item-top">
+ <view class="coupon-item-left">
+ <text class="coupon-name">{{ coupon.name }}</text>
+ <text class="coupon-validity">鏈夋晥鏈焮{ coupon.startDate }}~{{ coupon.endDate }}</text>
+ </view>
+ <view class="coupon-item-right">
+ <text class="coupon-amount">锟{ ((coupon.price || 0) / 100).toFixed(2) }}</text>
+ <text class="coupon-desc">婊{((coupon.limitPrice || 0) / 100).toFixed(2)}}鍙敤</text>
+ </view>
+ </view>
+
+ <!-- 铏氱嚎鍒嗛殧 -->
+ <view class="coupon-divider"></view>
+
+ <!-- 涓嬪崐閮ㄥ垎 -->
+ <view class="coupon-item-bottom">
+ <view class="coupon-usage" @click.stop="toggleUsage(index)">
+ <text class="coupon-usage-label">浣跨敤璇存槑</text>
+ <u-icon :name="showUsageIndex === index ? 'arrow-up' : 'arrow-down'" size="14" color="#999999"></u-icon>
+ </view>
+ <u-icon v-if="selectedCouponIndex === index" name="checkmark-circle-fill" size="24" color="#1890FF"></u-icon>
+ </view>
+
+ <!-- 浣跨敤璇存槑鍐呭 -->
+ <view v-if="showUsageIndex === index" class="coupon-usage-content">
+ <text class="coupon-usage-text">{{ coupon.info }}</text>
+ </view>
+ </view>
+ </scroll-view>
+ <view class="coupon-confirm-btn-wrap">
+ <view class="coupon-confirm-btn active-submit-btn" @click="confirmCoupon">纭畾閫夋嫨</view>
+ </view>
+ </view>
+ </u-popup>
<u-popup :show="showStorePopup" mode="bottom" round="24" :closeOnClickOverlay="true" @close="showStorePopup = false">
<view class="store-popup-wrap">
@@ -332,11 +395,23 @@
</view>
<text class="amount-row-value">{{ amountData.distance + 'km' }}</text>
</view>
+ <view v-if="activeMode !== 'city' && amountData.days" class="amount-row amount-row-extra">
+ <view class="amount-row-left">
+ <text class="amount-row-label">瀵勫瓨澶╂暟</text>
+ </view>
+ <text class="amount-row-value">{{ amountData.days + '澶�' }}</text>
+ </view>
<view v-if="amountData.insuranceFee" class="amount-row amount-row-extra">
<view class="amount-row-left">
- <text class="amount-row-label">琛屾潕淇濅环</text>
+ <text class="amount-row-label">鐗╁搧淇濊垂</text>
</view>
<text class="amount-row-value">{{ '锟�' + amountData.insuranceFee }}</text>
+ </view>
+ <view v-if="selectedCoupon" class="amount-row amount-row-extra">
+ <view class="amount-row-left">
+ <text class="amount-row-label">骞冲彴浼樻儬鍒�</text>
+ </view>
+ <text class="amount-row-discount">-锟{ selectedCoupon.value || selectedCoupon.amount || 0 }}</text>
</view>
</view>
<view class="agreement-bar popup-agreement-bar" @click="toggleAgreement">
@@ -371,7 +446,7 @@
<view class="bottom-action-row">
<view class="total-wrap">
<text class="total-label">鎬昏垂鐢�</text>
- <text class="total-price">{{ amountData ? '锟�' + amountData.totalPrice : '锟�--' }}</text>
+ <text class="total-price">{{ amountData ? '锟�' + (amountData.totalPrice - (selectedCoupon ? selectedCoupon.value || 0 : 0)).toFixed(2) : '锟�--' }}</text>
<template v-if="amountData">
<text class="detail-text detail-click" @tap.stop="openAmountPopup">鏄庣粏</text>
<u-icon name="arrow-down" size="18" color="#999999"></u-icon>
@@ -452,8 +527,13 @@
actions: [
{ name: '閫夋嫨鏈嶅姟鐐�' },
{ name: '閫夋嫨鍦板潃绨�' }
- ]
- }
+ ],
+ selectedCoupon: null,
+ showCouponPopup: false,
+ couponList: [],
+ selectedCouponIndex: -1,
+ showUsageIndex: -1,
+ }
},
watch: {
'form.insurance': {
@@ -485,6 +565,12 @@
},
totalPriceText() {
return '锟�150.00'
+ },
+ pickupMinDate() {
+ if (this.form.arriveTime) {
+ return new Date(this.form.arriveTime).getTime()
+ }
+ return Date.now()
}
},
onLoad() {
@@ -492,25 +578,100 @@
this.getCategoryList()
this.getCitySizeList()
this.agreementChecked=false
+ this.getContactInfo()
+
+ if (uni.getStorageSync('selectedStore')) {
+ this.selectedStore = uni.getStorageSync('selectedStore')
+ uni.removeStorageSync('selectedStore')
+ }
+
uni.$on('updateAddress', (data) => {
- console.log(data)
+ this.form.receiver = data.name
+ this.form.mobile = data.phone
this.receiveAddr = data
+ this.receiveAddr.addr = data.provinceName + data.cityName + data.districtName + data.addr
+ })
+
+ uni.$on('selectCoupon', (data) => {
+ this.selectedCoupon = data
+ if (this.activeMode === 'city') {
+ this.calculateRemotePrice()
+ } else {
+ this.calculateLocalPrice()
+ }
})
},
+ onUnload() {
+ uni.$off('updateAddress')
+ uni.$off('selectCoupon')
+ },
methods: {
+ getCouponId() {
+ if (this.selectedCoupon && this.selectedCoupon.id && this.selectedCoupon.id > 0) {
+ return this.selectedCoupon.id
+ } else if (this.selectedCoupon && this.selectedCoupon.id === 0) {
+ return null
+ }
+ return -1
+ },
+ selectCoupon() {
+ this.showCouponPopup = true
+ },
+ toggleUsage(index) {
+ if (this.showUsageIndex === index) {
+ this.showUsageIndex = -1
+ } else {
+ this.showUsageIndex = index
+ }
+ },
+ toggleCoupon(index) {
+ if (this.selectedCouponIndex === index) {
+ // 閲嶅鐐瑰嚮锛屽彇娑堥�夋嫨
+ this.selectedCouponIndex = -1
+ } else {
+ // 閫夋嫨浼樻儬鍒�
+ this.selectedCouponIndex = index
+ }
+ },
+ confirmCoupon() {
+ if (this.selectedCouponIndex >= 0 && this.selectedCouponIndex < this.couponList.length) {
+ const coupon = this.couponList[this.selectedCouponIndex]
+ this.selectedCoupon = {
+ id: coupon.id,
+ name: coupon.name,
+ value: coupon.value || coupon.amount / 100,
+ price: coupon.amount
+ }
+ this.showCouponPopup = false
+ if (this.activeMode === 'city') {
+ this.calculateRemotePrice()
+ } else {
+ this.calculateLocalPrice()
+ }
+ } else if (this.selectedCouponIndex === -1) {
+ // 鍙栨秷閫夋嫨浼樻儬鍒�
+ this.selectedCoupon = { id: 0, name: '涓嶄娇鐢ㄤ紭鎯犲埜', value: 0 }
+ this.showCouponPopup = false
+ if (this.activeMode === 'city') {
+ this.calculateRemotePrice()
+ } else {
+ this.calculateLocalPrice()
+ }
+ }
+ },
caozuo(e) {
var that = this;
+ this.receiveStore = null
+ this.receiveAddr = null
if (e.name === '閫夋嫨鏈嶅姟鐐�') {
that.storePopupType = 'receive'
- that.receiveStore = null
that.showStorePopup = true
} else if (e.name === '閫夋嫨鍦板潃绨�') {
- that.receiveAddr = null
uni.navigateTo({
url: '/pages/address/address?type=1'
})
}
- that.showReceiveAddress = false
+ this.showReceiveAddress = false
},
async uploadFiles(filePaths, maxCount = 9) {
if (!filePaths || filePaths.length === 0) {
@@ -683,8 +844,17 @@
const hour = String(date.getHours()).padStart(2, '0')
const minute = String(date.getMinutes()).padStart(2, '0')
this.form.arriveTime = `${year}-${month}-${day} ${hour}:${minute}`
+ this.form.pickupTime = ''
+ this.pickupTimeValue = e.value + 3600000
this.showArriveTimePicker = false
this.calculateLocalPrice()
+ },
+ openPickupTimePicker() {
+ if (!this.form.arriveTime) {
+ uni.showToast({ title: '璇峰厛閫夋嫨鍒板簵瀵勫瓨鏃堕棿', icon: 'none' })
+ return
+ }
+ this.showPickupTimePicker = true
},
confirmPickupTime(e) {
const date = new Date(e.value)
@@ -695,7 +865,7 @@
const minute = String(date.getMinutes()).padStart(2, '0')
const pickupTime = `${year}-${month}-${day} ${hour}:${minute}`
if (this.form.arriveTime && new Date(pickupTime) <= new Date(this.form.arriveTime)) {
- uni.showToast({ title: '棰勮鍙栦欢鏃堕棿蹇呴』澶т簬棰勮鍒板簵鏃堕棿', icon: 'none' })
+ uni.showToast({ title: '棰勮鍙栦欢鏃堕棿蹇呴』澶т簬鍒板簵瀵勫瓨鏃堕棿', icon: 'none' })
return
}
this.form.pickupTime = pickupTime
@@ -719,6 +889,17 @@
item.count = 0
})
this.luggageTypes = res.data || []
+ }
+ },
+ async getContactInfo() {
+ const res = await this.$u.api.getContactInfo({})
+ if (res.code === 200 && res.data) {
+ if (res.data.name) {
+ this.form.receiver = res.data.name
+ }
+ if (res.data.phone) {
+ this.form.mobile = res.data.phone
+ }
}
},
async getNearbyShopList() {
@@ -761,7 +942,8 @@
}
},
async calculateLocalPriceOnly() {
- if (!this.selectedStore || !this.form.arriveTime || !this.form.pickupTime) {
+ if (!this.form.arriveTime || !this.form.pickupTime) {
+ this.amountData = null
return
}
const luggageList = this.luggageTypes
@@ -771,15 +953,16 @@
quantity: item.count
}))
if (luggageList.length === 0) {
+ this.amountData = null
return
}
const res = await this.$u.api.calculateLocalPrice({
cityId: this.cityId,
- shopId: this.selectedStore.id,
depositStartTime: this.form.arriveTime + ':00',
depositEndTime: this.form.pickupTime + ':00',
items: luggageList,
- declaredAmount: this.form.insurance || 0
+ declaredAmount: this.form.insurance || 0,
+ couponId: this.getCouponId()
})
if (res.code === 200) {
res.data.itemList.forEach(item => {
@@ -787,14 +970,35 @@
})
res.data.totalPrice = res.data.totalPrice / 100
res.data.insuranceFee = res.data.insuranceFee / 100
+ if (res.data.selectedCoupon) {
+ res.data.selectedCoupon.value = res.data.selectedCoupon.price / 100
+ }
+ if (res.data.availableCoupons) {
+ res.data.availableCoupons.forEach(coupon => {
+ coupon.value = coupon.price / 100
+ })
+ this.couponList = res.data.availableCoupons
+ }
this.amountData = res.data
+ if (res.data.selectedCoupon) {
+ this.selectedCoupon = res.data.selectedCoupon
+ // 鎵惧埌瀵瑰簲鐨勪紭鎯犲埜绱㈠紩
+ if (res.data.availableCoupons) {
+ const index = res.data.availableCoupons.findIndex(coupon => coupon.id === res.data.selectedCoupon.id)
+ if (index !== -1) {
+ this.selectedCouponIndex = index
+ }
+ }
+ }
}
},
async calculateRemotePrice() {
- if (!this.sendStore || !this.form.arriveTime || !this.form.pickupTime) {
+ if (!this.sendStore) {
+ this.amountData = null
return
}
if (!this.receiveStore && !this.receiveAddr) {
+ this.amountData = null
return
}
const luggageList = this.luggageTypes
@@ -804,6 +1008,7 @@
quantity: item.count
}))
if (luggageList.length === 0) {
+ this.amountData = null
return
}
let fromLat = ''
@@ -828,10 +1033,9 @@
toLat: toLat,
toLgt: toLgt,
urgent: this.isUrgent,
- depositStartTime: this.form.arriveTime + ':00',
- depositEndTime: this.form.pickupTime + ':00',
items: luggageList,
- declaredAmount: this.form.insurance || 0
+ declaredAmount: this.form.insurance || 0,
+ couponId: this.getCouponId()
})
if (res.code === 200) {
res.data.itemList.forEach(item => {
@@ -839,11 +1043,30 @@
})
res.data.totalPrice = res.data.totalPrice / 100
res.data.insuranceFee = res.data.insuranceFee / 100
+ if (res.data.selectedCoupon) {
+ res.data.selectedCoupon.value = res.data.selectedCoupon.price / 100
+ }
+ if (res.data.availableCoupons) {
+ res.data.availableCoupons.forEach(coupon => {
+ coupon.value = coupon.price / 100
+ })
+ this.couponList = res.data.availableCoupons
+ }
this.serviceTimes = [
{ id: 0, name: '鏍囧噯杈�', serviceTime: res.data.standardHours, price: res.data.itemPrice / 100 },
{ id: 1, name: '鎬ラ�熻揪', serviceTime: res.data.urgentHours, price: (res.data.urgentFee + res.data.itemPrice) / 100 }
]
this.amountData = res.data
+ if (res.data.selectedCoupon) {
+ this.selectedCoupon = res.data.selectedCoupon
+ // 鎵惧埌瀵瑰簲鐨勪紭鎯犲埜绱㈠紩
+ if (res.data.availableCoupons) {
+ const index = res.data.availableCoupons.findIndex(coupon => coupon.id === res.data.selectedCoupon.id)
+ if (index !== -1) {
+ this.selectedCouponIndex = index
+ }
+ }
+ }
}
},
async createOrder() {
@@ -877,7 +1100,7 @@
return
}
if (!this.form.arriveTime) {
- uni.showToast({ title: '璇烽�夋嫨棰勮鍒板簵鏃堕棿', icon: 'none' })
+ uni.showToast({ title: '璇烽�夋嫨鍒板簵瀵勫瓨鏃堕棿', icon: 'none' })
return
}
if (!this.form.pickupTime) {
@@ -885,7 +1108,7 @@
return
}
if (new Date(this.form.pickupTime) <= new Date(this.form.arriveTime)) {
- uni.showToast({ title: '棰勮鍙栦欢鏃堕棿蹇呴』澶т簬棰勮鍒板簵鏃堕棿', icon: 'none' })
+ uni.showToast({ title: '棰勮鍙栦欢鏃堕棿蹇呴』澶т簬鍒板簵瀵勫瓨鏃堕棿', icon: 'none' })
return
}
const luggageList = this.luggageTypes
@@ -934,7 +1157,8 @@
takePhone: this.form.mobile,
takeUser: this.form.receiver,
type: this.activeMode === 'local' ? 0 : 1,
- isUrgent: this.isUrgent
+ isUrgent: this.isUrgent,
+ couponId: this.getCouponId()
}
if (this.activeMode === 'local') {
orderParams.depositShopId = this.selectedStore.id
@@ -1463,6 +1687,26 @@
color: #222222;
}
+ .form-value-wrap {
+ display: flex;
+ align-items: center;
+ gap: 8rpx;
+ flex: 1;
+ justify-content: flex-end;
+ }
+
+ .form-value-text {
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #333333;
+ }
+
+ .form-value-placeholder {
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #B2B2B2;
+ }
+
.form-input {
flex: 1;
height: 88rpx;
@@ -1873,6 +2117,24 @@
color: #222222;
}
+ .amount-row-right {
+ display: flex;
+ align-items: center;
+ gap: 8rpx;
+ }
+
+ .amount-row-placeholder {
+ font-weight: 400;
+ font-size: 30rpx;
+ color: #999999;
+ }
+
+ .amount-row-discount {
+ font-weight: 400;
+ font-size: 30rpx;
+ color: #FF4D4F;
+ }
+
.popup-agreement-bar {
margin-top: 12rpx;
}
@@ -2002,4 +2264,164 @@
.active-submit-btn {
background: #10B2FA;
}
+
+ /* 浼樻儬鍒稿脊绐楁牱寮� */
+ .coupon-popup-wrap {
+ background: #ffffff;
+ border-radius: 24rpx 24rpx 0 0;
+ padding: 0 30rpx 16rpx 30rpx;
+ box-sizing: border-box;
+ }
+
+ .coupon-popup-head {
+ position: relative;
+ height: 96rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .coupon-popup-title {
+ font-weight: 600;
+ font-size: 32rpx;
+ color: #222222;
+ }
+
+ .coupon-popup-close {
+ position: absolute;
+ right: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 56rpx;
+ height: 56rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .coupon-list-scroll {
+ max-height: 60vh;
+ padding-bottom: 20rpx;
+ }
+
+ .coupon-item {
+ background: #F7F8FA;
+ border-radius: 16rpx;
+ padding: 24rpx;
+ margin-bottom: 16rpx;
+ display: flex;
+ flex-direction: column;
+ gap: 20rpx;
+ border: 2rpx solid transparent;
+ transition: all 0.3s;
+ }
+
+ .coupon-item-top {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+ }
+
+ .coupon-item-bottom {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ .coupon-divider {
+ height: 1rpx;
+ background: repeating-linear-gradient(to right, #CCCCCC 0, #CCCCCC 8rpx, transparent 8rpx, transparent 16rpx);
+ margin: 12rpx 0;
+ }
+
+ .coupon-item.active {
+ background: #E6F7FF;
+ border-color: #1890FF;
+ }
+
+ .coupon-item-left {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ gap: 12rpx;
+ }
+
+ .coupon-name {
+ font-weight: 500;
+ font-size: 30rpx;
+ color: #222222;
+ }
+
+ .coupon-validity {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #999999;
+ }
+
+ .coupon-usage {
+ display: flex;
+ align-items: center;
+ gap: 8rpx;
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #666666;
+ }
+
+ .coupon-usage-label {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #666666;
+ }
+
+ .coupon-usage-content {
+
+ }
+
+ .coupon-usage-text {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #666666;
+ line-height: 1.5;
+ }
+
+ .coupon-item-right {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+ gap: 12rpx;
+ }
+
+ .coupon-amount {
+ font-weight: 600;
+ font-size: 32rpx;
+ color: #FF4D4F;
+ }
+
+ .coupon-desc {
+ font-weight: 400;
+ font-size: 22rpx;
+ color: #FF4D4F;
+ border-radius: 12rpx;
+ }
+
+ .coupon-confirm-btn-wrap {
+ padding: 24rpx 0;
+ }
+
+ .coupon-confirm-btn {
+ height: 88rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-weight: bold;
+ font-size: 32rpx;
+ color: #FFFFFF;
+ border-radius: 12rpx;
+ }
+
+ .coupon-value-red {
+ font-weight: 400;
+ font-size: 30rpx;
+ color: #FF4D4F;
+ }
</style>
--
Gitblit v1.9.3