120 lines
3.7 KiB
Vue
120 lines
3.7 KiB
Vue
<template>
|
|
<view class="new-password">
|
|
<uni-forms ref="formRef" label-align="left" :model="vdata.formData" :rules="rules">
|
|
<uni-forms-item label="新密码" name="pwd">
|
|
<uni-easyinput class='jeepay-easyinput' :inputBorder="false" :type="vdata.isShowPwd ? 'text' : 'password'" v-model="vdata.formData.pwd" :clearable="false" placeholder="请输入登录密码" >
|
|
<template #suffixIcon> <view class='show-tips' style="color: rgba(88,132,204,1);font-weight: 400;font-size: 32rpx;" @tap="vdata.isShowPwd = !vdata.isShowPwd ">{{ vdata.isShowPwd ? '隐藏' : '显示' }}</view> </template>
|
|
</uni-easyinput>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="确认新密码" name="newPwd">
|
|
<uni-easyinput class='jeepay-easyinput' :inputBorder="false" :type="vdata.isShowNewPwd ? 'text' : 'password'" v-model="vdata.formData.newPwd" :clearable="false" placeholder="请输入登录密码" >
|
|
<template #suffixIcon> <view class='show-tips' style="color: rgba(88,132,204,1);font-weight: 400;font-size: 32rpx;" @tap="vdata.isShowNewPwd = !vdata.isShowNewPwd ">{{ vdata.isShowNewPwd ? '隐藏' : '显示' }}</view> </template>
|
|
</uni-easyinput>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
<view class="btn-box">
|
|
<Button @tap="confirmRetrieve">确认修改</Button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive } from 'vue';
|
|
import { onLoad } from '@dcloudio/uni-app';
|
|
import { $retrieve, $getPasswordRules } from '@/http/apiManager.js';
|
|
import storageManage from '@/commons/utils/storageManage.js'
|
|
import infoBox from '@/commons/utils/infoBox.js';
|
|
import go from '@/commons/utils/go.js'
|
|
import timer from '@/commons/utils/timer.js'
|
|
import formUtil from '@/commons/utils/formUtil.js'
|
|
const rules = {
|
|
pwd: {
|
|
rules:[ formUtil.rules.requiredInputShowToast('新密码') ],
|
|
},
|
|
newPwd: {
|
|
rules:[ formUtil.rules.requiredInputShowToast('确认密码') ],
|
|
},
|
|
}
|
|
const formRef = ref()
|
|
const vdata = reactive({
|
|
formData: {
|
|
pwd: '', // 新密码
|
|
newPwd: '' // 确认新密码
|
|
},
|
|
isShowPwd: false, // 是否显示新密码
|
|
isShowNewPwd: false, // 是否显示确认新密码
|
|
params: null,
|
|
passwordRules: /^$/, //密码规则
|
|
passwordRulesText: '',//密码规则提示文字
|
|
})
|
|
|
|
onLoad(options => {
|
|
vdata.params = options
|
|
getPasswordRules()
|
|
});
|
|
|
|
const getPasswordRules = () => {
|
|
$getPasswordRules().then(({bizData}) => {
|
|
vdata.passwordRules = new RegExp(bizData.regexpRules)
|
|
vdata.passwordRulesText = bizData.errTips
|
|
})
|
|
}
|
|
|
|
const confirmRetrieve = () => {
|
|
formUtil.validate(formRef.value).then(() => {
|
|
let { pwd, newPwd } = vdata.formData;
|
|
if(!vdata.passwordRules.test(pwd) || !vdata.passwordRules.test(newPwd)) {
|
|
return infoBox.showToast(vdata.passwordRulesText)
|
|
}
|
|
if (pwd !== newPwd) {
|
|
return infoBox.showToast('两次密码输入不一致')
|
|
}
|
|
$retrieve({
|
|
...vdata.params,
|
|
newPwd
|
|
}).then(() => {
|
|
storageManage.token() && storageManage.token(null, true)
|
|
infoBox.showToast('设置成功').then(() => {
|
|
go.to('PAGES_LOGIN', {}, go.GO_TYPE_RELAUNCH)
|
|
})
|
|
})
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.new-password {
|
|
min-height: 100vh;
|
|
background-color: $v-color-bgrey;
|
|
::v-deep.uni-forms-item.is-direction-left {
|
|
padding: 0 40rpx;
|
|
.uni-forms-item__label {
|
|
width: 190rpx !important;
|
|
font-size: 32rpx !important;
|
|
font-weight: 400;
|
|
white-space: nowrap;
|
|
color: rgba(102,102,102,1);
|
|
text-indent: 0 !important;
|
|
|
|
}
|
|
.uni-easyinput__placeholder-class {
|
|
font-size: 32rpx !important;
|
|
font-weight: 400 !important;
|
|
}
|
|
}
|
|
|
|
.btn-box {
|
|
position: fixed;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
height: 200rpx;
|
|
border: 1rpx solid rgba(237,237,237,1);
|
|
background: rgba(255,255,255,0.85);
|
|
.jeepay-btn {
|
|
margin: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|