qsh
1 year ago
parent
266b7d4a0f
commit
ae7e2bc17f
@ -0,0 +1,9 @@ |
||||
import request from '../request/index.js'; |
||||
|
||||
export function queryVip(data) { |
||||
return request({ |
||||
url: 'driver-api/tdMember/queryUserMember', |
||||
method: 'POST', |
||||
data, |
||||
}); |
||||
} |
||||
@ -0,0 +1,167 @@ |
||||
/** |
||||
* 判断url是否是http或https |
||||
* @param {string} path |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isHttp(url) { |
||||
return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1; |
||||
} |
||||
|
||||
/** |
||||
* 判断path是否为外链 |
||||
* @param {string} path |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isExternal(path) { |
||||
return /^(https?:|mailto:|tel:)/.test(path); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} str |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function validUsername(str) { |
||||
const valid_map = ['admin', 'editor']; |
||||
return valid_map.indexOf(str.trim()) >= 0; |
||||
} |
||||
|
||||
/** |
||||
* @param {string} url |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isURL(url) { |
||||
const reg = |
||||
/^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/; |
||||
return reg.test(url); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} str |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function validLowerCase(str) { |
||||
const reg = /^[a-z]+$/; |
||||
return reg.test(str); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} str |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function validUpperCase(str) { |
||||
const reg = /^[A-Z]+$/; |
||||
return reg.test(str); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} str |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function validAlphabets(str) { |
||||
const reg = /^[A-Za-z]+$/; |
||||
return reg.test(str); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} email |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isEmail(email) { |
||||
const reg = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; |
||||
return reg.test(email); |
||||
} |
||||
|
||||
/** |
||||
* @param {string} str |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isString(str) { |
||||
if (typeof str === 'string' || str instanceof String) { |
||||
return true; |
||||
} |
||||
return false; |
||||
} |
||||
|
||||
export function isPhone(str) { |
||||
return str && /^1[3456789]\d{9}$/.test(str) |
||||
} |
||||
|
||||
/** |
||||
* @param {Array} arg |
||||
* @returns {Boolean} |
||||
*/ |
||||
export function isArray(arg) { |
||||
if (typeof Array.isArray === 'undefined') { |
||||
return Object.prototype.toString.call(arg) === '[object Array]'; |
||||
} |
||||
return Array.isArray(arg); |
||||
} |
||||
|
||||
// 是否纯英文
|
||||
export function isAllEN(val) { |
||||
return /^[a-zA-Z]*$/.test(val); |
||||
} |
||||
|
||||
// 是否纯中文
|
||||
export function isAllCN(val) { |
||||
return /^[\u4E00-\u9FA5]*$/.test(val); |
||||
} |
||||
|
||||
// 校验手机号
|
||||
export function validPhone(rule, value, callback) { |
||||
if (value && !/^1[3456789]\d{9}$/.test(value)) { |
||||
return callback(new Error('请输入正确的11位号码')); |
||||
} else { |
||||
return callback(); |
||||
} |
||||
} |
||||
|
||||
// 校验固话和手机号
|
||||
export function validPhoneAndMobile(rule, value, callback) { |
||||
if (value && !/^((0\d{2,3}-?\d{7,8})|(1[3465789]\d{9}))$/.test(value)) { |
||||
return callback(new Error('请输入正确的电话号码')); |
||||
} else { |
||||
return callback(); |
||||
} |
||||
} |
||||
|
||||
// 校验邮箱
|
||||
export function validEmail(rule, value, callback) { |
||||
if (value && !isEmail(value)) { |
||||
return callback(new Error('请输入正确的邮箱')); |
||||
} else { |
||||
return callback(); |
||||
} |
||||
} |
||||
|
||||
// 校验纳税人识别号
|
||||
export function validTaxpayer(rule, value, callback) { |
||||
if (value && !/^[A-Z0-9]{15}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/.test(value)) { |
||||
return callback(new Error('请输入正确的纳税人识别号')); |
||||
} else { |
||||
return callback(); |
||||
} |
||||
} |
||||
|
||||
// 校验是否网站
|
||||
export function validUrl(rule, value, callback) { |
||||
if (value && !isURL(value)) { |
||||
return callback(new Error('请输入正确的网站')); |
||||
} else { |
||||
return callback(); |
||||
} |
||||
} |
||||
|
||||
// 校验银行卡
|
||||
export function validBankCard(rule, value, callback) { |
||||
const strBin = '10,18,30,35,37,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,58,60,62,65,68,69,84,87,88,94,95,98,99'; |
||||
if (!value) { |
||||
return callback(); |
||||
} else if (!Number.isInteger(+value)) { |
||||
callback(new Error('银行卡号必须全为数字')); |
||||
} else if (value.trim().length < 8 || value.trim().length > 32) { |
||||
callback(new Error('银行卡号长度必须在8到32之间')); |
||||
} else { |
||||
callback(); |
||||
} |
||||
} |
||||
@ -1,27 +0,0 @@ |
||||
<template> |
||||
<view> |
||||
<web-view :webview-styles="webviewStyles" :src="articleurl"></web-view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
articleurl: '', |
||||
webviewStyles: { |
||||
progress: { |
||||
color: '#FF7200' |
||||
} |
||||
} |
||||
}; |
||||
}, |
||||
onLoad(options) { |
||||
this.articleurl = 'http://www.baidu.com/'; |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
||||
@ -1,255 +0,0 @@ |
||||
<template> |
||||
<view class="content"> |
||||
<view class="list"> |
||||
<view class="tishi">若您忘记了密码，可在此重新设置新密码。</view> |
||||
<view class="list-call"> |
||||
<u-icon name="phone" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" type="number" v-model="phone" maxlength="11" placeholder="请输入手机号" /> |
||||
</view> |
||||
<view class="list-call"> |
||||
<u-icon name="lock" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" type="text" v-model="password" maxlength="32" placeholder="请输入新密码" |
||||
:password="!showPassword" /> |
||||
<u-icon @click="display" :name="showPassword?'eye-off':'eye-fill'" color="#EE2626" size="40"></u-icon> |
||||
|
||||
</view> |
||||
<view class="list-call"> |
||||
<u-icon name="checkmark-circle" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" type="number" v-model="code" maxlength="4" placeholder="验证码" /> |
||||
<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view> |
||||
</view> |
||||
</view> |
||||
<view class="button-login" hover-class="button-hover" @tap="bindLogin()"> |
||||
<text>修改密码</text> |
||||
</view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
var _this, js; |
||||
export default { |
||||
data() { |
||||
return { |
||||
phone: '', |
||||
second: 0, |
||||
code: "", |
||||
showPassword: false, |
||||
password: '' |
||||
} |
||||
}, |
||||
onLoad() { |
||||
_this = this; |
||||
}, |
||||
computed: { |
||||
yanzhengma() { |
||||
if (this.second == 0) { |
||||
return '获取验证码'; |
||||
} else { |
||||
if (this.second < 10) { |
||||
return '重新获取0' + this.second; |
||||
} else { |
||||
return '重新获取' + this.second; |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
onUnload() { |
||||
this.clear() |
||||
}, |
||||
methods: { |
||||
display() { |
||||
this.showPassword = !this.showPassword |
||||
}, |
||||
clear() { |
||||
clearInterval(js) |
||||
js = null |
||||
this.second = 0 |
||||
}, |
||||
getcode() { |
||||
if (this.phone.length != 11) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '手机号不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.second > 0) { |
||||
return; |
||||
} |
||||
_this.second = 60; |
||||
js = setInterval(function() { |
||||
_this.second--; |
||||
if (_this.second == 0) { |
||||
_this.clear() |
||||
} |
||||
}, 1000) |
||||
uni.request({ |
||||
url: 'http://***/getPassWord', //仅为示例，并非真实接口地址。 |
||||
data: { |
||||
phone: this.phone, |
||||
type: 'forget' |
||||
}, |
||||
method: 'POST', |
||||
dataType: 'json', |
||||
success: (res) => { |
||||
if (res.data.code != 200) { |
||||
uni.showToast({ |
||||
title: res.data.msg, |
||||
icon: 'none' |
||||
}); |
||||
_this.second = 0; |
||||
} else { |
||||
uni.showToast({ |
||||
title: res.data.msg |
||||
}); |
||||
_this.second = 60; |
||||
js = setInterval(function() { |
||||
_this.second--; |
||||
if (_this.second == 0) { |
||||
_this.clear() |
||||
} |
||||
}, 1000) |
||||
} |
||||
}, |
||||
fail() { |
||||
this.clear() |
||||
} |
||||
}); |
||||
|
||||
|
||||
|
||||
|
||||
}, |
||||
bindLogin() { |
||||
if (this.phone.length != 11) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '手机号不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.password.length < 6) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '密码不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.code.length != 4) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '验证码不正确' |
||||
}); |
||||
return; |
||||
} |
||||
uni.request({ |
||||
url: 'http://***/forget', |
||||
data: { |
||||
phone: this.phone, |
||||
password: this.password, |
||||
code: this.code |
||||
}, |
||||
method: 'POST', |
||||
dataType: 'json', |
||||
success: (res) => { |
||||
if (res.data.code != 200) { |
||||
uni.showToast({ |
||||
title: res.data.msg, |
||||
icon: 'none' |
||||
}); |
||||
} else { |
||||
uni.showToast({ |
||||
title: res.data.msg |
||||
}); |
||||
setTimeout(function() { |
||||
uni.navigateBack(); |
||||
}, 1500) |
||||
} |
||||
} |
||||
}); |
||||
|
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
page { |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.content { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.tishi { |
||||
color: #999999; |
||||
font-size: 28rpx; |
||||
line-height: 50rpx; |
||||
margin-bottom: 50rpx; |
||||
} |
||||
|
||||
.list { |
||||
display: flex; |
||||
flex-direction: column; |
||||
padding-top: 50rpx; |
||||
padding-left: 70rpx; |
||||
padding-right: 70rpx; |
||||
} |
||||
|
||||
.list-call { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 100rpx; |
||||
color: #333333; |
||||
border-bottom: 0.5px solid #e2e2e2; |
||||
} |
||||
|
||||
|
||||
.list-call .sl-input { |
||||
flex: 1; |
||||
text-align: left; |
||||
font-size: 32rpx; |
||||
margin-left: 16rpx; |
||||
} |
||||
|
||||
.button-login { |
||||
color: #FFFFFF; |
||||
font-size: 34rpx; |
||||
width: 470rpx; |
||||
height: 100rpx; |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); |
||||
border-radius: 50rpx; |
||||
line-height: 100rpx; |
||||
text-align: center; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
margin-top: 100rpx; |
||||
} |
||||
|
||||
.button-hover { |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); |
||||
} |
||||
|
||||
.yzm { |
||||
color: #FF7D13; |
||||
font-size: 24rpx; |
||||
line-height: 64rpx; |
||||
padding-left: 10rpx; |
||||
padding-right: 10rpx; |
||||
width: auto; |
||||
height: 64rpx; |
||||
border: 1rpx solid rgba(255, 131, 30, 1); |
||||
border-radius: 50rpx; |
||||
} |
||||
|
||||
.yzms { |
||||
color: #999999 !important; |
||||
border: 1rpx solid #999999; |
||||
} |
||||
</style> |
||||
@ -1,140 +1,162 @@ |
||||
<template> |
||||
<view class="content"> |
||||
<view class="header"> |
||||
<image src="/static/images/login/logo.jpg"></image> |
||||
</view> |
||||
|
||||
<view class="list"> |
||||
<view class="list-call"> |
||||
<u-icon name="phone" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" v-model="login.phone" type="number" maxlength="11" placeholder="输入手机号" /> |
||||
</view> |
||||
<view class="list-call"> |
||||
<u-icon name="lock" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" v-model="login.password" type="text" maxlength="32" placeholder="输入密码" |
||||
password="true" /> |
||||
</view> |
||||
|
||||
</view> |
||||
|
||||
<view class="button-login" hover-class="button-hover" @tap="bindLogin()"> |
||||
<text>登录</text> |
||||
</view> |
||||
|
||||
<view class="agreenment"> |
||||
<navigator url="/pages/login/forget" open-type="navigate">忘记密码</navigator> |
||||
<text>|</text> |
||||
<navigator url="/pages/login/reg" open-type="navigate">注册账户</navigator> |
||||
</view> |
||||
</view> |
||||
<view class="content"> |
||||
<view class="header"> |
||||
<image src="/static/image/login/logo.png" mode="widthFix"></image> |
||||
<view class="mt21 fs16 cor-333 fwb text-center">欢迎使用金联武驾考！</view> |
||||
</view> |
||||
|
||||
<view class="list"> |
||||
<view class="list-call"> |
||||
<u-input class="sl-input" border="none" v-model="login.phone" type="number" maxlength="11" |
||||
placeholder="输入手机号" /> |
||||
</view> |
||||
<view class="list-call"> |
||||
<u-input class="sl-input" v-model="login.code" type="text" maxlength="6" border="none" placeholder="输入验证码"> |
||||
<template #suffix> |
||||
<text class="fs14 mr10" style="color: #05C341;" @tap="getCode">{{countDown==0?'获取验证码':countDown}}</text> |
||||
</template> |
||||
</u-input> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="button-login" @tap="bindLogin()"> |
||||
<text>登录</text> |
||||
</view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
login: { |
||||
phone: '', |
||||
password: '' |
||||
} |
||||
|
||||
}; |
||||
}, |
||||
methods: { |
||||
bindLogin() { |
||||
|
||||
} |
||||
} |
||||
} |
||||
import { |
||||
isPhone |
||||
} from '@/jtools/utils/validate.js' |
||||
import { |
||||
getCode, |
||||
login |
||||
} from '@/jtools/api/login' |
||||
import useUserStore from '@/jtools/store/user' |
||||
export default { |
||||
data() { |
||||
return { |
||||
login: { |
||||
phone: '', |
||||
code: '' |
||||
}, |
||||
countDown: 0, |
||||
js: undefined |
||||
}; |
||||
}, |
||||
onShow() { |
||||
if(useUserStore().isLogin) { |
||||
this.toHome() |
||||
} |
||||
}, |
||||
methods: { |
||||
getCode() { |
||||
if (isPhone(this.login.phone) && this.countDown == 0) { |
||||
getCode({ |
||||
phone: this.login.phone |
||||
}).then(resp => { |
||||
if (resp.code == '0000') { |
||||
uni.showToast({ |
||||
title: '发送成功!', |
||||
icon: 'none' |
||||
}) |
||||
this.countDown = 60 |
||||
this.js = setInterval(() => { |
||||
this.countDown; |
||||
if (this.countDown == 0) { |
||||
this.clear() |
||||
} |
||||
}, 1000) |
||||
} |
||||
}) |
||||
} |
||||
}, |
||||
clear() { |
||||
clearInterval(js) |
||||
this.js = null |
||||
this.countDown = 0 |
||||
}, |
||||
bindLogin() { |
||||
if(isPhone(this.login.phone) && this.login.code) { |
||||
useUserStore().login(this.login).then(resp => { |
||||
if(resp.userId) { |
||||
this.toHome() |
||||
} |
||||
}) |
||||
} |
||||
}, |
||||
toHome() { |
||||
uni.switchTab({ |
||||
url: '/pages/index/index' |
||||
}) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
page { |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.content { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.header { |
||||
width: 161rpx; |
||||
height: 161rpx; |
||||
border-radius: 50%; |
||||
margin-top: 30rpx; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
} |
||||
|
||||
.header image { |
||||
width: 161rpx; |
||||
height: 161rpx; |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
.list { |
||||
display: flex; |
||||
flex-direction: column; |
||||
padding-top: 50rpx; |
||||
padding-left: 70rpx; |
||||
padding-right: 70rpx; |
||||
} |
||||
|
||||
.list-call { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 100rpx; |
||||
color: #333333; |
||||
border-bottom: 0.5px solid #e2e2e2; |
||||
} |
||||
|
||||
|
||||
|
||||
.list-call .sl-input { |
||||
flex: 1; |
||||
text-align: left; |
||||
font-size: 32rpx; |
||||
margin-left: 16rpx; |
||||
} |
||||
|
||||
.button-login { |
||||
color: #FFFFFF; |
||||
font-size: 34rpx; |
||||
width: 470rpx; |
||||
height: 100rpx; |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); |
||||
border-radius: 50rpx; |
||||
line-height: 100rpx; |
||||
text-align: center; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
margin-top: 100rpx; |
||||
} |
||||
|
||||
.button-hover { |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); |
||||
} |
||||
|
||||
.agreenment { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: center; |
||||
align-items: center; |
||||
font-size: 30rpx; |
||||
margin-top: 80rpx; |
||||
color: #FFA800; |
||||
text-align: center; |
||||
height: 40rpx; |
||||
line-height: 40rpx; |
||||
} |
||||
page { |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.content { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.header { |
||||
margin-top: 166rpx; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
letter-spacing: 10rpx; |
||||
} |
||||
|
||||
.header image { |
||||
width: 383rpx; |
||||
} |
||||
|
||||
.list { |
||||
display: flex; |
||||
flex-direction: column; |
||||
padding-top: 120rpx; |
||||
padding-left: 90rpx; |
||||
padding-right: 90rpx; |
||||
} |
||||
|
||||
.list-call { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 100rpx; |
||||
color: #333333; |
||||
border-bottom: 0.5px solid #e2e2e2; |
||||
} |
||||
|
||||
|
||||
|
||||
.list-call .sl-input { |
||||
flex: 1; |
||||
text-align: left; |
||||
font-size: 32rpx; |
||||
margin-left: 16rpx; |
||||
} |
||||
|
||||
.button-login { |
||||
color: #FFFFFF; |
||||
font-size: 34rpx; |
||||
width: 560rpx; |
||||
height: 100rpx; |
||||
background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%); |
||||
border-radius: 50rpx; |
||||
line-height: 100rpx; |
||||
text-align: center; |
||||
margin-top: 100rpx; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
} |
||||
|
||||
.agreenment text { |
||||
font-size: 24rpx; |
||||
margin-left: 15rpx; |
||||
margin-right: 15rpx; |
||||
} |
||||
</style> |
||||
@ -1,303 +0,0 @@ |
||||
<template> |
||||
<view class="content"> |
||||
<view class="header"> |
||||
<image src="/static/images/login/logo.jpg"></image> |
||||
</view> |
||||
|
||||
<view class="list"> |
||||
<view class="list-call"> |
||||
<u-icon name="phone" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" v-model="phone" type="number" maxlength="11" placeholder="手机号" /> |
||||
</view> |
||||
<view class="list-call"> |
||||
<u-icon name="lock" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" v-model="password" type="text" maxlength="32" placeholder="登录密码" |
||||
:password="!showPassword" /> |
||||
<u-icon @click="display" :name="showPassword?'eye-off':'eye-fill'" color="#EE2626" size="40"></u-icon> |
||||
</view> |
||||
<view class="list-call"> |
||||
<u-icon name="checkmark-circle" color="#EE2626" size="40"></u-icon> |
||||
<input class="sl-input" v-model="code" type="number" maxlength="4" placeholder="验证码" /> |
||||
<view class="yzm" :class="{ yzms: second>0 }" @tap="getcode">{{yanzhengma}}</view> |
||||
</view> |
||||
|
||||
</view> |
||||
|
||||
<view class="button-login" hover-class="button-hover" @tap="bindLogin"> |
||||
<text>注册</text> |
||||
</view> |
||||
|
||||
<view class="agreement"> |
||||
<image @tap="agreementSuccess" |
||||
:src="agreement==true?'/static/images/login/ty1.png':'/static/images/login/ty0.png'"></image> |
||||
<text @tap="agreementSuccess"> 同意</text> |
||||
<navigator url="/pages/login/agreement?id=1" open-type="navigate">《软件用户协议》</navigator> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
var _this, js; |
||||
export default { |
||||
onLoad() { |
||||
_this = this; |
||||
|
||||
}, |
||||
onUnload() { |
||||
clearInterval(js) |
||||
this.second = 0; |
||||
}, |
||||
data() { |
||||
return { |
||||
phone: '', |
||||
password: '', |
||||
code: '', |
||||
agreement: true, |
||||
showPassword: false, |
||||
second: 0 |
||||
}; |
||||
}, |
||||
computed: { |
||||
yanzhengma() { |
||||
if (this.second == 0) { |
||||
return '获取验证码'; |
||||
} else { |
||||
if (this.second < 10) { |
||||
return '重新获取0' + this.second; |
||||
} else { |
||||
return '重新获取' + this.second; |
||||
} |
||||
} |
||||
} |
||||
}, |
||||
onUnload() { |
||||
this.clear() |
||||
}, |
||||
methods: { |
||||
clear() { |
||||
clearInterval(js) |
||||
js = null |
||||
this.second = 0 |
||||
}, |
||||
display() { |
||||
this.showPassword = !this.showPassword |
||||
}, |
||||
agreementSuccess() { |
||||
this.agreement = !this.agreement; |
||||
}, |
||||
getcode() { |
||||
if (this.phone.length != 11) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '手机号不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.second > 0) { |
||||
return; |
||||
} |
||||
this.second = 60; |
||||
//请求业务 |
||||
js = setInterval(function() { |
||||
_this.second--; |
||||
if (_this.second == 0) { |
||||
_this.clear() |
||||
} |
||||
}, 1000) |
||||
// uni.request({ |
||||
// url: 'http://***/getcode.html', //仅为示例，并非真实接口地址。 |
||||
// data: { |
||||
// phone: this.phone, |
||||
// type: 'reg' |
||||
// }, |
||||
// method: 'POST', |
||||
// dataType: 'json', |
||||
// success: (res) => { |
||||
// if (res.data.code != 200) { |
||||
// uni.showToast({ |
||||
// title: res.data.msg, |
||||
// icon: 'none' |
||||
// }); |
||||
// } else { |
||||
// uni.showToast({ |
||||
// title: res.data.msg |
||||
// }); |
||||
// js = setInterval(function() { |
||||
// _this.second--; |
||||
// if (_this.second == 0) { |
||||
// _this.clear() |
||||
// } |
||||
// }, 1000) |
||||
// } |
||||
// }, |
||||
// fail() { |
||||
// this.second == 0 |
||||
// } |
||||
// }); |
||||
}, |
||||
bindLogin() { |
||||
if (this.agreement == false) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '请先阅读《软件用户协议》' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.phone.length != 11) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '手机号不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.password.length < 6) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '密码不正确' |
||||
}); |
||||
return; |
||||
} |
||||
if (this.code.length != 4) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: '验证码不正确' |
||||
}); |
||||
return; |
||||
} |
||||
uni.request({ |
||||
url: 'http://***/reg.html', |
||||
data: { |
||||
phone: this.phone, |
||||
password: this.password, |
||||
code: this.code, |
||||
}, |
||||
method: 'POST', |
||||
dataType: 'json', |
||||
success: (res) => { |
||||
if (res.data.code != 200) { |
||||
uni.showToast({ |
||||
title: res.data.msg, |
||||
icon: 'none' |
||||
}); |
||||
} else { |
||||
uni.showToast({ |
||||
title: res.data.msg |
||||
}); |
||||
setTimeout(function() { |
||||
uni.navigateBack(); |
||||
}, 1500) |
||||
} |
||||
} |
||||
}); |
||||
|
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
page { |
||||
background-color: #fff; |
||||
} |
||||
|
||||
.content { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.header { |
||||
width: 161rpx; |
||||
height: 161rpx; |
||||
border-radius: 50%; |
||||
margin-top: 30rpx; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
} |
||||
|
||||
.header image { |
||||
width: 161rpx; |
||||
height: 161rpx; |
||||
border-radius: 50%; |
||||
} |
||||
|
||||
.list { |
||||
display: flex; |
||||
flex-direction: column; |
||||
padding-top: 50rpx; |
||||
padding-left: 70rpx; |
||||
padding-right: 70rpx; |
||||
} |
||||
|
||||
.list-call { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
height: 100rpx; |
||||
color: #333333; |
||||
border-bottom: 0.5px solid #e2e2e2; |
||||
} |
||||
|
||||
|
||||
|
||||
.list-call .sl-input { |
||||
flex: 1; |
||||
text-align: left; |
||||
font-size: 32rpx; |
||||
margin-left: 16rpx; |
||||
} |
||||
|
||||
.yzm { |
||||
color: #FF7D13; |
||||
font-size: 24rpx; |
||||
line-height: 64rpx; |
||||
padding-left: 10rpx; |
||||
padding-right: 10rpx; |
||||
width: auto; |
||||
height: 64rpx; |
||||
border: 1rpx solid #FFA800; |
||||
border-radius: 50rpx; |
||||
} |
||||
|
||||
.yzms { |
||||
color: #999999 !important; |
||||
border: 1rpx solid #999999; |
||||
} |
||||
|
||||
.button-login { |
||||
color: #FFFFFF; |
||||
font-size: 34rpx; |
||||
width: 470rpx; |
||||
height: 100rpx; |
||||
line-height: 100rpx; |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); |
||||
border-radius: 50rpx; |
||||
text-align: center; |
||||
margin-left: auto; |
||||
margin-right: auto; |
||||
margin-top: 100rpx; |
||||
} |
||||
|
||||
.button-hover { |
||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 0.8), rgba(238, 38, 38, 0.8)); |
||||
} |
||||
|
||||
.agreement { |
||||
display: flex; |
||||
flex-direction: row; |
||||
justify-content: center; |
||||
align-items: center; |
||||
font-size: 30rpx; |
||||
margin-top: 80rpx; |
||||
color: #FFA800; |
||||
text-align: center; |
||||
height: 40rpx; |
||||
line-height: 40rpx; |
||||
} |
||||
|
||||
.agreement image { |
||||
width: 40rpx; |
||||
height: 40rpx; |
||||
} |
||||
</style> |
||||
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 656 B |
Loading…
Reference in new issue