exam/exam-06173-uni/pages/login/reg.vue

<template>
	<view class="page-box">




		<uni-forms :modelValue="postForm" ref="postForm" :rules="rules" :label-width="100">


			<uni-forms-item name="realName" label="真实姓名" required>
				<uni-easyinput type="text" v-model="postForm.realName" placeholder="用户姓名" />
			</uni-forms-item>
			
			<uni-forms-item name="userName" label="登录账号" required>
				<uni-easyinput type="text" v-model="postForm.userName" placeholder="登录账号" />
			</uni-forms-item>

			<uni-forms-item name="password" label="登录密码" required>
				<uni-easyinput type="password" v-model="postForm.password" placeholder="登录密码" />
			</uni-forms-item>

			<uni-forms-item name="deptCode" label="所在部门" required>

				<uni-data-picker placeholder="请选择所在部门" popup-title="选择部门" :localdata="treeData" :step-searh="true"
					@nodeclick="deptClick">
				</uni-data-picker>

			</uni-forms-item>
			
		</uni-forms>

		<view style="margin-top: 10px;">
			<button type="primary" @tap="handleLogin">注册并登录</button>
		</view>
		
		
		<view class="login-opt">
		   <a @tap="$navs.toForgot">忘记密码</a>
		   <a @tap="$navs.toLogin">已有账号？</a>
		</view>
		


	</view>
</template>

<script>
	import { userReg } from '@/api/user.js'
	import { fetchTreeSelect } from '@/api/sys/depart/depart.js'

	export default {

		data() {
			return {

				treeData: [],
				rules: {
					
					realName: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空！'
						}]

					},
					userName: {
						rules: [{
							required: true,
							errorMessage: '登录账号不能为空！'
						}]
					
					},
					deptCode: {
						rules: [{
							required: true,
							errorMessage: '所属部门不能为空！'
						}]

					},
					password: {
						rules: [{
							required: true,
							errorMessage: '密码不能为空！'
						}]
					}
				
				},
				postForm: {
					realName: '',
					deptCode: '',
					password: ''
				}
			}
		},

		created() {

			fetchTreeSelect({}).then(data => {
				this.treeData = data
			})
		},
		
	

		methods: {

			deptClick(e) {
				const value = e.value
				this.postForm.deptCode = value
			},

			async handleLogin() {
				
			
				
				// 对整个表单进行校验，返回一个 Promise
				this.$refs.postForm.validate().then((res) => {
					
					uni.showLoading({
						title: '加载中...'
					});

					this.loginLoading = true
					// 快速注册后开始考试
					userReg(this.postForm).then(data => {

						// 关闭加载
						uni.hideLoading()

						// 保存本地token
						uni.setStorageSync('token', data.token);

						//打印请求返回的数据
						uni.switchTab({
							url: '/pages/index/index'
						});

					});

				}).catch((err) => {

				})
				
			}


		}
	}
</script>


<style scoped>
	/deep/ .uni-data-tree-input .input-value {
		line-height: 34px !important;
		height: 34px !important;
	}
</style>