Skip to content

C
CFFP-HB
Commit 8b0c76ea by sunchao
Options

登陆注册

parent e6d1d1d5
Showing with 156 additions and 77 deletions
api/api.ts
......@@ -28,6 +28,10 @@ export default {
//注册接口
register(params){
return request(`${cffpURL}/user/register`, "POST", params)
},
//重置密码
resetPassword(){
return request(`${cffpURL}/user/resetPassword`, "POST", params)
}
}
common/common.ts
......@@ -3,6 +3,11 @@ export default {
const MOBILE_REGEXP = /^(1)\d{10}$/;
return MOBILE_REGEXP.test(no);
},
passwordValid(no) {
const PASSWOED_REGEXP = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;
return PASSWOED_REGEXP.test(no);
},
// 封装报错弹窗
errorDialog(type,content){
// type 1 必填项校验 2 规则校验
......
components/login/login.vue
<template>
<view class="wrapper">
<view class="logo">
<img src="/static/logo.png" alt="logo" srcset="">
<img src="/static/cffp_logo.jpg" alt="logo" srcset="">
<view>欢迎登录使用CFFP</view>
</view>
<view class="content">
......@@ -21,39 +21,41 @@
/>
</view>
<view class="inputItem" v-if="loginType === 'codelogin' || loginType==='register' || loginType === 'resetpw'">
<input class="uni-input" name="code" placeholder="输入验证码" v-model="form.code" type="number"/>
<input class="uni-input" name="code" placeholder="输入验证码" v-model="form.code" type="number" maxlength="6"/>
<text @click="sendMessage()" :class="{'grey':disabledSendBtn}">{{sendCodeHtml}}</text>
</view>
<view class="inputItem" v-if="loginType === 'pwlogin' || loginType==='register'">
<input class="uni-input" type="text" name="password" placeholder="输入密码" v-if="!passwordFlag"/>
<input class="uni-input" type="text" password name="password" placeholder="输入密码" v-if="passwordFlag"/>
<text v-if="passwordFlag" @click="passwordFlag=false">显示密码</text>
<text v-if="!passwordFlag" @click="passwordFlag=true">不显示密码</text>
<view class="inputItem" v-if="loginType === 'pwlogin' || loginType==='register' || loginType==='agentlogin'">
<input class="uni-input" type="text" name="password" placeholder="输入密码" v-if="!passwordFlag" v-model="form.password"/>
<input class="uni-input" type="text" password name="password" placeholder="输入密码" v-if="passwordFlag" v-model="form.password"/>
<text v-if="!passwordFlag" @click="passwordFlag=true">显示密码</text>
<text v-if="passwordFlag" @click="passwordFlag=false">不显示密码</text>
</view>
<!--重置密码-->
<view v-if="loginType === 'resetpw'">
<view class="inputItem" >
<input class="uni-input" type="text" password name="password" placeholder="密码(6-20位字母数字组合)" />
<input class="uni-input" type="text" password name="password" placeholder="密码(6-20位字母数字组合)" v-model="form.password"/>
</view>
<view class="inputItem" >
<input class="uni-input" type="text" password name="password" placeholder="再次确认密码" />
<input class="uni-input" type="text" password name="password" placeholder="再次确认密码" v-model="doublePassword"/>
</view>
</view>
</form>
<view class="agree" v-if="loginType!='resetpw'">
<icon :type="radioUnselect" size="26"/><text>已阅读并同意</text><a href="#">银盾保险经纪服务协议</a><text>和</text><a href="">隐私政策</a>
<label class="radio"><radio :checked="agreeFlag" @click="agreeFlag=!agreeFlag"/>选中</label>
<text>已阅读并同意</text><a href="#">银盾保险经纪服务协议</a><text>和</text><a href="">隐私政策</a>
</view>
<view class="login_btn" @click="loginInCheck()()" v-if="loginType!='resetpw'">
<view class="login_btn" @click="loginInCheck()" v-if="loginType!='resetpw'">
{{loginType=='register'?'注册':'登录'}}
{{loginType}}
</view>
<view class="login_btn" v-if="loginType=='resetpw'">
<view class="login_btn" v-if="loginType=='resetpw'" @click="loginInCheck()">
保存
</view>
<view class="login_type" v-if="loginType!='resetpw'">
<text @click="getLoginType()">{{(loginType=='pwlogin' || loginType=='register')?'验证码登录':'密码登录'}}</text>
<text @click="register()">{{loginType=='codelogin'?'立即注册':'忘记密码'}}</text>
<text v-if="loginType==='codelogin'" @click="loginType='register';loginTypeName='注册'">立即注册</text>
<text v-if="loginType!=='codelogin'" @click="loginType='resetpw';loginTypeName='重置密码'">忘记密码</text>
</view>
<view v-if="loginType!='resetpw'">
<view class="other_login">
......@@ -62,7 +64,7 @@
<text class="text_line"></text>
</view>
<view class="login_type">
<text @click="loginType='visitor';loginIn(1)">游客</text>
<text @click="loginType='visitor';initForm();loginIn(1)">游客</text>
<text @click="loginType = 'agentlogin';loginTypeName = '管理账号登录';">代理商</text>
</view>
</view>
......@@ -92,22 +94,18 @@
},
disabledSendBtn:false,
invitation_code:null,
account:null
account:null,
doublePassword:null,
agreeFlag:false,
userId:null
}
},
methods: {
formReset: function(e) {
console.log('清空数据')
},
getLoginType(){
this.loginType==='codelogin'?this.loginType='pwlogin':this.loginType='codelogin';
this.loginTypeName = this.loginType =='codelogin'?'验证码登录':'密码登录';
this.loginType==='codelogin'?this.form.password=null:this.form.code=null;
},
register(){
this.loginType==='register'?this.loginType='resetpw':this.loginType='register';
this.loginTypeName = this.loginType =='register'?'注册':'重置密码';
},
sendMessage(){
const params = {
mobileNo:this.form.mobile,
......@@ -140,16 +138,15 @@
}, 1000);
},
loginIn(loginType){
console.log(loginType)
const params = {
loginType:loginType,
...this.form
}
console.log(params)
api.loginVerification(params).then((res)=>{
if(res['success']){
this.userId = res['data']['userId'];
uni.setStorageSync('isLogin',1)
uni.navigateTo({
uni.switchTab({
url:'/pages/index/index'
})
}else{
......@@ -169,8 +166,9 @@
console.log(params)
api.register(params).then((res)=>{
if(res['success']){
this.userId = res['data']['userId'];
uni.setStorageSync('isLogin',1)
uni.navigateTo({
uni.switchTab({
url:'/pages/index/index'
})
}else{
......@@ -182,6 +180,35 @@
}
})
},
resetPassword(){
const params = {
...this.form
}
console.log(params)
api.resetPassword(params).then((res)=>{
if(res['success']){
uni.showToast({
title: '密码重置成功，请重新登录',
duration: 5000,
icon: 'none'
})
//重置密码后需要密码登录
this.loginType = 'pwlogin';
this.loginTypeName = '密码登录';
this.form = {
mobile:null,
code:null,
password:null,
}
}else{
uni.showToast({
title: res['message'],
duration: 2000,
icon: 'none'
})
}
})
},
loginInCheck(){
//只有代理商登录不需要填写手机号
if(this.loginType !== 'agentlogin'){
......@@ -193,34 +220,77 @@
common.errorDialog(2,'手机号格式填写错误');
return false;
}
if(this.loginType === 'codelogin'){
if(this.loginType === 'codelogin' || this.loginType === 'register' || this.loginType ==='resetpw'){
if(!this.form.code){
common.errorDialog(1,'请输入验证码');
return false;
}
this.loginIn(3)
}
if(this.loginType === 'password'){
if(!this.form.code){
if(this.loginType === 'pwlogin' || this.loginType === 'register' || this.loginType ==='resetpw'){
if(!this.form.password){
common.errorDialog(1,'请输入密码');
return false;
}
this.loginIn(2)
if(!common.passwordValid(this.form.password)){
common.errorDialog(2,'请输入6-12位数字字母组合');
return false;
}
}
if(this.loginType === 'register'){
if(this.loginType ==='resetpw'){
if(this.form.password !== this.doublePassword){
common.errorDialog(2,'两次密码不一致');
return false;
}
}
}
if(this.loginType === 'agentlogin'){
}else{
if(!this.account){
if(!this.form.code){
common.errorDialog(1,'请输入密码');
common.errorDialog(1,'请输入账号');
return false;
}
if(!common.passwordValid(this.account)){
common.errorDialog(2,'账号为6-12位数字密码组合');
return false;
}
if(!this.form.password){
common.errorDialog(1,'请输入密码');
return false;
}else if(!common.passwordValid(this.form.password)){
common.errorDialog(2,'请输入6-12位数字密码组合');
return false;
}
}
//代理商登录
this.loginIn(4)
}
}
if(!this.agreeFlag){
uni.showToast({
title: '请阅读并勾选银盾保险经纪服务协议和隐私条款',
duration: 5000,
icon: 'none'
})
return false;
}
if(this.loginType === 'codelogin'){
//验证码登录
this.loginIn(3)
}else if(this.loginType === 'pwlogin'){
//密码登录
this.loginIn(2)
}else if(this.loginType === 'register'){
//注册
this.registerIn()
}else if(this.loginType === 'resetpw'){
//重置密码
this.resetPassword()
}
},
initForm(){
this.form = {
mobile:null,
code:null,
password:null,
}
},
},
mounted() {
}
......@@ -240,6 +310,9 @@
margin-top: 40rpx;
font-size: 40rpx;
}
img{
border-radius: 15rpx;
}
}
.content{
background-color: #fff;
......
pages.json
......@@ -13,42 +13,40 @@
"topWindow": false,
"navigationBarTitleText": "CFFP"
}
},
// {
// "path": "pages/index/index",
// "style": {
// "topWindow": false,
// "navigationBarTitleText": "CFFP"
// }
// },
}
],
// "tabBar": {
// "color": "#7A7E83", // tab 上的文字默认颜色
// "selectedColor": "#3cc51f", // tab 上的文字选中时的颜色
// "borderStyle": "black", // tabbar 上边框的颜色，可选值 black/white
// "backgroundColor": "#ffffff", // tab 的背景色
// "list": [{ // 最少2个、最多5个 tab
// "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// "iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
// "selectedIconPath": "static/tabbar/home-active.png", // 选中时的图片路径
// "text": "首页" // tab 上按钮文字
// }, { // 最少2个、最多5个 tab
// "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// "iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
// "selectedIconPath": "static/tabbar/home-active.png", // 选中时的图片路径
// "text": "SFP智能财策" // tab 上按钮文字
// },{ // 最少2个、最多5个 tab
// "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// "iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
// "selectedIconPath": "static/tabbar/home-active.png", // 选中时的图片路径
// "text": "CFFP认证" // tab 上按钮文字
// },{
// "pagePath": "pages/my/my",
// "iconPath": "static/tabbar/my.png",
// "selectedIconPath": "static/tabbar/my-active.png",
// "text": "我的"
// }]
// },
"tabBar": {
"color": "#7A7E83", // tab 上的文字默认颜色
"selectedColor": "#7A7E83", // tab 上的文字选中时的颜色
"borderStyle": "black", // tabbar 上边框的颜色，可选值 black/white
"backgroundColor": "#ffffff", // tab 的背景色
"fontSize":"28rpx",
"iconWidth":"60rpx",
"height":"120rpx",
"list": [{ // 最少2个、最多5个 tab
"pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
"iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
"selectedIconPath": "static/tabbar/home_active.png", // 选中时的图片路径
"text": "首页" // tab 上按钮文字
},
// { // 最少2个、最多5个 tab
// "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// "iconPath": "static/tabbar/sfp.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
// "selectedIconPath": "static/tabbar/sfp_active.png", // 选中时的图片路径
// "text": "SFP智能财策" // tab 上按钮文字
// },
{ // 最少2个、最多5个 tab
"pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
"iconPath": "static/tabbar/cffp.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
"selectedIconPath": "static/tabbar/cffp_active.png", // 选中时的图片路径
"text": "CFFP认证" // tab 上按钮文字
},{
"pagePath": "pages/index/index",
"iconPath": "static/tabbar/my.png",
"selectedIconPath": "static/tabbar/my_active.png",
"text": "我的"
}]
},
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
......
pages/index/index.vue
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
......
util/router.js
//只要是未登录状态，想要跳转到名单内的路径时，直接跳到登录页
// 页面白名单，不受拦截
const whiteList = [
'/components/login/login',
'/pages/index/index'
'/components/login/login'
]
export default function initApp(){
uni.addInterceptor('navigateTo', {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment