151 lines
3.9 KiB
Vue
151 lines
3.9 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="item">
|
||
<view class="item-title">{{content.title}}</view>
|
||
<!-- 修改支付密码输入框 -->
|
||
<input v-if="content.type === 'pay'" class="input-desc" :value="cellPhone" type="number" maxlength="11" data-name='phone' @input="handerChangeClick" :placeholder='content.defultDesc' />
|
||
|
||
<!-- 修改登录密码输入框 -->
|
||
<input v-if="content.type === 'login'" class="input-desc" password :value="cellPhone" data-name='phone' @input="handerChangeClick" :placeholder='content.defultDesc' />
|
||
</view>
|
||
|
||
<view class="item">
|
||
<view class="item-title">{{content.subTitle}}</view>
|
||
<input class="input-desc" :value="passWord" data-name='pwd' password @input="handerChangeClick" :placeholder="content.defultSubDesc" />
|
||
</view>
|
||
<view class="tips">
|
||
<text class="desc">提示：</text>
|
||
如果您是微信登录的账户，请直接填写新密码，然后点击确认修改即可设置登录密码
|
||
</view>
|
||
|
||
<!-- 修改支付密码禁用规则： 手机号不存在 或者 手机号不足11位 或者 密码不存在 则禁止点击 -->
|
||
<button
|
||
v-if="content.type === 'pay'"
|
||
class="submit_reset"
|
||
:disabled='!cellPhone || cellPhone.length !== 11 || !passWord'
|
||
@click="handleSubmit"
|
||
>
|
||
确认{{content.btnText}}
|
||
</button>
|
||
<!-- 修改登录密码禁用规则：新密码不存在 或者 确认密码不存在 则禁止点击 -->
|
||
<button
|
||
v-if="content.type === 'login'"
|
||
class="submit_reset"
|
||
:disabled='!cellPhone || !passWord'
|
||
@click="handleSubmit"
|
||
>
|
||
确认{{content.btnText}}
|
||
</button>
|
||
|
||
<nav-footer />
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import { request } from '../../../utils/index';
|
||
import { pageOptionType } from './constant';
|
||
import { apiArr } from '../../../api/user';
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
cellPhone: null,
|
||
passWord: null,
|
||
type: '',
|
||
content:{},
|
||
}
|
||
},
|
||
methods: {
|
||
// 修改输入框值
|
||
handerChangeClick(event) {
|
||
const {value} = event.detail;
|
||
const {name} = event.currentTarget.dataset;
|
||
if (name === 'phone') {
|
||
this.cellPhone = value;
|
||
};
|
||
if (name === 'pwd') {
|
||
this.passWord = value;
|
||
}
|
||
},
|
||
|
||
|
||
// 提交修改
|
||
async handleSubmit() {
|
||
/**
|
||
* 参数场景说明：
|
||
* 修改登录密码页面时，cellPhone 是新设密码，passWord 是确认密码
|
||
* 修改支付密码页面时，cellPhone 是已绑定手机号，passWord 是支付密码
|
||
*/
|
||
const {cellPhone, passWord, type} = this;
|
||
|
||
if (type === 'login') {
|
||
if (cellPhone !== passWord) {
|
||
uni.showToast({
|
||
title: '新密码与确认密码不一致',
|
||
icon: 'none',
|
||
duration: 2000
|
||
});
|
||
return
|
||
}
|
||
const res = await request(apiArr.modifyPass, "POST", {
|
||
new_password: cellPhone,
|
||
conform_password: passWord,
|
||
});
|
||
|
||
uni.showToast({
|
||
title: '修改登录密码成功',
|
||
icon: 'success',
|
||
success () {
|
||
setTimeout(() => {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
}, 2000)
|
||
}
|
||
})
|
||
}
|
||
|
||
if (type === 'pay') {
|
||
const res = await request(apiArr.payPass, "POST", {
|
||
mobile: cellPhone,
|
||
pay_password: passWord,
|
||
});
|
||
|
||
uni.showToast({
|
||
title: '设置支付密码成功',
|
||
icon: 'success',
|
||
success () {
|
||
setTimeout(() => {
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
}, 2000)
|
||
}
|
||
})
|
||
};
|
||
},
|
||
|
||
|
||
|
||
|
||
},
|
||
onLoad(options) {
|
||
// 基于父页面传递参数设置页面名称
|
||
uni.setNavigationBarTitle({
|
||
title: options.title
|
||
});
|
||
|
||
// 根据父页面传递type参数映射页面渲染参数
|
||
this.content = pageOptionType[options.type];
|
||
this.type = options.type;
|
||
},
|
||
onShow() {
|
||
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
@import url("./index.css");
|
||
</style> |