fanyunAi/pages/user/commission/apply.vue

<!-- 申请分销商 -->
<template>
	<view>


		<view style="color: #000000;">
			<tn-nav-bar backgroundColor="#ffffff" :bottomShadow="false">合伙人入驻</tn-nav-bar>
			<view :style="{height: tobheight+'px'}"></view>
		</view>
		<view class="u-content">
			<u-parse :content="intro"></u-parse>
		</view>
		<!-- <button class="u-reset-button save-btn"  @tap="onSubmit" :disabled="isFormEnd">立即入驻</button> -->
		<view class="dygbhg">
			<view class="whole" @click="deleteall">退出</view>
			<view @click="showsettlein = true" class="distinguish">
				立即入驻{{commission_price>0?'(￥'+commission_price+')':''}}</view>
		</view>
		<u-popup :show="showsettlein" mode="bottom" :round="10" closeable @close="showsettlein = false">
			<view class="container">
				<view class="textl_ogin">填写资料</view>
				<!-- 填写资料 -->
				<view class="login">
					<view class="input u-flex align-center">
						<u-icon name="account-fill" color="#5336ff" size="24"></u-icon>
						<input class="vs-flex-item" v-model="form.name" :maxlength="11" placeholder="请输入姓名" />
					</view>
					<view class="input u-flex align-center">
						<u-icon name="phone-fill" color="#5336ff" size="24"></u-icon>
						<input class="vs-flex-item" type="number" v-model="form.number" placeholder="请输入手机号"
							placeholder-class="input-placeholder" />
						<!-- <u-icon @click="password = !password" :name="password ? 'eye-off' : 'eye-fill'" color="#26B3A0" size="18"></u-icon> -->
					</view>

				</view>
				<view @click="onSubmit()" hover-class="hoversubmit" class="signinnow">确认提交</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	import ShoproPay from '@/common/pay';
	export default {
		data() {
			return {

				tobheight: 45,
				platform: this.$platform.get(),
				intro: '',
				showsettlein: false,
				form: {
					name: '',
					number: ''
				},
				commission_price: 0,
				paid: 0
			};
		},
		computed: {
			...mapGetters(['appInfo', 'userInfo', 'isLogin'])
		},
		onLoad() {
			const that = this;
			if (this.platform == 'wxMiniProgram') {
				var menumtop = uni.getMenuButtonBoundingClientRect().top - uni.getSystemInfoSync().statusBarHeight
				var paddingtop = uni.getSystemInfoSync().statusBarHeight + menumtop
				this.tobheight = (menumtop + paddingtop + uni.getMenuButtonBoundingClientRect().height)
			}
			this.auth()
			this.commission()
		},
		methods: {
			deleteall() {
				uni.navigateBack()
			},
			commission() {
				let that = this;
				that.$http('conf.getGroupConf', {
					group: 'system.commission'
				}).then(res => {
					if (res.code === 0) {
						this.intro = res.data.intro
						this.commission_price = res.data.commission_price
						uni.setNavigationBarTitle({
							title: that.appInfo.site_name
						});
					}
				});
			},
			auth() {
				let that = this;
				that.$http('commission.auth').then(res => {
					if (res.code == 0) {
						that.paid = res.data.paid

					}
				})
			},
			create() {
				let that = this;
				that.$http('order.createSettle', {
					pay_type: 'wechat',
					real_name: that.form.name,
					telnum: that.form.number
				}).then(res => {
					if (res.code === 0) {
						// let pay = new ShoproPay('wechat', res.data,1);
						if (that.userInfo.openid_miniapp || that.userInfo.openid_wechat) {
							let pay = new ShoproPay('wechat', res.data, 1);
						} else {
							// console.log(res.data);
							that.paytest(res.data.order_number, res.data.id)
						}
					} else {
						that.$u.toast(res.msg);
					}
				});
			},
			paytest(e, id) {
				uni.showLoading({
					title: '支付跳转中...'
				})
				let uniacid = uni.getStorageSync("uniacid") || "";
				this.$http('pay.hupijiaopay', {
					order_number: e,
					is_commission: 1,
					return_url: window.location.href.split('/h5')[0] +
						'/h5/pages/user/public/paymentdetail?uniacid=' + uniacid + '&orderType=1&orderId=' + id,
					callback_url: window.location.href,
				}).then(res => {
					// console.log(res);
					if (res.code === 0) {
						// console.log(res.data);

						window.location.href = res.data.url
						// uni.navigateTo({
						// 	url:'pages/user/public/webview?url='+res.data.url
						// })

					} else {
						this.$u.toast(res.msg);
					}
				});
			},
			commissionapply() {
				var that = this;
				that.$http('commission.apply', {
					real_name: that.form.name,
					telnum: that.form.number
				}).then(res => {
					if (res.code == 0) {
						uni.showToast({
							title: '申请成功'
						})
						setTimeout(function() {
							uni.redirectTo({
								url: '/pages/user/commission/index'
							})
						}, 1500);

					} else {
						uni.showModal({
							confirmText: '重新申请',
							confirmColor: '#5e49c3',
							content: '合伙人申请失败',
							title: '提示',
							success(res) {
								if (res.confirm) {
									this.create()
								} else if (res.cancel) {
									// uni.navigateBack()
								}
							}
						})
					}
				});
			},
			// 提交
			onSubmit() {
				let that = this;
				// console.log(this.form);
				if (!that.form.name) {
					uni.showToast({
						title: '请输入您的姓名',
						icon: 'none'
					})
				} else if (!uni.$u.test.chinese(that.form.name)) {
					uni.showToast({
						title: '请输入姓名为汉字',
						icon: 'none'
					})
				} else if (!uni.$u.test.rangeLength(that.form.name, [2, 10])) {
					uni.showToast({
						title: '姓名长度不能低于2位多于10位',
						icon: 'none'
					})
				} else if (!that.form.number) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
				} else if (!uni.$u.test.mobile(that.form.number)) {
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
				} else {
					if (that.commission_price > 0) {
						that.create()
						return;
					} else {
						that.commissionapply()
						return;
					}

				}
			}
		}
	};
</script>

<style lang="scss">
	.u-content {
		padding: 30rpx;
		font-size: 32rpx;
		color: $u-content-color;
		line-height: 1.6;
	}

	.dygbhg {
		background: #ffffff;
		border-radius: 20rpx 20rpx 0 0;
		position: fixed;
		bottom: 0;
		width: 100%;
		box-shadow: 0px 0px 10px #00000024;
		display: flex;
		align-items: center;
		justify-content: space-evenly;
	}

	.whole {
		width: 30%;
		height: 100rpx;
		display: flex;
		color: #ffffff;
		align-items: center;
		justify-content: center;
		background: #9E9E9E;
		// font-weight: bold;
		border-radius: 60rpx;
	}

	.distinguish {
		width: 56%;
		height: 100rpx;
		display: flex;
		color: #ffffff;
		align-items: center;
		justify-content: center;
		background: linear-gradient(-90deg, #a36fff, #5336ff);
		font-weight: bold;
		border-radius: 60rpx;
		margin: 38rpx 0;
		margin-left: 4%;
	}

	.container {
		margin-top: 60rpx;

		.bg {
			display: flex;
			align-items: center;
			justify-content: center;
			position: relative;
			height: 400rpx;
			margin-bottom: 80rpx;
		}

		.topimg {
			image {
				width: 180rpx;
				height: 180rpx;
				border-radius: 50%;
			}
		}

		.textl_ogin {
			font-size: 40rpx;
			margin: 0 60rpx 50rpx;
			font-weight: bold;
		}

		.login {
			margin-bottom: 80rpx;
		}

		.signinnow {
			background: linear-gradient(-90deg, #a36fff, #5336ff);
			font-size: 34rpx;
			color: #fff;
			margin: 0 60rpx 40rpx;
			text-align: center;
			line-height: 90rpx;
			height: 90rpx;
			border-radius: 60rpx;
			font-weight: bold;
		}

		.input {
			// width: 630rpx;
			height: 100rpx;
			padding: 0 30rpx;
			background: #f7f7f7;
			border-radius: 60rpx;
			flex-direction: row;
			// margin-left: 60rpx;
			// margin-bottom: 40rpx;
			margin: 0 60rpx 40rpx;
			font-style: normal;
			font-size: 30rpx;
			font-family: Droid Sans Fallback;

			&-icon {
				width: 30rpx;
				height: 38rpx;
			}
		}

		.hoversubmit {
			background: #F7F7F7;
			color: #ACACB3;
		}

		.vs-flex-item {
			flex: 1;
			margin-left: 16rpx;
		}
	}
</style>