141 lines
4.3 KiB
Vue
141 lines
4.3 KiB
Vue
<!--
|
|
@auther: bypanghu<bypanghu@163.com>
|
|
@date: 2024/5/7
|
|
!-->
|
|
|
|
<template>
|
|
<div class="flex justify-between fixed top-0 left-0 right-0 z-10 h-16 bg-white text-slate-700 dark:text-slate-300 dark:bg-slate-900 shadow dark:shadow-gray-700 flex items-center px-2">
|
|
<div
|
|
class="flex items-center cursor-pointer flex-1"
|
|
>
|
|
<div class="flex items-center cursor-pointer" @click="router.push({ path: '/' })">
|
|
<img
|
|
alt
|
|
class="h-12 bg-white rounded-full"
|
|
:src="$GIN_VUE_ADMIN.appLogo"
|
|
>
|
|
<div
|
|
v-if="!isMobile"
|
|
class="inline-flex font-bold text-2xl ml-2"
|
|
:class="(config.side_mode === 'head' || config.side_mode === 'combination') &&'min-w-fit'"
|
|
>
|
|
{{ $GIN_VUE_ADMIN.appName }}
|
|
</div>
|
|
</div>
|
|
|
|
<el-breadcrumb v-show="!isMobile" v-if="config.side_mode !== 'head'&& config.side_mode !== 'combination'" class="ml-4">
|
|
<el-breadcrumb-item
|
|
v-for="item in matched.slice(1, matched.length)"
|
|
:key="item.path"
|
|
>
|
|
{{
|
|
fmtTitle(item.meta.title, route)
|
|
}}
|
|
</el-breadcrumb-item>
|
|
</el-breadcrumb>
|
|
<gva-aside v-if="config.side_mode === 'head' && !isMobile" class="flex-1" />
|
|
<gva-aside v-if="config.side_mode === 'combination' && !isMobile" mode="head" class="flex-1" />
|
|
</div>
|
|
|
|
<div class="ml-2 flex items-center">
|
|
<tools />
|
|
<el-dropdown>
|
|
<div
|
|
class="flex justify-center items-center h-full w-full"
|
|
>
|
|
<span
|
|
class="cursor-pointer flex justify-center items-center text-black dark:text-gray-100"
|
|
>
|
|
<CustomPic />
|
|
<span
|
|
v-show="!isMobile"
|
|
class="w-16"
|
|
>{{ userStore.userInfo.nickName }}</span>
|
|
<el-icon>
|
|
<arrow-down />
|
|
</el-icon>
|
|
</span>
|
|
</div>
|
|
<template #dropdown>
|
|
<el-dropdown-menu>
|
|
<el-dropdown-item>
|
|
<span class="font-bold">
|
|
当前角色：{{
|
|
userStore.userInfo.authority.authorityName
|
|
}}
|
|
</span>
|
|
</el-dropdown-item>
|
|
<template v-if="userStore.userInfo.authorities">
|
|
<el-dropdown-item
|
|
v-for="item in userStore.userInfo.authorities.filter(
|
|
(i) =>
|
|
i.authorityId !==
|
|
userStore.userInfo.authorityId
|
|
)"
|
|
:key="item.authorityId"
|
|
@click="changeUserAuth(item.authorityId)"
|
|
>
|
|
<span>
|
|
切换为：{{ item.authorityName }}
|
|
</span>
|
|
</el-dropdown-item>
|
|
</template>
|
|
<el-dropdown-item icon="avatar" @click="toPerson">
|
|
个人信息
|
|
</el-dropdown-item>
|
|
<el-dropdown-item
|
|
icon="reading-lamp"
|
|
@click="userStore.LoginOut"
|
|
>
|
|
登 出
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</template>
|
|
</el-dropdown>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import tools from "./tools.vue"
|
|
import CustomPic from '@/components/customPic/index.vue'
|
|
import { useUserStore } from "@/pinia/modules/user";
|
|
import { useRoute, useRouter } from 'vue-router'
|
|
import { useAppStore } from "@/pinia"
|
|
import { storeToRefs } from "pinia"
|
|
import { computed, } from 'vue'
|
|
import { setUserAuthority } from '@/api/user'
|
|
import { fmtTitle } from "@/utils/fmtRouterTitle";
|
|
import gvaAside from "@/view/layout/aside/index.vue"
|
|
const userStore = useUserStore();
|
|
const router = useRouter()
|
|
const route = useRoute()
|
|
const appStore = useAppStore()
|
|
const { device , config } = storeToRefs(appStore)
|
|
const isMobile = computed(() =>{
|
|
return device.value === 'mobile'
|
|
})
|
|
const toPerson = () => {
|
|
router.push({ name: "person" });
|
|
};
|
|
const matched = computed(() => route.meta.matched);
|
|
|
|
|
|
const changeUserAuth = async (id) => {
|
|
const res = await setUserAuthority({
|
|
authorityId: id,
|
|
});
|
|
if (res.code === 0) {
|
|
window.sessionStorage.setItem("needCloseAll", "true");
|
|
window.sessionStorage.setItem("needToHome", "true");
|
|
window.location.reload();
|
|
}
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
|
|
</style>
|