更新：谷歌支付、积分列表

2025-11-27 19:48:12 +08:00
parent 435a23f995
commit 878e49dc2e
5 changed files with 349 additions and 82 deletions
--- a/pages/user/index.vue
+++ b/pages/user/index.vue
@@ -26,18 +26,22 @@
 				<view class="vip-card-title">{{ $t('user.vip') }}</view>
 				<view class="vip-card-content">
 					<view class="vip-item-list">
-						<view v-if="vipInfo.length > 0" v-for="vip in vipInfo">{{ vipTypeDict[vip.type] }}（有效期到 {{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
+						<view v-if="vipInfo.length > 0" v-for="vip in vipInfo">{{ vipTypeDict[vip.type] }}（有效期到
+							{{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
 						<view v-else>办理课程VIP，畅享更多权益</view>
 					</view>
-					<wd-button v-if="vipInfo.length > 0" plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.renewal') }}</wd-button>
+					<wd-button v-if="vipInfo.length > 0" plain type="primary" size="small"
+						@click="goSubscribe">{{ $t('vip.renewal') }}</wd-button>
 					<wd-button v-else plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.openVip') }}</wd-button>
 				</view>
 				<view class="vip-card-content">
 					<view class="vip-item-list">
-						<view v-if="vipInfoEbook.length > 0" v-for="vip in vipInfoEbook">电子书VIP{{ vipTypeDict[vip.type] }}（有效期到 {{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
+						<view v-if="vipInfoEbook.length > 0" v-for="vip in vipInfoEbook">电子书VIP{{ vipTypeDict[vip.type] }}（有效期到
+							{{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
 						<view v-else>办理电子书VIP，畅享更多权益</view>
 					</view>
-					<wd-button v-if="!vipInfoEbook.length" plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.openVip') }}</wd-button>
+					<wd-button v-if="!vipInfoEbook.length" plain type="primary" size="small"
+						@click="goSubscribe">{{ $t('vip.openVip') }}</wd-button>
 				</view>
 			</view>
 		</view>
@@ -50,14 +54,14 @@
 						<view class="assets_row">{{ t('global.coin') }}</view>
 						<view>{{userInfo.peanutCoin ?? 1}}</view>
 					</view>
-					<view>
+					<view @click="goPointsList">
 						<view class="assets_row">积分</view>
 						<view>{{userInfo.jf ?? 1}}</view>
 					</view>
-					<view>
+					<!-- <view>
 						<view class="assets_row">优惠卷</view>
 						<view>0</view>
-					</view>
+					</view> -->
 				</view>
 				<view class="chong_btn" @click="goRecharge">充 值</view>
 				<!-- <text class="wallet_title">{{$t('my.coin')}}<uni-icons type="help" size="19" color="#666"></uni-icons></text>
@@ -86,6 +90,7 @@
 	import { getNotchHeight } from '@/utils/system'
 	import { parseTime } from '@/utils/index'
 	import { t } from '@/utils/i18n'
+	import { onShow } from '@dcloudio/uni-app'

 	const userStore = useUserStore()
 	const sysStore = useSysStore()
@@ -99,7 +104,7 @@
 	// VIP信息
 	const vipInfo = computed(() => userStore.userVips)
 	const vipInfoEbook = computed(() => userStore.userEbookVip)
-		
+
 	// VIP类型字典
 	const vipTypeDict = sysStore.vipTypeDict

@@ -212,7 +217,7 @@
 			url: '/pages/user/recharge/index'
 		})
 	}
-	
+
 	/**
 	 * 跳转虚拟币页面
 	 */
@@ -221,12 +226,22 @@
 			url: '/pages/user/virtual/index'
 		})
 	}
-	
-	
-	
+
+	/**
+		* 跳转积分列表
+		*/
+	const goPointsList = () => {
+		uni.navigateTo({
+			url: '/pages/user/points/index'
+		})
+	}
+
+	onShow(() => {
+		getData()
+	})
+
 	onMounted(() => {
 		getPlatform()
-		getData()
 	})
 </script>

@@ -306,14 +321,14 @@
 			border-radius: 15rpx;
 			padding: 26rpx 30rpx 10rpx;
 			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
-			
+
 			.vip-card-title {
 				font-size: 32rpx;
 				color: #fff;
 				font-weight: bold;
 				margin-bottom: 20rpx;
 			}
-			
+
 			.vip-card-content {
 				display: flex;
 				align-items: center;
@@ -323,6 +338,7 @@
 				padding: 30rpx;
 				margin-bottom: 20rpx;
 			}
+
 			.vip-item-list {
 				font-size: 28rpx;
 				color: #fff;
@@ -412,7 +428,7 @@
 		flex: 1;
 		justify-content: space-around;
 		text-align: center;
-		transform:translateX(-20px);
+		transform: translateX(-20px);

 		.assets_row {
 			margin-bottom: 20rpx;
--- a/pages/user/points/index.vue
+++ b/pages/user/points/index.vue
@@ -0,0 +1,135 @@
+<template>
+	<z-paging ref="paging" v-model="bookList" auto-show-back-to-top class="my-book-page" @query="pointsList" :default-page-size="10">
+		<template #top>
+			<!-- 自定义导航栏 -->
+			<nav-bar :title="$t('user.consumptionRecord')"></nav-bar>
+		</template>
+		<view class="recharge-record" v-if="(bookList && bookList.length > 0)">
+			<view class="go-gecharge" @click="goRecharge">
+				<view>{{$t('order.recharge')}}</view>
+				<view><wd-icon name="arrow-right" size="16px" color="#fff"/></view>
+			</view>
+			<view class="title">{{$t('order.rechargeConsumptionList')}}</view>
+			<view class="recharge-record-block" v-for="(item, index) in bookList" :key="index">
+				<view class="recharge-record-block-row">{{item.orderType}}<text class="text">{{item.changeAmount}}</text></view>
+				<view class="time">{{item.createTime}}</view>
+			</view>
+		</view>
+	</z-paging>
+</template>
+
+<script setup lang="ts">
+	import { ref } from 'vue'
+	import { useI18n } from 'vue-i18n'
+	import { useUserStore } from '@/stores/user'
+	import { getPointsData } from '@/api/modules/user'
+
+	const { t } = useI18n()
+	const paging = ref<any>()
+	const userStore = useUserStore()
+
+	// 数据状态
+	const bookList = ref([])
+	const loading = ref(false)
+	const firstLoad = ref(true)
+
+	// 充值记录列表
+	async function pointsList(pageNo : number, pageSize : number) {
+		const userId = userStore.userInfo.id
+		loading.value = true
+		try {
+			const res = await getPointsData(pageNo, pageSize, userId)
+			console.log(res, 'res');
+			paging.value.complete(res.transactionDetailsList.records)
+		} catch (error) {
+			paging.value.complete(false)
+			console.error('Failed to load book list:', error)
+		} finally {
+			firstLoad.value = false
+			loading.value = false
+		}
+	}
+	
+	/**
+	 * 跳转充值页面
+	 */
+	const goRecharge = () => {
+		uni.navigateTo({
+			url: '/pages/user/recharge/index'
+		})
+	}
+</script>
+
+<style lang="scss" scoped>
+	.my-book-page {
+		background: #f7faf9;
+		min-height: 100vh;
+
+		.recharge-record {
+			background: #fff;
+			border-radius: 15rpx;
+			overflow: hidden;
+			box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+			// padding: 20rpx;
+			margin: 20rpx;
+			
+			.go-gecharge{
+				//height: 100rpx;
+				background: linear-gradient(to right, #007bff, #17a2b8);
+				font-size: 30rpx;
+				font-weight: bold;
+				color: #fff;
+				padding: 20rpx;
+				margin-bottom: 20rpx;
+				display: flex;justify-content:space-between;align-items:center
+			}
+			
+			.title {
+				font-size: 30rpx;
+				padding-left:20rpx;
+				margin-bottom: 30rpx;
+				color: #007bff;
+				font-weight: bold;
+			}
+
+			.recharge-record-block {
+				border-bottom: 1px solid #e0e0e0;
+				padding: 20rpx;
+				
+				.time{
+					font-size: 20rpx;
+				}
+
+				.recharge-record-block-row {
+					display: flex;
+					justify-content: space-between;
+					margin-bottom: 20rpx;
+					
+					.text{
+						color: #007bff;
+					}
+				}
+			}
+		}
+	}
+	.empty-state {
+	  display: flex;
+	  flex-direction: column;
+	  align-items: center;
+	  justify-content: center;
+	  padding-top: 200rpx;
+	  
+	  image {
+	    width: 400rpx;
+	    height: 300rpx;
+	    margin-bottom: 40rpx;
+	  }
+	  
+	  .empty-text {
+	    font-size: 28rpx;
+	    color: #999;
+	    margin-bottom: 50rpx;
+	  }
+	}
+	
+</style>
--- a/pages/user/recharge/index.vue
+++ b/pages/user/recharge/index.vue
@@ -8,8 +8,8 @@
 				<view class="recharge_block" @click="chosPric(item)"
 					:class="aloneItem.priceTypeId === item.priceTypeId ? 'selected' : ''"
 					v-for="item in rechargeList.bookBuyConfigList" :key="item.priceTypeId">
-					<view class="recharge_money">￥{{item.money}}</view>
-					<view>{{item.realMoney}}{{ t('global.coin') }}</view>
+					<view class="recharge_money">￥{{item.realMoney}}</view>
+					<view>{{item.money}}{{ t('global.coin') }}</view>
 					<!-- 红框位置的618活动标签 -->
 					<!-- <view class="activity-tag">618活动</view> -->
 					<span class="activity-label" v-if="item.givejf >0">618充值活动</span>
@@ -23,25 +23,26 @@
 		<view class="cha_fangsh">
 			<view class="cf_title PM_font">{{$t('user.paymentMethod')}}</view>
 			<view class="cf_radio">
-				<radio-group v-for="item in iosPaylist" @click="choseType(item.id)">
+				<radio-group v-for="item in iosPaylist">
 					<view style="width: 100%">
 						<view :class="payType == item.id ? 'Tab_xf cf_xuanx' : 'cf_xuanx'">
 							<!-- <image class="pay_item_img" :src="item.imgUrl" mode="aspectFil">
 							</image> -->
 							<text>{{ item.title }}</text>
-							<radio :checked="payType === item.id"></radio>
+							<radio :checked="payType === item.id" @click="choseType(item.id)"></radio>
 						</view>
 					</view>
 				</radio-group>
 			</view>
 		</view>
 		<view class="agree_wo flexbox">
-			<radio-group class="agree" v-for="(item, index) in argee" :key="index" @click="radioCheck">
+			<radio-group class="agree" v-for="(item, index) in argee" :key="index">
 				<view>
-					<radio class="agreeRadio" :value="item.id" :checked="state" color="#007bff"></radio>
+					<radio class="agreeRadio" :value="item.id" :checked="state" color="#007bff" @click="radioCheck"></radio>
 				</view>
 			</radio-group>
-			<view>{{$t('order.readAgree')}}<span class="highlight" @click="showAgreement">《{{$t('order.valueAddedServices')}}》</span></view>
+			<view>{{$t('order.readAgree')}}<span class="highlight"
+					@click="showAgreement">《{{$t('order.valueAddedServices')}}》</span></view>
 		</view>
 		<view class="bottom-button-container">
 			<button class="recharge-button" @click="handleRecharge">{{$t('order.recharge')}}</button>
@@ -61,10 +62,13 @@

 <script setup lang="ts">
 	import { ref, computed, onMounted, toRefs, reactive } from 'vue'
-  import { useI18n } from 'vue-i18n'
+	import { useI18n } from 'vue-i18n'
 	import { useMessage } from '@/uni_modules/wot-design-uni'
-	import { getBookBuyConfigList, getAgreement, getActivityDescription } from '@/api/modules/user'
-	// const googlePay = uni.requireNativePlugin("sn-googlepay5");
+	import { getBookBuyConfigList, getAgreement, getActivityDescription, verifyGooglePay, getPlaceOrder } from '@/api/modules/user'
+	import { useUserStore } from '@/stores/user'
+
+	const googlePay = uni.requireNativePlugin("sn-googlepay5");
+	const userStore = useUserStore()
 	const { t } = useI18n()
 	const message = useMessage()
 	const payType = ref('1')
@@ -107,13 +111,40 @@

 	const remark = ref({})
 	const isConnected = ref(false)
+	const purchaseToken = ref()
+	// 订单编号
+	const orderSn = ref('')


-  /**
+	/**
+		* 获取订单编号
+		*/
+	const getPlaceOrderObj = async () => {
+		const { priceTypeId, realMoney, money } = toRefs(aloneItem.value)
+		const data = {
+			userId: userStore.userInfo.id, // 用户di
+			paymentMethod: '5', //支付方式4point 5google
+			orderMoney: money.value, //订单金额
+			realMoney: realMoney.value, //实际金额
+			come: '10', //订单来源 2医学吴门医述 10海外读书
+			orderType: 'point', //订单类型, point充值、order课程、书、vip 课vip、abroadVip 书vip、relearn 复读、trainingClass 培训班
+			productId: priceTypeId.value // 商品id
+		}
+		try {
+			const res = await getPlaceOrder(data)
+			orderSn.value = res.orderSn
+			console.log(orderSn.value, '获取订单号');
+			getGooglePay()
+		} catch (error) {
+			console.error('获取订单号失败', error)
+		}
+	}
+
+	/**
 	 * 获取使用环境
 	 */
 	const getDevName = () => {
-		
+
 		if (uni.getSystemInfoSync().platform === "android") {
 			qudao.value = 'Google'
 			isAndroid.value = true;
@@ -127,7 +158,7 @@

 	// 点击金额
 	const chosPric = (item : any) => {
-		console.log(item,'金额每项');
+		console.log(item, '金额每项');
 		aloneItem.value = item;
 	};

@@ -195,25 +226,25 @@
 		// payType.value = val;
 	}

-	const handleRecharge = () => {
-		if(!state.value){
+	const handleRecharge = async () => {
+		if (!state.value) {
 			uni.showToast({
-			  title: t('order.readAgreeServices'),
-			  icon: 'none'
+				title: t('order.readAgreeServices'),
+				icon: 'none'
 			})
 			return
 		}
-		uni.showLoading({ title: '加载中...' })
-		console.log('立即充值');
-		getGooglePay()
+		getPlaceOrderObj()
+		uni.showLoading({ title: '生成订单中...' })
 	}

+
 	/**
 	 * 初始化
 	 */
 	const getGooglePay = () => {
 		googlePay.init({
-		}, (e:any) => {
+		}, (e : any) => {
 			console.log('init', e);
 			if (e.code == 0) {
 				isConnected.value = true;
@@ -225,47 +256,93 @@
 			}
 		});
 	}
-	
+
 	/**
 	 * 查询sku
 	 */
-	const getQuerySku = () =>{
+	const getQuerySku = () => {
 		const id = aloneItem.value.priceTypeId
 		console.log(id, '获取每项');
 		googlePay.querySku(
-		  {
-		    inapp: [id], // 与subs二选一, 参数为商品ID（字符串）数组
-		  },
-		  (e:any) => {
-		    if (e.code == 0) {
-		      // 查询成功.
-					console.log('查询成功',e);
-		      // e.list; // 查询结果, array
-		    } else {
-					console.log('查询失败');
-		      // 查询失败
-		    }
-		  }
-		)
-		}
-	
-	const getPayAll = () =>{
-		googlePay.payAll(
-		  {
-		    productId: "", // 产品id
-		
-		  },
-		  (e) => {
-		    if (e.code == 0) {
-		      // 支付成功
-		      e.data; //支付结果, array [ {original:{ }, signature: ''} ]
-		    } else {
-		      // 支付失败
-		    }
-		  },
+			{
+				inapp: [id], // 与subs二选一, 参数为商品ID（字符串）数组
+			},
+			(e : any) => {
+				if (e.code == 0) {
+					// 查询成功.
+					console.log('querySku查询成功', e);
+					uni.hideLoading()
+					getPayAll()
+				} else {
+					console.log('查询失败', e);
+					// 查询失败
+				}
+			}
 		)
 	}
-	
+
+	/**
+	 * 发起支付
+	 */
+	const getPayAll = () => {
+		console.log(aloneItem.value.priceTypeId, orderSn.value, '发起支付传入产品id,订单id');
+		googlePay.payAll(
+			{
+				productId: aloneItem.value.priceTypeId, // 产品id
+				accountId: orderSn.value // 订单编号
+			},
+			(e : any) => {
+				if (e.code == 0) {
+					purchaseToken.value = e.data[0].original.purchaseToken
+					// 支付成功
+					console.log(e, 'payAll方法成功返参');
+					getConsume()
+				} else {
+					uni.showToast({ title: '支付失败', icon: 'success' })
+					console.log(e, 'e');
+					// 支付失败
+				}
+			},
+		)
+	}
+
+	/**
+	 * 消耗品 确认交易
+	 */
+	const getConsume = () => {
+		googlePay.consume(
+			{
+				purchaseToken: purchaseToken.value, // 来自支付结果的original.purchaseToken (或 original.token)
+			},
+			(e : any) => {
+				if (e.code == 0) {
+					console.log(e, '确认交易成功');
+					// 确认成功
+					googleVerify()
+				} else {
+					console.log(e, '确认交易失败');
+					// 确认失败
+				}
+			},
+		);
+	}
+  
+	/**
+	 * 校验订单
+	 */
+	const googleVerify = async () => {
+		try {
+			const obj = await verifyGooglePay(aloneItem.value.priceTypeId, purchaseToken.value, orderSn.value)
+			uni.switchTab({
+				url: '/pages/user/index'
+			})
+			console.log(obj, '校验订单');
+		} catch (error) {
+			console.error('校验订单失败:', error)
+		}
+	}
+
+

 	onMounted(() => {
 		getDevName();
@@ -387,7 +464,7 @@
 				border-bottom: 1px solid #ededed;
 				display: flex;
 				justify-content: space-between;
-				align-items:center;
+				align-items: center;

 				image {
 					width: 40rpx;