XiXingWL/AnHanNET-UniAPP
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善登录 注册 1

Browse Source 
Signed-off-by: AnHanTech <admin@xixingwl.cn>
This commit is contained in:
AnHanTech
2023-02-09 21:00:19 +08:00
parent e25dce6a72
commit 450c6d021e
1 changed files with 95 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
components/ywx-auth-model/ywx-auth-model.vue
View File

@@ -1,54 +1,61 @@
<template> <template>
<view> <view>
<button @click="open">关闭</button> <button @click="open">关闭</button>
<uni-popup ref="popupLogin" :mask-click="false" type="bottom"> <!-- <uni-popup ref="popupLogin" :mask-click="false" type="bottom"> -->
<view class="content"> <view class="content">
<uni-forms ref="form" :modelValue="formData" :rules="rules"> <uni-forms ref="loginform" :modelValue="formData" :rules="rules" errShowType="modal">
<uni-forms-item label="姓名" name="name"> <uni-forms-item name="account">
<uni-easyinput type="text" v-model="formData.name" placeholder="请输入姓名" /> <uni-easyinput prefixIcon="person" type="text" v-model="formData.account" placeholder="请输入账号" />
</uni-forms-item> </uni-forms-item>
<uni-forms-item label="邮箱" name="email"> <uni-forms-item name="password">
<uni-easyinput type="text" v-model="formData.email" placeholder="请输入用户名" /> <uni-easyinput prefixIcon="locked" type="password" v-model="formData.password"
placeholder="请输入密码" />
</uni-forms-item> </uni-forms-item>
</uni-forms> </uni-forms>
<button @click="submit">Submit</button> <button @click="submitLogin">立 即 登 录</button>
<view class="footer"> <view class="footer">
<uni-icons type="weixin" color="#00aa00" size="48"></uni-icons> <uni-icons type="weixin" color="#00aa00" size="48"></uni-icons>
<uni-icons type="qq" color="#686868" size="48"></uni-icons> <uni-icons type="qq" color="#686868" size="48"></uni-icons>
</view> </view>
</view> </view>
</uni-popup> <!-- </uni-popup> -->
<!-- <uni-popup ref="popupReg" :mask-click="false" type="bottom"> --> <uni-popup ref="popupReg" :mask-click="false" type="bottom">
<view class="content"> <view class="content">
<text>用户注册</text> <text>用户注册</text>
<uni-forms ref="form" :modelValue="formDataReg" :rules="rules"> <uni-forms ref="regForm" :modelValue="formDataReg" :rules="rules" errShowType="modal">
<uni-forms-item label="头像" name="avatarUrl" labelWidth="80"> <uni-forms-item name="avatarUrl">
<button type="primary" class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" plain> <button type="primary" class="avatar-wrapper" open-type="chooseAvatar"
@chooseavatar="onChooseAvatar" plain>
<image class="avatar" :src="formDataReg.avatarUrl"></image> <image class="avatar" :src="formDataReg.avatarUrl"></image>
</button> </button>
</uni-forms-item> </uni-forms-item>
<uni-forms-item label="昵称" name="nickname" labelWidth="80"> <uni-forms-item name="nickname">
<uni-easyinput type="nickname" placeholder="请输入昵称" v-model="formDataReg.nickname" suffixIcon="phone"> <uni-easyinput prefixIcon="person" type="nickname" placeholder="请输入 您的昵称"
v-model="formDataReg.nickname">
</uni-easyinput> </uni-easyinput>
</uni-forms-item> </uni-forms-item>
<uni-forms-item label="电话" name="mobile" labelWidth="80"> <uni-forms-item name="mobile">
<uni-easyinput placeholder="请输入昵称" v-model="formDataReg.mobile" suffixIcon="phone"></uni-easyinput> <uni-easyinput prefixIcon="phone" placeholder="请输入 手机号" v-model="formDataReg.mobile">
<button size="mini" type="primary" open-type="getPhoneNumber" </uni-easyinput>
@getphonenumber="getPhoneNumber" plain>使用微信手机号</button> <button size="mini" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
plain>使用微信手机号</button>
</uni-forms-item> </uni-forms-item>
<uni-forms-item label="密码" name="password" labelWidth="80"> <uni-forms-item name="password">
<uni-easyinput type="password" placeholder="请输入密码" v-model="formDataReg.password" suffixIcon="phone"> <uni-easyinput prefixIcon="locked" type="password" placeholder="请输入 用户密码"
v-model="formDataReg.password" suffixIcon="phone">
</uni-easyinput> </uni-easyinput>
</uni-forms-item> </uni-forms-item>
</uni-forms> </uni-forms>
<button @click="submit">Submit</button> <button @click="submitReg">立 即 注 册</button>
</view> </view>
<!-- </uni-popup> --> </uni-popup>
</view> </view>
</template> </template>
<script> <script>
import {mapGetters} from 'vuex' import {
mapGetters
} from 'vuex'
export default { export default {
name: "ywxAuthModel", name: "ywxAuthModel",
computed: { computed: {
@@ -61,8 +68,8 @@
return { return {
// 表单数据 // 表单数据
formData: { formData: {
name: 'LiMing', account: 'LiMing',
email: 'dcloud@email.com' password: 'dcloud@email.com'
}, },
formDataReg: { formDataReg: {
nickname: '', nickname: '',
@@ -113,6 +120,30 @@
this.formDataReg.avatarUrl = avatarUrl this.formDataReg.avatarUrl = avatarUrl
}, },
submitLogin(loginform) {
let self = this;
this.$refs.loginform.validate().then(res => {
console.log('表单数据信息：', res);
self.$ajax.post("User/login", self.formData)
.then(e => {
if(e.code == 0)
uni.reLaunch({
url: "/pages/tabbar/home/home"
})
});
}).catch(err => {
console.log('表单错误信息：', err);
})
},
submitReg(loginform) {
let self = this;
this.$refs.loginform.validate().then(res => {
console.log('表单数据信息：', res);
}).catch(err => {
console.log('表单错误信息：', err);
})
},
open() { open() {
this.$refs.popupReg.open() this.$refs.popupReg.open()
}, },
@@ -143,7 +174,7 @@
<style> <style>
.content { .content {
padding: 35rpx; padding: 55rpx;
background-color: aliceblue; background-color: aliceblue;
} }
@@ -153,6 +184,7 @@
justify-content: space-evenly; justify-content: space-evenly;
padding: 30rpx; padding: 30rpx;
} }
.avatar-wrapper { .avatar-wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
@@ -160,9 +192,20 @@
padding: 20rpx 5rpx; padding: 20rpx 5rpx;
} }
.avatar { .avatar {
width: 260rpx; width: 260rpx;
height: 260rpx; height: 260rpx;
margin: auto; margin: auto;
} }
.uni-forms-item button {
line-height: 36rpx;
}
.uni-forms-item {
position: relative;
display: flex;
margin-bottom: 10rpx;
}
</style> </style>