122 lines
3.2 KiB
Vue
122 lines
3.2 KiB
Vue
<template>
|
|
<a-dropdown>
|
|
<a-spin v-if="!user" size="small" />
|
|
<div v-else class="header-avatar">
|
|
<a-icon class="avatar" type="user" />
|
|
<span class="name">{{ user.userName }}</span>
|
|
</div>
|
|
<a-menu slot="overlay">
|
|
<!-- <a-menu-item disabled>
|
|
<a-icon type="smile" />
|
|
{{ user.role && user.role.label }}
|
|
</a-menu-item> -->
|
|
<a-menu-item @click="modifySelfInfo">
|
|
<a-icon type="user" />
|
|
<span>个人信息</span>
|
|
</a-menu-item>
|
|
<a-menu-item @click="modifyPassword">
|
|
<a-icon type="lock" />
|
|
<span>修改密码</span>
|
|
</a-menu-item>
|
|
<a-menu-divider />
|
|
<a-menu-item @click="logout">
|
|
<a-icon type="poweroff" />
|
|
<span>退出登录</span>
|
|
</a-menu-item>
|
|
</a-menu>
|
|
</a-dropdown>
|
|
</template>
|
|
|
|
<script>
|
|
import UpdatePassword from "@/components/common/UpdatePassword";
|
|
import EditStudent from "@/components/edit/EditStudent";
|
|
import EditTeacher from "@/components/edit/EditTeacher";
|
|
import { mapState, mapActions } from "vuex";
|
|
|
|
export default {
|
|
name: "LoginState",
|
|
computed: {
|
|
...mapState(["user"]),
|
|
},
|
|
methods: {
|
|
...mapActions(["initUser"]),
|
|
logout() {
|
|
this.$store.commit("logout");
|
|
this.$router.replace("/login");
|
|
},
|
|
modifyPassword() {
|
|
let vnode;
|
|
this.$drawer({
|
|
title: "修改密码",
|
|
content: (h) => (vnode = <UpdatePassword />),
|
|
onOk: async () => {
|
|
const values = await vnode.componentInstance.validate();
|
|
return this.$api
|
|
.updatePassword({
|
|
account: this.user.account,
|
|
identity: this.user.identity,
|
|
oldVal: values.oldVal,
|
|
newVal: values.newVal,
|
|
})
|
|
.then(() => {
|
|
this.$message.success("修改成功");
|
|
})
|
|
.catch((e) => {
|
|
console.error(e);
|
|
this.$message.error(e.msg || "修改失败");
|
|
throw e;
|
|
});
|
|
},
|
|
});
|
|
},
|
|
modifySelfInfo() {
|
|
let vnode;
|
|
this.$drawer({
|
|
title: "修改个人信息",
|
|
content: (h) =>
|
|
(vnode =
|
|
this.$store.state.user.userPrivileges == 2 ? (
|
|
<EditStudent type="update" data={this.user} />
|
|
) : (
|
|
<EditTeacher type="update" data={this.user} />
|
|
)),
|
|
onOk: async () => {
|
|
const values = await vnode.componentInstance.validate();
|
|
const data = {
|
|
phone: values.phone,
|
|
email: values.email,
|
|
UserPassword: values.password,
|
|
sTId: values.stid,
|
|
};
|
|
return this.$api
|
|
.updateUser(data)
|
|
.then(() => {
|
|
this.$message.success("修改成功");
|
|
this.$store.dispatch("initUser");
|
|
})
|
|
.catch((e) => {
|
|
console.error(e);
|
|
this.$message.error(e.msg || "修改失败");
|
|
throw e;
|
|
});
|
|
},
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="stylus">
|
|
.header-avatar
|
|
display inline-flex
|
|
align-items center
|
|
cursor pointer
|
|
padding 0 10px
|
|
.avatar
|
|
position relative
|
|
top -1px
|
|
margin-right 8px
|
|
.name
|
|
font-weight 500
|
|
</style>
|