注销账号,账号安全页面功能开发

This commit is contained in:
fengerli
2025-09-18 14:20:08 +08:00
parent d8f281a891
commit 5116ae4ff7
8 changed files with 404 additions and 3 deletions

View File

@ -0,0 +1,145 @@
<template>
<div class="pageContent">
<view class="content">
<view class='ver_item'>
<input type="password" v-model="password" placeholder="请输入密码" class="input" />
</view>
<view class='ver_item'>
<input type="password" v-model="surePassword" placeholder="请输入确认密码" class="input" />
</view>
<button class="login-btn" @click="handleLogin">
确认
</button>
</view>
<!-- 成功提示弹框 -->
<CustomPopup :show="showPopupFlag" :title="popupTitle" :message="popupMessage"
icon="/static/images/common/sendSucc.png" :confirm-text="popupConfirmText" :show-cancel="false"
@confirm="onPopupConfirm" />
</div>
</template>
<script>
import CustomPopup from '@/components/CustomPopup/CustomPopup.vue'
import md5 from 'blueimp-md5'
import {
updatePassword
} from '@/api/common/login.js';
export default {
components: {
CustomPopup
},
data() {
return {
password: "",
surePassword: "",
showPopupFlag: false,
popupTitle: '',
popupMessage: '修改成功!',
popupConfirmText: '确认',
}
},
methods: {
// 确认
async handleLogin() {
if (!this.password.trim()) {
return uni.showToast({
title: "请输入密码",
icon: "none",
duration: 1500
});
return false
}
if (!this.surePassword.trim()) {
return uni.showToast({
title: "请输入确认密码",
icon: "none",
duration: 1500
});
return false
}
if (this.password.trim() !== this.surePassword.trim()) {
return uni.showToast({
title: "两次密码输入不一致",
icon: "none",
duration: 1500
});
return false
}
try {
uni.showLoading({
title: '加载中...'
})
// 调用忘记密码接口
const res = await updatePassword({
password: md5(this.password)
})
if (res.code == 200) {
uni.hideLoading()
this.showPopupFlag = true
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
} catch (error) {
uni.showToast({
title: error.msg || '登录失败',
icon: 'none'
});
uni.hideLoading()
}
},
// 确认
onPopupConfirm(){
uni.navigateBack()
}
}
}
</script>
<style scoped>
.pageContent {
background-color: rgb(18, 18, 18);
height: 100vh;
padding: 20rpx;
}
.content_con {
position: absolute;
top: 220rpx;
color: rgba(255, 255, 255, 0.87);
left: 30rpx;
font-size: 60rpx;
}
.input {
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
height: 80rpx;
color: rgba(255, 255, 255, 0.6);
margin-top: 50rpx;
}
.ver_item {
position: relative;
}
.switch-flex {
display: flex;
justify-content: space-between;
margin-top: 40rpx;
color: rgba(255, 255, 255, 0.6);
}
.switch-login {
color: rgb(187, 230, 0);
font-size: 28rpx;
}
.login-btn {
margin-top: 200rpx;
background-color: rgb(187, 230, 0);
color: rgb(35, 35, 35);
border-radius: 50rpx;
}
</style>