浅念
190 lines
3.5 KiB
Vue
190 lines
3.5 KiB
Vue
<template>
|
|
<view class="page">
|
|
<view class="title">
|
|
<image src="/static/image/hesu.png" mode=""></image>
|
|
</view>
|
|
|
|
<view class="form">
|
|
<view class="inputs_button">
|
|
|
|
<view class="inputs">
|
|
<view class="laber">邮箱</view>
|
|
<view class="vcode">
|
|
<u--input
|
|
type="password"
|
|
placeholder="邮箱地址"
|
|
border="none"
|
|
></u--input>
|
|
<text v-if="vcodeTime==0" @click="getVcode">获取验证码</text>
|
|
<text v-else style="color:#fff">重新获取({{vcodeTime}}s)</text>
|
|
</view>
|
|
<view class="password">
|
|
<u--input
|
|
type="password"
|
|
placeholder="验证码"
|
|
border="none"
|
|
></u--input>
|
|
</view>
|
|
<view class="laber">重置密码</view>
|
|
<view class="account">
|
|
<u--input
|
|
type="password"
|
|
placeholder="新密码"
|
|
border="none"
|
|
></u--input>
|
|
</view>
|
|
<view class="password">
|
|
<u--input
|
|
type="password"
|
|
placeholder="确认密码"
|
|
border="none"
|
|
></u--input>
|
|
</view>
|
|
</view>
|
|
<view class="button">
|
|
<view @click="login">
|
|
确认修改
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { request,showToast } from '@/api/apiT.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
email: "",
|
|
password: "",
|
|
pactChecked: false,
|
|
vcodeTime: 0,
|
|
vcodeTimer: null
|
|
}
|
|
},
|
|
onLoad() {
|
|
|
|
},
|
|
methods: {
|
|
leftClick(){
|
|
uni.navigateBack({})
|
|
},
|
|
login() {
|
|
if(this.email==''){
|
|
uni.showToast({
|
|
title:'邮箱不能为空',
|
|
icon: 'none'
|
|
});
|
|
return false
|
|
}
|
|
if(this.password==''){
|
|
uni.showToast({
|
|
title:'密码不能为空',
|
|
icon: 'none'
|
|
});
|
|
return false
|
|
}
|
|
},
|
|
getVcode() {
|
|
this.vcodeTime = 60
|
|
this.vcodeTimer = setInterval(() => {
|
|
if (this.vcodeTime > 0) {
|
|
this.vcodeTime--
|
|
} else {
|
|
clearInterval(this.vcodeTimer)
|
|
this.vcodeTimer = null
|
|
}
|
|
}, 1000)
|
|
uni.showToast({
|
|
title: "获取验证码",
|
|
icon: 'none'
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page {
|
|
min-height: 100vh;
|
|
background-image: url("../../static/image/login/loginbg.png");
|
|
background-size: 100%;
|
|
background-repeat: no-repeat;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
|
|
.title {
|
|
padding-top: 220rpx;
|
|
text-align: center;
|
|
image{
|
|
width: 160px;
|
|
height: 37px;
|
|
}
|
|
}
|
|
|
|
.form {
|
|
flex: 1;
|
|
margin: 0 76rpx;
|
|
overflow: hidden;
|
|
|
|
.inputs_button {
|
|
.inputs {
|
|
padding: 150rpx 0px 0;
|
|
margin-bottom: 20rpx;
|
|
.laber{
|
|
color: #222222;
|
|
font-size: 32rpx;
|
|
line-height: 48px;
|
|
padding-left: 15px;
|
|
}
|
|
.account,
|
|
.vcode,
|
|
.password{
|
|
height: 80rpx;
|
|
border-radius: 50px;
|
|
padding: 0 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
background-color: #F6F6F6;
|
|
|
|
input {
|
|
flex: 1;
|
|
}
|
|
}
|
|
|
|
.account {
|
|
margin-bottom: 48rpx;
|
|
}
|
|
.vcode {
|
|
margin-bottom: 10px;
|
|
padding-right: 0px;
|
|
text {
|
|
text-wrap: nowrap;
|
|
font-size: 26rpx;
|
|
padding: 14rpx 30rpx;
|
|
background-color: #3471FF;
|
|
border-radius: 50px;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.button {
|
|
padding: 0 32rpx;
|
|
margin-top: 80rpx;
|
|
view {
|
|
line-height: 80rpx;
|
|
border-radius: 50px;
|
|
text-align: center;
|
|
font-size: 32rpx;
|
|
background: linear-gradient(to right, #3471FF, #6776FF);
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |