FE_CRM/pages/reg/reg.vue

<template>
	<view class="page">
		<image class="logo" src="@/static/image/logo.png" mode=""></image>
		<view class="wrap">
			<view v-if="form.isTeam !== 0" class="hello">
				{{ form.isTeam ? '或然科技城市合伙人，欢迎回来！' : '欢迎加入或然城市合伙人计划！请认真填写您的姓名和意向开展业务的区域。注册后，我们将会有区域运营与您联系沟通后续事宜。'}}
			</view>
			<view>
				<uni-forms>
					<uni-forms-item label="姓名">
						<uni-easyinput type="text" v-model="form.userName" placeholder="请输入姓名" :disabled="exist" />
					</uni-forms-item>
					<uni-forms-item label="业务省份">
						<view v-if="form.isTeam" class="location">{{ form.provinceName }}</view>
						<uni-data-picker v-else placeholder="请选择省份" popup-title="请选择省份" preload :localdata="provinces" :map="{text: 'provinceName', value: 'provinceId'}" v-model="form.provinceId" @change="getCity"></uni-data-picker>
					</uni-forms-item>
					<uni-forms-item label="业务城市">
						<view v-if="form.isTeam" class="location">{{ form.cityName }}</view>
						<uni-data-picker v-else placeholder="请选择城市" popup-title="请选择城市" preload :localdata="cities" :map="{text: 'cityName', value: 'cityId'}" v-model="form.cityId"></uni-data-picker>
					</uni-forms-item>
				</uni-forms>
				<view class="btns">
					<button type="primary" @click="submit">{{ form.isTeam ? '登录' : form.isTeam === 0 ? '确定' : '注册' }}</button>
					<button @click="back">取消</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { queryPartnerAccount, queryProvince, queryCity, partnerAccountApplication, loginByOpenid, checkWorkNumOrAccount } from '@/apis/modules/user.js'
	export default {
		data() {
			return {
				openid: '',
				phone: '',
				form: {
					userName: '',
					provinceId: '',
					cityId: '',
				},
				accountRepeat: false,
				provinces: [],
				cities: [],
				exist: false
			}
		},
		onShow() {
			const pages = getCurrentPages()
			const { options } = pages[pages.length - 1]
			this.openid = options.openid
			this.phone = options.phone
			this.getProvince()
			this.checkLogin()
		},
		methods: {
			// 检查登录状态
			checkLogin() {
				// 根据手机号获取是否注册过，如果有，则判断是否是队长（isTeam 1：队长，0：成员），如果没有返回team，则注册
				queryPartnerAccount(this.phone).then(({ team, username }) => {
					if (team) {
						team.teamId && uni.setStorageSync('teamId', team.teamId)
						this.form.userName = team.userName
						if (team) this.exist = true
						if (team.isTeam) {
							this.form = team
							this.getCity()
						} else {
							this.form.isTeam = 0
							if (team.userName) this.form.userName = team.userName
							uni.showModal({
								title: '提示',
								content: `或然科技城市合伙人，欢迎回来！您已在${team.teamName}，是否要创建自己的团队？`,
								success: function (res) {
									if (res.confirm) {
										console.log('用户点击确定');
									} else if (res.cancel) {
										uni.redirectTo({
											url: '../login/login'
										})
									}
								}
							})
						}
					} else if (username) { // 没有团队，只有username
						this.form.userName = username
					}
				}).catch(e => {})
			},
			// 获取省份
			getProvince() {
				queryProvince().then(({ list }) => {
					this.provinces = list
				}).catch(res => {})
			},
			// 获取城市
			getCity(val) {
				if (this.form.provinceId) {
					queryCity({
						provinceId: this.form.provinceId
					}).then(({ list }) => {
						this.cities = list
					}).catch(res => {})
				} else {
					this.cities = []
				}
				if (val) this.form.cityId = ''
			},
			// 提交
			submit() {
				const { form } = this
				if (!form.userName) return this.$util.errMsg('请输入姓名！')
				if (!form.provinceId) return this.$util.errMsg('请选择意向省份！')
				if (!form.cityId) return this.$util.errMsg('请选择意向城市！')
				form.phone = this.phone
				form.appOpenId = this.openid
				form.uniqueIdentification = Date.now()
				if (form.isTeam) { // 队长，直接登录
					loginByOpenid(this.openid).then(({ data }) => {
						uni.setStorageSync('token', data.token)
						this.toIndex()
					}).catch(res => {})
				} else { // 新用户，注册。or 成员，创建自己的团队
					partnerAccountApplication(form).then(({ token, teamId }) => {
						this.$util.sucMsg(form.isTeam === 0 ? '创建成功' : '注册成功')
						// 如果返回了token，直接登录，并且把teamId存在缓存里，到了首页后直接选中该团队
						if (token) {
							teamId && uni.setStorageSync('teamId', teamId)
							uni.setStorageSync('token', token)
							setTimeout(() => {
								this.toIndex()
							}, 1500)
						} else {
							setTimeout(() => {
								uni.redirectTo({
									url: '../login/login'
								})
							}, 1500)
						}
					}).catch(res => {})
				}
			},
			// 跳转到首页
			toIndex() {
				uni.reLaunch({
					url: '../index/index'
				})
			},
			// 返回
			back() {
				uni.redirectTo({
					url: '../login/login'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
.page {
	min-height: 100%;
	text-align: center;
	background: url(@/static/image/login1.png) 0 0/175rpx auto no-repeat,
		url(@/static/image/login2.png) bottom right/123rpx auto no-repeat;
	.logo {
		width: 393rpx;
		height: 93rpx;
		margin: 100rpx 0 60rpx;
	}
}
.wrap {
	position: relative;
	padding: 60rpx;
	margin: 0 61rpx;
	text-align: center;
	border-radius: 8rpx;
	background-color: #fff;
	.hello {
		margin-bottom: 30rpx;
		font-size: 28rpx;
		color: #333;
	}
	.btns {
		display: flex;
		button {
			width: 200rpx;
			font-size: 30rpx;
		}
	}
	.location {
		padding-left: 10px;
		line-height: 38px;
		font-size: 14px;
		color: #D5D5D5;
		border: 1px solid #e5e5e5;
		background-color: #F7F6F6;
		border-radius: 4px;
	}
}
</style>