d

api/money.js

@@ -165,4 +165,57 @@ export function getOrderInfo(data) {
 // 		method: 'get',
 // 		data
 // 	})
-// }
+// }
+
+///api/lave/create_sign
+export function createSign(data) {
+	return request({
+		url: '/api/lave/create_sign',
+		method: 'post',
+		data
+	})
+}
+
+export function getPlan(data) {
+	///api/lave/plan_ls
+	return request({
+		url: '/api/lave/plan_lst',
+		method: 'get',
+		data
+	})
+}
+
+export function getPlanInfo(data) {
+	//lave/plan_info
+	return request({
+		url: '/api/lave/plan_info',
+		method: 'get',
+		data
+	})
+}
+
+
+export function getMyPlan(data) {
+	return request({
+		url: '/api/lave/user_lst',
+		method: 'get',
+		data
+	})
+}
+
+export function getInfo(data) {
+	return request({
+		url: '/api/lave/user_info',
+		method: 'get',
+		data
+	})
+}
+
+//http://xns.igxys.com/api/lave/delete_sign
+export function qxyue(data) {
+	return request({
+		url: '/api/lave/delete_sign',
+		method: 'get',
+		data
+	})
+}

pages.json

@@ -21,6 +21,43 @@
 
 			}
 		},
+		{
+			"path": "pages/index/ken",
+			"style": {
+				"navigationBarTitleText": "博爱园"
+			}
+		},
+		{
+			"path": "pages/index/dk",
+			"style": {
+				"navigationBarTitleText": ""
+			}
+		},
+		{
+			"path": "pages/index/pay",
+			"style": {
+				"navigationBarTitleText": "博爱园"
+			}
+		},
+		//yueList
+		{
+			"path": "pages/index/yueList",
+			"style": {
+				"navigationBarTitleText": "我的月捐"
+			}
+		},
+		{
+			"path": "pages/index/thank",
+			"style": {
+				"navigationBarTitleText": "感谢信"
+			}
+		},
+		{
+			"path": "pages/index/yue",
+			"style": {
+				"navigationBarTitleText": "项目详情"
+			}
+		},
 		{
 			// "path": "pages/cart/cart1",
 			"path":"pages/cart/cat1",

pages/index/dk.vue

@@ -0,0 +1,304 @@
+<template>
+	<view class="content">
+		<image src="../../static/img/b-top.png" mode="" class="b-top"></image>
+		<view class="wrap-wrap">
+			<view class="u-wrap">
+				<view class="top flex">
+					<image :src="userInfo.avatar" mode="" class="uavt"></image>
+					<view class="name">
+						<view class="clamp">
+							{{userInfo.nickname}}
+						</view>
+						<view class="val">
+							{{info.is_signing == 0 ?'已开通自动续费':'已解约'}}
+						</view>
+					</view>
+					<view class="btn" @click="qx" v-if="info.is_signing == 0">
+						取消续费
+					</view>
+				</view>
+				<view class="type">
+					按月捐款
+				</view>
+				<view class="price">
+					¥{{info.price}}/月  每月自动续费
+				</view>
+			</view>
+		</view>
+		
+		<view class="xq">
+			<view class="j-tit">
+				<text>捐款详情</text>
+			</view>
+			<view class="line flex">
+				<image src="../../static/icon/dk1.png" mode=""></image>
+				<view class="name">
+					捐款项目
+				</view>
+				<view class="val">
+					{{info.order_name}}
+				</view>
+			</view>
+			<view class="line flex">
+				<image src="../../static/icon/dk2.png" mode=""></image>
+				<view class="name">
+					每月捐款金额
+				</view>
+				<view class="val">
+					{{info.price}}元
+				</view>
+			</view>
+			<!-- <view class="line flex">
+				<image src="../../static/icon/dk3.png" mode=""></image>
+				<view class="name">
+					支付方式
+				</view>
+				<view class="val">
+					微信支付
+				</view>
+			</view> -->
+		</view>
+		<view class="xq" v-if="list.length > 0">
+			<view class="j-tit">
+				<text>月捐记录</text>
+			</view>
+			<view class="box">
+				<view class="box-item" v-for="item in list" :key="item.id" >
+					<view class="main">
+						<view class="main-left">
+							<view class="project">
+								{{item.order_name}}
+							</view>
+							<view class="time">
+								{{item.paytime_text}}
+							</view>
+						</view>
+						<view class="mian-right">
+							{{item.amount}}元
+						</view>
+					</view>
+			
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex';
+	import { getInfo,qxyue } from '@/api/money.js'
+	export default {
+		data() {
+			return {
+				list: [],
+				info: {},
+				id: 0,
+				plan_id:0
+			}
+		},
+		computed: {
+			...mapState('user', ['hasLogin', 'userInfo']),
+		},
+		onLoad(opt) {
+			this.id = opt.id;
+			this.plan_id = opt.plan_id;
+			console.log(opt.id,opt.plan_id,this.id,this.plan_id);
+			this.getInfo();
+		},
+		methods: {
+			qx() {
+				let that = this
+				uni.showModal({
+					title: '提示',
+					content: '您确定要取消当前的公益月捐？',
+					success(res) {
+						if (res.confirm) {
+							console.log('用户点击确定');
+							qxyue({
+								id:that.id,
+								plan_id:that.plan_id,
+							}).then(res => {
+								// console.log();
+								uni.showToast({
+									title: '解约成功',
+									duration: 2000
+								});
+								that.info.is_signing = 1
+								// that.getInfo()
+								setTimeout(()=> {
+									uni.navigateTo({
+										url:'/pages/user/user'
+									})
+								},1500)
+								
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+						
+					}
+				})
+			},
+			getInfo() {
+				getInfo({
+					id:this.id,
+					plan_id:this.plan_id,
+					page:1,
+					limit:100
+				}).then(res => {
+					this.info = res.data.data
+					this.list = res.data.list
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.b-top {
+		width: 750rpx;
+		height: 312rpx;
+	}
+	.wrap-wrap {
+		background-color: #fff;
+		padding-bottom:45rpx;
+	}
+	.u-wrap {
+		width: 655rpx;
+		height: 324rpx;
+		background: linear-gradient(225deg, #FFEED2 0%, #FED591 100%);
+		border-radius: 24rpx;
+		margin:-200rpx auto 0;
+		position: relative;
+		padding: 28rpx 36rpx;
+		.top {
+			align-items: center;
+			* {
+				flex-shrink: 0;
+			}
+			.uavt {
+				width: 90rpx;
+				height: 90rpx;
+				border-radius: 50%;
+				background-color: #eee;
+			}
+			.btn {
+				width: 190rpx;
+				height:70rpx;
+				height: 70rpx;
+				background: #3A3A3B;
+				border-radius: 35rpx;
+				font-size: 30rpx;
+				color: #FFFFFF;
+				text-align: center;
+				display: flex;
+				justify-content: center;
+				align-items: center;
+			}
+			.name {
+				padding-left: 10rpx;
+				flex-grow: 1;
+				font-weight: 500;
+				font-size: 30rpx;
+				color: #333333;
+				.val {
+					font-weight: 500;
+					font-size: 20rpx;
+					color: #af9c7c;
+				}
+			}
+		}
+		
+		.type {
+			font-weight: bold;
+			font-size: 40rpx;
+			color: #6B4216;
+			position: absolute;
+			bottom: 75rpx;
+		}
+		.price {
+			font-weight: 500;
+			font-size: 28rpx;
+			color: #6B4216;
+			position: absolute;
+			bottom: 28rpx;
+		}
+	}
+	.xq {
+		margin: 20rpx 0;
+		background-color: #fff;
+		padding: 45rpx  0;
+		.line {
+			align-items: center;
+			padding: 30rpx 27rpx 30rpx 33rpx;
+			* {
+				flex-shrink: 0;
+			}
+			image {
+				width: 34rpx;
+				height: 34rpx;
+			}
+			.name {
+				font-weight: bold;
+				font-size: 30rpx;
+				color: #333333;
+				padding-left: 12rpx;
+			}
+			.val {
+				flex-grow: 1;
+				font-size: 26rpx;
+				color: #666666;
+				text-align: right;
+			}
+		}
+	}
+	.j-tit {
+		font-weight: bold;
+		font-size: 32rpx;
+		color: #1D2023;
+		text-align: center;
+		padding-bottom: 30rpx;
+	}
+	.box {
+		padding: 0 24rpx;
+	
+		.box-item {
+			padding: 24rpx 0;
+			border-bottom: 1rpx solid #e0e0e0;
+	
+			.header {
+				color: #999999;
+				font-size: 24rpx;
+			}
+	
+			.main {
+				margin-top: 22rpx;
+				display: flex;
+				justify-content: space-between;
+	
+				.mian-right {
+					display: flex;
+					flex-direction: column;
+					justify-content: flex-end;
+				}
+	
+				.main-left {
+					.project {
+						color: #333;
+						font-size: 28rpx;
+					}
+	
+					.time {
+						margin-top: 6rpx;
+						color: #999999;
+						font-size: 22rpx;
+					}
+				}
+			}
+		}
+	
+	}
+</style>

pages/index/index.vue

@@ -23,6 +23,11 @@ export default {
 					image: '/static/index/aixin2.jpg',
 					name: '其他捐款捐物渠道',
 					src: '/pages/applic/other'
+				},
+				{
+					image: '/static/index/aixin3.jpg',
+					name: '公益月捐',
+					src: '/pages/index/ken'
 				}
 			]
 		}

pages/index/ken.vue

@@ -0,0 +1,208 @@
+<template>
+	<view class="content">
+		<image src="../../static/images/bg-bg.png" mode="" class="bg-bg"></image>
+		<image src="../../static/images/ken-tit1.png" mode="" class="top-tit"></image>
+		<view class="cot">
+			{{$store.state.baseName}}推出博爱园公益月捐计划 ，参与月捐项目 ，我们将为您每月发放一封{{$store.state.baseName}}官方感谢信 ，我们期待并感谢您无私的爱心奉献。
+		</view>
+		<view class="lov">
+			Love makes dreams come true
+		</view>
+		<view class="dow">
+			下拉查看详情
+		</view>
+		<image src="../../static/icon/dow.png" mode="" class="dow-dow"></image>
+		<image src="../../static/images/pen.png" mode="" class="pen"></image>
+		<view class="pen-pen" v-for="(item,index) in list" @click="navto('/pages/index/yue?id=' + item.id)">
+			<image src="../../static/img/pen0.png" mode=""></image>
+			<view class="tit" v-html="item.title">
+			</view>
+		</view>
+		<view class="" style="height: 150rpx;">
+
+		</view>
+
+	</view>
+
+</template>
+
+<script>
+	import {
+		getArticList
+	} from '@/api/index.js';
+	import { getPlan} from '@/api/money.js'
+	export default {
+		data() {
+			return {
+				list: [],
+				page: 1,
+				limit: 10,
+				loadingType: 'more'
+			}
+		},
+		methods: {
+			navto(url) {
+				uni.navigateTo({
+					url
+				})
+			},
+			getList() {
+				let that = this
+				if (that.loadingType == 'loading' || that.loadingType == 'noMore') return;
+				that.loadingType = 'loading'
+				getPlan({
+					page: that.page,
+					limit: that.limit
+				}).then(({data}) => {
+					let arr = []
+					if (data.data.length > 0) {
+						arr = data.data.map(item => {
+							item.title = item.title.replace(/[^\u4e00-\u9fa5]/g, '<br />');
+							return item
+						})
+					}
+					that.list = that.list.concat(arr);
+					that.page++
+					if (that.limit == data.data.length) {
+						that.loadingType = 'more'
+					} else {
+						that.loadingType = 'noMore'
+					}
+				})
+				// getArticList({
+				// 	ifyid: 78,
+				// 	page: that.page,
+				// 	limit: that.limit
+				// }).then(({
+				// 	data
+				// }) => {
+				// 	let arr = []
+				// 	if (data.list.length > 0) {
+				// 		arr = data.list.map(item => {
+				// 			item.title = item.title.replace(/[^\u4e00-\u9fa5]/g, '<br />');
+				// 			return item
+				// 		})
+				// 	}
+				// 	that.list = that.list.concat(arr);
+				// 	that.page++
+				// 	if (that.limit == that.list.length) {
+				// 		that.loadingType = 'more'
+				// 	} else {
+				// 		that.loadingType = 'noMore'
+				// 	}
+				// });
+			}
+		},
+		onLoad() {
+			this.getList()
+		},
+		onReachBottom() {
+			this.getList()
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	image {
+		display: block;
+	}
+
+	* {
+		position: relative;
+	}
+
+	.bg-bg {
+		width: 750rpx;
+		height: 773rpx;
+		position: absolute;
+		bottom: 0;
+	}
+
+	.content {
+		width: 750rpx;
+		// height: 4983rpx;
+		background: linear-gradient(3.799999999999997deg, #1784D8 0%, #6CA7E1 100%);
+		padding-top: 1rpx;
+	}
+
+	.top-tit {
+		width: 521rpx;
+		height: 322rpx;
+		margin: 128rpx auto 70rpx;
+	}
+
+	.cot {
+		padding: 0 70rpx;
+		font-weight: bold;
+		font-size: 26rpx;
+		color: #FFFFFF;
+		text-decoration-line: underline;
+		text-align: center;
+		line-height: 53rpx;
+		letter-spacing: 1rpx;
+		text-underline-offset: 10px
+	}
+
+	.lov {
+		// font-family: Source Han Serif SC;
+		text-align: center;
+		font-weight: bold;
+		font-size: 19rpx;
+		color: #FFFFFF;
+		padding: 30rpx 0 64rpx;
+	}
+
+	.dow {
+		text-align: center;
+		font-weight: bold;
+		font-size: 43rpx;
+		color: #FFFFFF;
+		padding-bottom: 27rpx;
+	}
+
+	.dow-dow {
+		width: 38rpx;
+		height: 87rpx;
+
+		margin: auto;
+	}
+
+	.pen {
+		width: 738rpx;
+		height: 562rpx;
+		margin: auto;
+	}
+
+	.pen-pen {
+		width: 594rpx;
+		height: 757rpx;
+		margin:30rpx auto;
+		image {
+			width: 594rpx;
+			height: 757rpx;
+			position: absolute;
+			top: 0;
+			left: 0;
+		}
+		.tit {
+			width: 250rpx;
+			height: 100rpx;
+			text-align: center;
+			font-size: 40rpx;
+			color: #D27227;
+			font-weight: bold;
+			// font-weight: bold;
+			// /* 设置描边宽度及颜色 默认为字体内外描边 */
+			// text-stroke: 1px #D27227;
+			// /* 兼容Webkit(Chrome/Safari)内核浏览器的写法 */
+			// -webkit-text-stroke: 1px #D27227;
+			
+			position: absolute;
+			top: 200rpx;
+			left: 0;
+			right: 0;
+			margin: auto;
+
+		}
+	}
+</style>

pages/index/pay.vue

@@ -0,0 +1,482 @@
+<template>
+	<view class="content">
+		<view class="tc-wrap">
+			<view class="" style="text-align: center;font-size: 28rpx;font-weight: bold;padding: 20rpx;">
+				世界因你而美好
+			</view>
+			<view class="" style="text-align: center;font-size: 24rpx;padding-top: 10rpx;color: red;">
+				每月不高于500
+			</view>
+			<!-- <view class="tit flex">
+				<view class="">
+					捐款金额
+				</view>
+				<image src="../../static/icon/cl.png" mode="" @click="closeTc"></image>
+			</view> -->
+			<view class="m-list flex">
+				<view class="mitem" v-for="item in list" :class="{'action': item == money}" @click="money = item">
+					￥{{item}}/月
+				</view>
+			</view>
+			<view class="sy-wrap flex">
+				<input type="number" placeholder="请输入自定义金额" class="user-inp" v-if="diy" v-model="money" />
+				<view class="user-inp" v-if="!diy" @click="diy = true">自定义金额</view>
+				<view @click="sy" class="flex" style="align-items: center;">
+					<image src="../../static/icon/re.png" mode="" class="re"></image>
+					<view class="sy">
+						随缘
+					</view>
+				</view>
+
+			</view>
+			<view class="line">
+				
+			</view>
+			<view class="jz-info">
+				<view class="tit1">
+					捐赠方式
+				</view>
+				<picker @change="PickerType" :value="index" :range="chooseType" class="box-right">
+					<view class="inp" >{{way}}</view>
+				</picker>
+			</view>
+			<view class="jz-info">
+				<view class="tit1">
+					{{way === '个人'?'捐赠人':'捐赠单位'}}<text>*</text>
+				</view>
+				<input type="text" :placeholder="'请输入'+ (way === '个人'?'捐赠人':'捐赠单位')" class="inp" v-model="donate_er" />
+			</view>
+			<view class="jz-info">
+				<view class="tit1">
+					手机号码
+				</view>
+				<input type="text" placeholder="请输入手机号码" class="inp" v-model="mobile" />
+			</view>
+			<view class="" style="text-align: center;padding: 20rpx;">
+				<checkbox style="transform:scale(0.7)"  :checked="isok" @click="changeOK" />我已阅读并同意<text
+					style="color: #4768c9;" @click="openxy">用户协议</text>
+			</view>
+			<view class="" style="text-align: center;font-size: 24rpx;padding-top: 10rpx;color: red;">
+				开通月捐后，每月自动扣费，可随时取消
+			</view>
+			
+			<view class="go" @click="go">
+				确认支付{{money}}元/月
+			</view>
+		</view>
+		<uni-popup ref="popup" type="center">
+			<view class="xy">
+				<p style="text-align: center; "><span style="font-size: 9px;">&nbsp;&nbsp;&nbsp;&nbsp;</span><span
+						style="white-space: pre;"></span><span style="font-size: 18px;">用户协议</span></p>
+				<p> </p>
+				<p>&nbsp; 尊敬的付款人/捐款人，当您准备转账时，您应明确如下事项：</p>
+				<p> </p>
+				<p> </p>
+				<p>&nbsp;
+					（一）您已经年满18周岁或具备完全民事行为能力，或者您是在中国大陆地区合法开展经营活动或其他业务的法人或其他组织；本协议内容不受您所属国家或地区法律的排斥。不具备该条件的，您应立即停止支付行为。
+				</p>
+				<p> </p>
+				<p>&nbsp;
+					（二）您在使用该系统时，应自行判断收款发起方是否是完全民事行为能力人或是否为有资格进行收款的主体，您应自行判断发起方及其关联方是否有履约能力。并自行决定是否与对方进行交易或转账给对方等，且您应自行承担与此相关的所有风险。
+				</p>
+				<p> </p>
+				<p>&nbsp; （三）您认可，您已经充分阅读、了解收款发起方、收款方发起方的主体资质、发布的内容或者提供的商品或服务。您认可您的支付行为完全出于自愿。</p>
+				<p> </p>
+				<p>&nbsp;
+					（四）您同意，您通过该系统上发生的所有交易或支付，您不可撤销地授权由本单位按照制定的相应规则进行处理；同时本单位有权获取您的相关信息（包括但不限于交易商品、服务描述、物流信息、行为信息、账户相关信息等）。您确认，您使用灵析服务时，您仍应完全遵守本服务协议及本单位制定的各项规则及页面提示等。
+				</p>
+				<p> </p>
+				<p>&nbsp; （五）本单位特别提示：</p>
+				<p> </p>
+				<p>&nbsp; 您所转出的款项将进入收款发起方账户，或发起方指定的收款人的账户。基于此项服务可能存在的风险, 在使用转账服务时, 您理解并接受:&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>1.&nbsp; 使用交易或转账服务是基于您对收款发起方与转账原因的充分了解,
+					一旦您选用转账服务进行转账, 您应当自行承担因您指示错误(失误)。而导致的风险。本单位依照您指示的收款方并根据本协议的约定完成转账后,
+					即完成了当次服务的所有义务。对于收付款双方之间产生的关于当次转账的任何纠纷不承担任何责任, 也不提供任何形式的纠纷解决途径, 您应当自行处理相关的纠纷。</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>2.&nbsp;
+					本单位并非银行或其它金融机构，本服务也非金融业务，本协议项下的资金移转均通过银行或第三方支付平台（包括支付宝、财付通、微信支付、银联在线、Paypal）来实现，你理解并同意您的资金在流转途中需要时间，本单位无法保障资金流转时间。
+				</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;3.&nbsp;
+					非经特别说明，本协议中“收款发起方”是指发起收费项目的收款的主体，收费项目包括但不限于：收费活动、销售商品或服务、众筹、募款，系实际收款的支配方。“收款方”是指您的资金所汇入的账户方，收款方既可以是收款发起方，也可以是收款发起方指定的第三方。
+				</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>4.&nbsp;
+					本单位并非银行或其他金融机构，亦不是收款方。因此事实上无法提供退款服务，您的款项一旦转出，将不可通过本单位撤销，如有疑问，请直接与收款发起方或收款方联系沟通。</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;5.&nbsp; 本单位根据业务需求，有权随时对本协议条款进行调整，无需单独通知您，请您在转款之前，请认真阅读本协议。</p>
+				<p>（六）您同意：</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;1.&nbsp; 本单位仅对该系统中列明的责任承担范围负责。&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>2.&nbsp;
+					您因交易或转账所产生的任何风险应由您与收款发起方承担。&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;3.&nbsp; 本单位不对交易标的及本服务提供任何形式的保证，包括但不限于以下事项：&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>（1）本服务符合您的需求。&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="white-space:pre"></span>（2）本服务不受干扰、及时提供或免于出错。&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span
+						style="white-space:pre"></span>（3）您经由本服务购买或取得之任何产品、服务、资讯或其他资料符合您的期望。&nbsp;</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span
+						style="white-space:pre"></span>（4）您经由本服务之使用下载或取得任何资料，应由您自行考量且自负风险，因资料之下载而导致您电脑系统之任何损坏或资料流失，您应负完全责任。&nbsp;
+				</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span
+						style="white-space:pre"></span>（5）您自本单位及本单位工作人员或经由本服务取得之建议和资讯，无论其为书面或口头形式，均不构成本单位对本服务之保证。</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span
+						style="white-space:pre"></span>（6）除本单位另有规定外，在任何情况下，本单位对本协议所承担的违约赔偿责任总额不超过向您收取的当次服务费用总额。</p>
+				<p> </p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;<span
+						style="white-space:pre"></span>（7）您充分知晓并同意本单位可能同时为您及您的（交易）对手方提供本服务，您同意对本单位可能存在的该等行为予以明确豁免，并不得以此来主张本单位在提供本服务时存在法律上的瑕疵。
+				</p>
+				<p>&nbsp;&nbsp;&nbsp;&nbsp;（8）除本单位另有规定或另行同意外，您对本单位的委托及向本单位发出的指令均不可撤销。</p>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex';
+	
+	import {
+		createSign
+	} from '@/api/money.js';
+	export default {
+		data() {
+			return {
+				mobile: '',
+				address:'',
+				way: '个人', // 捐款方式
+				way_id: 0, // 捐款方式id
+				index:0,
+				chooseType: ['个人', '单位'],
+				donate_er: '',
+				isok: false,
+				isShowBase: false,
+				diy: false,
+				isOpen: false,
+				money: 100,
+				umoney: '',
+				list: [50, 100, 200],
+				description: '',
+				art: {},
+				id: 0,
+				plan_id:0,
+				order_name:''
+			}
+		},
+		computed: {
+			...mapState(['weichatObj']),
+			...mapState('user',['userInfo']),
+		},
+		onLoad(opt) {
+			this.plan_id = opt.id
+			this.order_name = opt.tit
+			this.donate_er = this.userInfo.nickname
+		},
+		methods: {
+			PickerType: function(e) {
+				this.way = this.chooseType[e.target.value];
+				this.way_id = e.target.value;
+				this.index = e.target.value;
+				console.log('选择捐款方式', this.way_id)
+				if (this.index == 1) {
+					this.is_show = true
+				} else {
+					this.is_show = false
+				}
+				// if ( )
+			},
+			sy() {
+				this.diy = true
+				this.money = Math.floor(Math.random() * 500) + 1;
+			},
+			openxy() {
+				this.$refs.popup.open()
+			},
+			changeOK(e) {
+				// console.log(e);
+				this.isok = !this.isok
+			},
+			go() {
+				if (this.isok) {
+					// uni.showModal({
+					// 	title: '提示',
+					// 	content: '功能审核中...',
+					// 	success(res) {
+					// 		if (res.confirm) {
+					// 			console.log('用户点击确定');
+					// 		} else if (res.cancel) {
+					// 			console.log('用户点击取消');
+					// 		}
+
+					// 	}
+					// })
+					this.confirm()
+				} else {
+					uni.showModal({
+						title: '提示',
+						content: '请先阅读并同意用户协议',
+						success(res) {
+							if (res.confirm) {
+								console.log('用户点击确定');
+							} else if (res.cancel) {
+								console.log('用户点击取消');
+							}
+
+						}
+					})
+				}
+
+			},
+			confirm() {
+				let obj = this
+			// 	if (!obj.way) {
+			// 		this.$api.msg('请选择捐款方式！');
+			// 		return;
+			// 	}
+			// 	if (!obj.money) {
+			// 		this.$api.msg('请输入捐款金额！');
+			// 		return;
+			// 	}
+			// 	if (obj.public) {
+			// 		if (this.is_show) {
+			// 			if (!obj.donate_er) {
+			// 				this.$api.msg('请填写您的姓名');
+			// 				return;
+			// 			}
+			// 		} else {
+			// 			if (!obj.donate_er) {
+			// 				this.$api.msg('请填写您的单位');
+			// 				return;
+			// 			}
+			// 		}
+			
+			// 		const reg = /^(\+?0?86-?)?1[\d]\d{9}$/;
+			// 		if (!reg.test(obj.mobile)) {
+			// 			obj.$api.msg('请填写正确的手机号码');
+			// 			return;
+			// 		}
+			// 	}
+			
+			// 	if (this.is_receipts == '0') {
+			// 		// obj.address = '用户未填写联系地址'
+			// 		if (!obj.address) {
+			// 			this.$api.msg('请输入联系地址');
+			// 			return;
+			// 		}
+			// 	}
+			
+			// 	if (!obj.address) {
+			// 		obj.address = '用户未填写联系地址'
+			// 	}
+			// 	if (!obj.isHelp) {
+			// 		if (!obj.intention) {
+			// 			this.$api.msg('请选择捐款意向');
+			// 			return;
+			// 		}
+			// 	}
+				let updata = {
+					amount: obj.money, //捐款金额
+					name: obj.donate_er, //捐款人/单位
+					tel: obj.mobile, //手机号
+					address: obj.address, //联系地址
+					is_open: 1, //是否实名公开
+					is_ticket: 0, //是否开发票
+					pay_type: 0, //支付方式0微信1支付宝
+					type: obj.way_id,
+					plan_id: obj.plan_id
+				}
+				// if (obj.isHelp) {
+				// 	updata.help_id = obj.help_id
+					updata.order_name = obj.order_name
+				// } else {
+				// 	updata.order_name = obj.intention //捐款意向
+				// 	updata.category_id = obj.category_id //捐款意向id
+				// }
+				createSign(updata).then(({
+					data
+				}) => {
+					let res = data.jsConfig;
+					console.log(res)
+					// 仅作为示例，非真实参数信息。
+					obj.weichatObj.chooseWXPay({
+						timestamp: res.timestamp,
+						nonceStr: res.nonceStr,
+						package: res.package,
+						signType: res.signType,
+						paySign: res.paySign,
+						success: function(res) {
+							
+							let date = new Date()
+							let year = date.getFullYear()
+							let month = date.getMonth() >= 9 ? date.getMonth() + 1 : '0' + (date
+								.getMonth() + 1)
+							let day = date.getDate() >= 10 ? date.getDate() : '0' + date.getDate()
+							// uni.navigateTo({
+							// 	url: '/pages/form/donaSuccess?money=' + obj.money +
+							// 		'&name=' + obj.donate_er + '&time=' + year + '年' +
+							// 		month + '月' + day + '日'
+							// })
+							uni.navigateTo({
+								url:'/pages/index/thank?money=' + obj.money +'&name=' + obj.donate_er + '&time=' + encodeURI(year + '年' + month + '月' + day + '日') + '&order_name=' + encodeURI(obj.order_name)
+							})
+							
+						},
+						fail: function(res) {
+							// this.$refs.popup1.open()
+							console.log(res, "失败")
+							console.log(res.errMsg)
+						}
+					});
+				})
+				// 支付中
+				obj.payLoding = true;
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	page {
+		background-color: #fff;
+		height: 100%;
+	}
+
+	.tc-wrap {
+		width: 750rpx;
+		// height: 578rpx;
+		background: #FFFFFF;
+		border-radius: 30rpx 30rpx 0 0;
+		padding: 0 31rpx 66rpx 32rpx;
+
+		.tit {
+			height: 114rpx;
+			align-items: center;
+			justify-content: space-between;
+			font-weight: bold;
+			font-size: 42rpx;
+			color: #1E2B31;
+			border-bottom: 1px solid #EDF0F2;
+
+			image {
+				width: 34rpx;
+				height: 34rpx;
+			}
+		}
+
+		.m-list {
+			justify-content: space-between;
+			padding: 30rpx 0;
+
+			.mitem {
+				width: 215rpx;
+				line-height: 96rpx;
+				background: #FFFFFF;
+				border-radius: 5rpx;
+				border: 1px solid #78919d;
+				text-align: center;
+				font-weight: bold;
+				font-size: 29rpx;
+				color: #1E2B31;
+			}
+
+			.action {
+				background: #fdecee;
+				border: 1px solid #ed3142;
+				color: #ED3142;
+			}
+
+		}
+
+		.sy-wrap {
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.user-inp {
+			display: inline-block;
+			width: 554rpx;
+			height: 81rpx;
+			line-height: 81rpx;
+			background: #FFFFFF;
+			border-radius: 5rpx;
+			border: 1px solid #78919d;
+			text-align: center;
+			font-weight: bold;
+			font-size: 29rpx;
+			color: #1E2B31;
+		}
+
+		.re {
+			width: 30rpx;
+			height: 30rpx;
+			margin-left: 33rpx;
+			margin-right: 14rpx;
+		}
+
+		.sy {
+			font-weight: bold;
+			font-size: 29rpx;
+			color: #0C0C0C;
+		}
+
+		.go {
+			width: 100%;
+			line-height: 94rpx;
+			background: #f3392c;
+			border-radius: 46rpx;
+			text-align: center;
+			font-weight: bold;
+			font-size: 33rpx;
+			color: #FFFFFF;
+			margin-top: 20rpx;
+		}
+	}
+
+	.xy {
+		width: 600rpx;
+		height: 700rpx;
+		// overflow: hidden;
+		background-color: #fff;
+		border-radius: 40rpx 30rpx;
+		padding: 20rpx;
+		overflow: auto;
+		line-height: 1.5;
+
+	}
+	.jz-info {
+		padding: 20rpx 0;
+		.tit1 {
+			font-size:28rpx;
+			padding-bottom: 10rpx;
+			text {
+				color:red;
+			}
+		}
+		.inp {
+			width: 690rpx;
+			height: 81rpx;
+			line-height: 81rpx;
+			background: #FFFFFF;
+			border-radius: 5rpx;
+			border: 1px solid #78919d;
+			text-align: center;
+			font-weight: bold;
+			font-size: 29rpx;
+			color: #1E2B31;
+		}
+	}
+	.line {
+		width: 100%;
+	}
+</style>

pages/index/thank.vue

@@ -0,0 +1,366 @@
+<template>
+	<view class="content">
+		<view class="box">
+			<!-- <view class="music">
+				<view class="player playing" :class="playing ? 'none' : 'keepgo'" @click.stop="play">
+					<image src="../../static/img/music.png" style="width: 68rpx;height: 68rpx;" :animation="animationData"></image>
+				</view>
+			</view> -->
+			<canvas v-if="showcanvas" id="qrShareBox" canvas-id="qrShareBox" class="tki-qrcode-canvas" />
+			<image class="imgbox" v-else :src="img"></image>
+		</view>
+		<!-- <image class="image" src="../../static/img/thinks.png" mode=""></image> -->
+	</view>
+</template>
+
+<script>
+	import {
+		weixindata
+	} from '@/utils/wxAuthorized.js';
+	export default {
+		data() {
+			return {
+				money: '',
+				url: '',
+				img: '',
+				showcanvas: true,
+				loading: true, //是否载入图片中
+				size: 180,
+				ratio: 1, //页面比例用于计算
+				canHeight: '',
+				canWeidth: '',
+				playing: true,
+				current: {
+					src: '../../static/audio/xx.mp3'
+				},
+				rotateIndex: '',
+				animation: {},
+				animationData: {},
+				audioAction: {
+					method: 'pause'
+				},
+				ran: -1,
+				isStop: true,
+				demo: 0,
+				name: '',
+				add_time: '',
+				title:'',
+				order_name:''
+			};
+		},
+		onReady() {
+			let query = uni.createSelectorQuery();
+			let obj = this;
+			console.log(999, obj.money);
+			// 获取页面比例
+			query
+				.select('.box')
+				.fields({
+						size: true
+					},
+					e => {
+						console.log('获取页面比例', e);
+						// 保存比例
+						this.ratio = e.width / 750;
+					}
+				)
+				.exec();
+			// 获取画布宽高信息
+			query
+				.select('#qrShareBox')
+				.fields({
+						size: true
+					},
+					e => {
+						console.log('获取画布宽高信息', e);
+						obj.canHeight = e.height;
+						obj.canWeidth = e.width;
+					}
+				)
+				.exec();
+			let ctxBg = '/static/index/thanks2.png'; //画布背景
+			let src = '/static/icon/erweima.jpg'; // 二维码
+			let src1 = '/static/icon/gongzhang.png' //公章
+
+			let context = uni.createCanvasContext('qrShareBox');
+			// 插入背景图片
+			console.log('插入背景图片', ctxBg, 0, 0, obj.canWeidth, obj.canHeight);
+			context.drawImage(ctxBg, 0, 0, obj.canWeidth, obj.canHeight);
+
+			const codeSize = obj.size * obj.ratio; //计算二维码大小
+			const codeX = ((750 - obj.size) * obj.ratio) / 2; //二维码所在x轴位置
+			const codeY = 960 * obj.ratio; //二维码所在y轴位置
+
+			const codeBoxColor = '#FFFFFF'; //包裹框颜色
+			const codeBoxWidht = 0; //包裹边框宽度
+			const codeBoxSize = (codeBoxWidht / 2) * obj.ratio; //计算二维码白色包裹框大小
+			const codeBoxX = codeX - codeBoxSize; //包裹框初始X轴
+			const codeBoxY = codeY - codeBoxSize; //包裹框初始Y轴
+			const codeBoxEnd = codeSize + codeBoxWidht * obj.ratio; //计算包裹框大小
+			const fontTop = codeY + codeBoxEnd + (codeBoxWidht + 20) * obj.ratio; //文字距离上边距高度
+			const fontSize = 24 * obj.ratio; //文字大小
+			const fontText = ''; //文字内容
+			const fontLeft = (codeSize - fontSize * fontText.length) / 2 + codeX; //文字左侧距离
+
+			const tl = 130 * obj.ratio;
+			const tlh = 60 * obj.ratio;
+			const tb = 400 * obj.ratio;
+			const tbw = 60 * obj.ratio;
+
+			// // 插入文字
+			context.setFontSize(28);
+			context.setFillStyle('#000000');
+			// context.fillText('捐赠证书', ((750 - obj.size) * obj.ratio) / 2, 260 * obj.ratio)
+			context.setFontSize(30 * obj.ratio);
+			context.fillText('尊敬的' + this.name + ':', tl, tb);
+			context.fillText('您好！', tl, tb + tlh);
+			//十字精
+			context.fillText('感谢您发扬“人道、博爱、奉献”', tl + tbw, tb + tlh * 2);
+			context.fillText('的红十字精神，捐赠人民币', tl, tb + tlh * 3);
+			let h1 = context.measureText('的红十字精，捐赠人民币').width;
+			let h2 = context.measureText('感谢您发扬“人道、博爱、奉献').width;
+			context.fillText('元', h2 + tl + tbw, tb + tlh * 3);
+			context.setTextAlign('center')
+			context.fillText((obj.money*1).toFixed(2), (tl * 2 + tbw + h1 + h2 + 10) / 2, tb + tlh * 3);
+			context.moveTo(tl + h1 + 20, tb + tlh * 3 + 8);
+			context.lineTo(tl + tbw + h2 - 10, tb + tlh * 3 + 8);
+			context.stroke();
+			context.setTextAlign('left')
+			let yyl = context.measureText('用于').width;
+			let storeName = obj.order_name;
+			let str = '用于“'+storeName+'”爱心月捐项目，我们将遵照您的意愿使用。';
+			let arr = obj.splitStringByCount(str, 17);
+			for(let i =0; i< arr.length;i++) {
+					context.fillText(arr[i], tl, tb + tlh * (4 + i));
+			}
+			let sl = context.measureText(arr[0]).width;
+			context.setTextAlign('right')
+			// context.drawImage(src1, sl + tl-codeSize, tb + tlh*(6 + arr.length)-codeSize/2, codeSize, codeSize);
+			context.fillText(obj.$store.state.baseName, sl + tl, tb + tlh*(5 + arr.length));
+			context.fillText(obj.add_time, sl + tl, tb + tlh*(6 + arr.length));
+			context.setTextAlign('left')
+			// context.fillText('此致敬礼', tl, tb + tlh*(6 + arr.length));
+			//感谢您发扬“人道、博爱、奉献”的红十字精
+			// context.fillText('衷心感谢您对咸宁市红十字事业的信任与支', 120 * obj.ratio, 410 * obj.ratio);
+			// context.fillText('持！我们已收到您的捐款', 60 * obj.ratio, 465 * obj.ratio);
+			// // 画横线
+			// context.moveTo(380 * obj.ratio, 470 * obj.ratio);
+			// context.lineTo(540 * obj.ratio, 470 * obj.ratio);
+			// context.stroke();
+			// context.setTextAlign('center')
+			// context.fillText('￥' + obj.money, 460 * obj.ratio, 465 * obj.ratio);
+			// context.setTextAlign('left')
+			// context.fillText('元。我们承', 540 * obj.ratio, 465 * obj.ratio);
+			// context.fillText('诺绝不辜负大家的信任，遵照您的意愿，将捐款', 60 * obj.ratio, 520 * obj.ratio);
+			// context.fillText('全部用于相关救助项目。您的善举将给受助人带', 60 * obj.ratio, 575 * obj.ratio);
+			// context.fillText('去温暖！', 60 * obj.ratio, 630 * obj.ratio);
+			// context.fillText('爱心无界，情义无价。授以此证书，我们因', 120 * obj.ratio, 680 * obj.ratio);
+
+			// context.fillText('您更有力量，因您倍感温暖！', 60 * obj.ratio, 735 * obj.ratio);
+			// // context.fillText('谨表谢意', (580 * obj.ratio), 680 * obj.ratio)
+			
+			// 插入二维码
+			// context.drawImage(src, codeX, codeY, codeSize, codeSize);
+			// 插入公章
+			// 生成
+			context.draw(false, e => {
+				uni.canvasToTempFilePath({
+					x: 0,
+					y: 0,
+					width: obj.canWeidth,
+					height: obj.canHeight,
+					destWidth: obj.canWeidth,
+					destHeight: obj.canHeight,
+					canvasId: 'qrShareBox',
+					success: function(res) {
+						console.log(333, res);
+						// 在H5平台下，tempFilePath 为 base64
+						obj.showcanvas = false;
+						obj.img = res.tempFilePath;
+					}
+				});
+			});
+		},
+		onShow() {
+			var animation = uni.createAnimation();
+			this.animation = animation;
+			if (this.isStop) {
+				// 使用动画
+				this.scaleAndScale();
+				this.timer = setInterval(() => {
+					//创建定时器,3秒执行异一次
+					this.scaleAndScale();
+					// console.log('每三秒执行一次 , 达到往复运动的效果')
+				}, 1000);
+			} else {
+				this.noscaleAndScale();
+			}
+		},
+		onLoad(option) {
+			// console.log(333, option);
+			// try{
+			// 	this.title = decodeURI(option.title)||'';
+			// }catch(e){
+			// 	//TODO handle the exception
+			// }
+			if(option.order_name) {
+				this.order_name = decodeURI(option.order_name);
+			}
+			this.money = option.money;
+			this.name = decodeURI(option.name) || '佚名';
+			this.add_time = decodeURI(option.time);
+			this.IndexShare();
+			// this.ScanAudio(true);
+		},
+		onHide() {
+			//在页面隐藏时也要清除定时器
+			if (this.timer) {
+				// console.log('清除定时器-' + this.timer)
+				clearInterval(this.timer);
+			}
+		},
+		onUnload() {
+			//在页面卸载时清除定时器 避免出现多个定时器连续创建动画
+			if (this.timer) {
+				console.log('清除定时器-' + this.timer);
+				clearInterval(this.timer);
+			}
+		},
+		methods: {
+			splitStringByCount(str, count) {
+				var result = [];
+				for (var i = 0; i < str.length; i += count) {
+					result.push(str.substring(i, i + count));
+				}
+				return result;
+			},
+			// 分享
+			IndexShare() {
+				let obj = this;
+				// let money = obj.money;
+				let item = {
+					link: this.$store.state.baseURL + '/index/#/pages/index/thank?money=' + obj.money + '&name=' +
+						encodeURI(obj.name) + '&time=' + encodeURI(obj.add_time) + '&order_name=' + encodeURI(obj.order_name), // 分享链接
+					imgUrl: this.$store.state.baseURL + '/index/static/img/002.png',
+					desc: '弘扬红十字精神，传播红十字观念，宣传红十字工作，这是一个汇聚爱心、救助之家力量的平台！',
+					title: '来自' + this.$store.state.baseName + '的感谢信',
+					success: console.log('分享加载成功')
+				};
+				console.log('分享加', item);
+				weixindata(item);
+			},
+			musicClick() {
+				// if (this.isRoate) {
+				// 	this.isRoate = false
+				// 	this.stopScanAudio()
+				// } else {
+				// 	this.isRoate = true
+				// 	this.ScanAudio()
+				// }
+			},
+			play() {
+				this.playing = !this.playing;
+				this.ScanAudio(this.playing);
+				if (this.playing == true) {
+					this.timer = setInterval(() => {
+						//创建定时器,3秒执行异一次
+						this.scaleAndScale();
+						console.log('每1秒执行一次');
+					}, 1000);
+				} else {
+					clearInterval(this.timer);
+				}
+				// var music = uni.createInnerAudioContext();
+				// music.src= "../../static/audio/xx.mp3"; //选择播放的音频
+				//   music.onPause(); //暂停播放
+				// 	console.log('暂停播放')
+				// console.log('dianjizanting')
+				// this.stopAudio()
+				// this.playing = !this.playing; //背景音乐点击，暂停或继续
+			},
+			// 定义动画内容
+			scaleAndScale() {
+				// 定义动画内容
+				// this.animation.scale(1.2, 1.2).step() //先放大1,2倍
+				// this.animation.scale(1, 1).step() //缩小至原来的大小
+				// 导出动画数据传递给data层
+				// this.animationData = this.animation.export(); //每次执行导出动画时 会覆盖之前的动画
+				this.animation.rotate(this.demo).step({
+					duration: 1000
+				});
+				this.animationData = this.animation.export();
+				this.demo += 360;
+			},
+			noscaleAndScale() {
+				this.animation.rotate(0).step({
+					duration: 1000
+				});
+				this.animationData = this.animation.export();
+			}
+			// ScanAudio(){
+			// 	this.$api.music.play(); //执行播放
+			// 				console.log('执行播放')
+			// }
+		}
+	};
+</script>
+
+<style lang="scss">
+	page {
+		width: 100%;
+		height: 100%;
+	}
+
+	.content {
+		// background-color: pink;
+		width: 100%;
+		height: 100%;
+		position: relative;
+
+		.bgimg {
+			width: 100%;
+			height: 100%;
+
+			// background-color: pink;
+			image {
+				width: 100%;
+				height: 100%;
+			}
+		}
+
+		.tki-qrcode-canvas {
+			width: 750rpx;
+			height: 1469rpx;
+			margin: 0 auto;
+			// background-color: pink;
+		}
+
+		.box {
+			color: #ffffff;
+			width: 100%;
+
+			.music {
+				border-radius: 28rpx;
+				position: absolute;
+				left: 40rpx;
+				top: 100rpx;
+				z-index: 999;
+			}
+
+		}
+
+		.keepgo {
+			animation-play-state: paused;
+		}
+
+		.imgbox {
+			height: 1350rpx;
+			width: 750rpx;
+		}
+	}
+
+	.image {
+		width: 100%;
+		height: 100%;
+	}
+</style>

pages/index/yue.vue

@@ -0,0 +1,470 @@
+<template>
+	<view class="content">
+		<image :src="$store.state.baseURL + art.image" mode="widthFix" class="logo"></image>
+		<view class="art-info">
+			<view class="tit">
+				{{art.title}}
+			</view>
+			<view class="des">
+				{{art.synopsis}}
+			</view>
+			<view class="join">
+				善款接受：{{$store.state.baseName}}
+			</view>
+			<view class="join">
+				执行机构：{{$store.state.baseName}}
+			</view>
+			<view class="share-num">
+				<image src="../../static/icon/sharenum.png" mode=""></image>已有{{art.num}}人参与
+			</view>
+			<image src="../../static/icon/share1.png" mode="" class="share" @click="isShowBase = true"></image>
+		</view>
+		<view class="art-detail">
+			<view class="de-tit flex">
+				<view class="line"></view>
+				<view class="ct">项目介绍</view>
+				<view class="line"></view>
+			</view>
+			<view class="notice-item">
+				<jyf-parser :html="description" ref="article"></jyf-parser>
+			</view>
+		</view>
+		<view class="tc">
+
+		</view>
+		<view class="btn" v-show="!isOpen" @click="openTc">
+			<view class="">
+				参与月捐
+			</view>
+			<view class="tip">开通月捐后，每月自动扣费，可随时取消</view>
+		</view>
+		<uni-popup ref="popup" type="bottom" @change="changeTc">
+			<view class="tc-wrap">
+				<view class="tit flex">
+					<view class="">
+						捐款金额
+					</view>
+					<image src="../../static/icon/cl.png" mode="" @click="closeTc"></image>
+				</view>
+				<view class="m-list flex">
+					<view class="mitem" v-for="item in list" :class="{'action': item == money}" @click="money = item">
+						￥{{item}}/月
+					</view>
+				</view>
+				<view class="sy-wrap flex">
+					<input type="number" placeholder="请输入自定义金额" class="user-inp" v-if="diy" v-model="money" />
+					<view class="user-inp" v-if="!diy" @click="diy = true">自定义金额</view>
+					<view @click="sy" class="flex" style="align-items: center;">
+						<image src="../../static/icon/re.png" mode="" class="re"></image>
+						<view class="sy">
+							随缘
+						</view>
+					</view>
+
+				</view>
+
+				<view class="" style="text-align: center;padding: 20rpx;">
+					<checkbox style="transform:scale(0.7)" :value="isok" :checked="isok" @click="changeOK" />
+					我已阅读并同意<text style="color: #4768c9;" @click="openxy">用户协议</text>
+				</view>
+				<view class="" style="text-align: center;font-size: 24rpx;padding-top: 10rpx;color: red;">
+					开通月捐后，每月自动扣费，可随时取消
+				</view>
+				<view class="go" @click="go">
+					确认支付{{money}}元/月
+				</view>
+			</view>
+		</uni-popup>
+		<image v-if="isShowBase" src="../../static/images/shareimg.png" mode="" class="sharebase"
+			@click="isShowBase = false"></image>
+	</view>
+</template>
+
+<script>
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex';
+	import {
+		saveUrl,
+		interceptor
+	} from '@/utils/loginUtils.js';
+	import {
+		weixindata
+	} from '@/utils/wxAuthorized.js';
+
+	import {
+		getPlanInfo
+	} from '@/api/money.js'
+	import {
+		details,
+		deconstructArticle
+	} from '@/api/info.js';
+	import jyfParser from "@/components/jyf-parser/jyf-parser.vue";
+	export default {
+		components: {
+			jyfParser
+		},
+		computed: {
+			...mapState('user', ['hasLogin', 'userInfo']),
+		},
+		data() {
+			return {
+				isok: false,
+				isShowBase: false,
+				diy: false,
+				isOpen: false,
+				money: 100,
+				umoney: '',
+				list: [50, 100, 200],
+				description: '',
+				art: {},
+				id: 0
+			}
+		},
+		onLoad(opt) {
+			if (opt.id) {
+				this.id = opt.id
+				this.getInfo()
+				uni.setStorageSync('tcplant_id', this.id)
+			} else {
+				let id = uni.getStorageSync('tcplant_id') || '';
+				console.log(id, 'did')
+				if (id) {
+					this.id = id;
+					this.getInfo()
+				} else {
+					uni.switchTab({
+						url: '/pages/index/index'
+					})
+				}
+			}
+
+		},
+		methods: {
+			openxy() {
+
+			},
+			changeOK(e) {
+				// console.log(e);
+				this.isok = !this.isok
+			},
+			go() {
+				if (this.isok) {
+					uni.showModal({
+						title: '提示',
+						content: '功能审核中...',
+						success(res) {
+							if (res.confirm) {
+								console.log('用户点击确定');
+							} else if (res.cancel) {
+								console.log('用户点击取消');
+							}
+
+						}
+					})
+				} else {
+					uni.showModal({
+						title: '提示',
+						content: '请先阅读并同意用户协议',
+						success(res) {
+							if (res.confirm) {
+								console.log('用户点击确定');
+							} else if (res.cancel) {
+								console.log('用户点击取消');
+							}
+
+						}
+					})
+				}
+
+			},
+			goShare() {
+
+			},
+			getInfo() {
+
+				getPlanInfo({
+					id: this.id
+				}).then(e => {
+					this.art = e.data[0];
+					if (this.art.text != null) {
+						this.description = this.art.text.replace(/<img/g, "<img class='baseimg'");
+					} //小程序商品详情图超出屏幕问题
+					this.IndexShare(this.art.title, this.art.info)
+				});
+			},
+			changeTc(e) {
+				console.log(e);
+			},
+			closeTc() {
+				this.$refs.popup.close()
+			},
+			openTc() {
+				if (this.hasLogin) {
+					uni.navigateTo({
+						url: '/pages/index/pay?id=' + this.art.plan_id + '&tit=' + this.art.title
+					})
+				} else {
+					saveUrl();
+					uni.showModal({
+						title: '登录',
+						content: '您未登录，是否马上登陆?',
+						success: e => {
+							if (e.confirm) {
+								interceptor();
+							}
+						},
+						fail: e => {
+							console.log(e);
+						}
+					});
+				}
+
+			},
+			sy() {
+				this.diy = true
+				this.money = Math.floor(Math.random() * 500) + 1;
+			},
+			IndexShare(title, desc) {
+				let obj = this;
+				// let money = obj.money;
+				let item = {
+					link: this.$store.state.baseURL + '/index/#/pages/index/yue?id=' + obj.id, // 分享链接
+					imgUrl: this.$store.state.baseURL + '/index/static/img/002.png',
+					desc: desc,
+					title: title,
+					success() {
+						console.log('分享成功');
+					}
+				};
+				weixindata(item);
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+	.logo {
+		width: 750rpx;
+	}
+
+	.art-info {
+		background-color: #fff;
+		padding: 0 30rpx 35rpx;
+		margin-bottom: 20rpx;
+		position: relative;
+
+		.tit,
+		.des {
+			width: 80%;
+		}
+
+		.tit {
+			font-weight: bold;
+			font-size: 42rpx;
+			color: #1B282E;
+			padding-top: 30rpx;
+		}
+
+		.des {
+			font-size: 28rpx;
+			color: #898d8f;
+			padding: 15rpx 0 30rpx;
+		}
+
+		.share-num {
+			font-weight: 500;
+			font-size: 24rpx;
+			color: #FB2D42;
+
+			image {
+				width: 28rpx;
+				height: 26rpx;
+				vertical-align: bottom;
+				margin-right: 8rpx;
+			}
+		}
+
+		.share {
+			width: 44rpx;
+			height: 44rpx;
+			position: absolute;
+			right: 26rpx;
+			top: 32rpx;
+		}
+	}
+
+	.art-detail {
+		width: 100%;
+		background-color: #fff;
+		padding: 30rpx;
+
+		.de-tit {
+			text-align: center;
+			font-size: 31rpx;
+			color: #898d8f;
+			align-items: center;
+			justify-content: center;
+
+			.line {
+				width: 38rpx;
+				height: 2rpx;
+				background-color: #E0E0DF;
+				margin: 0 20rpx;
+			}
+		}
+	}
+
+	.tc {
+		height: 99rpx;
+	}
+
+	.btn {
+		width: 750rpx;
+		height: 120rpx;
+		background: #f3392c;
+		position: fixed;
+		bottom: 0;
+		font-size: 36rpx;
+		color: #FFFFFF;
+		text-align: center;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+
+		.tip {
+			font-size: 24rpx;
+		}
+	}
+
+	.tc-wrap {
+		width: 750rpx;
+		// height: 578rpx;
+		background: #FFFFFF;
+		border-radius: 30rpx 30rpx 0 0;
+		padding: 0 31rpx 66rpx 32rpx;
+
+		.tit {
+			height: 114rpx;
+			align-items: center;
+			justify-content: space-between;
+			font-weight: bold;
+			font-size: 42rpx;
+			color: #1E2B31;
+			border-bottom: 1px solid #EDF0F2;
+
+			image {
+				width: 34rpx;
+				height: 34rpx;
+			}
+		}
+
+		.m-list {
+			justify-content: space-between;
+			padding: 30rpx 0;
+
+			.mitem {
+				width: 215rpx;
+				line-height: 96rpx;
+				background: #FFFFFF;
+				border-radius: 5rpx;
+				border: 1px solid #78919d;
+				text-align: center;
+				font-weight: bold;
+				font-size: 29rpx;
+				color: #1E2B31;
+			}
+
+			.action {
+				background: #fdecee;
+				border: 1px solid #ed3142;
+				color: #ED3142;
+			}
+
+		}
+
+		.sy-wrap {
+			align-items: center;
+			justify-content: space-between;
+		}
+
+		.user-inp {
+			display: inline-block;
+			width: 554rpx;
+			height: 81rpx;
+			line-height: 81rpx;
+			background: #FFFFFF;
+			border-radius: 5rpx;
+			border: 1px solid #78919d;
+			text-align: center;
+			font-weight: bold;
+			font-size: 29rpx;
+			color: #1E2B31;
+		}
+
+		.re {
+			width: 30rpx;
+			height: 30rpx;
+			margin-left: 33rpx;
+			margin-right: 14rpx;
+		}
+
+		.sy {
+			font-weight: bold;
+			font-size: 29rpx;
+			color: #0C0C0C;
+		}
+
+		.go {
+			width: 100%;
+			line-height: 94rpx;
+			background: #f3392c;
+			border-radius: 46rpx;
+			text-align: center;
+			font-weight: bold;
+			font-size: 33rpx;
+			color: #FFFFFF;
+			margin-top: 20rpx;
+		}
+	}
+
+	.notice_name {
+		font-size: 35rpx !important;
+		color: #303133;
+		padding: 25rpx 25rpx 0rpx 25rpx;
+		margin-bottom: 25rpx;
+	}
+
+	.course-video {
+		width: 100%;
+		height: 500rpx;
+	}
+
+	.notice-item {
+		width: 100%;
+		height: 100%;
+		color: #666666;
+		padding: 35rpx 0;
+		font-size: 23rpx;
+		padding-bottom: 30rpx;
+	}
+
+	.baseimg {
+		max-width: 100%;
+		height: auto;
+	}
+
+	.sharebase {
+		display: block;
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+	}
+
+	.join {
+		padding-bottom: 10rpx;
+	}
+</style>

pages/index/yueList.vue

@@ -0,0 +1,286 @@
+<template>
+	<view class="content">
+		<!-- <view class="top">
+			<view class="Search-box">
+				<view class="Search-box-size">
+					<image class="box-img" src="../../static/images/img01.png"></image>
+					<input type="text" class="box-word" placeholder="请输入关键字" v-model="keyword"  />
+				</view>
+				<view class="Search-box-sort" @click="messagesearch">搜索</view>
+			</view>
+		</view> -->
+		<!-- <view class="list-box" v-for="(item,index) in science" :key='index' @click="Jump(item.id)">
+			<view class="box-left">
+				<image :src="$store.state.baseURL + item.image" mode="" class="left-img"></image>
+			</view>
+			<view class="box-right">
+				<view class="right-top word1_ellipsis">
+					{{item.title}}
+				</view>
+				<view class="right-center">
+					{{item.synopsis}}
+				</view>
+
+			</view>
+		</view> -->
+		<view class="list-box" v-for="(item,index) in science" :key='index' @click="Jump(item.id,item.plan_id)">
+			<view class="box-left">
+				<image :src="$store.state.baseURL + item.image" mode="" class="left-img"></image>
+			</view>
+			<view class="box-right">
+				<view class="right-top word1_ellipsis">
+					{{item.order_name}}
+				</view>
+				<view class="right-center">
+					每月捐款金额:{{item.price}}
+				</view>
+				<view class="right-foot">
+					当前状态：{{item.is_signing == 0 ?'进行中': '已停止'}}
+				</view>
+			</view>
+		</view>
+		<!-- <view class="xq" v-for="item in science" @click="Jump(item.id)">
+			<view class="line flex">
+				<image src="../../static/icon/dk1.png" mode=""></image>
+				<view class="name">
+					捐款项目
+				</view>
+				<view class="val">
+					{{item.order_name}}
+				</view>
+			</view>
+			<view class="line flex">
+				<image src="../../static/icon/dk2.png" mode=""></image>
+				<view class="name">
+					每月捐款金额
+				</view>
+				<view class="val">
+					{{item.price}}元
+				</view>
+			</view>
+			<view class="line flex">
+				<image src="../../static/icon/dk3.png" mode=""></image>
+				<view class="name">
+					支付方式
+				</view>
+				<view class="val">
+					微信支付
+				</view>
+			</view>
+		</view> -->
+		<!-- <uni-load-more :status="loadingType"></uni-load-more> -->
+	</view>
+</template>
+
+<script>
+	import { getArticList} from '@/api/index.js';
+	import { getMyPlan} from '@/api/money.js';
+	export default{
+		data(){
+			return{
+				keyword:'',
+				science:[],
+				page: 1,
+				limit: 10,
+				loadingType:'more'
+			}
+		},
+		onLoad() {
+			this.loadData();
+		},
+		onReachBottom() {
+			this.loadData()
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				return arr[0]
+			}
+		},
+		methods:{
+			messagesearch() {
+				let keyword = this.keyword;
+				console.log(keyword);
+				let arrlist = [];
+				for (let i = 0; i < this.science.length; i++) {
+					if (this.science[i].title.indexOf(keyword) != -1) {
+						arrlist.push(this.science[i]);
+					}
+				}
+				this.science = arrlist;
+				if (keyword == '') {
+					this.loadData();
+				}
+			},
+			loadData(){
+				let obj = this;
+				if(obj.loadingType == 'noMore' || obj.loadingType == 'loading') {
+					return
+				}
+				obj.loadingType = 'loading'
+				getMyPlan({
+					page: obj.page,
+					limit: obj.limit
+				}).then(({ data }) => {
+					obj.science = obj.science.concat(data.data);
+					obj.page++
+					if(obj.limit == data.data.length) {
+						obj.loadingType = 'more'
+					}else {
+						obj.loadingType = 'noMore'
+					}
+				});
+			},
+			Jump(id,plan_id) {
+				uni.navigateTo({
+					url:"/pages/index/dk?id="+id + '&plan_id=' + plan_id
+				})	
+			},
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+	//搜索框
+	.Search-box {
+		padding-left: 20rpx;
+		padding-right: 20rpx;
+		height: 100rpx;
+		background: #ffffff;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		.Search-box-sort {
+			font-size: 30rpx;
+	
+			font-weight: 500;
+			color: rgba(102, 102, 102, 1);
+	
+			.sort-text {
+				width: 57rpx;
+				height: 29rpx;
+				font-size: 30rpx;
+				font-weight: 500;
+				color: rgba(51, 51, 51, 1);
+				line-height: 58rpx;
+				margin-right: 19rpx;
+			}
+			.sort-img {
+				width: 21rpx;
+				height: 11rpx;
+				margin-bottom: 4rpx;
+			}
+		}
+	
+		.Search-box-size {
+			width: 630rpx;
+			height: 65rpx;
+			border-radius: 32rpx;
+			background-color: #f1f1f1;
+			padding-left: 36rpx;
+			display: flex;
+			align-items: center;
+	
+			.box-img {
+				height: 32rpx;
+				width: 32rpx;
+				margin-right: 16rpx;
+			}
+			.box-word {
+				width: 100%;
+				font-size: 22rpx;
+				font-weight: 500;
+				color: rgba(205, 203, 203, 1);
+				line-height: 55rpx;
+			}
+		}
+	}
+
+    .content{
+		line-height: 1;
+		.list-box{
+			width: 725rpx;
+			height: 200rpx;
+			margin: 20rpx auto 0;
+			background: #FFFFFF;
+			box-shadow: 0px 5rpx 5rpx 0px rgba(35, 24, 21, 0.06);
+			border-radius: 7rpx;
+			padding:0 20rpx;
+			display: flex;
+			align-items: center;
+			.box-left{
+				width: 230rpx;
+				height: 145rpx;
+				margin-right: 20rpx;
+				.left-img{
+					width: 230rpx;
+					height: 145rpx;
+				}
+			}
+			.box-right{
+				width: 430rpx;
+				height: 145rpx;
+				position: relative;
+				.right-top{
+					font-size: 25rpx;
+					font-weight: bold;
+					color: #333333;
+					margin-bottom: 24rpx;
+				}
+				.right-center{
+					width: 362rpx;
+					// height: 53rpx;
+					font-size: 21rpx;
+					font-weight: bold;
+					color: #999999;
+					line-height: 33rpx;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					display: -webkit-box;
+					-webkit-line-clamp: 2;//在第几行显示...
+					-webkit-box-orient: vertical;
+				}
+				.right-foot{
+					font-size: 21rpx;
+					font-weight: bold;
+					color: #999999;
+					line-height: 31rpx;
+					text-align: right;
+					// margin-top: 13rpx;
+					position: absolute;
+					right: 0;
+					bottom: 0;
+				}
+			}
+		}
+	}
+.xq {
+		margin: 20rpx 0;
+		background-color: #fff;
+		padding: 45rpx  0;
+		.line {
+			align-items: center;
+			padding: 30rpx 27rpx 30rpx 33rpx;
+			* {
+				flex-shrink: 0;
+			}
+			image {
+				width: 34rpx;
+				height: 34rpx;
+			}
+			.name {
+				font-weight: bold;
+				font-size: 30rpx;
+				color: #333333;
+				padding-left: 12rpx;
+			}
+			.val {
+				flex-grow: 1;
+				font-size: 26rpx;
+				color: #666666;
+				text-align: right;
+			}
+		}
+	}
+</style>

pages/user/user.vue

@@ -14,6 +14,7 @@
 				</view>
 			</view>
 		</view>
+		<image src="../../static/images/poai.png" mode="" @click="boai" style="display:block;width: 700rpx;height: 90rpx;margin: 20rpx auto;"></image>
 		<view class="nav-wrapper">
 			<!-- <view class="nav-item flex" @click="tohelp">
 				<view class="item-left flex">
@@ -196,6 +197,11 @@
 		},
 		methods: {
 			...mapMutations('user', ['setUserInfo','logout']),
+			boai() {
+				uni.navigateTo({
+					url:'/pages/index/yueList'
+				})
+			},
 			// 续费
 			xuFei() {
 				let obj = this