master
dongmu
11 months ago
parent
3a2ccd4a4c
commit
c5eb65922b
@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<!-- 忘记密码 -->
|
||||
<view
|
||||
class="normal-login-container"
|
||||
:style="{ height: searchHeight + 'px', backgroundColor: '#b6dcff', 'padding-top': '1px' }"
|
||||
>
|
||||
<HeadTabbar :isShowIcon="true" :backNumber="2" tabbarName="忘记密码"></HeadTabbar>
|
||||
<!--鸿森通货运 标题 -->
|
||||
<view class="logo-content align-center justify-center flex">
|
||||
<text class="title">忘记密码</text>
|
||||
</view>
|
||||
<view class="login-form-content">
|
||||
<view class="input-item flex align-center" style="background-color: #eee">
|
||||
<view class="iconfont icon-user icon"></view>
|
||||
<input
|
||||
v-model="loginForm.account"
|
||||
:disabled="true"
|
||||
class="input"
|
||||
type="text"
|
||||
placeholder="请输入手机号"
|
||||
:maxlength="11"
|
||||
/>
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input
|
||||
v-model="loginForm.password"
|
||||
:password="true"
|
||||
class="input"
|
||||
placeholder="请输入新密码"
|
||||
:maxlength="20"
|
||||
/>
|
||||
</view>
|
||||
<view class="input-item flex align-center">
|
||||
<view class="iconfont icon-password icon"></view>
|
||||
<input
|
||||
v-model="loginForm.confirmPassword"
|
||||
:password="true"
|
||||
class="input"
|
||||
placeholder="请输入确认密码"
|
||||
:maxlength="20"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="action-btn">
|
||||
<button @click="handleLogin" class="login-btn cu-btn block bg-blue lg round">
|
||||
确认修改
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { recoverPassword } from '@/services/home'
|
||||
|
||||
const codeUrl = ref()
|
||||
const captchaEnabled = ref(true)
|
||||
const searchHeight = ref()
|
||||
const loginForm = ref({
|
||||
account: '',
|
||||
password: '',
|
||||
registerLogotype: '',
|
||||
confirmPassword: '',
|
||||
})
|
||||
const content = ref('获取验证码') // 按钮里显示的内容
|
||||
const totaltime = ref(60) //记录具体倒计时时间
|
||||
const canclick = ref(true) //添加canclick
|
||||
|
||||
onLoad((option) => {
|
||||
if (option?.value) {
|
||||
let res = JSON.parse(option.value)
|
||||
loginForm.value.account = res.account
|
||||
loginForm.value.registerLogotype = res.registerLogotype
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// 挂载测出屏幕高度
|
||||
searchHeight.value = getHeight()
|
||||
})
|
||||
|
||||
// 检测屏幕高度
|
||||
const getHeight = () => {
|
||||
return uni.getWindowInfo().windowHeight
|
||||
}
|
||||
|
||||
// 登录方法
|
||||
const handleLogin = async () => {
|
||||
if (loginForm.value.password === '') {
|
||||
uni.showToast({
|
||||
title: '请输入您的密码',
|
||||
icon: 'error',
|
||||
})
|
||||
return
|
||||
} else if (loginForm.value.confirmPassword === '') {
|
||||
uni.showToast({
|
||||
title: '请输入确认密码',
|
||||
icon: 'error',
|
||||
})
|
||||
return
|
||||
} else {
|
||||
// 先发送请求
|
||||
recoverPassword(loginForm.value).then((res: any) => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'success',
|
||||
})
|
||||
uni.navigateBack({
|
||||
delta: 2,
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.border_class {
|
||||
display: inline-block;
|
||||
width: 1px;
|
||||
height: 20px;
|
||||
background-color: #eee;
|
||||
margin: 0px 40rpx -8rpx 40rpx;
|
||||
}
|
||||
|
||||
.normal-login-container {
|
||||
width: 100%;
|
||||
|
||||
.logo-content {
|
||||
width: 100%;
|
||||
font-size: 21px;
|
||||
text-align: center;
|
||||
padding-top: 20%;
|
||||
|
||||
image {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-left: 10px;
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-form-content {
|
||||
text-align: center;
|
||||
margin: 20px auto;
|
||||
margin-top: 15%;
|
||||
width: 80%;
|
||||
|
||||
.input-item {
|
||||
margin: 20px auto;
|
||||
background-color: #f5f6f7;
|
||||
height: 45px;
|
||||
border-radius: 20px;
|
||||
|
||||
.icon {
|
||||
font-size: 38rpx;
|
||||
margin-left: 10px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.input {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
text-align: left;
|
||||
padding-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.login-btn {
|
||||
margin-top: 20px;
|
||||
height: 45px;
|
||||
// border-radius: 50px;
|
||||
}
|
||||
|
||||
.login-code {
|
||||
height: 38px;
|
||||
float: right;
|
||||
|
||||
.login-code-verification {
|
||||
height: 43px;
|
||||
// width: 200px;
|
||||
position: absolute;
|
||||
margin-left: 10px;
|
||||
margin-top: -1px;
|
||||
// width: 200rpx;
|
||||
line-height: 38px;
|
||||
// padding: 2px;
|
||||
border: 1px #96e811 solid;
|
||||
border-radius: 20px;
|
||||
color: black;
|
||||
font-size: 15px;
|
||||
background-color: #96e811;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-blue {
|
||||
color: #7f7f7f;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
background-color: #ddd;
|
||||
border-color: #ddd;
|
||||
color: #57a3f3;
|
||||
cursor: not-allowed; // 鼠标变化
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue