hjq/PixelAI-admin
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页已经修改密码的编写

Browse Source
This commit is contained in:
夕阳微笑1 2025-01-10 10:50:02 +08:00
parent 7183a5dd6b
commit 7d5b4773f1
7 changed files with 182 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/api/user/index.ts
View File

@ -12,6 +12,7 @@ import { baseUrlHost } from '../baseUrlHost';
* @method updateUser 更新用户
* @method getuserListAll 获取全部用户
* @method getUserDetail 查询单个用户
* @method updatepwd 修改用户密码
*/
export function userApi() {
@ -55,5 +56,12 @@ export function userApi() {
method: 'get',
});
},
updatepwd: (id:Number,data:object) => {
return request({
url: baseUrlHost + `/acUser/${id}/pwdreset`,
method: 'post',
data
})
}
};
}

7
src/i18n/lang/en.ts
View File

@ -129,9 +129,10 @@ export default {
dropdownDefault: 'default',
dropdownSmall: 'small',
dropdown1: 'home page',
dropdown2: 'Personal Center',
dropdown3: '404',
dropdown4: '401',
dropdown2:'updatepwd',
// dropdown2: 'Personal Center',
// dropdown3: '404',
// dropdown4: '401',
dropdown5: 'Log out',
dropdown6: 'Code warehouse',
searchPlaceholder: 'Menu search: support Chinese, routing path',

7
src/i18n/lang/zh-cn.ts
View File

@ -132,9 +132,10 @@ export default {
dropdownDefault: '默认',
dropdownSmall: '小型',
dropdown1: '首页',
dropdown2: '个人中心',
dropdown3: '404',
dropdown4: '401',
// dropdown2: '个人中心',
// dropdown3: '404',
// dropdown4: '401',
dropdown2:'修改密码',
dropdown5: '退出登录',
dropdown6: '代码仓库',
searchPlaceholder: '菜单搜索：支持中文、路由路径',

7
src/i18n/lang/zh-tw.ts
View File

@ -129,9 +129,10 @@ export default {
dropdownDefault: '默認',
dropdownSmall: '小型',
dropdown1: '首頁',
dropdown2: '個人中心',
dropdown3: '404',
dropdown4: '401',
dropdown2:'修改密碼',
// dropdown2: '個人中心',
// dropdown3: '404',
// dropdown4: '401',
dropdown5: '登出',
dropdown6: '程式碼倉庫',
searchPlaceholder: '選單蒐索：支援中文、路由路徑',

115
src/layout/navBars/topBar/user.vue
View File

@ -73,15 +73,38 @@
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="/home">{{ $t('message.user.dropdown1') }}</el-dropdown-item>
<!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item>
<el-dropdown-item command="/personal">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
<el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item>
<!-- <el-dropdown-item command="wareHouse">{{ $t('message.user.dropdown6') }}</el-dropdown-item> -->
<!-- <el-dropdown-item>
<el-button text style="height: 20px; ">
修改密码
</el-button>
</el-dropdown-item> -->
<el-dropdown-item command="updatepwd">{{ $t('message.user.dropdown2') }}</el-dropdown-item>
<!-- <el-dropdown-item command="/404">{{ $t('message.user.dropdown3') }}</el-dropdown-item>
<el-dropdown-item command="/401">{{ $t('message.user.dropdown4') }}</el-dropdown-item> -->
<el-dropdown-item divided command="logOut">{{ $t('message.user.dropdown5') }}</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
<Search ref="searchRef" />
<div class="system-menu-dialog-container">
<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="400px">
<el-form ref="userDialogFormRef" :rules="state.rules" :model="state.userDetailList" size="default" label-width="120px" v-loading="state.dialog.loading">
<el-form-item label="旧密码：" prop="old">
<el-input v-model="state.userDetailList.old"></el-input>
</el-form-item>
<el-form-item label="新密码：" prop="pwd">
<el-input v-model="state.userDetailList.pwd" placeholder="请输入新密码" clearable />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button plain @click="handleSure" type="primary" size="default">确 定</el-button>
<el-button plain @click="onCancel" size="default">关 闭</el-button>
</span>
</template>
</el-dialog>
</div>
</div>
</template>
@ -98,6 +121,7 @@ import other from '/@/utils/other';
import mittBus from '/@/utils/mitt';
import { Session, Local } from '/@/utils/storage';
import { useLoginApi } from '/@/api/login';
import { userApi } from '/@/api/user'
// 引入组件
const UserNews = defineAsyncComponent(() => import('/@/layout/navBars/topBar/userNews.vue'));
@ -106,6 +130,8 @@ const Search = defineAsyncComponent(() => import('/@/layout/navBars/topBar/searc
// 引入 api 请求接口
const loginApi = useLoginApi();
const userapi = userApi();
// 定义变量内容
const userNewsRef = ref();
const userNewsBadgeRef = ref();
@ -120,8 +146,23 @@ const state = reactive({
isScreenfull: false,
disabledI18n: 'zh-cn',
disabledSize: 'large',
userDetailList:{
old:'',
pwd:'',
},
dialog:{
isShowDialog: false,
title: '修改密码',
loading: false,
},
rules:{
old:{ required: true, message: '旧密码不能为空', trigger: 'blur' },
pwd:{ required: true, message: '新密码不能为空', trigger: 'blur' }
}
});
const userDialogFormRef = ref();
// 设置分割样式
const layoutUserFlexNum = computed(() => {
let num: string | number = '';
@ -152,7 +193,8 @@ const onLayoutSetingClick = () => {
mittBus.emit('openSetingsDrawer');
};
// 下拉菜单点击时
const onHandleCommandClick = (path: string) => {
const onHandleCommandClick = async(path: string) => {
if (path === 'logOut') {
ElMessageBox({
closeOnClickModal: false,
@ -189,10 +231,73 @@ const onHandleCommandClick = (path: string) => {
.catch(() => {});
} else if (path === 'wareHouse') {
window.open('https://gitee.com/lyt-top/vue-next-admin');
} else {
} else if(path === 'updatepwd'){
state.dialog.isShowDialog = true;
state.userDetailList.pwd ='';
try{
const res = await userapi.getUserDetail(localStorage.getItem('userid'));
if(res?.success){
state.userDetailList.old = res.data.password;
// console.log(111111111,state.userDetailList.oldpwd)
}
}catch(error){
console.error(error);
}
}
else {
router.push(path);
}
};
// 关闭弹窗
const closeDialog = () => {
state.dialog.isShowDialog = false;
};
//确定
const handleSure = () =>{
userDialogFormRef.value?.validate(async(valid:boolean) =>{
if(valid){
// console.log(111111111)
try{
const res = await userapi.updatepwd(localStorage.getItem('userid'),state.userDetailList);
if(res?.success){
ElMessage.success('修改成功！');
reset();
closeDialog();
ElMessageBox.alert('你已被登出，请重新登录', '提示', {})
.then(async () => {
// 清除缓存/token等
console.log('清除缓存/token等');
Session.clear();
// 使用 reload 时，不需要调用 resetRoute() 重置路由
window.location.reload();
window.location.href = import.meta.env.MODE === "development" ? '/' : '/pixelAdmin/'; // 去登录页
})
.catch(() => {});
}
}catch(error){
console.error(error);
ElMessage.error('修改失败！');
}
}
})
};
// 取消
const onCancel = () => {
closeDialog();
};
const reset = () =>{
state.userDetailList = {
old:'',
pwd:''
}
};
// 菜单搜索点击
const onSearchClick = () => {
searchRef.value.openSearch();

62
src/views/home/index.vue
View File

@ -14,28 +14,28 @@
</div>
<div class="personal-user-right">
<el-row>
<el-col :span="24" class="personal-title mb18">{{ currentTime }}，admin，生活变的再糟糕，也不妨碍我变得更好！ </el-col>
<el-col :span="24" class="personal-title mb18">{{ currentTime }}，{{username}}，生活变的再糟糕，也不妨碍我变得更好！ </el-col>
<el-col :span="24">
<el-row>
<el-col :xs="24" :sm="8" class="personal-item mb6">
<div class="personal-item-label">昵称：</div>
<div class="personal-item-value">小柒</div>
<div class="personal-item-value">{{ username }}</div>
</el-col>
<el-col :xs="24" :sm="16" class="personal-item mb6">
<div class="personal-item-label">身份：</div>
<div class="personal-item-value">超级管理</div>
<div class="personal-item-value">{{ acgroup }}</div>
</el-col>
</el-row>
</el-col>
<el-col :span="24">
<el-row>
<el-col :xs="24" :sm="8" class="personal-item mb6">
<!-- <el-col :xs="24" :sm="8" class="personal-item mb6">
<div class="personal-item-label">登录IP：</div>
<div class="personal-item-value">192.168.1.1</div>
</el-col>
</el-col> -->
<el-col :xs="24" :sm="16" class="personal-item mb6">
<div class="personal-item-label">登录时间：</div>
<div class="personal-item-value">2021-02-05 18:47:26</div>
<div class="personal-item-label">创建时间：</div>
<div class="personal-item-value">{{creatime}}</div>
</el-col>
</el-row>
</el-col>
@ -193,17 +193,22 @@
</template>
<script setup lang="ts" name="personal">
import { reactive, computed,ref } from 'vue';
import { reactive, computed,ref, onMounted } from 'vue';
import { formatAxis } from '/@/utils/formatTime';
import { newsInfoList, recommendList } from '../personal/mock';
import { userApi } from '/@/api/user';
import { ElMessage,TableColumnCtx } from 'element-plus';
const userapi = userApi();
// 定义变量内容
const state = reactive<PersonalState>({
const state = reactive({
newsInfoList,
recommendList,
personalForm: {
name: '',
email: '',
mail: '',
autograph: '',
occupation: '',
phone: '',
@ -219,6 +224,39 @@ const catchphraseDate = ref([
"良好的开端是成功的一半。"
])
//用户信息表
const username = ref('');
const creatime = ref('');
const acgroup = ref('');
//获取用户详细信息
const getuserDetail = async() =>{
try{
const res = await userapi.getUserDetail(localStorage.getItem('userid'));
// console.log(res);
if(res?.success){
username.value = res.data.username;
creatime.value = dateFormatter(res.data)
acgroup.value = res.data.acgroup;
if(acgroup.value == '1'){
acgroup.value = '管理员'
}else{
acgroup.value = '用户'
}
}
}catch(error){
console.error(error);
}
};
// 日期格式化
const dateFormatter = (row: any, column: TableColumnCtx<String>) => {
let date = new Date(row.createtime);
return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
};
const value = ref(new Date())
// 当前时间提示语
@ -226,7 +264,9 @@ const currentTime = computed(() => {
return formatAxis(new Date());
});
// 图片基本路径
onMounted(() => {
getuserDetail();
})
</script>
<style scoped lang="scss">

1
src/views/login/component/account.vue
View File

@ -106,6 +106,7 @@ const onSignIn = async () => {
// 存储 token 到浏览器缓存
Session.set('token', res.data.token);
localStorage.setItem('acgroup', JSON.stringify(res.data.user.acgroup));
localStorage.setItem('userid',JSON.stringify(res.data.user.id))
// usertype判断登录角色
// Cookies.set('userName', res.data.records.acgroup === 1 ? 'admin' : 'user');
Cookies.set('userName', 'admin');