添加活动金弹窗

pages/index/index.vue

@@ -122,7 +122,7 @@
 		</view>
 
 		<!-- 优惠券弹窗   -->
-		<wybPopup ref="popup" type="bottom" width="500" radius="6" :showCloseIcon="true" scrollY="true">
+		<wybPopup ref="popup" type="bottom" width="500" radius="6" :showCloseIcon="true" :scrollY="true">
 			<view class="fotct font18 fontwig6 fcor333 mart10 height30">优惠券选择</view>
 			<view v-if="discountList == ''" class="mart60 fotct font14 fcor666">
 				<image mode="widthFix" style="width: 50vw;" src="../../static/noorder.png"></image>
@@ -151,7 +151,7 @@
 			<view class="height40p"></view>
 		</wybPopup>
 		<!-- 门店活动 -->
-		<wybPopup ref="popupstore" type="bottom" width="500" radius="6" :showCloseIcon="true" scrollY="true">
+		<wybPopup ref="popupstore" type="bottom" width="500" radius="6" :showCloseIcon="true" :scrollY="true">
 			<view class="fotct font18 fontwig6 fcor333 mart10 height30">门店活动选择</view>
 			<view v-if="storeCouponlist == ''" class="mart60 fotct font14 fcor666">
 				<image mode="widthFix" style="width: 50vw;" src="../../static/noorder.png"></image>
@@ -200,6 +200,23 @@
 
 			</view>
 		</wybPopup>
+		<wybPopup ref="popupTip" type="center" :maskClickClose="false" :height="popupHeight" :width="popupWidth" bgColor="" radius="20" :showCloseIcon="false">
+			
+			<view class="width100 height100 pr" >
+				<image class="popImg" mode="aspectFit" src="/static/tipBg.png"></image>
+				<view class="popContain width100 ">
+					<view class="tip-top font20">恭喜!获得了到店优惠</view>
+					<view class="tip-price tip-color">
+						 <text class="font45 " v-if="tradeDetail">{{tradeDetail.rebateActivityActualPrice}}</text><text class="">元</text>
+					</view>
+					<view class="tip-color tip-desc">
+						到店付款可当现金用
+					</view>
+					
+					<view class="btnPay " @tap.stop="tapToPay" >去支付</view>
+				</view>
+			</view>
+		</wybPopup>
 	</view>
 </template>
 
@@ -270,7 +287,13 @@
 				storediscountType: '', //门店优惠类型
 				storediscountCondition: '', //门店优惠条件
 				storediscountPrice: '', //门店优惠价格
-				storeDiscountId: '' //门店活动id
+				storeDiscountId: '' ,//门店活动id
+				
+				tradeDetail:null,//订单详情
+				/* 弹窗 */
+				popupHeight:485,
+				popupWidth:330,
+				outTradeNo:'',//订单编号
 			}
 		},
 		mounted() {},
@@ -283,6 +306,9 @@
 				this.getUserAccount();
 				this.queryUserDiscountList();
 			}
+			
+			this.popupHeight = this.rpxTopx(this.popupHeight);
+			this.popupWidth = this.rpxTopx(this.popupWidth);
 		},
 		computed: {
 			//获取输入金额值
@@ -310,6 +336,13 @@
 
 		},
 		methods: {
+			rpxTopx(temp) {
+			  let deviceWidth = uni.getSystemInfoSync().windowWidth; //获取设备屏幕宽度
+			 
+			  let rpx = (750 / deviceWidth) * Number(temp)
+				return Math.floor(rpx);
+			
+			},
 			Timer() {},
 			//发送验证码
 			getCode() {
@@ -672,6 +705,7 @@
 				// if (userAgent.match(/Alipay/i) == "alipay") {
 				// 	this.createJSAPIOrder('ALIPAY');
 				// } else if (userAgent.match(/MicroMessenger/i) == "micromessenger") {
+	
 				if (app.globalData.isClick) {
 					this.createJSAPIOrder();
 					app.globalData.isClick = false;
@@ -697,10 +731,21 @@
 					"userDiscountId": this.memDiscountId,
 					"userPhone": phone
 				}
+				this.tradeDetail = null;
+				this.outTradeNo = "";
 				createJSAPIOrder(datas).then(res => {
 					uni.hideLoading();
 					if (res.return_code == '000000') {
+						
+						if(res.return_data.tradeDetail&&res.return_data.tradeDetail.rebateActivityPart){
+							this.tradeDetail = res.return_data.tradeDetail;
+							this.outTradeNo = res.return_data.outTradeNo;
+							this.$refs.popupTip.show();
+							return
+						}
+						
 						this.jsapiPay(res.return_data.outTradeNo);
+						
 					} else {
 						app.globalData.isClick = true;
 						uni.showToast({
@@ -710,15 +755,27 @@
 						})
 					}
 				})
+			},
+			tapToPay(){
+				this.$refs.popupTip.hide();
+				this.$nextTick(()=>{
+					if(this.outTradeNo){
+						this.jsapiPay(this.outTradeNo);
+					}
+				})
+				
+				
 			},
 			//唤起支付参数
 			jsapiPay(item) {
 				uni.showLoading({
-					title: '请求中'
+					title: '请求中',
+					mask:true,
 				})
 				let datas = {
 					outTradeNo: item
 				}
+				this.outTradeNo = "";
 				jsapiPay(datas).then(res => {
 					uni.hideLoading();
 					if (res.return_code == '000000') {
@@ -1028,6 +1085,9 @@
 			border-radius: 45rpx;
 			font-size: 28rpx;
 		}
+		
+		
+		
 	}
 
 	.re {
@@ -1184,4 +1244,58 @@
 
 		}
 	}
+	
+	/* 活动金弹窗 */
+	.pr{
+		position: relative;
+	}
+	.popImg {
+		width: 100%;
+		height: 100%;
+		min-height: 430px;
+	}
+	.popContain{
+		position: absolute;
+		top: 0;
+		// padding: 20px;
+		box-sizing: border-box;
+		text-align: center;
+		font-size:28rpx;
+		.tip-color{
+			color:#BF0E0F;
+		}
+		.tip-top{
+			color: white;
+			letter-spacing: 2px;
+		}
+		.tip-price{
+			margin-top:143px;
+			font-weight: bold;
+			display: flex;
+			align-items: baseline;
+			justify-content: center;
+			.font45{
+				font-size: 45px;
+				font-style: oblique;
+				margin-right: 5px;
+			}
+		}
+		.tip-desc{
+			font-size: 18px;
+			font-weight: bold;
+			margin-top: 10px;
+		}
+	}
+	.btnPay{
+		color: #FFFFFF;
+		background: linear-gradient(to right, #F46538, #E8411A);
+		width: 60%;
+		margin:22px auto 16px;
+		height: 50px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		border-radius: 25px;
+		font-size: 28rpx;
+	}
 </style>