gy-app-shop/pages/auth/companyRegister.vue

<style lang='scss' scoped>
	.companyRegister{
		width: 100%;
		&-form{
			padding: $paddingTB $paddingLR;
		}
	}
</style>
<template>
	<view class="companyRegister">
		<view class="companyRegister-form">
			<u-form class="" :model="form" ref="uForm" label-width="240">
				<u-form-item required label="企业名称" prop="companyName"><u-input v-model="form.companyName" placeholder="请输入企业名称" /></u-form-item>
				<u-form-item required label="企业社会统一码" prop="companyCode"><u-input v-model="form.companyCode" placeholder="请输入企业社会统一码" /></u-form-item>
				<u-form-item required label="法人姓名" prop="legalName"><u-input v-model="form.legalName" placeholder="请输入法人姓名" /></u-form-item>
				<u-form-item required label="登录账号" prop="username"><u-input v-model="form.username" placeholder="请输入登录账号" /></u-form-item>
				<u-form-item required label="登录密码" prop="password"><u-input v-model="form.password" type="password" placeholder="请输入登录密码" /></u-form-item>
				<u-form-item required label="手机号码" prop="phoneNumber"><u-input v-model="form.phoneNumber" type="text" placeholder="请输入手机号码" /></u-form-item>
				<u-form-item required label="验证码" prop="messageCode">
					<u-input placeholder="请输入验证码" v-model="form.messageCode" type="text"></u-input>
					<u-button slot="right" type="success" size="mini" @click="getCode">{{codeTips}}</u-button>
				</u-form-item>
			</u-form>
			<u-verification-code seconds="60" ref="uCode" @change="codeChange"></u-verification-code>
			<u-button class="mt30" type="primary" @click="submit">提交</u-button>
		</view>

	</view>
</template>
<script>
	let _this;
	export default {
		data() {
			return {
				codeTips: '', // 验证码文字
				form: {
					companyName: '',
					companyCode:"",
					legalName: '',
					username:"",
					password: '',
					phoneNumber:"",
					messageCode:""
				},
				rules: {
					companyName: [
						{
							required: true,
							message: '企业名称不能为空',
							trigger: ['change','blur'],
						}
					],
					companyCode: [
						{
							required: true,
							message: '请输入企业社会统一码',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					],
					legalName: [
						{
							required: true,
							message: '请输入法人姓名',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					],
					username: [
						{
							required: true,
							message: '请输入登入账号',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					],
					password: [
						{
							required: true,
							message: '请输入密码',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					],
					phoneNumber: [
						{
							required: true,
							message: '请输入手机号码',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					],
					messageCode: [
						{
							required: true,
							message: '请输入手机验证码',
							// 可以单个或者同时写两个触发验证方式
							trigger: ['change','blur'],
						}
					]
				}

			}
		},
		onLoad() {
			_this = this;
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			// 获取验证码
			getCode() {
				if(this.$refs.uCode.canGetCode) {
					// 模拟向后端请求验证码
					uni.showLoading({
						title: '正在获取验证码',
						mask: true
					})
					this.$post("/sms/registered",{phoneNumber:this.form.phoneNumber,expirationTime:90,smsType:1}).then((res)=>{
						if(res.code === 200){
							uni.hideLoading();
							// 这里此提示会被this.start()方法中的提示覆盖
							this.$u.toast('验证码已发送', 3000);
							// 通知验证码组件内部开始倒计时
							this.$refs.uCode.start();
						}else{
							this.$tui.toast(res.msg, 3000);
						}
					})
				} else {
					this.$u.toast('倒计时结束后再发送', 3000);
				}
			},
			codeChange(text) {
				this.codeTips = text;
			},
			submit() {
				this.$refs.uForm.validate(valid => {
					console.log(valid,"valid");
					if (valid) {
						let registerData = {
							tenantName:this.form.companyName,
							tenantCode:this.form.companyCode,
							corporation:this.form.legalName,
							username:this.form.username,
							password:this.form.password,
							phoneNumber:this.form.phoneNumber,
							captcha:this.form.messageCode,
						}
						this.$post("/system/registered",registerData).then((res)=>{
							console.log(res,"res");
							if(res.code === 200){
								uni.reLaunch({
									url:`./registerLoading?phonenumber=${this.form.phoneNumber}`
								})
							}else{
								uni.showToast({
									title: res.msg,
									duration: 3000,
									icon: 'none'
								})
							}
						}).catch((err)=>{
							console.log(err,"err");
						})
						// if (this.form.messageCode) {
						// 	console.log('验证通过');
						// 	uni.reLaunch({
						// 		url:`./registerLoading?phonenumber=${this.form.phonenumber}`
						// 	})
						// } else{
						// 	this.$u.toast('请输入短信验证码');
						// }

					} else {
						console.log('验证失败');
					}
				});
			}
		}
	}
</script>