sct/pagesT/Distribution/ApplyTerm.vue

<template>
	<view class="apply-term">
		<image :src="distributionSet.image || default_img" mode="aspectFill" class="apply-img"></image>
		<!--  无条件成为分销商 -->
		<view class="apply-cont" v-if="distributionSet.businessmanCondition === 0">
			<view class="apply-tip">
				<view class="audit-img"><image src="https://onlineimg.qianniao.vip/no_coll.jpg" mode="aspectFit"></image></view>
				<view class="tip-text">您还不是{{ text_set.name || '分销商' }}，点击下方按钮立即{{ text_set.distributor || '成为分销商' }}</view>
			</view>
			<view @click="subApply" class="sub-btn">立即{{ text_set.distributor || '成为分销商' }}</view>
		</view>
		<!--  申请成为分销商条件为填写资料申请 -->
		<view class="apply-cont" v-if="distributionSet.businessmanCondition === 1">
			<u-form label-width="140rpx">
				<block v-for="(item, index) in distributionSet.info" :key="index">
					<u-form-item :label="item.prop"><u-input :clearable="false" v-model="item.value" /></u-form-item>
				</block>
			</u-form>
			<view class="apply-agree" v-if='distributionSet.title'>
				提交代表您同意
				<text @click="goPage('/pagesT/Distribution/Agreement')" class="apply-agree-text primary-color">《{{ distributionSet.title }}》</text>
			</view>
			<view @click="subApply" class="sub-btn">申请{{ text_set.distributor || '成为分销商' }}</view>
		</view>
		<!--  申请成为分销商条件为累计消费次数或者累计消费金额 -->
		<view class="apply-cont" v-if="[2, 3].includes(distributionSet.businessmanCondition)">
			<view class="apply-num-cont">
				<view>您已累计消费</view>
				<view class="num-weight" v-if="distributionSet.businessmanCondition === 2">
					<text class="_number">0</text>
					<text>次</text>
				</view>
				<view class="num-weight" v-if="distributionSet.businessmanCondition === 3">
					<text class="_number">0</text>
					<text>元</text>
				</view>
			</view>

			<view class="apply-tip-view">
				您还不是{{ text_set.name || '分销商' }}，点击下方按钮申请{{ text_set.distributor || '成为分销商' }}
			</view>
			<view class="sub-btn" @click="subApply">申请成为分销商</view>
			<view class="user-discription">
				<view class="user-d-tit">
					用户须知
				</view>
				<view class="user-d-info">
					1、当您点击申请成为分销商按钮后，开始累计您在本店的{{distributionSet.businessmanCondition === 3?'消费金额':'消费次数'}}</text>；
				</view>
				<view class="user-d-info">
					2、您在本店累计{{distributionSet.businessmanCondition === 3?'消费金额':'消费次数'}}</text>满<text class="_importent">{{distributionSet.businessmanCondition === 3?distributionSet.buyAmount+'元':distributionSet.buyNum+'次'}}</text>，<text v-if="distributionSet.audit===4">通过审核后</text>即可{{ text_set.distributor || '成为分销商' }}
				</view>
			</view>
		</view>
		<!--  申请成为分销商条件为购买商品 -->
		<view class="apply-cont" v-if="distributionSet.businessmanCondition === 4">
			<view class="apply-tip-view">
				您还不是{{ text_set.name || '分销商' }}，点击下方按钮申请{{ text_set.distributor || '成为分销商' }}
			</view>
			<view class="sub-btn" @click="subApply">申请成为分销商</view>
			<view class="user-discription">
				<view class="user-d-tit">
					用户须知
				</view>
				<view class="user-d-info">
					当您点击申请成为分销商按钮后，购买指定商品，<text v-if="distributionSet.audit===4">通过审核后</text>即可{{ text_set.distributor || '成为分销商' }}
				</view>
			</view>
		</view>
		<AddCardModel :selAddress="now_sel_address" :skuId="goods_sku_id" @close="is_add_show = false" @change="cardModelPopChange" :isShow="is_add_show" :goodsId="goods_id" />

	</view>
</template>

<script>
import AddCardModel from '@/components/AddCardModel';
export default {
	components: {
		AddCardModel,
	},
	data() {
		return {
			default_img: 'https://onlineimg.qianniao.vip/931544405107da76ca2ec31cd63fae49/1596008994491apply_banner.png',
			is_add_show: false,
			isLoding: false,
			goods_id: 0,
			now_sel_address: {},
			goodsList: [],
			apply_form: {
				email: '',
				name: '',
				phone: ''
			},
			customerId: 0,
			userName: '',
			distributionSet: {
				image: '',
				info: [],
				businessmanCondition: 0
			},
			auditStatus: 0, // 审核状态
			applicationCondition: 0, // 申请成为分销商条件
			goods_sku_id: 0,
			text_set: {}
		};
	},
	onLoad(options) {
		if (options.auditStatus && options.applicationCondition) {
			this.auditStatus = parseInt(options.auditStatus);
			this.applicationCondition = parseInt(options.applicationCondition);
		} else {
			this.customerId = this.$store.state.userStatus.id;
			this.userName = this.$store.state.userStatus.name;
			this.distributionSet = this.$store.state.distributionSet;
			// 申请成为分销商条件为购买商品
			if (this.distributionSet.businessmanCondition === 4) {
				this.getBuyGoods();
			}
		}
		this.text_set = this.$store.state.distributionTextSet;
	},
	methods: {
		// 查询升级商品
		async getBuyGoods() {
			this.$u.api.getBuyGoods().then(({data})=>{
				this.goodsList = data;
			})
		},
		cardModelPopChange(obj) {
			if (!obj.show) {
				this.is_add_show = false;
			}
		},
		addCard(id, skuId) {
			this.goods_id = id;
			this.goods_sku_id = skuId;
			this.is_add_show = true;
		},
		async subApply() {
			let params = {
				customerId: this.customerId
			};
			if (this.distributionSet.businessmanCondition === 1) {
				let isSub = true;
				for (let i in this.distributionSet.info) {
					if (!this.distributionSet.info[i].value) {
						isSub = false;
						break;
					}
				}
				if (!isSub) {
					this.$api.msg('请输入申请资料');
					return;
				}
				params.info = this.distributionSet.info;
			}
			this.$u.api.applicationBusinessman(params).then(res=>{
				if (this.distributionSet.businessmanCondition === 0) {
					// 无条件 点击按钮自动成为分销商
					this.$api.msg('恭喜您已成为分销商');
					setTimeout(() => {
						this.goPage('/pagesT/Distribution/Distribution');
					}, 500);
				} else if(this.distributionSet.businessmanCondition === 4){
					this.$api.msg('申请成功');
					setTimeout(() => {
						this.goPage('/pagesT/Distribution/ApplyAudit?auditStatus=1&applicationCondition=4','redirectTo');
					}, 500);
				}else {
					// 不需要审核，填写完了条件成为分销商
					if (this.distributionSet.audit === 4&&this.distributionSet.businessmanCondition === 1) {
						this.$api.msg('恭喜您已成为分销商');
						setTimeout(() => {
							this.goPage('/pagesT/Distribution/Distribution');
						}, 500);
					} else {
						// 不需要审核，填写完了等待审核
						this.$api.msg('申请成功，正在审核中');
						setTimeout(() => {
							uni.navigateBack();
						}, 500);
					}
				}
			})

		}
	}
};
</script>

<style lang="scss">
.apply-img {
	width: 100%;
	height: 322upx;
	display: block;
}
.apply-cont {
	padding: 20upx 30upx;
	.apply-agree {
		font-size: 24upx;
		color: #999;
		padding: 20upx 0;
	}
	.apply-tip-view {
		text-align: center;
		._importent {
			color: #ff5a5f;
		}
	}
	.apply-tip {
		border-radius: 8upx;
		width: 650upx;
		margin: 26upx auto 46upx;
		box-shadow: 0 0 20upx 4upx #f5f5f5;
		padding: 50upx 0;
		.audit-img {
			image {
				display: block;
				width: 200upx;
				height: 200upx;
				margin: 0 auto;
			}
		}
		.tip-text {
			padding: 0 24upx;
			text-align: center;
			opacity: 0.9;
			line-height: 60upx;
		}
	}
	.sub-btn {
		font-size: 30upx;
		text-align: center;
		color: #ffffff;
		width: 645upx;
		height: 72upx;
		background-color: #fe582e;
		border-radius: 40px;
		line-height: 72upx;
		margin: 50upx auto 0;
	}
	.user-discription{
		font-size: 24upx;
		line-height: 40rpx;
		padding-top: 30rpx;
		.user-d-tit{
			color: #333;
			font-weight: bold;
		}
		.user-d-info{
			color: #666;
			._importent{
				color: #fe582e;
				font-weight: bold;
			}
		}
	}
}
.apply-num-cont {
	width: 650upx;
	margin: 46upx auto;
	font-size: 24upx;
	color: #898c98;
	text-align: center;
	box-shadow: 0 0 20upx 4upx #f5f5f5;
	padding: 64upx 0;
	.num-weight {
		padding-top: 40upx;
		font-weight: bold;
		color: #3d404c;
		._number {
			margin-right: 10upx;
			font-size: 66upx;
		}
	}
}

.goods-item-box {
	border-bottom: 1upx solid #eee;
	padding: 18upx 0;
	position: relative;
	.sale-end-icon {
		font-size: 90upx;
		color: $uni-color-error;
		display: block;
		position: absolute;
		right: 60upx;
		top: 80upx;
	}

	.right {
		width: calc(100% - 188upx);
	}

	.title {
		font-size: 28upx;
		color: #303133;
		width: 100%;
		height: 76upx;
		line-height: 36upx;
		text-overflow: -o-ellipsis-lastline;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.subTitle {
		font-size: 24upx;
		color: #666;
		white-space: nowrap;
		width: 100%;
		overflow: hidden;
		/* 默认溢出隐藏 */
		text-overflow: ellipsis;
		padding: 6upx 0;
		height: 48upx;
		line-height: 42upx;
		.gradeName {
			padding: 0 10upx;
			line-height: 32upx;
			color: #fe582e;
			border: 1upx solid #fe582e;
			border-radius: 20upx;
			display: inline-block;
			vertical-align: middle;
			height: 32upx;
			margin-right: 10upx;
		}
	}

	.price {
		display: inline-block;
		font-size: 28upx;
		color: #fe582e;
		font-weight: 500;
	}

	.price .icon-rmb {
		font-size: 22upx;
	}

	.imgStyle {
		padding-right: 24upx;
	}

	.imgStyle image {
		width: 160upx;
		height: 160upx;
		border: 1px solid #eee;
		border-radius: 4upx;
		display: block;
	}

	/* 选规格 */
	.add-cart-btn {
		position: absolute;
		right: 0;
		bottom: 45%;
		transform: translateY(50%);
		background-color: #fe582e;
		color: #fff;
		display: block;
		width: 50upx;
		height: 50upx;
		border-radius: 100%;
		font-size: 24upx;
		text-align: center;
		line-height: 50upx;
	}
}
</style>