<template>
	<view class="buy-popup" @click.stop="">
		<view class="header">
			<view class="header-info">
				<image v-if="previewData.coverResource" :src="previewData.coverResource.url" mode="aspectFit"
					class="info-img"></image>
				<view class="info-right">
					<view class="right-name">{{previewData.name}}</view>
					<view class="right-price" v-if="boxType === 'buy'">¥{{detailData.price[0].settlement}}/个</view>
					<view class="right-price" v-else>原价 ¥{{Number(previewData.amount.sale)}}/个</view>

				</view>
			</view>
			<view class="header-tip" v-if="boxType === 'buy' && isCard" @click="card">
				<view class="header-num">x {{listLengthObj[type]}}</view>
				使用提示卡
			</view>
		</view>
		<view class="btn-main" v-if="boxType === 'buy' && !activityType">
			<template v-for="(item,index) in detailData.price">
				<view class="btn-buy one" :class="{'buy-active':typeIndex === index}" v-if="item.type === 'SINGLE'"
					@click="goBuy(item.type,index)">
					一发入魂
				</view>
				<view class="btn-buy three" :class="{'buy-active':typeIndex === index}" v-if="item.type === 'TRIPLE'"
					@click="goBuy(item.type,index)">
					<view class="tips">9.5折</view>
					欧气三连
				</view>
				<view class="btn-buy five" :class="{'buy-active':typeIndex === index}" v-if="item.type === 'PENTA'"
					@click="goBuy(item.type,index)">
					<view class="tips">8.8折</view>
					霸气五连
				</view>
			</template>
		</view>
		<view class="item" v-if="boxType === 'buy'">
			<view class="label">优惠券</view>
			<view class="value">{{previewData.couponName || "无"}}</view>
		</view>
		
		<view class="item" v-if="boxType === 'buy'">
			<view class="label">优惠金额</view>
			<view class="value">¥ {{previewData.discountAmount || 0}}</view>
		</view>
		<view class="item" v-if="boxType === 'buy'">
			<view class="label">连抽优惠</view>
			<view class="value">¥ {{discountAmountObj[previewData.type] || "0"}}</view>
		</view>
		<view class="item">
			<view class="label">实付金额</view>
			<view class="value" v-if="boxType === 'buy'">¥ {{Number(previewData.total) || 0}}</view>
			<view class="value" v-else>¥ {{previewData.amount.sale || 0}}</view>
			<!-- <view class="value" v-if="boxType === 'ROOKIE'">¥ {{previewData.amount.sale || 0}}</view>
				<view class="value" v-else-if="boxType === 'PREFERENTIAL_DAY'">{{previewData.amount.sale || 0}} 代币</view>
				<view class="value" v-else>¥ {{Number(previewData.total) || 0}}</view> -->
		</view>
		<view class="mains" v-if="payList.length > 0">
			<view class="pay" v-for="(item,index) in payList" :key="index" @click="payChange(index,item)">
				<view class="left">
					<image :src="item.img" mode="aspectFit" class="pay-icon"></image>
					{{item.label}}
				</view>
				<image src="@/static/new/address/s.png" mode="" class="select-icon" v-if="item.visible"></image>
				<image src="@/static/new/address/no.png" mode="" class="select-icon" v-else></image>
			</view>
		</view>



		<view class="agreement" @click="agreementVisible = !agreementVisible">
			<image src="@/static/new/address/s.png" mode="" class="agreement-icon" v-if="agreementVisible"></image>
			<image src="@/static/new/address/no.png" mode="" class="agreement-icon" v-else></image>
			我已满18岁，已阅读并同意
			<text class="agreement-color" @click.stop="agreementCk('index')">《用户协议》、</text>
			<text class="agreement-color" @click.stop="agreementCk('privacy')">《隐私政策》、</text>
			<text class="agreement-color" @click.stop="agreementCk('nonage-rule')">《儿童个人信息保护规则》、</text>
			<text class="agreement-color" @click.stop="agreementCk('nonage')">《支付服务协议》</text>
		</view>
		<!-- <view class="agreement" v-if="previewData.payDiscountTip">
			{{previewData.payDiscountTip}}
		</view> -->

		<view class="popup-buy" @click="pay" v-if="boxType === 'buy'">
			<template>立即开盒 ¥{{Number(previewData.total) || 0}}</template>
			<template v-if="previewData.payDiscountTip">
				<view style="font-size: 18rpx;color: #fff;">{{previewData.payDiscountTip}}</view>
			</template>
		</view>
		<view class="popup-buy" @click="pay" v-else>
			立即支付 ¥{{previewData.amount.sale || 0}}
			<view style="font-size: 18rpx;color: #fff;">{{previewData.payDiscountTip}}</view>
		</view>
		<!-- <view class="popup-buy" @click="pay" v-else-if="boxType === 'PREFERENTIAL_DAY'">
				<template>立即开盒 ¥{{Number(previewData.amount.sale) || 0}}</template>
			</view>
			<view class="popup-buy" @click="pay" v-else>
				<template>立即开盒 ¥{{Number(previewData.total) || 0}}</template>
			</view> -->
		<!-- <template v-if="isPayDlgVisible">
				<isPayDlgVue @isOk="isPayStatus" @isCancel="isCancelCk" v-if="isPayDlgVisible"></isPayDlgVue>
			</template> -->



	</view>
</template>

<script>
	import {
		boxOrderReviewApi,
		boxOrderApi,
		boxOrderPaidApi,
		activityReviewApi,
		activityBuyApi,
		activityOrderApi,
		activityReviewSourceApi,
		activitySourceBuyApi,
		noOpenListApi
	} from '@/API/index.js'
	import {
		coinPaidApi,
		payMethodApi,
		userInfo
	} from '@/API/user.js'
	import reportClickFn from '@/utils/report.js'
	import isPayDlgVue from '@/pages/components/isPayDlg.vue'

	import {
		showWebview
	} from '@/utils/webViewCom.js'

	export default {
		data() {
			return {
				type: '',
				typeIndex: 0,
				previewData: {
					amount: {}
				}, //预览订单
				timer: null, //盲盒购买
				rookieTimer: null, //新手盲盒购买
				payList: [], //支付方式
				payType: '',
				boxOrderNo: '',
				isTopUp: false,
				infoDetail: {},
				payLink: '',
				orderSn: '',
				payinfoUrl: '',
				timeSec: 0,
				userInfo: {},
				isTip: true,
				orderNo: '',
				isPayDlgVisible: false,
				agreementVisible: false,
				listLengthObj: {
					SINGLE: 1,
					TRIPLE: 3,
					PENTA: 5,
					NINE:9
				},
				isPayBtn: false,
				discountAmountObj:{},
			}
		},
		props: {
			isActivityReport: {
				type: Boolean,
				default: false
			}, //新活动调起支付埋点
			visible: {
				type: Boolean,
				default: false
			},
			isCard: {
				type: Boolean,
				default: true
			}, //是否显示使用提示卡
			detailData: {
				type: Object,
				default: () => {
					coverResource: {}
				}
			},
			boxType: {
				type: String,
				default: ''
			}, //buy 为不同购买   ROOKIE 新手盲盒   PREFERENTIAL_DAY 每日优惠  SPECIAL_PRICE 薅羊毛
			isDetail: {
				type: Boolean,
				default: false
			}, //是否详情进入
			isActivityClick: {
				type: Boolean,
				default: false
			}, //是否点击打开新人福利
			payNum: {
				type: Number,
				default: 0
			},
			promptId: {
				type: String,
				default: ''
			}, //提示卡ID
			isActivity: {
				type: String,
				default: ''
			},
			activityId: {
				type: String,
				default: ''
			},
			activityType: {
				type: String,
				default: ''
			},
			typeNum: {
				type: String,
				default: ''
			},//几连抽
		},
		components: {
			isPayDlgVue
		},
		watch: {
			// timeSec(){
			//  if(this.timeSec == 30){
			//   clearInterval(this.rookieTimer)
			//   this.rookieTimer = null
			//   this.$api.msg('未查询到支付结果')
			//  }
			// }
			payNum() {
				console.log("asadasdsad")
				this.pay()
			},
		},
		mounted() {
			this.payLink = ''
			if (this.boxType === 'buy') {
					console.log("this.detailData:",this.detailData)
					
					
					const result = {};
					
					this.detailData.price.forEach(item => {
					  result[item.type] = item.discountAmount;
					});
					
					this.discountAmountObj = result
				// 普通盲盒
				if(this.typeNum){
					this.type = this.typeNum
					this.detailData.price.forEach((item,index) => {
						if(item.type === this.typeNum){
							this.typeIndex = index
						}
					})
					
				}else{
					this.type = this.detailData.price[0].type
					this.typeIndex = 0
				}
				
				this.getDetail()
				// 盲盒购买预览
				reportClickFn('box_buy_review_clk')
				if (this.isDetail) {
					// 指定盲盒详情购买预览
					reportClickFn(`boxId_detail_review_${this.detailData.id}`)
				} else {
					// 指定盲盒购买预览
					reportClickFn(`boxId_review_${this.detailData.id}`)
				}
			}
			if (this.boxType === 'ROOKIE') {
				// 活动购买预览
				reportClickFn('box_activity_review_clk')
				// 新手盲盒
				this.getActivityReview()
				// this.getPayMethod()
			}
			if (this.boxType === 'PREFERENTIAL_DAY') {
				// 活动购买预览
				reportClickFn('box_activity_review_clk')
				// 每日优惠
				this.getActivityReview()
			}
			if (this.boxType === 'SPECIAL_PRICE') {
				// 活动购买预览
				// reportClickFn('box_activity_review_clk')
				// 每日优惠
				this.getActivityReview()
			}

		},
		methods: {
			
			// 用户协议 隐私政策
			agreementCk(type){
				uni.navigateTo({
					url:`/pages/agreement/${type}`
				})
			},
			goPage(type) {
				uni.navigateTo({
					url: `/pages/agreement/nonage`
				})
			},
			// 获取用户信息
			// getUserInfo() {
			// 	userInfo().then(res => {
			// 		if (res.code === 200) {
			// 			this.infoDetail = res.data
			// 			if(this.boxType === 'PREFERENTIAL_DAY'){
			// 				this.payTypeClick()
			// 			}
			// 			if(this.boxType === 'buy'){
			// 				this.payTypeClick()
			// 			}
			// 		} else {
			// 			this.$api.msg(res.message)
			// 		}
			// 	})
			// },
			// payTypeClick(){
			// 	if (this.boxType === 'PREFERENTIAL_DAY') {
			// 		 //每日优惠
			// 		let data = {
			// 			method: this.payType
			// 		}
			// 		uni.showLoading()
			// 		activityOrderApi(data).then(result => {
			// 			console.log("result.data:",result.data)
			// 			// debugger
			// 			// window.location.href = result.data.payParams.payinfo
			// 			if(result.data.payParams.method !=="NONE"){
			// 				window.location.href = result.data.payParams.payinfo
			// 			}
			// 				let clearTime = 0
			// 			// 活动调起支付埋点
			// 			reportClickFn('box_activity_review_pay_clk')
			// 			if (result.code === 200) {
			// 				this.timer = setInterval(() => {
			// 					this.getBoxOrderPaid(result.data.no)
			// 					clearTime += 3
			// 					if(clearTime == 30){
			// 						uni.hideLoading()
			// 						clearInterval(this.timer)
			// 						this.timer = null
			// 						this.$api.msg("未查询到支付结果")
			// 					}
			// 				}, 3000);
			// 			} else {
			// 				this.$api.msg(result.message)
			// 			}
			// 		})
			// 	} else if(this.boxType === 'buy') {
			// 		// 普通盲盒购买
			// 		let data = {
			// 			boxId: this.detailData.id,
			// 			type: this.type,
			// 			method: this.payType
			// 		}
			// 		if (this.previewData.couponId) {
			// 			data['couponId'] = this.previewData.couponId
			// 		}

			// 		uni.showLoading()
			// 		boxOrderApi(data).then(result => {
			// 			// 盲盒调起支付埋点
			// 			reportClickFn('box_buy_review_pay_clk')
			// 			if(this.isDetail){
			// 				// 指定盲盒详情订单预览调起支付
			// 				reportClickFn(`boxId_detail_review_pay_${this.detailData.id}`)
			// 			}else{
			// 				// 指定盲盒订单预览调起支付
			// 				reportClickFn(`boxId_review_pay_${this.detailData.id}`)
			// 			}

			// 			if (result.code === 200) {

			// 				// console.log("result.data:",result.data)
			// 				// debugger
			// 				if(result.data.payParams.method !=="NONE"){
			// 					window.location.href = result.data.payParams.payinfo
			// 				}

			// 				let clearTime = 0
			// 				this.orderNo = result.data.no
			// 				this.getBoxOrderPaid(result.data.no)
			// 				this.timer = setInterval(() => {
			// 					this.getBoxOrderPaid(result.data.no)
			// 					clearTime += 3
			// 					if(clearTime == 30){
			// 						uni.hideLoading()
			// 						clearInterval(this.timer)
			// 						this.timer = null
			// 						this.$api.msg("未查询到支付结果")
			// 					}
			// 				}, 3000);
			// 			} else {
			// 				this.$api.msg(result.message)
			// 			}
			// 		}).catch(err => {
			// 			uni.hideLoading()
			// 		})
			// 	}
			// },
			// 使用提示卡
			card() {
				this.$emit('isOk')
				uni.navigateTo({
					url: `/pages/index/card?boxId=${this.previewData.boxId}&type=${this.type}&couponId=${this.previewData.couponId}`
				})
			},
			// 获取支付方式
			getPayMethod() {
				payMethodApi({
					type: 'COIN_RECHARGE'
				}).then(res => {
					console.log(res)
					if (res.code === 200) {
						this.payList = []
						res.data.forEach(item => {
							let objToAdd = null;

							if (item === 'ALIPAY') {
								objToAdd = {
									label: '支付宝支付',
									type: 'ALIPAY',
									visible: false,
									height: '30rpx',
									width: '30rpx',
									img: '../../static/new/pay/zfb.png',
								};
							} else if (item === 'WECHAT') {
								objToAdd = {
									label: '微信支付',
									type: 'WECHAT',
									visible: false,
									width: '34rpx',
									height: '29rpx',
									img: '../../static/new/pay/wx.png',
								};
							} else if (item === 'POINTS') {
								objToAdd = {
									label: "积分支付",
									type: 'POINTS',
									visible: false,
									img: '../../static/an/point.gif',
									width: '30rpx',
									height: '31rpx'
								};
							} else if (item === 'NONE') {
								objToAdd = {
									label: "无需支付",
									type: 'NONE',
									visible: false,
									img: '',
									width: '32rpx',
									height: '34rpx'
								};
							} else if (item === 'COIN') {
								objToAdd = {
									label: "代币支付",
									type: 'COIN',
									visible: false,
									img: '../../static/an/point.gif',
									width: '32rpx',
									height: '34rpx'
								};
							}

							// 只有在objToAdd被赋值的情况下才添加到payList
							// WECHAT
							if (objToAdd) {
								if (objToAdd.type === 'ALIPAY') {
									// 如果是WECHAT类型，则先添加到数组第一位
									this.payList.unshift(objToAdd);
								} else {
									// 其他类型添加到数组末尾
									this.payList.push(objToAdd);
								}
							}
						});
						this.payList[0].visible = true
						this.payType = this.payList[0].type
					}
				})
			},
			// 切换支付方式
			payChange(index, item) {
				this.payList.forEach((v, i) => {
					v.visible = false;
				})
				this.payType = item.type
				this.payList[index].visible = !this.payList[index].visible
				this.payinfoUrl = ''
			},
			// 活动盲盒订单预览
			getActivityReview() {
				activityReviewSourceApi({
					source: this.boxType
				}).then(res => {
					console.log("activityReviewSourceApi", res)
					if (res.code === 200) {
						if (this.isActivityClick) {
							if (this.boxType === 'SPECIAL_PRICE') {
								// 点击打开薅羊毛订单预览数
								reportClickFn('box_special_price_clk_activity_review');
							}
							if (this.boxType === 'ROOKIE') {
								// 点击打开新人福利订单预览数
								reportClickFn('box_clk_activity_review');
							}
							if(this.boxType === 'NINE'){
								// 点击打开九连抽订单预览数
								reportClickFn('box_clk_nine_review');
							}
						} else {
							if (this.boxType === 'SPECIAL_PRICE') {
								// 首次弹出薅羊毛订单预览数
								reportClickFn('box_special_price_activity_review');
							}
							if (this.boxType === 'ROOKIE') {
								// 首次弹出新人福利订单预览数
								reportClickFn('box_activity_review');
							}
							if(this.boxType === 'NINE'){
								// 首次弹出九连抽订单预览数
								reportClickFn('box_nine_review');
							}

						}

						userInfo().then(result => {
							if (result.code === 200) {
								this.previewData = res.data
								this.userInfo = result.data


								this.payList = []
								this.previewData.methods.forEach(item => {
									let objToAdd = null;
									if (item === 'ALIPAY') {
										objToAdd = {
											label: '支付宝支付',
											type: 'ALIPAY',
											visible: false,
											height: '30rpx',
											width: '30rpx',
											img: '../../static/new/pay/zfb.png',
										};
									} else if (item === 'WECHAT') {
										objToAdd = {
											label: '微信支付',
											type: 'WECHAT',
											visible: false,
											width: '34rpx',
											height: '29rpx',
											img: '../../static/new/pay/wx.png',
										};
									} else if (item === 'POINTS') {
										objToAdd = {
											label: "积分支付",
											type: 'POINTS',
											visible: false,
											img: '../../static/an/point.gif',
											width: '30rpx',
											height: '31rpx'
										};
									} else if (item === 'NONE') {
										objToAdd = {
											label: "无需支付",
											type: 'NONE',
											visible: false,
											img: '',
											width: '32rpx',
											height: '34rpx'
										};
									} else if (item === 'COIN') {
										objToAdd = {
											label: "代币支付",
											type: 'COIN',
											visible: false,
											img: '../../static/an/point.gif',
											width: '32rpx',
											height: '34rpx'
										};
									}

									// 只有在objToAdd被赋值的情况下才添加到payList
									if (objToAdd) {
										if (objToAdd.type === 'ALIPAY') {
											// 如果是WECHAT类型，则先添加到数组第一位
											this.payList.unshift(objToAdd);
										} else {
											// 其他类型添加到数组末尾
											this.payList.push(objToAdd);
										}
									}
								});
								this.payList[0].visible = true
								console.log("this.payList[0].type:", this.payList)
								this.payType = this.payList[0].type


							} else {
								this.$api.msg(result.message)
							}
						})
						// this.boxId = res.data.boxId
					} else {
						this.$api.msg(res.message)
					}
				})
				// activityReviewApi().then(res => {
				// 	if (res.code === 200) {
				// 		if(this.isActivityClick){
				// 			// 点击打开新人福利订单预览数
				// 			reportClickFn('box_clk_activity_review');
				// 		}else{
				// 			// 首次弹出新人福利订单预览数
				// 			reportClickFn('box_activity_review');
				// 		}

				// 		userInfo().then(result => {
				// 			if (result.code === 200) {
				// 				this.previewData = res.data
				// 				this.userInfo = result.data


				// 				this.payList = []
				// 				this.previewData.methods.forEach(item => {
				// 				            let objToAdd = null;
				// 				            if (item === 'ALIPAY') {
				// 				                objToAdd = {
				// 				                    label: '支付宝支付',
				// 				                    type: 'ALIPAY',
				// 				                    visible: false,
				// 				                    height: '30rpx',
				// 				                    width: '30rpx',
				// 				                    img: '../../static/new/pay/zfb.png',
				// 				                };
				// 				            } else if (item === 'WECHAT') {
				// 				                objToAdd = {
				// 				                    label: '微信支付',
				// 				                    type: 'WECHAT',
				// 				                    visible: false,
				// 				                    width: '34rpx',
				// 				                    height: '29rpx',
				// 				                    img: '../../static/new/pay/wx.png',
				// 				                };
				// 				            } else if (item === 'POINTS') {
				// 				                objToAdd = {
				// 				                    label: "积分支付",
				// 				                    type: 'POINTS',
				// 				                    visible: false,
				// 				                    img: '../../static/an/point.gif',
				// 				                    width: '30rpx',
				// 				                    height: '31rpx'
				// 				                };
				// 				            } else if (item === 'NONE') {
				// 				                objToAdd = {
				// 				                    label: "无需支付",
				// 				                    type: 'NONE',
				// 				                    visible: false,
				// 				                    img: '',
				// 				                    width: '32rpx',
				// 				                    height: '34rpx'
				// 				                };
				// 				            } else if (item === 'COIN') {
				// 				                objToAdd = {
				// 				                    label: "代币支付",
				// 				                    type: 'COIN',
				// 				                    visible: false,
				// 				                    img: '../../static/an/point.gif',
				// 				                    width: '32rpx',
				// 				                    height: '34rpx'
				// 				                };
				// 				            }

				// 				            // 只有在objToAdd被赋值的情况下才添加到payList
				// 				            if (objToAdd) {
				// 				                if (objToAdd.type === 'WECHAT') {
				// 				                    // 如果是WECHAT类型，则先添加到数组第一位
				// 				                    this.payList.unshift(objToAdd);
				// 				                } else {
				// 				                    // 其他类型添加到数组末尾
				// 				                    this.payList.push(objToAdd);
				// 				                }
				// 				            }
				// 				        });
				// 				this.payList[0].visible = true
				// 				console.log("this.payList[0].type:",this.payList)
				// 				this.payType = this.payList[0].type


				// 			} else {
				// 				this.$api.msg(result.message)
				// 			}
				// 		})
				// 		// this.boxId = res.data.boxId
				// 	}else{
				// 		this.$api.msg(res.message)
				// 	}
				// }).catch(err => {

				// })
			},
			// 订单预览
			getDetail() {
				boxOrderReviewApi({
					boxId: this.detailData.id,
					type: this.type
				}).then(res => {
					console.log(res.data)
					if (res.code === 200) {
						userInfo().then(result => {
							if (result.code === 200) {
								this.previewData = res.data
								this.userInfo = result.data
								this.payList = []
								this.previewData.methods.forEach(item => {
									let objToAdd = null;
									if (item === 'ALIPAY') {
										objToAdd = {
											label: '支付宝支付',
											type: 'ALIPAY',
											visible: false,
											height: '30rpx',
											width: '30rpx',
											img: '../../static/new/pay/zfb.png',
										};
									} else if (item === 'WECHAT') {
										objToAdd = {
											label: '微信支付',
											type: 'WECHAT',
											visible: false,
											width: '34rpx',
											height: '29rpx',
											img: '../../static/new/pay/wx.png',
										};
									} else if (item === 'POINTS') {
										objToAdd = {
											label: "积分支付",
											type: 'POINTS',
											visible: false,
											img: '../../static/an/point.gif',
											width: '30rpx',
											height: '31rpx'
										};
									} else if (item === 'NONE') {
										objToAdd = {
											label: "无需支付",
											type: 'NONE',
											visible: false,
											img: '',
											width: '32rpx',
											height: '34rpx'
										};
									} else if (item === 'COIN') {
										objToAdd = {
											label: "代币支付",
											type: 'COIN',
											visible: false,
											img: '../../static/an/point.gif',
											width: '32rpx',
											height: '34rpx'
										};
									}

									// 只有在objToAdd被赋值的情况下才添加到payList
									if (objToAdd) {
										if (objToAdd.type === 'ALIPAY') {
											// 如果是WECHAT类型，则先添加到数组第一位
											this.payList.unshift(objToAdd);
										} else {
											// 其他类型添加到数组末尾
											this.payList.push(objToAdd);
										}
									}
								});
								this.payList[0].visible = true
								console.log("this.payList[0].type:", this.payList)
								this.payType = this.payList[0].type


							} else {
								this.$api.msg(result.message)
							}
						})
					} else {
						this.$api.msg(res.message)
					}
				})
			},
			// 切换购买类型
			goBuy(type, index) {
				this.typeIndex = index
				this.type = type
				this.getDetail()
			},
			isCancelCk() {
				this.isPayDlgVisible = false
			},
			isPayStatus() {
				this.getBoxOrderPaid(this.orderNo, 'click')
			},
			// 立即支付
			pay() {
				if (this.isPayBtn) {
					return
				}
				this.isPayBtn = true
				if (!this.agreementVisible) {
					this.$api.msg("请阅读并同意《用户协议》、《隐私政策》、《儿童个人信息保护规则》、《支付服务协议》")
					this.isPayBtn = false
					return
				}
				clearInterval(this.timer)
				this.timer = null
				uni.hideLoading()
				clearInterval(this.rookieTimer)
				this.rookieTimer = null
				if (this.boxType === 'buy') {
					// 普通盲盒购买
					let data = {
						boxId: this.detailData.id,
						type: this.activityType ? this.activityType : this.type,
						method: this.payType
					}

					if (this.previewData.couponId) {
						data['couponId'] = this.previewData.couponId
					}

					if (this.promptId) {
						data['promptId'] = this.promptId
					}
					uni.showLoading({
						mask: true
					})
					boxOrderApi(data).then(result => {
						uni.hideLoading()
						setTimeout(() => {
							this.isPayBtn = false;
						}, 2000);
						// 盲盒调起支付埋点
						reportClickFn('box_buy_review_pay_clk')
						if (this.isDetail) {
							// 指定盲盒详情订单预览调起支付
							reportClickFn(`boxId_detail_review_pay_${this.detailData.id}`)
						} else {
							// 指定盲盒订单预览调起支付
							reportClickFn(`boxId_review_pay_${this.detailData.id}`)
						}

						if (result.code === 200) {
							if (result.data.payParams.method !== "NONE") {
								window.location.href = result.data.payParams.payinfo
							}
							let clearTime = 0
							this.orderNo = result.data.no
							this.isPayDlgVisible = true
							// 新增支付弹框
							let listLength = 1
							if (this.activityType) {
								if (this.activityType === 'SINGLE') {
									listLength = 1
								} else if (this.activityType === 'TRIPLE') {
									listLength = 3
								} else {
									listLength = 5
								}
							} else {
								if (this.previewData.type === 'SINGLE') {
									listLength = 1
								} else if (this.previewData.type === 'TRIPLE') {
									listLength = 3
								} else {
									listLength = 5
								}
							}

							this.$emit('payStatus', {
								no: result.data.no,
								type: listLength,
								boxId: this.previewData.boxId
							})
							// 新增支付弹框

							this.getBoxOrderPaid(result.data.no)
							this.timer = setInterval(() => {
								this.getBoxOrderPaid(result.data.no)
								clearTime += 3
								if (clearTime == 30) {
									uni.hideLoading()
									clearInterval(this.timer)
									this.timer = null
									// this.$api.msg("未查询到支付结果")
								}
							}, 3000);
						} else {
							uni.hideLoading()
							this.$api.msg(result.message)
						}
					}).catch(err => {

						setTimeout(() => {
							this.isPayBtn = false;
						}, 2000);
						uni.hideLoading()
					})
				} else {
					let data = {
						method: this.payType,
						source: this.boxType
					}
					uni.showLoading({
						mask: true
					})
					this.timeSec = 0
					activitySourceBuyApi(data).then(res => {
						if (res.code === 200) {
							if (res.data.payParams.payinfo) {
								// 活动调起支付埋点
								reportClickFn('box_activity_review_pay_clk')
								if (this.isActivityClick) {

									if (this.boxType === 'SPECIAL_PRICE') {
										// 首次弹出薅羊毛订单预览调起支付数
										reportClickFn('box_clk_special_price_activity_review_pay');
									}
									if (this.boxType === 'ROOKIE') {
										// 点击打开新人福利订单预览调起支付数
										reportClickFn('box_clk_activity_review_pay');
									}
									if(this.boxType === 'NINE'){
										// 点击打开九连抽订单预览调起支付数
										reportClickFn('box_clk_nine_review_pay');
									}
								} else {

									if (this.boxType === 'SPECIAL_PRICE') {
										// 首次弹出薅羊毛订单预览调起支付数
										reportClickFn('box_special_price_activity_review_pay');
									}
									if (this.boxType === 'ROOKIE') {
										// 首次弹出新人福利订单预览调起支付数
										reportClickFn('box_activity_review_pay');
									}
									if(this.boxType === 'NINE'){
										// 首次弹出九连抽订单预览调起支付数
										reportClickFn('box_nine_activity_review_pay');
									}
								}
								window.location.href = res.data.payParams.payinfo
								let clearTime = 0

								this.orderNo = res.data.no
								this.isPayDlgVisible = true
								this.getBoxOrderPaid(res.data.no)
								this.rookieTimer = setInterval(() => {
									console.log("result.data.no:", res.data.no)
									this.getBoxOrderPaid(res.data.no)
									clearTime += 3
									if (clearTime == 30) {
										uni.hideLoading()
										clearInterval(this.rookieTimer)
										this.rookieTimer = null
										this.$api.msg("未查询到支付结果")
									}
								}, 3000);
							} else {
								let clearTime = 0

								this.orderNo = res.data.no
								this.isPayDlgVisible = true
								this.getBoxOrderPaid(res.data.no)
								this.rookieTimer = setInterval(() => {
									this.getBoxOrderPaid(res.data.no)
									clearTime += 3
									if (clearTime == 30) {
										uni.hideLoading()
										clearInterval(this.rookieTimer)
										this.rookieTimer = null
										this.$api.msg("未查询到支付结果")
									}
								}, 3000);
							}
						} else {
							uni.hideLoading()
							this.$api.msg(res.message)
						}
					}).catch(err => {
						uni.hideLoading()
					})
				}
			},
			// 盲盒购买订单回调(如果type为click则是点击)
			getBoxOrderPaid(no, type) {
				boxOrderPaidApi({
					no
				}).then(payResult => {
					console.log("payResult")
					if (payResult.data) {
						if (type != 'click') {
							// 活动实际支付埋点
							if (this.boxType === 'PREFERENTIAL_DAY') {
								reportClickFn('box_activity_review_pay_accomplish_clk')
							}
							// 盲盒实际支付埋点
							if (this.boxType === 'buy') {
								reportClickFn('box_buy_review_pay_accomplish_clk')

								if (this.isDetail) {
									// 指定盲盒详情订单预览支付成功
									reportClickFn(`boxId_detail_review_pay_accomplish_${this.detailData.id}`)
								} else {
									// 指定盲盒订单预览支付成功
									reportClickFn(`boxId_review_pay_accomplish_${this.detailData.id}`)
								}

							}

							if (this.isActivityClick) {

								if (this.boxType === 'SPECIAL_PRICE') {
									// 点击打开薅羊毛订单预览支付成功数
									reportClickFn('box_special_price_clk_activity_review_pay_accomplish');
								}
								if (this.boxType === 'ROOKIE') {
									// 点击打开新人福利订单预览支付成功数
									reportClickFn('box_clk_activity_review_pay_accomplish');
								}
								if(this.boxType === 'NINE'){
									// 点击打开九连抽订单预览支付成功数
									reportClickFn('box_clk_nine_review_pay_accomplish');
								}
							} else {
								if (this.boxType === 'SPECIAL_PRICE') {
									// 首次弹出薅羊毛订单预览支付成功数
									reportClickFn('box_special_price_activity_review_pay_accomplish');
								}
								if (this.boxType === 'ROOKIE') {
									// 首次弹出新人福利订单预览支付成功数
									reportClickFn('box_activity_review_pay_accomplish');
								}
								if(this.boxType === 'NINE'){
									// 首次弹出九连抽订单预览支付成功数
									reportClickFn('box_nine_review_pay_accomplish');
								}
							}
						}



						if (this.isActivity === 'runActivity') {
							// 新活动支付调起埋点
							reportClickFn(`activity_pay_clk${this.activityId}`)
						}

						clearInterval(this.timer); // 清除定时器
						this.timer = null;
						clearInterval(this.rookieTimer); // 清除定时器
						this.rookieTimer = null;
						this.$emit('isOk')
						this.$api.msg('支付成功')
						let listLength = 1
						if (this.previewData.type === 'SINGLE') {
							listLength = 1
						} else if (this.previewData.type === 'TRIPLE') {
							listLength = 3
						} else {
							listLength = 5
						}
						this.isPayDlgVisible = false
						if (this.isActivity) {
							uni.navigateTo({
								url: `/pages/index/draw?no=${no}&boxId=${this.previewData.boxId}&type=${listLength}&isActivity=${this.isActivity}`
							})
						} else {
							if(this.previewData && this.previewData.boxId && no && listLength){
								uni.navigateTo({
									url: `/pages/index/draw?no=${no}&boxId=${this.previewData.boxId}&type=${listLength}`
								})
							}else{
								// 直接跳转开奖结果
								noOpenListApi().then(resss => {
									console.log(resss)
									if(resss.code === 200){
										if(resss.data.length > 0){
											uni.redirectTo({
												url:`/pages/index/draw?noOpen=noOpen`
											})
										}
									}else{
										this.$api.msg(resss.message)
									}
								}).catch(err => {
									
								})
							}
						}

						// uni.redirectTo({
						// 	url: `/pages/index/boxPaySuccess?no=${no}&boxId=${this.previewData.boxId}&name=${this.previewData.name}&type=${this.previewData.type}&sale=${this.previewData.total}`
						// })
						uni.hideLoading()
					} else {
						// if(type == 'click'){
						// 	this.$api.msg('未查询到支付结果')
						// }
					}
				}).catch(err => {
					clearInterval(this.timer); // 清除定时器
					this.timer = null;
					uni.hideLoading()
				})
			},
			// 查询新手盲盒支付订单
			getCoinPaid(no) {
				coinPaidApi({
					no
				}).then(payResult => {
					if (payResult.data) {
						// 活动实际支付埋点
						reportClickFn('box_activity_review_pay_accomplish_clk')
						if (this.isActivityClick) {
							// 点击打开新人福利订单预览支付成功数
							reportClickFn('box_clk_activity_review_pay_accomplish');
						} else {
							// 首次弹出新人福利订单预览支付成功数
							reportClickFn('box_activity_review_pay_accomplish');
						}
						clearInterval(this.rookieTimer); // 清除定时器
						this.rookieTimer = null;
						this.$emit('isOk')
						this.$api.msg('支付成功')
						uni.navigateTo({
							url: `/pages/index/draw?no=${this.boxOrderNo}&boxId=${this.previewData.boxId}&type=1`
						})
						// uni.redirectTo({
						// 	url: `/pages/index/boxPaySuccess?no=${this.boxOrderNo}&boxId=${this.previewData.boxId}&name=${this.previewData.name}&type=${this.previewData.type}&sale=${this.previewData.amount.sale}`
						// })
						uni.hideLoading()
					}
				}).catch(err => {
					clearInterval(this.timer); // 清除定时器
					this.timer = null;
					uni.hideLoading()
				})
			},
		},
		onUnload() {
			// 在页面离开时清除定时器
			clearInterval(this.timer);
			clearInterval(this.rookieTimer)
		}
	}
</script>

<style lang="scss" scoped>
	.buy-popup {
		// background-color: #fff;
		// position: absolute;
		// bottom: 0;
		// left: 0;
		// border-radius: 30rpx 0rpx 30rpx 0rpx;
		padding: 32rpx;

		.header {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.header-info {
				display: flex;
				align-items: center;

				.info-img {
					width: 158rpx;
					height: 158rpx;
					border-radius: 10rpx;
				}

				.info-right {
					margin-left: 24rpx;
					display: flex;
					// align-items: center;
					justify-content: space-between;
					flex-direction: column;
					height: 158rpx;
					font-weight: bold;
					font-size: 42rpx;
					color: #000000;

					.right-name {}

					.right-price {
						font-size: 28rpx;
						font-weight: normal;
					}
				}
			}

			.header-tip {
				font-size: 30rpx;
				color: #0080FF;

				.header-num {
					text-align: center;
					font-size: 40rpx;
					color: #000;
					font-weight: bold;
				}
			}
		}

		.item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 685rpx;
			height: 80rpx;
			font-weight: bold;
			font-size: 28rpx;
			color: #333333;

			.label {}

			.value {}
		}

		.popup-buy {
			z-index: 9999;
			margin-top: 16rpx;
			width: 706rpx;
			height: 88rpx;
			background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
			border-radius: 16rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			font-size: 32rpx;
			color: #FFFFFF;
		}

		.btn-main {
			display: flex;
			align-items: center;
			justify-content: center;

			margin-top: 40rpx;

			.btn-buy {
				margin: 0 20rpx;
				// background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
				border-radius: 16rpx;
				width: 30%;
				height: 80rpx;
				position: relative;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 8rpx;
				font-size: 28rpx;
				// color: #FFFFFF;
				color: #999999;
				border: 2rpx solid #E6E6E6;

				.tips {
					position: absolute;
					width: 158rpx;
					height: 40rpx;
					background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%);
					border-radius: 20rpx 0px 20rpx 0px;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 24rpx;
					color: #FFFFFF;
					top: -20rpx;
					left: 0rpx;
				}
			}

			.buy-active {
				background: linear-gradient(90deg, #39B2FF 0%, #3354FF 100%), #D9D9D9;
				color: #fff;
			}

			.one {}

			.three {}

			.five {}
		}

		.mains {
			width: 686rpx;
			background: #FFFFFF;
			border-radius: 24rpx;
			margin-bottom: 24rpx;

			// margin-left: 32rpx;
			.pay {
				display: flex;
				align-items: center;
				justify-content: space-between;
				height: 104rpx;
				padding: 0 24rpx;


				.left {
					font-weight: 500;
					font-size: 28rpx;
					color: #333333;
					display: flex;
					align-items: center;

					.pay-icon {
						width: 48rpx;
						height: 48rpx;
						margin-right: 16rpx;
					}
				}

				.select-icon {
					width: 32rpx;
					height: 32rpx;
				}
			}
		}

		.log-out {
			width: 590rpx;
			height: 300rpx;
			background: #FFFFFF;
			border-radius: 16rpx;

			.log-out-tip {
				height: 200rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: rgba(0, 0, 0, 0.85);
				line-height: 200rpx;
				text-align: center;
			}

			.log-out-footer {
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-top: 2rpx solid rgba(0, 0, 0, 0.06);
				height: 100rpx;

				.cancel {
					width: 294rpx;
					height: 100rpx;
					line-height: 100rpx;
					font-weight: 500;
					font-size: 32rpx;
					color: #000000;
					text-align: center;
					border-right: 1px solid rgba(0, 0, 0, 0.06);
				}

				.log-out-submit {
					width: 294rpx;
					height: 100rpx;
					line-height: 100rpx;
					font-weight: 500;
					font-size: 32rpx;
					color: #E55353;
					text-align: center;
				}
			}
		}
	}

	.agreement {
		// margin: 40rpx;
		width: 670rpx;
		font-size: 24rpx;
		color: #666666;
		line-height: 46rpx;

		.agreement-icon {
			width: 32rpx;
			height: 32rpx;
			margin-right: 8rpx;
			vertical-align: middle;
		}

		.agreement-color {
			color: #0080FF;
		}
	}
</style>