增加密码修改功能,删除注销账户

This commit is contained in:
TOP糯米 2023-03-17 00:06:47 +08:00
parent 4cbefe0504
commit 2fcd9ceda3
3 changed files with 163 additions and 9 deletions

View File

@ -55,6 +55,12 @@
"navigationBarTitleText": "我的" "navigationBarTitleText": "我的"
} }
}, },
{
"path": "pages/member/password",
"style": {
"navigationBarTitleText": "修改密码"
}
},
{ {
"path": "pages/member/cash-withdraw", "path": "pages/member/cash-withdraw",
"style": { "style": {
@ -77,7 +83,7 @@
{ {
"path": "pages/get/detail", "path": "pages/get/detail",
"style": { "style": {
"navigationBarTitleText": "详情" "navigationBarTitleText": "单详情"
} }
} }
], ],

View File

@ -0,0 +1,150 @@
<template>
<app-layout title="修改密码">
<view class="common-form-container">
<view class="input-item">
<view class="title-box">
<text>验证码</text>
</view>
<view class="input-box">
<input
class="input"
v-model="verificationCode"
placeholder="请输入验证码"
placeholder-class="placeholder-style-3"
/>
<view class="get-code" @click="getVerifyCode">
<text class="text active" v-if="canUse">获取验证码</text>
<text class="text" v-else>{{ sec }}s后重新获取</text>
</view>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>新密码</text>
</view>
<view class="input-box">
<input class="input" v-model="password" placeholder="请输入新密码" placeholder-class="placeholder-style-3" />
</view>
</view>
</view>
<view class="common-save-form-btn">
<view class="btn" @click="submit">修改</view>
</view>
</app-layout>
</template>
<script>
import AppLayout from "@/components/layout/layout";
import { mapState } from "vuex";
export default {
name: "member-password",
data() {
return {
timeTask: null,
canUse: true,
sec: 0,
password: "",
verificationCode: "",
};
},
components: {
AppLayout,
},
computed: {
...mapState({
isLogin: (state) => state.user.token.length > 0,
userInfo: (state) => state.user.info,
}),
},
onLoad() {
if (!this.isLogin) {
return this.$store.commit("user/showLoginModal", true);
}
},
onShow() {},
onReady() {},
onReachBottom() {},
onPullDownRefresh() {},
methods: {
/**
* 获取验证码
*/
getVerifyCode() {
if (this.canUse) {
this.$models.user
.sendVerificationCode(this.userInfo.mobile)
.then((response) => {
this.parseTime(60);
})
.catch((e) => {
this.$utils.toast(e);
});
} else {
this.$utils.toast("请稍后再试");
}
},
/**
* 倒计时
*/
parseTime(sec) {
const that = this;
this.canUse = false;
this.sec = sec;
clearInterval(this.timeTask);
this.timeTask = setInterval(() => {
that.sec -= 1;
if (that.sec <= 0) {
that.canUse = true;
that.sec = 0;
}
}, 1000);
},
/**
* 修改密码
*/
submit() {
this.$models.user
.resetPassword(
{
username: this.userInfo.mobile,
password: this.password,
},
this.verificationCode
)
.then((message) => {
this.$utils.toast(message).then(() => {
this.$utils.toPage("", {}, "back");
});
})
.catch((e) => {
this.$utils.toast(e);
});
},
},
};
</script>
<style lang="less" scoped>
.common-form-container {
.input-item {
position: relative;
}
.get-code {
position: absolute;
top: 0;
right: 0;
display: inline-block;
padding: 24rpx 0;
.text {
font-size: 28rpx;
color: #999999;
}
.text.active {
color: #ffa800;
}
}
.title-box {
font-weight: normal;
}
}
</style>

View File

@ -8,7 +8,7 @@
<text class="content version">v1.02</text> <text class="content version">v1.02</text>
</view> </view>
</view> </view>
<view class="widget-item"> <view class="widget-item" @click="toPage('/pages/member/password')">
<text class="title limit-line clamp-1">密码管理</text> <text class="title limit-line clamp-1">密码管理</text>
<view class="item-content"> <view class="item-content">
<text class="iconfont icon-jinru"></text> <text class="iconfont icon-jinru"></text>
@ -32,12 +32,6 @@
<text class="iconfont icon-jinru"></text> <text class="iconfont icon-jinru"></text>
</view> </view>
</view> </view>
<view class="widget-item last">
<text class="title limit-line clamp-1">注销账户</text>
<view class="item-content">
<text class="iconfont icon-jinru"></text>
</view>
</view>
</view> </view>
<view class="common-save-form-btn"> <view class="common-save-form-btn">
<view class="btn">退出账户</view> <view class="btn">退出账户</view>
@ -61,7 +55,11 @@ export default {
onReady() {}, onReady() {},
onReachBottom() {}, onReachBottom() {},
onPullDownRefresh() {}, onPullDownRefresh() {},
methods: {}, methods: {
toPage(url) {
this.$utils.toPage(url);
},
},
}; };
</script> </script>