menber-center/pages/daiJiaoDanWeiChaXunJieGuo/daiJiaoDanWeiChaXunJieGuo.vue

<template>
	<view class="container">
		<view class="info-box">
			<view class="info-item-box flex">
				<view class="label">
					机构名称
				</view>
				<view class="text">
					{{ info.name }}
				</view>
			</view>
			<view class="info-item-box flex">
				<view class="label">
					支付项目
				</view>
				<view class="text">
					{{ info.payProject }}
				</view>
			</view>
			<view class="info-item-box flex">
				<view class="label">
					类型
				</view>
				<view class="text">
					{{ info.type }}
				</view>
			</view>
			<view class="info-item-box flex">
				<view class="label">
					年份
				</view>
				<view class="text">
					{{ info.year }}年
				</view>
			</view>
			<view class="info-item-box flex">
				<view class="label">
					金额
				</view>
				<view class="text">
					{{ info.price }}元
				</view>
			</view>
			<view class="info-item-box flex">
				<view class="label">
					会籍有效期
				</view>
				<view class="text">
					{{ info.periodOfValidity }}
				</view>
			</view>
		</view>
		<view class="info-box" style="background: none;">
			<view class="info-item-box row" style="height: auto;border-bottom: 0;">
				<view class="text" v-html="info.remark"></view>
			</view>
		</view>
		<view class="bottom-box-block">
		</view>
		<view class="bottom-box">
			<u-button type="error" shape="circle" @click="onSubmit">支付</u-button>
		</view>
	</view>
</template>
<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		dept,
		deptPayment,
		getSubUnitCastAgree
	} from '@/api/cost.js'
	import {
		msgError
	} from '../../utils/common'

	import {
		useAuthStore
	} from '@/store/authStore'
	const authStore = useAuthStore()

	const openid = ref('')

	const info = ref({
		name: '某某某机构', // 机构名称
		payProject: '2025年度理事单位会费', // 支付项目
		type: '理事单位会费', // 类型
		year: '2024', // 年份
		price: '1000', // 金额
		periodOfValidity: '2024.1.1-2024.12.31',
		userIds: null,
		remark: '根据《协会章程》规定，会费标准如下:<br/>1、副会长单位:50000元/年;<br/>2、常务理事及理事单位:10000元/年;<br/>3、普通会员单位:1000元/年;单位会员会籍为每年1月1日至12月31日。<br/>会员可享受以下权利:<br/>1、协会的选举权、被选举权和表决权;<br/>2、优先参加协会组织开展的各类活动;<br/>3、获得协会服务的优先权;<br/>4、对协会工作的批评建议权和监督权;<br/>5、请求协会维护合法权益;<br/>6、入会自愿、退会自由。',
		giver: "",
		giverPhone: ""
	})

	const params = ref({
		timeStamp: '',
		nonceStr: '',
		package: '',
		signType: '',
		paySign: '',
	})

	function init() {
		getSubUnitCastAgree().then(res => {
			if (res && res.code === 0) {
				info.value.remark = res.data.content
// 				info.value.remark = `<p>
//     描述：
// </p>
// <p>
//     会员可享受以下权利：
// </p>
// <p>
//     1、本会的选举权、被选举权和表决权；
// </p>
// <p>
//     2、参加本会的活动权；
// </p>
// <p>
//     3、获得本会服务的优先权；
// </p>
// <p>
//     4、入会自愿、退会自由权；
// </p>
// <p>
//     5、查阅本会章程、会员名册、会议纪要（决议）、财务审计报告等知情权；
// </p>
// <p>
//     6、批评建议权和监督权；
// </p>
// <p>
//     7、请求协会维护合法权益。
// </p>`
				// console.log("代缴单位会费缴交",res.data)
			}
		})
	}

	function onSubmit() {
		// 支付写了，但是没有测试
		const {
			giver,
			giverPhone
		} = info.value
		const form = {
			title: `${info.value.payProject}代缴`,
			year: info.value.year,
			amount: info.value.price,
			desc: `${info.value.payProject}代缴`,
			userId: info.value.userId,
			openid: openid.value,
			giver,
			giverPhone
		}
		// console.log(form)
		deptPayment(form).then(res => {
			if (res && res.code === 0) {
				params.value = res.data
				wx.requestPayment({
					timeStamp: params.value.timeStamp,
					nonceStr: params.value.nonceStr,
					package: params.value.package,
					signType: params.value.signType,
					paySign: params.value.paySign,
					success(res) {
						msgSuccess('支付成功')
						uni.navigateBack()
					},
					fail(res) {
						// console.log('支付失败', res)
						const errMsg = res.errMsg
						if (errMsg.indexOf('fail cancel')) {
							msgError('已取消支付')
						}
					}
				})
			} else {
				msgError(res.message)
				uni.navigateBack()
			}
		})

	}

	onLoad((load) => {
		const name = load.name
		const year = load.year
		const number = load.number
		const price = load.price
		const type = Number(price) > 10000 
		? '副会长单位' : Number(price) > 1000 
		? '理事单位' : '普通会员单位'
		const userId = load.userId
		openid.value = uni.getStorageSync('openid')
		const giver = load.giver
		const giverPhone = load.giverPhone
		info.value = {
			name: name, // 机构名称
			payProject: `${year}年度${type}会费`, // 支付项目
			type: `${type}会费`, // 类型
			year, // 年份
			price, // 金额
			periodOfValidity: `${year}.1.1-${year}.12.31`,
			userId,
			remark: '根据《协会章程》规定，会费标准如下:<br/>1、副会长单位:50000元/年;<br/>2、常务理事及理事单位:10000元/年;<br/>3、普通会员单位:1000元/年;单位会员会籍为每年1月1日至12月31日。<br/>会员可享受以下权利:<br/>1、协会的选举权、被选举权和表决权;<br/>2、优先参加协会组织开展的各类活动;<br/>3、获得协会服务的优先权;<br/>4、对协会工作的批评建议权和监督权;<br/>5、请求协会维护合法权益;<br/>6、入会自愿、退会自由。',
			giver,
			giverPhone
		}
		init()
		// console.log(info.value)
	})
</script>

<style lang="scss" scoped>
	.container {
		height: 100vh;
		width: 100vw;
		background-color: $uni-bg-color;
		padding: 20rpx;

		.info-box {
			padding: 30rpx;
			background-color: $uni-bg-color-grey;
			border-radius: $uni-card-border-radius;

			.info-item-box {
				font-size: $uni-title-font-size-2;
				border-bottom: 1rpx solid #E6E6E6;
				height: 82rpx;

				.label {
					font-weight: bold;
				}
			}

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

				.label {
					width: 30%;
				}

				.text {
					width: 70%;
				}
			}

			.row {
				.label {
					line-height: 62rpx;
				}

				.text {
					line-height: 180%;
					font-size: 28rpx;
					font-weight: bold;
				}
			}
		}

		.bottom-box-block {
			height: 150rpx;
		}

		.bottom-box {
			padding: 20rpx;
			position: fixed;
			bottom: 50rpx;
			width: 95%;
		}
	}
</style>