首页已经修改密码的编写
This commit is contained in:
parent
7183a5dd6b
commit
7d5b4773f1
@ -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
|
||||
})
|
||||
}
|
||||
};
|
||||
}
|
||||
|
@ -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',
|
||||
|
@ -132,9 +132,10 @@ export default {
|
||||
dropdownDefault: '默认',
|
||||
dropdownSmall: '小型',
|
||||
dropdown1: '首页',
|
||||
dropdown2: '个人中心',
|
||||
dropdown3: '404',
|
||||
dropdown4: '401',
|
||||
// dropdown2: '个人中心',
|
||||
// dropdown3: '404',
|
||||
// dropdown4: '401',
|
||||
dropdown2:'修改密码',
|
||||
dropdown5: '退出登录',
|
||||
dropdown6: '代码仓库',
|
||||
searchPlaceholder: '菜单搜索:支持中文、路由路径',
|
||||
|
@ -129,9 +129,10 @@ export default {
|
||||
dropdownDefault: '默認',
|
||||
dropdownSmall: '小型',
|
||||
dropdown1: '首頁',
|
||||
dropdown2: '個人中心',
|
||||
dropdown3: '404',
|
||||
dropdown4: '401',
|
||||
dropdown2:'修改密碼',
|
||||
// dropdown2: '個人中心',
|
||||
// dropdown3: '404',
|
||||
// dropdown4: '401',
|
||||
dropdown5: '登出',
|
||||
dropdown6: '程式碼倉庫',
|
||||
searchPlaceholder: '選單蒐索:支援中文、路由路徑',
|
||||
|
@ -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();
|
||||
|
@ -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">
|
||||
|
@ -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');
|
||||
|
Loading…
Reference in New Issue
Block a user