Files
mosr-web/src/layout/siderbar/index.vue
2024-11-07 11:04:16 +08:00

55 lines
1.4 KiB
Vue

<template>
<div class="logo" ref="logo">
<img src="../../assets/kylogo.png" alt="">
<!-- <span v-if="!siderbarStore.isCollapse">科技创新项目管理平台</span> -->
<span v-if="!siderbarStore.isCollapse"></span>
</div>
<el-scrollbar :height="`calc(100vh - ${logoHeight}px)`" style="background-color: #ffffff">
<el-menu
router
:default-active="activeMenu"
:unique-opened="true"
:collapse="siderbarStore.isCollapse"
active-text-color="#927648"
text-color="#575757"
style="border: none;"
:collapse-transition="false"
>
<MenuItem :menu-item="permisstionStore.menuList"></MenuItem>
</el-menu>
</el-scrollbar>
</template>
<script setup>
import MenuItem from './MenuItem.vue';
import {useRoute} from 'vue-router'
import {useSiderBar} from '@/stores/siderbar.js'
import {usePermisstionStroe} from '@/stores/permisstion.js'
import {nextTick} from 'vue';
const siderbarStore = useSiderBar()
const permisstionStore = usePermisstionStroe()
const route = useRoute()
const link = ref('')
const title = ref('')
const logo = ref(null)
const logoHeight = ref()
const getLogoH = () => {
logoHeight.value = logo.value.offsetHeight
}
const activeMenu = computed(() => {
const {path} = route
return path
})
onMounted(() => {
nextTick(() => {
getLogoH()
})
})
window.addEventListener('resize', () => {
getLogoH()
})
</script>