Commit 27ca2797 by 梁建民

登录

parent f4f243b0
{ {
"pages": [ "pages": [
"pages/person/verifycode/index",
"pages/person/login/index", "pages/person/login/index",
"pages/person/auth/index", "pages/person/auth/index",
"pages/person/getphone/index", "pages/person/getphone/index",
"pages/person/agreement/index", "pages/person/agreement/index",
"pages/person/successfully/index", "pages/person/successfully/index",
"pages/person/register/index", "pages/person/register/index",
"pages/person/verifycode/index",
"pages/tab/home/home", "pages/tab/home/home",
"pages/form/good/index", "pages/form/good/index",
"pages/tab/good/good", "pages/tab/good/good",
......
const http = require('../../../utils/util.js'); const http = require('../../../utils/util.js');
import { apis } from '../../../utils/api.js'; import {
apis
} from '../../../utils/api.js';
Page({ Page({
...@@ -8,113 +10,237 @@ Page({ ...@@ -8,113 +10,237 @@ Page({
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
error:false, error: false,
visible_pwd:false, errorText: '',
passwordType: true visiblePwd: false,
passwordType: true,
mobileFlag: false,
passwordFlag: false,
disabled: false,
loading: false,
formData: {
mobile: '',
password: ''
}
}, },
/** /**
* 生命周期函数--监听页面加载 * 生命周期函数--监听页面加载
*/ */
onLoad: function(options) { onLoad: function (options) {
}, },
/** /**
* 生命周期函数--监听页面初次渲染完成 * 生命周期函数--监听页面初次渲染完成
*/ */
onReady: function() { onReady: function () {
}, },
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow: function() { onShow: function () {
}, },
/** /**
* 生命周期函数--监听页面隐藏 * 生命周期函数--监听页面隐藏
*/ */
onHide: function() { onHide: function () {
}, },
/** /**
* 生命周期函数--监听页面卸载 * 生命周期函数--监听页面卸载
*/ */
onUnload: function() { onUnload: function () {
}, },
/** /**
* 页面相关事件处理函数--监听用户下拉动作 * 页面相关事件处理函数--监听用户下拉动作
*/ */
onPullDownRefresh: function() { onPullDownRefresh: function () {
}, },
/** /**
* 页面上拉触底事件的处理函数 * 页面上拉触底事件的处理函数
*/ */
onReachBottom: function() { onReachBottom: function () {
}, },
/** /**
* 用户点击右上角分享 * 用户点击右上角分享
*/ */
onShareAppMessage: function() { onShareAppMessage: function () {
},
/**
* 校验字段
*/
calcForm: function (val, type) {
let mobile = val.mobile;
let password = val.password;
let reg_mobile = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;
let reg_pwd = /^[0-9A-Za-z]{6,}$/;
if (!mobile) {
this.setData({
error: true,
errorText: '手机号不能为空',
mobileFlag: true
});
return false;
}
if (!reg_mobile.test(mobile)) {
this.setData({
error: true,
errorText: '请填写正确的手机号',
mobileFlag: true
});
return false;
}
if (!password) {
this.setData({
error: true,
errorText: '密码不能为空',
mobileFlag: false,
passwordFlag: true
});
return false;
}
if (!reg_pwd.test(password)) {
this.setData({
error: true,
errorText: '密码由字母和数字组成,且不能少于6位',
mobileFlag: false,
passwordFlag: true
});
return false;
}
this.setData({
error: false,
errorText: '',
passwordFlag: false,
mobileFlag: false
});
return true;
},
/**
* 校验字段
*/
bindinputFn: function (e) {
if (e.currentTarget.dataset.type == 1) {
this.setData({
'formData.mobile': e.detail.value
});
this.calcForm({
mobile: this.data.formData.mobile
});
} else {
this.setData({
'formData.password': e.detail.value
});
this.calcForm({
mobile: this.data.formData.mobile,
password: this.data.formData.password
});
}
}, },
/** /**
* 登录 * 登录
*/ */
formSubmit: function (e) { formSubmit: function (e) {
http.postData(apis.authlogin, e.detail.value,function(res){
if (res.err_code === 0){
//注入token
wx.setStorage({
key: "access_token",
data: res.data.access_token
});
wx.switchTab({ var self=this;
url: '/pages/tab/home/home'
}) if (this.calcForm(e.detail.value)) {
self.setData({
disabled: true,
loading: true
});
http.postData(apis.authlogin, e.detail.value, function (res) {
}else{ if (res.err_code === 0) {
wx.showToast({ //注入token
title: res.err_msg, wx.setStorage({
icon: 'none', key: "access_token",
duration: 2000 data: res.data.access_token
});
wx.switchTab({
url: '/pages/tab/home/home'
})
} else {
wx.showToast({
title: res.err_msg,
icon: 'none',
duration: 2000
});
}
self.setData({
disabled: false,
loading: false
}); });
}
},true); });
}
}, },
/** /**
* 密码是否可见 * 密码是否可见
*/ */
toggleFn:function(e){ toggleFn: function (e) {
if (this.data['visible_pwd']) { if (this.data['visiblePwd']) {
this.setData({ this.setData({
visible_pwd: false, visiblePwd: false,
passwordType:true passwordType: true
}); });
} else { } else {
this.setData({ this.setData({
visible_pwd: true, visiblePwd: true,
passwordType:false passwordType: false
}); });
} }
......
...@@ -50,10 +50,10 @@ ...@@ -50,10 +50,10 @@
.login-button { .login-button {
height: 98rpx; height: 98rpx;
line-height: 98rpx; line-height: 98rpx;
background: rgba(13, 132, 209, 1); background: rgba(13, 132, 209, 1) !important;
box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3); box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3) !important;
border-radius: 8rpx; border-radius: 8rpx;
color: #fff; color: #fff !important;
font-size: 32rpx; font-size: 32rpx;
margin-top: 40rpx; margin-top: 40rpx;
} }
...@@ -74,6 +74,7 @@ ...@@ -74,6 +74,7 @@
font-size: 24rpx; font-size: 24rpx;
color: #ea1717; color: #ea1717;
margin-left: 15rpx; margin-left: 15rpx;
font-weight: 400;
} }
} }
.forget { .forget {
...@@ -81,8 +82,17 @@ ...@@ -81,8 +82,17 @@
color: #61a0f2; color: #61a0f2;
} }
} }
.placeholderClass{ .placeholderClass {
color: #ADB6BF; color: #adb6bf;
font-size: 32rpx; font-size: 32rpx;
} }
.inp-error {
border-bottom: 1px solid #ea1717;
.icon {
color: #ea1717;
}
input {
color: #ea1717;
}
}
} }
...@@ -8,10 +8,10 @@ ...@@ -8,10 +8,10 @@
<form bindsubmit="formSubmit"> <form bindsubmit="formSubmit">
<view class="inp-wrap row verCenter"> <view class="inp-wrap row verCenter {{mobileFlag ? 'inp-error':''}}">
<text class="icon iconfont iconiconxiantiaoshouji21"></text> <text class="icon iconfont iconiconxiantiaoshouji21"></text>
<view class="form-item-right row verCenter bothSide"> <view class="form-item-right row verCenter bothSide">
<input placeholder="请输入手机号" placeholder-class="placeholderClass" name="mobile" type="number"></input> <input placeholder="请输入手机号" placeholder-class="placeholderClass" name="mobile" type="number" data-type="1" bindinput='bindinputFn' bindblur='bindblurFn'></input>
<view class="areacode" bindtap="switchPrice"> <view class="areacode" bindtap="switchPrice">
<text class="tel-value">中国 + 86</text> <text class="tel-value">中国 + 86</text>
<text class="icon iconfont iconbianzu1"></text> <text class="icon iconfont iconbianzu1"></text>
...@@ -19,15 +19,15 @@ ...@@ -19,15 +19,15 @@
</view> </view>
</view> </view>
<view class="inp-wrap row verCenter"> <view class="inp-wrap row verCenter {{passwordFlag ? 'inp-error':''}}">
<text class="icon iconfont iconiconxiantiaoshouji2"></text> <text class="icon iconfont iconiconxiantiaoshouji2"></text>
<view class="form-item-right row verCenter bothSide"> <view class="form-item-right row verCenter bothSide">
<input placeholder="请输入密码" placeholder-class="placeholderClass" class="pwd" name="password" password='{{passwordType}}'></input> <input placeholder="请输入密码" placeholder-class="placeholderClass" class="pwd" name="password" data-type="2" password='{{passwordType}}' bindinput='bindinputFn' bindblur='bindblurFn'></input>
<block wx:if="{{visible_pwd}}"> <block wx:if="{{visiblePwd}}">
<text class="icon iconfont iconiconxiantiaoshouji3 pwd-ico" bindtap="toggleFn"></text> <text class="icon iconfont iconiconxiantiaoshouji3 pwd-ico" bindtap="toggleFn"></text>
</block> </block>
<block wx:else> <block wx:else>
<text class="icon iconfont iconiconxiantiaoshouji4 pwd-ico" bindtap="toggleFn"></text> <text class="icon iconfont iconiconxiantiaoshouji4 pwd-ico" bindtap="toggleFn"></text>
</block> </block>
</view> </view>
</view> </view>
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<view class="error"> <view class="error">
<block wx:if="{{error}}"> <block wx:if="{{error}}">
<text class="icon iconfont iconiconxiantiaoshouji1"></text> <text class="icon iconfont iconiconxiantiaoshouji1"></text>
<text class="txt">密码错误,请重新输入</text> <text class="txt">{{errorText}}</text>
</block> </block>
</view> </view>
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
</view> </view>
<button class="login-button" form-type="submit">登录</button> <button class="login-button" form-type="submit" disabled="{{disabled}}" loading="{{loading}}">登录</button>
</form> </form>
<view class="bottom row bothSide"> <view class="bottom row bothSide">
......
...@@ -51,10 +51,10 @@ ...@@ -51,10 +51,10 @@
.person .login-button { .person .login-button {
height: 98rpx; height: 98rpx;
line-height: 98rpx; line-height: 98rpx;
background: #0d84d1; background: #0d84d1 !important;
box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3); box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3) !important;
border-radius: 8rpx; border-radius: 8rpx;
color: #fff; color: #fff !important;
font-size: 32rpx; font-size: 32rpx;
margin-top: 40rpx; margin-top: 40rpx;
} }
...@@ -75,12 +75,22 @@ ...@@ -75,12 +75,22 @@
font-size: 24rpx; font-size: 24rpx;
color: #ea1717; color: #ea1717;
margin-left: 15rpx; margin-left: 15rpx;
font-weight: 400;
} }
.person .error-wrap .forget { .person .error-wrap .forget {
font-size: 28rpx; font-size: 28rpx;
color: #61a0f2; color: #61a0f2;
} }
.person .placeholderClass { .person .placeholderClass {
color: #ADB6BF; color: #adb6bf;
font-size: 32rpx; font-size: 32rpx;
} }
.person .inp-error {
border-bottom: 1px solid #ea1717;
}
.person .inp-error .icon {
color: #ea1717;
}
.person .inp-error input {
color: #ea1717;
}
// pages/person/verifycode/index.js const http = require('../../../utils/util.js');
import {
apis
} from '../../../utils/api.js';
Page({ Page({
/** /**
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
error: false,
errorText: '',
mobileFlag: false,
codeFlag: false,
disabled: false,
loading: false,
formData: {
mobile: '',
code: ''
}
}, },
/** /**
...@@ -62,5 +75,94 @@ Page({ ...@@ -62,5 +75,94 @@ Page({
*/ */
onShareAppMessage: function () { onShareAppMessage: function () {
},
/**
* 校验字段
*/
calcForm: function (val, type) {
let mobile = val.mobile;
let code = val.code;
let reg_mobile = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/;
if (!mobile) {
this.setData({
error: true,
errorText: '手机号不能为空',
mobileFlag: true
});
return false;
}
if (!reg_mobile.test(mobile)) {
this.setData({
error: true,
errorText: '请填写正确的手机号',
mobileFlag: true
});
return false;
}
this.setData({
error: false,
errorText: '',
codeFlag: false,
mobileFlag: false
});
return true;
},
/**
* 登录
*/
formSubmit:function(e){
var self = this;
console.log(e.detail.value)
if (this.calcForm(e.detail.value)) {
self.setData({
disabled: true,
loading: true
});
http.postData(apis.authMobilelogin, e.detail.value, function (res) {
if (res.err_code === 0) {
//注入token
wx.setStorage({
key: "access_token",
data: res.data.access_token
});
wx.switchTab({
url: '/pages/tab/home/home'
})
} else {
wx.showToast({
title: res.err_msg,
icon: 'none',
duration: 2000
});
}
self.setData({
disabled: false,
loading: false
});
});
}
} }
}) })
\ No newline at end of file
{ {
"usingComponents": {} "usingComponents": {},
"navigationBarTitleText": "",
"navigationBarBackgroundColor": "white",
"navigationBarTextStyle": "black",
"backgroundColor": "white"
} }
\ No newline at end of file
...@@ -47,10 +47,10 @@ ...@@ -47,10 +47,10 @@
.login-button { .login-button {
height: 98rpx; height: 98rpx;
line-height: 98rpx; line-height: 98rpx;
background: rgba(13, 132, 209, 1); background: rgba(13, 132, 209, 1) !important;
box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3); box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3) !important;
border-radius: 8rpx; border-radius: 8rpx;
color: #fff; color: #fff !important;
font-size: 32rpx; font-size: 32rpx;
margin-top: 40rpx; margin-top: 40rpx;
} }
...@@ -76,4 +76,13 @@ ...@@ -76,4 +76,13 @@
color: #adb6bf; color: #adb6bf;
font-size: 32rpx; font-size: 32rpx;
} }
.inp-error {
border-bottom: 1px solid #ea1717;
.icon {
color: #ea1717;
}
input {
color: #ea1717;
}
}
} }
<!-- 验证码登录 --> <!-- 验证码登录 -->
<view class="person"> <view class="person">
<view class="column tit"> <view class="column tit">
<text class="t1">Hi,上午好</text> <text class="t1">Hi,上午好</text>
<text class="t1">欢迎使用IC业务助手!</text> <text class="t1">欢迎使用IC业务助手!</text>
</view> </view>
<view class="inp-wrap row verCenter"> <form bindsubmit="formSubmit">
<text class="icon iconfont iconiconxiantiaoshouji21"></text> <view class="inp-wrap row verCenter {{mobileFlag ? 'inp-error':''}}">
<view class="form-item-right row verCenter bothSide"> <text class="icon iconfont iconiconxiantiaoshouji21"></text>
<input placeholder="请输入手机号" placeholder-class="placeholderClass"></input> <view class="form-item-right row verCenter bothSide">
<view class="areacode" bindtap="switchPrice"> <input placeholder="请输入手机号" placeholder-class="placeholderClass" name='mobile'></input>
<text class="tel-value">中国 + 86</text> <view class="areacode" bindtap="switchPrice">
<text class="icon iconfont iconbianzu1"></text> <text class="tel-value">中国 + 86</text>
</view> <text class="icon iconfont iconbianzu1"></text>
</view> </view>
</view> </view>
</view>
<view class="inp-wrap row verCenter"> <view class="inp-wrap row verCenter {{codeFlag ? 'inp-error':''}}">
<text class="icon iconfont iconiconxiantiaoshouji"></text> <text class="icon iconfont iconiconxiantiaoshouji"></text>
<view class="form-item-right row verCenter bothSide"> <view class="form-item-right row verCenter bothSide">
<input placeholder="请输入验证码" placeholder-class="placeholderClass"></input> <input placeholder="请输入验证码" placeholder-class="placeholderClass" name='code'></input>
<button class="vcode">发送验证码</button> <button class="vcode">发送验证码</button>
</view> </view>
</view> </view>
<view class="error"> <view class="error">
<text class="icon iconfont iconiconxiantiaoshouji1"></text> <block wx:if="{{error}}">
<text class="txt">验证码错误,请重新输入</text> <text class="icon iconfont iconiconxiantiaoshouji1"></text>
</view> <text class="txt">{{errorText}}</text>
</block>
</view>
<button class="login-button">登录</button> <button class="login-button" form-type="submit" disabled="{{disabled}}" loading="{{loading}}">登录</button>
</form>
<view class="bottom row bothSide"> <view class="bottom row bothSide">
<navigator url="/pages/person/login/index" class="txt">密码登录</navigator> <navigator url="/pages/person/login/index" class="txt">密码登录</navigator>
<navigator url="/pages/person/verifycode/index" class="txt">注册账户</navigator> <navigator url="/pages/person/verifycode/index" class="txt">注册账户</navigator>
</view> </view>
</view> </view>
\ No newline at end of file
...@@ -48,10 +48,10 @@ ...@@ -48,10 +48,10 @@
.person .login-button { .person .login-button {
height: 98rpx; height: 98rpx;
line-height: 98rpx; line-height: 98rpx;
background: #0d84d1; background: #0d84d1 !important;
box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3); box-shadow: 0px 6rpx 10rpx 0rpx rgba(97, 160, 242, 0.3) !important;
border-radius: 8rpx; border-radius: 8rpx;
color: #fff; color: #fff !important;
font-size: 32rpx; font-size: 32rpx;
margin-top: 40rpx; margin-top: 40rpx;
} }
...@@ -77,3 +77,12 @@ ...@@ -77,3 +77,12 @@
color: #adb6bf; color: #adb6bf;
font-size: 32rpx; font-size: 32rpx;
} }
.person .inp-error {
border-bottom: 1px solid #ea1717;
}
.person .inp-error .icon {
color: #ea1717;
}
.person .inp-error input {
color: #ea1717;
}
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 sign in to comment