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> |
<template> |
||||||
<view class="content"> |
<view class="content"> |
||||||
<view class="header"> |
<view class="header"> |
||||||
<image src="/static/images/login/logo.jpg"></image> |
<image src="/static/image/login/logo.png" mode="widthFix"></image> |
||||||
</view> |
<view class="mt21 fs16 cor-333 fwb text-center">欢迎使用金联武驾考!</view> |
||||||
|
</view> |
||||||
<view class="list"> |
|
||||||
<view class="list-call"> |
<view class="list"> |
||||||
<u-icon name="phone" color="#EE2626" size="40"></u-icon> |
<view class="list-call"> |
||||||
<input class="sl-input" v-model="login.phone" type="number" maxlength="11" placeholder="输入手机号" /> |
<u-input class="sl-input" border="none" v-model="login.phone" type="number" maxlength="11" |
||||||
</view> |
placeholder="输入手机号" /> |
||||||
<view class="list-call"> |
</view> |
||||||
<u-icon name="lock" color="#EE2626" size="40"></u-icon> |
<view class="list-call"> |
||||||
<input class="sl-input" v-model="login.password" type="text" maxlength="32" placeholder="输入密码" |
<u-input class="sl-input" v-model="login.code" type="text" maxlength="6" border="none" placeholder="输入验证码"> |
||||||
password="true" /> |
<template #suffix> |
||||||
</view> |
<text class="fs14 mr10" style="color: #05C341;" @tap="getCode">{{countDown==0?'获取验证码':countDown}}</text> |
||||||
|
</template> |
||||||
</view> |
</u-input> |
||||||
|
</view> |
||||||
<view class="button-login" hover-class="button-hover" @tap="bindLogin()"> |
</view> |
||||||
<text>登录</text> |
|
||||||
</view> |
<view class="button-login" @tap="bindLogin()"> |
||||||
|
<text>登录</text> |
||||||
<view class="agreenment"> |
</view> |
||||||
<navigator url="/pages/login/forget" open-type="navigate">忘记密码</navigator> |
|
||||||
<text>|</text> |
</view> |
||||||
<navigator url="/pages/login/reg" open-type="navigate">注册账户</navigator> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
export default { |
import { |
||||||
data() { |
isPhone |
||||||
return { |
} from '@/jtools/utils/validate.js' |
||||||
login: { |
import { |
||||||
phone: '', |
getCode, |
||||||
password: '' |
login |
||||||
} |
} from '@/jtools/api/login' |
||||||
|
import useUserStore from '@/jtools/store/user' |
||||||
}; |
export default { |
||||||
}, |
data() { |
||||||
methods: { |
return { |
||||||
bindLogin() { |
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> |
</script> |
||||||
|
|
||||||
<style> |
<style> |
||||||
page { |
page { |
||||||
background-color: #fff; |
background-color: #fff; |
||||||
} |
} |
||||||
|
|
||||||
.content { |
.content { |
||||||
display: flex; |
display: flex; |
||||||
flex-direction: column; |
flex-direction: column; |
||||||
justify-content: center; |
justify-content: center; |
||||||
} |
} |
||||||
|
|
||||||
.header { |
.header { |
||||||
width: 161rpx; |
margin-top: 166rpx; |
||||||
height: 161rpx; |
margin-left: auto; |
||||||
border-radius: 50%; |
margin-right: auto; |
||||||
margin-top: 30rpx; |
letter-spacing: 10rpx; |
||||||
margin-left: auto; |
} |
||||||
margin-right: auto; |
|
||||||
} |
.header image { |
||||||
|
width: 383rpx; |
||||||
.header image { |
} |
||||||
width: 161rpx; |
|
||||||
height: 161rpx; |
.list { |
||||||
border-radius: 50%; |
display: flex; |
||||||
} |
flex-direction: column; |
||||||
|
padding-top: 120rpx; |
||||||
.list { |
padding-left: 90rpx; |
||||||
display: flex; |
padding-right: 90rpx; |
||||||
flex-direction: column; |
} |
||||||
padding-top: 50rpx; |
|
||||||
padding-left: 70rpx; |
.list-call { |
||||||
padding-right: 70rpx; |
display: flex; |
||||||
} |
flex-direction: row; |
||||||
|
justify-content: space-between; |
||||||
.list-call { |
align-items: center; |
||||||
display: flex; |
height: 100rpx; |
||||||
flex-direction: row; |
color: #333333; |
||||||
justify-content: space-between; |
border-bottom: 0.5px solid #e2e2e2; |
||||||
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; |
||||||
.list-call .sl-input { |
margin-left: 16rpx; |
||||||
flex: 1; |
} |
||||||
text-align: left; |
|
||||||
font-size: 32rpx; |
.button-login { |
||||||
margin-left: 16rpx; |
color: #FFFFFF; |
||||||
} |
font-size: 34rpx; |
||||||
|
width: 560rpx; |
||||||
.button-login { |
height: 100rpx; |
||||||
color: #FFFFFF; |
background: linear-gradient(90deg, #11DF20 0%, #00B74F 100%); |
||||||
font-size: 34rpx; |
border-radius: 50rpx; |
||||||
width: 470rpx; |
line-height: 100rpx; |
||||||
height: 100rpx; |
text-align: center; |
||||||
background: linear-gradient(-90deg, rgba(193, 25, 32, 1), rgba(238, 38, 38, 1)); |
margin-top: 100rpx; |
||||||
border-radius: 50rpx; |
margin-left: auto; |
||||||
line-height: 100rpx; |
margin-right: auto; |
||||||
text-align: center; |
} |
||||||
margin-left: auto; |
|
||||||
margin-right: auto; |
</style> |
||||||
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; |
|
||||||
} |
|
||||||
|
|
||||||
.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