|
|
@@ -0,0 +1,142 @@
|
|
|
+<template>
|
|
|
+ <view class="register">
|
|
|
+ <view class="title">用户注册</view>
|
|
|
+ <uni-forms class="form" :modelValue="dataForm" :rules="rules" validate-trigger="bind" label-width="80px">
|
|
|
+ <uni-forms-item name="userName" label="用户名">
|
|
|
+ <uni-easyinput type="text" v-model="dataForm.userName" placeholder="用户名" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item name="nickName" label="昵称">
|
|
|
+ <uni-easyinput type="text" v-model="dataForm.nickName" placeholder="昵称" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item name="password" label="密码">
|
|
|
+ <uni-easyinput type="password" v-model="dataForm.password" placeholder="密码" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item name="corfirmPassword" label="确认密码">
|
|
|
+ <uni-easyinput type="password" v-model="dataForm.corfirmPassword" placeholder="确认密码" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <button class="btn-submit" @click="submit" type="warn">注册并登陆</button>
|
|
|
+ </uni-forms>
|
|
|
+ <navigator class="nav-login" url="/pages/login/login" render-link="true" hover-class="other-navigator-hover">
|
|
|
+ 返回登陆页面
|
|
|
+ </navigator>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dataForm: {
|
|
|
+ userName: '',
|
|
|
+ nickName: '',
|
|
|
+ password: '',
|
|
|
+ corfirmPassword: ''
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ userName: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ errorMessage: '请输入用户名',
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ nickName: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ errorMessage: '请输入昵称',
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ password: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ errorMessage: '请输入密码',
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ corfirmPassword: {
|
|
|
+ rules: [{
|
|
|
+ required: true,
|
|
|
+ errorMessage: '请输入确认密码',
|
|
|
+ }, {
|
|
|
+ validateFunction: (rule, value, data, callback) => {
|
|
|
+ console.log("validateFunction")
|
|
|
+ if (data.password != value) {
|
|
|
+ callback('两次密码输入不一致')
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ submit() {
|
|
|
+ this.$http({
|
|
|
+ url: '/register',
|
|
|
+ data: this.dataForm,
|
|
|
+ method: 'POST'
|
|
|
+ }).then(() => {
|
|
|
+ uni.showToast({
|
|
|
+ title: "注册成功",
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ this.login();
|
|
|
+ })
|
|
|
+ },
|
|
|
+ login() {
|
|
|
+ const loginForm = {
|
|
|
+ terminal: this.$enums.TERMINAL_TYPE.APP,
|
|
|
+ userName: this.dataForm.userName,
|
|
|
+ password: this.dataForm.password
|
|
|
+ }
|
|
|
+ this.$http({
|
|
|
+ url: '/login',
|
|
|
+ data: loginForm,
|
|
|
+ method: 'POST'
|
|
|
+ }).then((loginInfo) => {
|
|
|
+ console.log("登录成功,自动跳转到聊天页面...")
|
|
|
+ uni.setStorageSync("userName", loginForm.userName);
|
|
|
+ uni.setStorageSync("password", loginForm.password);
|
|
|
+ loginInfo.expireTime = new Date().getTime() + loginInfo.refreshTokenExpiresIn * 1000;
|
|
|
+ uni.setStorageSync("loginInfo", loginInfo);
|
|
|
+ // 调用App.vue的初始化方法
|
|
|
+ getApp().init()
|
|
|
+ // 跳转到聊天页面
|
|
|
+ uni.switchTab({
|
|
|
+ url: "/pages/chat/chat"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .register {
|
|
|
+ .title {
|
|
|
+ padding-top: 150rpx;
|
|
|
+ padding-bottom: 100rpx;
|
|
|
+ color: royalblue;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 60rpx;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+
|
|
|
+ .form {
|
|
|
+ padding: 50rpx;
|
|
|
+
|
|
|
+ .btn-submit {
|
|
|
+ margin-top: 80rpx;
|
|
|
+ border-radius: 50rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .nav-login {
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ bottom: 100rpx;
|
|
|
+ color: royalblue;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 32rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
xsx