zhywpt-sp/subpackage/service/equityList/equityList.vue

<template>
	<!-- 	<text class="btn" v-if="item.isPay==2"
			@click.stop="equityPaymentOrderRequest(item.id)">去支付</text> -->

	<view class="list" :style="{'--bgimg':`url(${$imgUrl}equiet-bg1.png)`}" v-for="(item, index) in listData" :key="index" @click="onClick(item)" :data-code="item">
		<image class="name" :src="`${$imgUrl}equity-name.png`"></image>
		<view class="right-content">
			<view>{{item.EQUITYNAME}}</view>
			<image class="icon-back" src="/static/image/icon-back.png" mode=""></image>
		</view>
	</view>
	<view v-if="listData.length==0" class="no">暂无数据</view>
</template>
<script setup lang='ts'>
	import { reactive } from "vue";
	import {
		getItem
	} from "@/utils/storage";
	import {
		ref
	} from 'vue';
	import {
		requestNew
	} from "@/utils/network/request.js";
	import {getOpenId,paymentequityapplyapp,payequitydetection,queryuserallequity} from "@/utils/network/api.js";
	import {
		stringToJson
	} from "@/utils/network/encryption";
	import { msg } from "@/utils/utils";
	import {onShow} from "@dcloudio/uni-app";
	let listData = ref([])
    const state = reactive({
		id: "", //支付id
	});
	onShow(()=>{
		query()
	})
	function query(){
		//卡券渠道类型获取单项权益列表
		requestNew(queryuserallequity, {
			type: 2,
			method: "POST",
			showLoading: true,
		}).then((item) => {
			let res = item
			console.log(res, '=========');
			listData.value = res.mapList
		})
	}
  
	function onClick(singId: any) {
		console.log("singId", singId)
		uni.navigateTo({
			url: '/subpackage/service/equity/equity?singleEquityId=' + singId.EQUITYID +
				'&couponAgencyType=' + singId.couponAgencyType + '&couponId=' + singId.couponId + '&equityId=' + singId.equityId+ '&purchasedEquityId=' + singId.eporderId,
		})
	}
	// 权益支付下单
	// const equityPaymentOrderRequest = (id) => {
	// 	state.id =id
	// 	// #ifdef MP-WEIXIN
	// 	uni.login({
	// 		provider: "weixin",
	// 		success: function (e) {
	// 			const options1 = {
	// 				type: 2,
	// 				data: {
	// 					"jsCode": e.code
	// 				},
	// 				method: "POST",
	// 				showLoading: true,
	// 			};
	// 			requestNew(getOpenId, options1).then((res) => {
	// 				console.log("state.id",id)
	// 				const result = res;
	// 				const openidData = stringToJson(result.data);
	// 				console.log("openidData",openidData)
	// 				const options = {
	// 					type: 2,
	// 					data: {
	// 						id: id,
	// 						payType: "EQUITY",
	// 						wxOpenid: openidData.openid,
	// 					},
	// 					method: 'POST',
	// 					showLoading: true,
	// 				}
	// 				requestNew(paymentequityapplyapp, options).then((res) => {
	// 					const data = res;
	// 					console.log("权益支付下单", data)
	// 					if (data.info == "购买权益记录已支付") {
	// 						uni.showModal({
	// 							title: '提示',
	// 							content: data.info,
	// 							showCancel: false,
	// 							success: function (res) {
	// 								if (res.confirm) {
	// 									uni.navigateBack({
	// 										delta: 2
	// 									})
	// 								}
	// 							}
	// 						});
	// 					} else {
	// 						uni.requestPayment({
	// 							provider: "wxpay",
	// 							orderInfo: "",
	// 							timeStamp: data.timestamp,
	// 							nonceStr: data.noncestr,
	// 							package: data.wxPackage ? data.wxPackage : "",
	// 							signType: data.signType,
	// 							paySign: data.sign,
	// 							success: function (e) {
	// 								console.log("支付成功", res);
	// 								// 权益支付检测
	// 								equityPaymentTestRequest().then((item : any) => {
	// 									console.log("权益支付检测", data)
	// 									msg("权益产品购买成功")
	// 									// 重新查询一遍
	// 									query()
	// 								})
	// 							},
	// 							fail: function (err) {
	// 								confirm(err, () => { }, "支付失败", false);
	// 							},
	// 						})
	// 					}
	// 				})
	// 			})
	// 		},
	// 	})
	// 	// #endif
	// 	// #ifdef MP-ALIPAY
	// 	my.getAuthCode({
	// 		scopes: 'auth_base',
	// 		success: res => {
	// 			const optionsUser = {
	// 				type: 2,
	// 				data: {
	// 					payConfigId: aliPayConfigIdTwo,
	// 					code: res.authCode
	// 				},
	// 				method: "POST",
	// 				showLoading: true,
	// 			};
	// 			console.log('支付宝用户编号请求：', optionsUser)
	// 			requestNew(obtainUserId, optionsUser).then((res) => {
	// 				console.log('支付宝用户编号返回：', res)
	// 				const data = res;
	// 				console.log("data", data)
	// 				const optionsali = {
	// 					type: 2,
	// 					data: {
	// 						id: state.id,
	// 						payType: "EQUITY",
	// 						wxOpenid: data.openId,
	// 					},
	// 					method: "POST",
	// 					showLoading: true,
	// 				};
	// 				console.log('支付下单请求：', optionsali)
	// 				requestNew(paymentequityapplyapp, optionsali).then((res) => {
	// 					const data = stringToJson(res.bizContent);
	// 					console.log('支付下单返回：', data)
	// 					my.tradePay({
	// 						// 调用统一收单交易创建接口（alipay.trade.create），获得返回字段支付宝交易号 trade_no
	// 						tradeNO: data.tranPackage,
	// 						success: res => {
	// 							console.log("支付成功", res);
	// 							if (res.resultCode != "6001") {
	// 								// 权益支付检测
	// 								equityPaymentTestRequest().then((item : any) => {
	// 									console.log("权益支付检测", data)
	// 									msg("权益产品购买成功,到【我的】权益查看")
	// 									setTimeout(() => {
	// 										uni.navigateBack({
	// 											delta: 2
	// 										})
	// 									}, 2000)
	// 								})
	// 							}
	
	// 						},
	// 						fail: res => {
	// 							console.log("支付失败", res);
	// 						},
	// 					});
	
	// 				});
	// 			});
	// 		},
	// 		fail: err => {
	// 			console.log('my.getAuthCode 调用失败', err)
	// 		}
	// 	});
	// 	// #endif
	// }
	// 权益支付检测
	// const equityPaymentTestRequest = () => {
	// 	const options = {
	// 		type: 2,
	// 		data: {
	// 			id: state.id,
	// 		},
	// 		method: 'POST',
	// 		showLoading: true,
	// 	}
	// 	return new Promise(async (resolve, reject) => {
	// 		const res = await requestNew(payequitydetection, options);
	// 		const data = res;
	// 		resolve(data);
	// 	}).catch((error) => {
	// 		reject(error);
	// 	});
	// }
</script>
<style>
	page {
		background: #E9EDF0;
		font-size: 28rpx;
		padding: 20rpx;
		box-sizing: border-box;
	}
</style>
<style lang='scss' scoped>
.no{
	text-align: center;
	margin: 40rpx auto;
	font-size: 28rpx;
}
.list {
	background-size: 100% 100%;
	background-repeat: no-repeat;
	width: 100%;
	height: 168rpx;
	text-align: right;
	display: flex;
	align-items: center;
	background-image: var(--bgimg);
	
	.name{
		width: 60rpx;
		height: 60rpx;
		margin-left: 60rpx;
		margin-right: 60rpx;
	}
	.right-content{
		flex: 3;
		display: flex;
		align-items: center;
		padding: 0 20rpx 0 40rpx;
		box-sizing: border-box;
		justify-content: space-between;
		.icon-back{
			width: 26rpx;
			height: 36rpx;
			transform: rotateY(180deg);
		}
	}
	
}
</style>