Skip to content

C
CFFP-HB
Commit 8b0c76ea by sunchao
Options

登陆注册

parent e6d1d1d5
Showing with 150 additions and 71 deletions
api/api.ts
...@@ -28,6 +28,10 @@ export default { ...@@ -28,6 +28,10 @@ export default {
//注册接口 //注册接口
register(params){ register(params){
return request(`${cffpURL}/user/register`, "POST", 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 { ...@@ -3,6 +3,11 @@ export default {
const MOBILE_REGEXP = /^(1)\d{10}$/; const MOBILE_REGEXP = /^(1)\d{10}$/;
return MOBILE_REGEXP.test(no); 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){ errorDialog(type,content){
// type 1 必填项校验 2 规则校验 // type 1 必填项校验 2 规则校验
......
components/login/login.vue
<template> <template>
<view class="wrapper"> <view class="wrapper">
<view class="logo"> <view class="logo">
<img src="/static/logo.png" alt="logo" srcset=""> <img src="/static/cffp_logo.jpg" alt="logo" srcset="">
<view>欢迎登录使用CFFP</view> <view>欢迎登录使用CFFP</view>
</view> </view>
<view class="content"> <view class="content">
...@@ -21,39 +21,41 @@ ...@@ -21,39 +21,41 @@
/> />
</view> </view>
<view class="inputItem" v-if="loginType === 'codelogin' || loginType==='register' || loginType === 'resetpw'"> <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> <text @click="sendMessage()" :class="{'grey':disabledSendBtn}">{{sendCodeHtml}}</text>
</view> </view>
<view class="inputItem" v-if="loginType === 'pwlogin' || loginType==='register'"> <view class="inputItem" v-if="loginType === 'pwlogin' || loginType==='register' || loginType==='agentlogin'">
<input class="uni-input" type="text" name="password" placeholder="输入密码" v-if="!passwordFlag"/> <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"/> <input class="uni-input" type="text" password name="password" placeholder="输入密码" v-if="passwordFlag" v-model="form.password"/>
<text v-if="passwordFlag" @click="passwordFlag=false">显示密码</text> <text v-if="!passwordFlag" @click="passwordFlag=true">显示密码</text>
<text v-if="!passwordFlag" @click="passwordFlag=true">不显示密码</text> <text v-if="passwordFlag" @click="passwordFlag=false">不显示密码</text>
</view> </view>
<!--重置密码--> <!--重置密码-->
<view v-if="loginType === 'resetpw'"> <view v-if="loginType === 'resetpw'">
<view class="inputItem" > <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>
<view class="inputItem" > <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>
</view> </view>
</form> </form>
<view class="agree" v-if="loginType!='resetpw'"> <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>
<view class="login_btn" @click="loginInCheck()()" v-if="loginType!='resetpw'"> <view class="login_btn" @click="loginInCheck()" v-if="loginType!='resetpw'">
{{loginType=='register'?'注册':'登录'}} {{loginType=='register'?'注册':'登录'}}
{{loginType}} {{loginType}}
</view> </view>
<view class="login_btn" v-if="loginType=='resetpw'"> <view class="login_btn" v-if="loginType=='resetpw'" @click="loginInCheck()">
保存 保存
</view> </view>
<view class="login_type" v-if="loginType!='resetpw'"> <view class="login_type" v-if="loginType!='resetpw'">
<text @click="getLoginType()">{{(loginType=='pwlogin' || loginType=='register')?'验证码登录':'密码登录'}}</text> <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>
<view v-if="loginType!='resetpw'"> <view v-if="loginType!='resetpw'">
<view class="other_login"> <view class="other_login">
...@@ -62,7 +64,7 @@ ...@@ -62,7 +64,7 @@
<text class="text_line"></text> <text class="text_line"></text>
</view> </view>
<view class="login_type"> <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> <text @click="loginType = 'agentlogin';loginTypeName = '管理账号登录';">代理商</text>
</view> </view>
</view> </view>
...@@ -92,22 +94,18 @@ ...@@ -92,22 +94,18 @@
}, },
disabledSendBtn:false, disabledSendBtn:false,
invitation_code:null, invitation_code:null,
account:null account:null,
doublePassword:null,
agreeFlag:false,
userId:null
} }
}, },
methods: { methods: {
formReset: function(e) {
console.log('清空数据')
},
getLoginType(){ getLoginType(){
this.loginType==='codelogin'?this.loginType='pwlogin':this.loginType='codelogin'; this.loginType==='codelogin'?this.loginType='pwlogin':this.loginType='codelogin';
this.loginTypeName = this.loginType =='codelogin'?'验证码登录':'密码登录'; this.loginTypeName = this.loginType =='codelogin'?'验证码登录':'密码登录';
this.loginType==='codelogin'?this.form.password=null:this.form.code=null; 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(){ sendMessage(){
const params = { const params = {
mobileNo:this.form.mobile, mobileNo:this.form.mobile,
...@@ -140,16 +138,15 @@ ...@@ -140,16 +138,15 @@
}, 1000); }, 1000);
}, },
loginIn(loginType){ loginIn(loginType){
console.log(loginType)
const params = { const params = {
loginType:loginType, loginType:loginType,
...this.form ...this.form
} }
console.log(params)
api.loginVerification(params).then((res)=>{ api.loginVerification(params).then((res)=>{
if(res['success']){ if(res['success']){
this.userId = res['data']['userId'];
uni.setStorageSync('isLogin',1) uni.setStorageSync('isLogin',1)
uni.navigateTo({ uni.switchTab({
url:'/pages/index/index' url:'/pages/index/index'
}) })
}else{ }else{
...@@ -169,8 +166,9 @@ ...@@ -169,8 +166,9 @@
console.log(params) console.log(params)
api.register(params).then((res)=>{ api.register(params).then((res)=>{
if(res['success']){ if(res['success']){
this.userId = res['data']['userId'];
uni.setStorageSync('isLogin',1) uni.setStorageSync('isLogin',1)
uni.navigateTo({ uni.switchTab({
url:'/pages/index/index' url:'/pages/index/index'
}) })
}else{ }else{
...@@ -182,6 +180,35 @@ ...@@ -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(){ loginInCheck(){
//只有代理商登录不需要填写手机号 //只有代理商登录不需要填写手机号
if(this.loginType !== 'agentlogin'){ if(this.loginType !== 'agentlogin'){
...@@ -193,35 +220,78 @@ ...@@ -193,35 +220,78 @@
common.errorDialog(2,'手机号格式填写错误'); common.errorDialog(2,'手机号格式填写错误');
return false; return false;
} }
if(this.loginType === 'codelogin'){ if(this.loginType === 'codelogin' || this.loginType === 'register' || this.loginType ==='resetpw'){
if(!this.form.code){ if(!this.form.code){
common.errorDialog(1,'请输入验证码'); common.errorDialog(1,'请输入验证码');
return false; return false;
} }
this.loginIn(3)
} }
if(this.loginType === 'password'){ if(this.loginType === 'pwlogin' || this.loginType === 'register' || this.loginType ==='resetpw'){
if(!this.form.code){ if(!this.form.password){
common.errorDialog(1,'请输入密码'); common.errorDialog(1,'请输入密码');
return false; 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.account){
if(!this.form.code){ common.errorDialog(1,'请输入账号');
common.errorDialog(1,'请输入密码');
return false; 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) 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() { mounted() {
} }
} }
...@@ -240,6 +310,9 @@ ...@@ -240,6 +310,9 @@
margin-top: 40rpx; margin-top: 40rpx;
font-size: 40rpx; font-size: 40rpx;
} }
img{
border-radius: 15rpx;
}
} }
.content{ .content{
background-color: #fff; background-color: #fff;
......
pages.json
...@@ -13,42 +13,40 @@ ...@@ -13,42 +13,40 @@
"topWindow": false, "topWindow": false,
"navigationBarTitleText": "CFFP" "navigationBarTitleText": "CFFP"
} }
}, }
// {
// "path": "pages/index/index",
// "style": {
// "topWindow": false,
// "navigationBarTitleText": "CFFP"
// }
// },
], ],
// "tabBar": { "tabBar": {
// "color": "#7A7E83", // tab 上的文字默认颜色 "color": "#7A7E83", // tab 上的文字默认颜色
// "selectedColor": "#3cc51f", // tab 上的文字选中时的颜色 "selectedColor": "#7A7E83", // tab 上的文字选中时的颜色
// "borderStyle": "black", // tabbar 上边框的颜色，可选值 black/white "borderStyle": "black", // tabbar 上边框的颜色，可选值 black/white
// "backgroundColor": "#ffffff", // tab 的背景色 "backgroundColor": "#ffffff", // tab 的背景色
// "list": [{ // 最少2个、最多5个 tab "fontSize":"28rpx",
// "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义 "iconWidth":"60rpx",
// "iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px "height":"120rpx",
// "selectedIconPath": "static/tabbar/home-active.png", // 选中时的图片路径 "list": [{ // 最少2个、最多5个 tab
// "text": "首页" // tab 上按钮文字 "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// }, { // 最少2个、最多5个 tab "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 中先定义 // "pagePath": "pages/index/index", // 页面路径，必须在 pages 中先定义
// "iconPath": "static/tabbar/home.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px // "iconPath": "static/tabbar/sfp.png", // 图片路径，icon 大小限制为40kb，建议尺寸为 81px * 81px
// "selectedIconPath": "static/tabbar/home-active.png", // 选中时的图片路径 // "selectedIconPath": "static/tabbar/sfp_active.png", // 选中时的图片路径
// "text": "SFP智能财策" // tab 上按钮文字 // "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": "我的"
// }]
// }, // },
{ // 最少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": { "globalStyle": {
"navigationBarTextStyle": "black", "navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app", "navigationBarTitleText": "uni-app",
......
pages/index/index.vue
<template> <template>
<view class="content"> <view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area"> <view class="text-area">
<text class="title">{{title}}</text> <text class="title">{{title}}</text>
</view> </view>
......
util/router.js
//只要是未登录状态，想要跳转到名单内的路径时，直接跳到登录页 //只要是未登录状态，想要跳转到名单内的路径时，直接跳到登录页
// 页面白名单，不受拦截 // 页面白名单，不受拦截
const whiteList = [ const whiteList = [
'/components/login/login', '/components/login/login'
'/pages/index/index'
] ]
export default function initApp(){ export default function initApp(){
uni.addInterceptor('navigateTo', { 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