银联支付集成和购买插件；修改首页小区更改后获取数据；对接我的信息接口

property-uniapp-project/pageSubPack/payment-list/addHydropower.vue

@@ -10,7 +10,7 @@
 				<!-- 头部物业费A标题+水滴图标 -->
 				<view class="card-header">
 					<image class="iconStyle"
-						:src="paymentType=='物业费A'?'https://wuyeadmin.bugtc.com/images/propertyImgs/water.png':'https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png'">
+						:src="paymentType=='水费'?'https://wuyeadmin.bugtc.com/images/propertyImgs/water.png':'https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png'">
 					</image>
 					<text class="card-title">{{paymentType}}</text>
 				</view>
@@ -175,10 +175,18 @@
 						// 	return
 						// }
 						const openid = uni.getStorageSync('openid')
+						// if (!openid) {
+						// 	uni.hideLoading()
+						// 	uni.showToast({
+						// 		title: '获取用户信息失败，请重新登录',
+						// 		icon: 'none'
+						// 	})
+						// 	return
+						// }
 						await getTopUpBindDevice({
-							deviceType: paymentType.value=='物业费A'?'2':'1',
+							deviceType: paymentType.value=='水费'?'2':'1',
 							deviceCode: deviceNo.value,
-							openid: openid,
+							// openid: openid,
 							residentUserId: uni.getStorageSync('userId')
 						})
 						uni.hideLoading()

property-uniapp-project/pageSubPack/payment-list/arrearsPayment.vue

@@ -44,8 +44,13 @@
 							<view style="border-bottom: 2rpx solid #ededed;margin:10rpx 0rpx;"></view>
 							<view class="input-section" style="display: flex;">
 								<text class="amount-input" style="width: auto;margin: 0rpx 20rpx;">¥</text>
-								<input type="digit" v-model="payNum" class="amount-input" placeholder="点击输入缴费金额">
-								</input>
+								<input
+									type="digit"
+									:value="payNum"
+									@input="(e) => payNum = e.detail.value"
+									class="amount-input"
+									placeholder="点击输入缴费金额"
+								/>
 							</view>
 							<view style="border-bottom: 2rpx solid #ededed;margin:10rpx 0rpx;"></view>
 							<view class="arrears-row" v-if="outstandingPayment==true">
@@ -57,7 +62,6 @@
 							</view>
 						</view>
 					</view>
-
 				</view>
 
 				<!-- 2. 缴费成功页 -->
@@ -98,29 +102,18 @@
 <script setup>
 	import {
 		ref,
-		reactive,
-		onMounted,
-		computed
-
+		reactive
 	} from 'vue'
 	import {
 		onShow,
-		onReady,
-		onReachBottom,
-		onLoad,
-		onUnload,
-		onPullDownRefresh
+		onLoad
 	} from '@dcloudio/uni-app'
 
 	import {
-		getTopUp,
-		getToWxPay,
-		getopenIdByCode,
-		postSubscribeAuth
-	} from '/pageSubPack/api/apiSub.js'
+		getPushSingle
+	} from '/pageSubPack/api/api.js'
 
 	// 响应式数据
-	const statusBarHeight = ref(20)
 	const outstandingPayment = ref(true)
 	const storageValue = uni.getStorageSync('arrearsPayment')
 	const paymentItem = reactive(typeof storageValue === 'object' && storageValue !== null ? storageValue : {})
@@ -132,7 +125,15 @@
 	// 页面加载时初始化数据
 	onLoad(() => {
 		initPaymentData()
-		checkAllSubscribeStatus()
+	})
+
+	// 从支付收银台返回时检查支付结果
+	onShow(() => {
+		const paySuccess = uni.getStorageSync('paySuccess')
+		if (paySuccess) {
+			uni.removeStorageSync('paySuccess')
+			currentStep.value = 2
+		}
 	})
 
 	// 初始化缴费数据
@@ -159,7 +160,7 @@
 		});
 	}
 
-	// 立即缴费
+		// 立即缴费 — 跳转到支付收银台选择支付方式
 	const handlePay = () => {
 		if (!payNum.value || Number(payNum.value) <= 0) {
 			uni.showToast({
@@ -168,235 +169,31 @@
 			})
 			return
 		}
-		requestPayOrder()
+		uni.setStorageSync('payData', {
+			amount: payNum.value,
+			deviceCode: paymentItem.deviceCode,
+			type: paymentItem.type,
+			name: paymentItem.name,
+			fullAddress: paymentItem.fullAddress
+		})
+		uni.navigateTo({ url: '/pageSubPack/payment-list/yinlianPayTn' })
 	}
-	// 统一下单后后端返回的支付参数
-	const payInfo = ref({
-		appId: '', // 公众号/小程序ID
-		timeStamp: '', // 时间戳
-		nonceStr: '', // 随机串
-		package: '', // 数据包 如 prepay_id=xxx
-		signType: 'MD5', // 签名方式
-		paySign: '' // 签名
-	})
 
-	// 1. 先请求后端接口生成预支付订单
-	const requestPayOrder = async () => {
-		try {
-			uni.showLoading({
-				title: '发起支付中'
-			})
-
-			// // 获取 openid
-			// const loginRes = await wx.login()
-			// if (!loginRes.code) {
-			// 	uni.hideLoading()
-			// 	uni.showToast({
-			// 		title: '登录失败',
-			// 		icon: 'none'
-			// 	})
-			// 	return
-			// }
-			// // 用 code 换 openid
-			// const openIdRes = await getopenIdByCode({
-			// 	code: loginRes.code
-			// })
-			// if (openIdRes.code !== 200 || !openIdRes.data) {
-			// 	uni.hideLoading()
-			// 	uni.showToast({
-			// 		title: '获取openid失败',
-			// 		icon: 'none'
-			// 	})
-			// 	return
-			// }
-			// const openid = openIdRes.data
-			const openid = uni.getStorageSync('openid')
-
-			// 调用充值接口创建订单
-			console.log('1111111111', paymentItem);
-			const topUpRes = await getTopUp({
-				residentUserId: uni.getStorageSync('userId'),
-				rechargeAmount: payNum.value,
-				money: payNum.value || payAmount.value,
-				deviceCode: paymentItem.deviceCode,
-				// type: paymentItem.type == '物业费A' ? '2' : paymentItem.type == '物业费B' ? '1' : ''
-				type:'2'
-			})
-			uni.hideLoading()
-
-			const topUpData = topUpRes
-			console.log(topUpData);
-			if (topUpData.code !== 200) {
-				uni.showToast({
-					title: topUpData.msg || '下单失败',
-					icon: 'none'
-				})
-				return
-			}
-
-			// 调用微信支付接口获取支付参数
-			const payRes = await getToWxPay({
-				orderId: topUpData.data.orderId,
-				openid: openid,
-				// rechargeAmount: payNum.value || payAmount.value,
-				// type: paymentItem.type == '物业费A' ? '2' : paymentItem.type == '物业费B' ? '1' : ''
-			})
-
-			if (payRes.code !== 200) {
-				uni.showToast({
-					title: payRes.msg || '获取支付参数失败',
-					icon: 'none'
-				})
-				return
-			}
-			const payData = payRes.data
-			console.log('payData', payData);
-			// 赋值支付参数
-			payInfo.value = {
-				appId: payData.appId,
-				timeStamp: payData.timeStamp,
-				nonceStr: payData.nonceStr,
-				package: payData.package.startsWith('prepay_id=') ? payData.package : 'prepay_id=' + payData
-					.package,
-				signType: payData.signType,
-				paySign: payData.paySign
-			}
-
-			// 2. 调起微信支付
-			wx.requestPayment({
-				...payInfo.value,
-				success(res) {
-					console.log('支付成功', res)
-					currentStep.value = 2
-				},
-				fail(err) {
-					console.log('支付失败', err)
-					uni.showToast({
-						title: '支付取消或失败',
-						icon: 'none'
-					})
-				}
-			})
-			handleWaterElecSubscribe()
-
-		} catch (err) {
-			uni.hideLoading()
-			console.log('请求异常', err)
-			uni.showToast({
-				title: '支付请求异常',
-				icon: 'none'
+	// 缴费成功推送通知
+	const sendPaySuccessPush = () => {
+		const userId = uni.getStorageSync('userId')
+		if (userId) {
+			getPushSingle({
+				userId: userId,
+				channel: 'resident',
+				title: '缴费成功',
+				content: `您已成功缴纳${paymentItem.type || ''}费用 ¥${payNum.value || payAmount.value}元`
+			}).catch(err => {
+				console.log('推送发送失败', err)
 			})
 		}
 	}
 
-	// 【双模板ID】你提供的 物业费A+物业费B 催缴模板
-	const TEMPLATE_IDS = {
-		water: 'DowYnoGKNtl_eYycRCq-nt7DAoFjH7aVcGUQciZl1v0',
-		elec: 'PE7Neemv0z77JnBIPmb-Qg2Q3pJSUDGaILCryFCxmaw'
-	}
-	// 转成数组（微信API要求）
-	const TEMPLATE_ID_ARRAY = Object.values(TEMPLATE_IDS)
-
-
-	// 1. 检测 物业费A+物业费B 订阅状态
-	const checkAllSubscribeStatus = () => {
-		uni.getSetting({
-			withSubscriptions: true,
-			success: (res) => {
-				const itemSettings = res.subscriptionsSetting?.itemSettings || {}
-				console.log('物业费A订阅状态：', itemSettings[TEMPLATE_IDS.water])
-				console.log('物业费B订阅状态：', itemSettings[TEMPLATE_IDS.elec])
-			}
-		})
-	}
-
-	// 2. 点击开启订阅（主方法）
-	const handleWaterElecSubscribe = () => {
-		uni.getSetting({
-			withSubscriptions: true,
-			success: (res) => {
-				const itemSettings = res.subscriptionsSetting?.itemSettings || {}
-				const waterStatus = itemSettings[TEMPLATE_IDS.water]
-				const elecStatus = itemSettings[TEMPLATE_IDS.elec]
-
-				// 如果任意一个被永久拒绝 → 引导去设置
-				if ((waterStatus === 'reject' || waterStatus === 'ban') ||
-					(elecStatus === 'reject' || elecStatus === 'ban')) {
-					uni.showModal({
-						title: '开启消息通知',
-						content: '请前往设置页打开物业费A/物业费B提醒开关',
-						confirmText: '去设置',
-						success: (modalRes) => {
-							if (modalRes.confirm) uni.openSetting()
-						}
-					})
-					return
-				}
-
-				// 正常弹出授权框
-				requestMultiSubscribe()
-			}
-		})
-	}
-
-	// 3. 调用微信授权（根据类型传对应模板）
-	const requestMultiSubscribe = () => {
-		const tmplIds = paymentItem.type == '物业费A' ? [TEMPLATE_IDS.water] : paymentItem.type == '物业费B' ? [TEMPLATE_IDS.elec] : TEMPLATE_ID_ARRAY
-		uni.requestSubscribeMessage({
-			tmplIds: tmplIds,
-			success: async (res) => {
-				console.log('双模板授权结果：', res)
-
-				let successCount = 0
-				// 物业费A授权成功
-				if (res[TEMPLATE_IDS.water] === 'accept') successCount++
-				// 物业费B授权成功
-				if (res[TEMPLATE_IDS.elec] === 'accept') successCount++
-
-				if (successCount > 0) {
-					uni.showToast({
-						title: `已开启${successCount}项提醒`,
-						icon: 'success'
-					})
-					// 保存用户openid到后端
-					await saveUserSubscribe()
-				} else {
-					uni.showToast({
-						title: '已取消授权',
-						icon: 'none'
-					})
-				}
-			},
-			fail: () => {
-				uni.showToast({
-					title: '授权失败',
-					icon: 'none'
-				})
-			}
-		})
-	}
-
-	// 4. 传给后端：保存订阅信息
-	const saveUserSubscribe = async () => {
-
-		const res = await postSubscribeAuth({
-			openid: uni.getStorageSync('openid'),
-			templateIds: paymentItem.type == '物业费A' ? [TEMPLATE_IDS.water] : paymentItem.type == '物业费B' ? [TEMPLATE_IDS.elec] : TEMPLATE_ID_ARRAY,
-			// deviceCode: paymentItem.deviceCode,
-			// deviceType: paymentItem.type == '物业费A' ? '2' : paymentItem.type == '物业费B' ? '1' : ''
-		})
-		if (res.data == 200) {
-			console.log('111111111111111：', res)
-		} else {
-			uni.showToast({
-				title: `${res.msg}`,
-				icon: 'none'
-			})
-		}
-
-
-	}
-
 	// 返回缴费列表
 	const handleBackToList = () => {
 		uni.redirectTo({
@@ -764,6 +561,65 @@
 		margin-bottom: 150rpx;
 	}
 
+	/* 支付方式选择 */
+	.pay-method-section {
+		margin-top: 30rpx;
+		padding: 0 20rpx;
+	}
+	.pay-method-title {
+		font-size: 30rpx;
+		color: #333;
+		font-weight: 600;
+		margin-bottom: 20rpx;
+		display: block;
+	}
+	.pay-method-list {
+		display: flex;
+		flex-direction: column;
+		gap: 20rpx;
+	}
+	.pay-method-item {
+		display: flex;
+		align-items: center;
+		padding: 24rpx 30rpx;
+		background: #fff;
+		border-radius: 12rpx;
+		border: 2rpx solid #ededed;
+	}
+	.pay-method-item.active {
+		border-color: #1677ff;
+		background: #f0f7ff;
+	}
+	.pay-icon {
+		width: 48rpx;
+		height: 48rpx;
+		margin-right: 20rpx;
+	}
+	.pay-name {
+		flex: 1;
+		font-size: 30rpx;
+		color: #333;
+	}
+	.pay-check {
+		width: 32rpx;
+		height: 32rpx;
+		border-radius: 50%;
+		background: #1677ff;
+		position: relative;
+	}
+	.pay-check::after {
+		content: '';
+		position: absolute;
+		left: 10rpx;
+		top: 6rpx;
+		width: 8rpx;
+		height: 14rpx;
+		border: 2rpx solid #fff;
+		border-left: none;
+		border-top: none;
+		transform: rotate(45deg);
+	}
+
 	/*  核心：欠费金额行样式 */
 	.arrears-row {
 		display: flex;

property-uniapp-project/pageSubPack/payment-list/paymentIndex.vue

@@ -14,9 +14,9 @@
 
 					<view class="bill-item" @click="goToBill(item)" v-for="item,index in paymentList" :key="index">
 						<image class="billIcon" src="https://wuyeadmin.bugtc.com/images/propertyImgs/water.png"
-							v-if="item.type=='物业费A'"></image>
+							v-if="item.type=='水费'"></image>
 						<image class="billIcon" src="https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png"
-							v-if="item.type=='物业费B'"></image>
+							v-if="item.type=='电费'"></image>
 						<view class="bill-info">
 							<view class="bill-title">{{item.type}}
 								<view class="bill-status debt" v-if="item.balance<0">已欠费</view>
@@ -80,7 +80,6 @@
 
 	import {
 		getTopUpSelectByResident,
-		getopenIdByCode,
 		postInsertOpenId,
 		postSubscribeAuth
 	} from '/pageSubPack/api/apiSub.js'
@@ -105,7 +104,7 @@
 		// },
 		// {
 		// 	id: 3,
-		// 	name: '物业费B',
+		// 	name: '电费',
 		// 	status: '已欠费',
 		// 	address: '山东省日照市东港区桂花园（别墅）2号楼2层',
 		// 	icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png",
@@ -120,26 +119,25 @@
 		// 	iconClass: "gas"
 		// },
 		{
-			name: "物业费A",
+			name: "水费",
 			type: "water",
 			icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/water.png",
 			iconClass: "water"
 		},
+		{
+			name: "电费",
+			type: "electric",
+			icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png",
+			iconClass: "electric"
+		},
 		// {
-		// 	name: "物业",
+		// 	name: "物业费",
 		// 	type: "property",
 		// 	icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/property.png",
 		// 	iconClass: "property"
 		// },
 		// {
-		// 	name: "物业费B",
-		// 	type: "electric",
-		// 	icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/electric.png",
-		// 	iconClass: "electric"
-		// },
-
-		// {
-		// 	name: "车位",
+		// 	name: "车位费",
 		// 	type: "parking",
 		// 	icon: "https://wuyeadmin.bugtc.com/images/propertyImgs/parkingIcon.png",
 		// 	iconClass: "parking"
@@ -147,34 +145,18 @@
 	])
 	
 	const postOpenId = async () => {
-		// 获取 openid
+		// App 端直接从本地存储获取 openid
 		try {
-			const loginRes = await wx.login()
-			if (!loginRes.code) {
-				uni.hideLoading()
+			const openid = uni.getStorageSync('openid')
+			if (!openid) {
 				uni.showToast({
-					title: '登录失败',
+					title: '请先登录',
 					icon: 'none'
 				})
 				return
 			}
-			// 用 code 换 openid
-			const openIdRes = await getopenIdByCode({
-				code: loginRes.code
-			})
-			if (openIdRes.code !== 200 || !openIdRes.data) {
-				uni.hideLoading()
-				uni.showToast({
-					title: '获取openid失败',
-					icon: 'none'
-				})
-				return
-			}
-			const openid = openIdRes.data
-			uni.setStorageSync('openid', openid)
-
 			await postInsertOpenId({
-				openid: uni.getStorageSync('openid'),
+				openid: openid,
 				residentUserId: uni.getStorageSync('userId')
 			})
 		} catch (err) {
@@ -247,7 +229,7 @@
 			uni.redirectTo({
 				url: '/pageSubPack/payment-list/selectPaymentEntity'
 			})
-		} else if (type.name == '物业费A' || type.name == '物业费B') {
+		} else if (type.name == '水费' || type.name == '电费') {
 			uni.redirectTo({
 				url: '/pageSubPack/payment-list/addHydropower'
 			})
@@ -425,23 +407,28 @@
 		display: flex;
 		flex-wrap: wrap;
 		justify-content: flex-start;
-		gap: 26rpx;
+		/* gap: 26rpx; */
 	}
 
 	.grid-item {
-		width: calc(25% - 50rpx);
+		width: calc(25% - 60rpx);
 		background-color: #F6F9FE;
 		border-radius: 12rpx;
 		padding: 20rpx;
 		margin-bottom: 20rpx;
+		margin-left: 20rpx;
 		display: flex;
 		align-items: center;
 		flex-direction: column;
 	}
+	/* 每行第 1 个 item 清除左边距，保证对齐 */
+	.grid-item:nth-child(4n+1) {
+		margin-left: 0;
+	}
 
 	.icon-box {
-		width: 88rpx;
-		height: 88rpx;
+		width: 52rpx;
+		height: 52rpx;
 		border-radius: 50%;
 		display: flex;
 		align-items: center;