<template>
	<view class="page">
		<!-- 支付状态 -->
		<view class="status">
			<view class="status-success-icon"><u-icon name="checkbox-mark" :color="appThemeBgColor" size="44"></u-icon></view>
			<view class="status-name">支付成功</view>
			<view class="money">
				<text>￥</text>
				<text>{{payTotal}}</text>
			</view>
		</view>

		<!-- 付款信息 -->
		<view class="pay-info">
			<view class="item">
				<view class="label">付款方式</view>
				<view class="value">微信支付</view>
			</view>
		</view>
		<view class="oparBtn" v-if="orderId">
			<u-button type="primary" @click="viewOrderInfo">查看订单</u-button>
		</view>
	</view>
</template>

<script>
	var _self;
export default {
	data() {
		return {
			appThemeBgColor: this.$appTheme.appThemeBgColor,
			payTotal:0,
			orderId:null,
		};
	},
	onLoad(opt) {
		_self = this;
		console.log(opt);
		_self.payTotal = opt.payTotal||0;
		_self.orderId = opt.orderId||null;
		console.log(_self.orderId);
	},
	onBackPress(options) {
		console.log('监听到了返回按钮点击事件');
		this.backpage();
		/* if (options && options.from === 'navigateBack') {
		  uni.navigateBack({
		  	delta: 3
		  });
		} else {
		  console.log('直接返回主界面');
		  uni.switchTab({
			  url:'pages/mall/index'
		  })
		  // 这里可以编写处理直接返回主界面的相关逻辑
		} */
  },
	methods: {
		backpage() {
			uni.navigateBack({
				delta: 3
			});
		},
		viewOrderInfo(){
			// this.subScribeMsg();
			uni.navigateTo({
				url: '/pages-mall/pages/order/detail?order_id='+this.orderId
			});
		},
		// 支付回调
		subScribeMsg() {
			uni.getSetting({
				withSubscriptions: true,
				success(res) {
					console.log('1', res, '订阅信息', res.subscriptionsSetting);
					if (!res.subscriptionsSetting.mainSwitch) {
						uni.openSetting({ //打开设置页
							success(res) {
								console.log('打开设置页', res.authSetting);
							}
						})
					} else {
						uni.requestSubscribeMessage({
							tmplIds: ['Sfa68XDGAUQveX50PcP_Ep6ngNz3luvXJNwzASjzzvQ',
								'_VxaYVnVTj3aG_wengF8KNFDI3WRhOrFseBerx8xvXE',
							],
							success(res) {
								console.log('requestSubscribeMessage 订阅信息', res);
								if (res['Sfa68XDGAUQveX50PcP_Ep6ngNz3luvXJNwzASjzzvQ'] == "accept") { // 用户点击确定后
									console.log('用户订阅点击确定按钮');
									// _self.getSubMsg()
								} else {
									console.log('拒绝');
								}
							},
							fail(errMessage) {
								console.log("订阅消息 失败 ", errMessage);
							},
							// 不管成功或失败都要执行
							complete() {
								// if (_self.ordercode == null) return _self.getOrder();
								// if (_self.ordercode != null) return _self.getPayOrder();
								uni.navigateTo({
									url: '/pages-mall/pages/order/detail?order_id='+_self.orderId
								});
							}
						})
					}
				},
			})
		},
	}
};
</script>

<style lang="scss" scoped>
.page {
	background-color: $app-theme-bg-color;
}
.status {
	padding: 80rpx 0 84rpx 0;
	.status-success-icon {
		width: 88rpx;
		height: 88rpx;
		margin: 0 auto;
		margin-bottom: 16rpx;
		background-color: $app-theme-color;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 50%;
	}
	.status-name {
		font-size: 34rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: $app-theme-color;
		margin-bottom: 40rpx;
		text-align: center;
	}
	.money {
		text-align: center;
		text:nth-child(1) {
			font-size: 40rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: $app-theme-text-color;
		}
		text:nth-child(2) {
			font-size: 60rpx;
			font-family: Helvetica;
			color: $app-theme-text-color;
		}
	}
}

.pay-info {
	margin: 0 24rpx;
	padding-bottom: 24rpx;
	border-bottom: 1px solid $app-theme-border-color;

	.item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 24rpx;
	}
	.label {
		font-size: 30rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: $app-theme-text-gray-color;
	}
	.value {
		font-size: 30rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: $app-theme-text-color;
	}
}

.oparBtn{
	padding:100rpx 100rpx 0;
}
</style>
