修改注册登录验证模块

Signed-off-by: AnHanTech <admin@xixingwl.cn>
This commit is contained in:
AnHanTech
2023-02-09 01:11:02 +08:00
parent c6caad4bc8
commit d54351449c
9 changed files with 2087 additions and 19 deletions

View File

@@ -1,29 +1,88 @@
<template>
<view>
<button @click="open">关闭</button>
<uni-popup ref="popup" :mask-click="false" type="bottom">
<text>Popup</text>
<uni-popup ref="popupLogin" :mask-click="false" type="bottom">
<view style="padding: 35rpx; background-color: aliceblue;">
<uni-forms ref="form" :modelValue="formData" :rules="rules">
<uni-forms-item label="姓名" name="name">
<uni-easyinput type="text" v-model="formData.name" placeholder="请输入姓名" />
</uni-forms-item>
<uni-forms-item label="邮箱" name="email">
<uni-easyinput type="text" v-model="formData.email" placeholder="请输入用户名" />
</uni-forms-item>
</uni-forms>
<button @click="submit">Submit</button>
<view style="display:flex;align-items:center;justify-content:space-evenly; padding: 30rpx;">
<uni-icons type="weixin" color="#00aa00" size="48"></uni-icons>
<uni-icons type="qq" color="#686868" size="48"></uni-icons>
</view>
</view>
</uni-popup>
<uni-popup ref="popupReg" :mask-click="false" type="bottom">
<view style="padding: 35rpx; background-color: aliceblue;">
<text>用户注册</text>
<uni-forms ref="form" :modelValue="formDataReg" :rules="rules">
<uni-forms-item label="姓名" name="avatarUrl">
<button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<image class="avatar" :src="formDataReg.avatarUrl"
style="width: 320rpx; height: 320rpx; margin: auto;"></image>
</button>
</uni-forms-item>
<uni-forms-item label="姓名" name="nickname">
<uni-easyinput type="nickname" placeholder="请输入昵称" v-model="formDataReg.nickname">
</uni-easyinput>
</uni-forms-item>
<uni-forms-item label="姓名" name="mobile">
<uni-easyinput placeholder="请输入昵称" v-model="formDataReg.mobile"></uni-easyinput>
<button class="avatar-wrapper" open-type="chooseAvatar" @tap="onChooseAvatar">
<image class="avatar" :src="avatarUrl" style="width: 320rpx; height: 320rpx; margin: auto;"></image>
</button>
<uni-easyinput placeholder="请输入昵称" v-model="nickname" type="nickname"></uni-easyinput>
<button v-show="showPhone" type="primary" block open-type="getPhoneNumber" @getphonenumber="getPhone">
授权电话
</button>
<button v-show="showPhone" type="primary" block open-type="getPhoneNumber"
@getphonenumber="getPhone">
授权电话
</button>
</uni-forms-item>
</uni-forms>
<button @click="submit">Submit</button>
</view>
</uni-popup>
</view>
</template>
<script>
export default {
name: "ywx-auth-model",
name: "ywxAuthModel",
data() {
return {
avatarUrl: 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0',
// 表单数据
formData: {
name: 'LiMing',
email: 'dcloud@email.com'
},
formDataReg: {
nickname: '',
avatarUrl: 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0',
},
rules: {
// 对name字段进行必填验证
name: {
rules: [{
required: true,
errorMessage: '请输入姓名',
},
{
minLength: 3,
maxLength: 5,
errorMessage: '姓名长度在 {minLength} 到 {maxLength} 个字符',
}
]
},
// 对email字段进行必填验证
email: {
rules: [{
format: 'email',
errorMessage: '请输入正确的邮箱地址',
}]
}
},
openid: "",
loginstate: "0",
openid: "",
@@ -31,7 +90,7 @@
terminal: "",
osVersion: "",
phoneNumber: "",
showPhone:false,
showPhone: false,
showModal: false, //定义登录弹窗
}
},
@@ -42,10 +101,11 @@
const {
avatarUrl
} = e.detail
this.avatarUrl = avatarUrl
this.formDataReg.avatarUrl = avatarUrl
},
open() {
this.$refs.popup.open('top')
this.$refs.popupReg.open()
},
close() {
this.$refs.popup.close()