优惠券bug修复

center/center.vue

@@ -76,11 +76,12 @@
 				customerMobile:'',
 				tools:[
 					// {name:'观看记录',url:'/center/viewrecord',ico:this.$commonConfig.staticUrl+'/img/center-record.png',checkauth:true},
-					{name:'领券中心',url:'/center/mycoupon',ico:this.$commonConfig.staticUrl+'/img/center-coupon.png',checkauth:true},
+					
 					// {name:'开具发票',url:'center/invoice',ico:this.$commonConfig.staticUrl+'/img/center-ticket.png',checkauth:true},
 					{name:'我的订单',url:'center/order',ico:this.$commonConfig.staticUrl+'/img/center-order.png',checkauth:true},
 					{name:'客服热线',url:'',ico:this.$commonConfig.staticUrl+'/img/center-call.png',checkauth:true,phone:''},
 					{name:'全民分享',url:'/center/applyshare',ico:this.$commonConfig.staticUrl+'/img/center-share.png',checkauth:true},
+					{name:'领券中心',url:'/center/mycoupon',ico:this.$commonConfig.staticUrl+'/img/center-coupon.png',checkauth:true},
 					// {name:'在线客服',chat:'1',ico:this.$commonConfig.staticUrl+'/img/center-call.png'},
 				]
 			}

pages/bookticket.vue

@@ -77,26 +77,13 @@
 					</view>
 				</view>
 			</view>
-			<view class="coupon">
-				<view class="title u-flex u-row-between u-border-bottom">
-					<text>本单可享优惠</text>
-				</view>
-				<view class="single-til u-flex u-row-between">
-					<view class="text">优惠券</view>
-					<view class="more-text u-flex" @click="selectCoupon">
-						<text v-if="!coupon.quota">未使用</text>
-						<u-icon name="arrow-right" color="#E6E6E6" size="24rpx"></u-icon>
-					</view>
-				</view>
-				<view class="coupon-info" :class="{useable:couponList.length>0}" @click="selectCoupon">
-					<text v-if="couponList.length>0&&!coupon.quota">选择优惠券</text>
-					<view v-else-if="coupon.quota" class="coupon-item">
-						优惠
-						<text v-if="coupon.type == 1">￥</text> 
-						{{coupon.quota}}
-						<text v-if="coupon.type == 2">%</text>
-					</view>
-					<text v-else>您暂无可使用优惠券～</text>
+			<view class="coupon u-flex u-row-between block-wrap" @click="selectCoupon">
+				<view class="left">优惠券</view>
+				<view class="right u-flex">
+					<text v-if="couponList.length<1||Number(this.totalPrice)<=0">暂无可用</text>
+					<text v-if="coupon.quota" style="color: #EF2929;">已选1张优惠券</text>
+					<text v-if="couponList.length>0&&!coupon.quota&&Number(this.totalPrice)>0">未选择优惠券</text>
+					<u-icon name="arrow-right" color="#7F7F7F" size="24rpx"></u-icon>
 				</view>
 			</view>
 			<view class="notice">
@@ -142,8 +129,8 @@
 		</u-popup>
 		<view class="page-bottom">
 			<view class="inner u-flex u-row-between">
-				<view class="left u-flex">
-					<text>应付金额：</text>
+				<view class="left u-flex u-col-top">
+					<text>实付金额：</text>
 					<view class="total-price">
 						￥{{finalPrice}}
 						<view class="bottom-coupon" v-if="coupon.quota">
@@ -280,14 +267,22 @@ import {
 					return 1
 				}
 			},
-			couponAmount(){
-				let amount = 0;
-				if(this.coupon.type==1){
-					amount = this.coupon.quota || 0; // 如果没有优惠券，默认为0 
-				}else if(this.coupon.type==2){
-					amount =  this.totalPrice - this.totalPrice*(this.coupon.quota/100);
-				}
-				return amount.toFixed(2)
+			couponAmount() {
+			    let amount = 0;
+			    if (this.coupon.type == 1) {
+			        amount = this.coupon.quota || 0; // 如果没有优惠券，默认为0 
+			    } else if (this.coupon.type == 2) {
+			        // 将总价和折扣转化为整数
+			        const totalPrice = Math.round(this.totalPrice * 100); // 以分为单位
+			        const discountRate = this.coupon.quota; // 折扣百分比
+			        const discountAmount = totalPrice * (discountRate / 100);
+			        const finalAmount = totalPrice - discountAmount;
+			        amount = finalAmount / 100; // 结果转换回以元为单位
+					// console.log('this.totalPrice',this.totalPrice);
+					// console.log('this.coupon.quota',this.coupon.quota);
+					// console.log('amount',amount);
+			    }
+			    return amount.toFixed(2);
 			},
 		},
 		onShow() {
@@ -741,23 +736,34 @@ import {
 				// #endif
 			},
 			selectCoupon(){
+				if(Number(this.totalPrice)<=0){
+					return
+				}
 				this.$u.route('/center/couponselect',{
 					salePrice:this.totalPrice,
 					performId:this.performId,
 					goodsId: this.pageContent.goodsId
 				})
 			},
-			findOrderCoupons(){
-				let param = {
-					salePrice:this.totalPrice,
-					performId:this.performId,
-					goodsId:this.pageContent.goodsId
-				};
-				this.$u.api.findOrderCoupons(param).then(res=>{
-					this.couponList = res.data.list||[];
-					}).catch(err=>{
-					// console.log('findOrderCoupons',err.data);
-				})
+			findOrderCoupons() {
+			    let param = {
+			        salePrice: this.totalPrice,
+			        performId: this.performId,
+			        goodsId: this.pageContent.goodsId
+			    };
+			
+			    this.$u.api.findOrderCoupons(param)
+			        .then(res => {
+			            this.couponList = res.data.list || [];
+						console.log('this.couponList',this.couponList);
+						console.log('this.coupon.id',this.coupon.id);
+			            if (this.couponList.length < 1 || !this.couponList.some(obj => obj.id === this.coupon.id)) {
+			               this.$u.vuex('coupon', {});
+			            }
+			        })
+			        .catch(err => {
+			            // console.log('findOrderCoupons',err.data);
+			        });
 			},
 		}
 	}
@@ -1007,44 +1013,21 @@ import {
 	}
 
 	.coupon {
-		background: #FFFFFF;
-		box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(232, 232, 232, 0.5);
-		border-radius: 16rpx;
-		padding: 44rpx 36rpx;
-		margin-bottom: 24rpx;
-
-		.title {
-			font-size: 28rpx;
+		.left{
 			font-weight: bold;
+			font-size: 28rpx;
 			color: #2D2D2D;
-			padding-bottom: 20rpx;
-			margin-bottom: 26rpx;
-			border-bottom-style: dashed;
-		}
-
-		.single-til {
-			margin-bottom: 28rpx;
-
-			.text {
-				font-weight: 400;
-			}
 		}
-
-		.coupon-info {
-			height: 116rpx;
-			line-height: 116rpx;
-			text-align: center;
-			background: #F9FAFD;
-			border-radius: 8rpx;
-			font-size: 24rpx;
+		.right{
 			font-weight: 400;
-			color: #C0C0C0;
-			&.useable{
-				color: #ED0000;
-				font-size: 28rpx;
-				font-weight: bold;
-				border: 1px solid #ED0000;
-			}
+			font-size: 24rpx;
+			color: #606060;
+		}
+		/deep/ .u-icon{
+			top: 1px;
+			margin-left: 5px;
+			position: relative;
+			
 		}
 	}