76 lines
2.1 KiB
Vue
76 lines
2.1 KiB
Vue
<template>
|
||
<header>
|
||
<div class="logo flex align-center" @click="goToHome">
|
||
<img
|
||
width="45"
|
||
class="mr10"
|
||
src="@/assets/images/jinghui.png"
|
||
alt=""
|
||
/>林芝公交管理平台
|
||
</div>
|
||
<div class="right">
|
||
<div><img src="@/assets/images/peo.png" /></div>
|
||
<div class="detail">
|
||
<div class="hd">
|
||
<div class="name">姓名：{{ username }}</div>
|
||
<div class="work">单位：{{ deptName }}</div>
|
||
</div>
|
||
<el-dropdown :hide-on-click="false">
|
||
<span class="el-dropdown-link">
|
||
<el-icon :size="20" color="#fff"> <CaretBottom /> </el-icon>
|
||
</span>
|
||
<template #dropdown>
|
||
<el-dropdown-menu class="loginOut" @click="goToHome">
|
||
<el-dropdown-item command="logout">前往前台</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
<el-dropdown-menu class="loginOut" @click="logout">
|
||
<el-dropdown-item command="logout">退出登录</el-dropdown-item>
|
||
</el-dropdown-menu>
|
||
</template>
|
||
</el-dropdown>
|
||
</div>
|
||
<!-- <div @click="goToHome">
|
||
<img src="@/assets/images/meun.png" />
|
||
</div> -->
|
||
</div>
|
||
</header>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { getItem } from "@/utils/storage";
|
||
import NavBar from "./NavBar.vue";
|
||
import { useRouter } from "vue-router";
|
||
import { onMounted, ref } from "vue";
|
||
import { useStore } from "vuex";
|
||
const store = useStore();
|
||
const username = ref("测试");
|
||
const deptName = ref("");
|
||
|
||
const router = useRouter();
|
||
onMounted(() => {
|
||
deptName.value = localStorage.getItem("deptId")
|
||
? JSON.parse(localStorage.getItem("deptId"))[0].deptName
|
||
: "";
|
||
});
|
||
|
||
// 路由跳转
|
||
function goToHome() {
|
||
window.location.href = "/";
|
||
}
|
||
|
||
const active = ref("");
|
||
onMounted(() => {
|
||
//登陆用户信息
|
||
username.value = localStorage.getItem("USERNAME");
|
||
let dept = getItem("deptId");
|
||
active.value = "LZ";
|
||
});
|
||
const logout = () => {
|
||
store.dispatch("user/logout");
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import "@/assets/css/layout.scss";
|
||
</style>
|