fix : 修复实施图片
This commit is contained in:
@@ -1,71 +1,71 @@
|
||||
<template>
|
||||
<!-- 有子菜单 -->
|
||||
<template v-for="item in menuItem" :key="item.path">
|
||||
<el-sub-menu v-if="checkMenuItem(item)" :index="item.path">
|
||||
<template #title>
|
||||
<svg-icon :name="item.icon"/>
|
||||
<span>{{ item.title }}</span>
|
||||
</template>
|
||||
<Item :menu-item="item.children"></Item>
|
||||
</el-sub-menu>
|
||||
<el-menu-item v-else-if="!item.hidden&&!item.meta.isFrame" :index="handleGo(item.path)">
|
||||
<template #title>
|
||||
<div v-if="item.path==='/tool/swagger'">
|
||||
<a class="port-link" :href="link" target="_blank">
|
||||
<svg-icon :name="item.icon"/>
|
||||
{{ item.title }}
|
||||
</a>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon>
|
||||
<svg-icon :name="item.icon" class="menu-item-icon"/>
|
||||
</el-icon>
|
||||
<span>{{ item.title }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import SvgIcon from '@/components/svgIcon/index.vue'
|
||||
import Item from './MenuItem.vue'
|
||||
|
||||
const props = defineProps({
|
||||
menuItem: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
const link = ref('http://gateway.feashow.cn/doc.html#/home')
|
||||
const handleGo = (path) => {
|
||||
if (path === "/tool/swagger") {
|
||||
return ''
|
||||
} else {
|
||||
return path
|
||||
}
|
||||
}
|
||||
|
||||
const checkMenuItem = (item) => {
|
||||
let children = item.children
|
||||
let childState = false;
|
||||
if (children){
|
||||
for (let child of children) {
|
||||
if (!child.hidden) {
|
||||
childState = true
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
return item?.children?.length>0 && !item.hidden && childState
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<!-- <style lang="scss" scoped>
|
||||
.menu-item-icon {
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
margin-left: 0;
|
||||
}
|
||||
<template>
|
||||
<!-- 有子菜单 -->
|
||||
<template v-for="item in menuItem" :key="item.path">
|
||||
<el-sub-menu v-if="checkMenuItem(item)" :index="item.path">
|
||||
<template #title>
|
||||
<svg-icon :name="item.icon"/>
|
||||
<span>{{ item.title }}</span>
|
||||
</template>
|
||||
<Item :menu-item="item.children"></Item>
|
||||
</el-sub-menu>
|
||||
<el-menu-item v-else-if="!item.hidden&&!item.meta.isFrame" :index="handleGo(item.path)">
|
||||
<template #title>
|
||||
<div v-if="item.path==='/tool/swagger'">
|
||||
<a class="port-link" :href="link" target="_blank">
|
||||
<svg-icon :name="item.icon"/>
|
||||
{{ item.title }}
|
||||
</a>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-icon>
|
||||
<svg-icon :name="item.icon" class="menu-item-icon"/>
|
||||
</el-icon>
|
||||
<span>{{ item.title }}</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import SvgIcon from '@/components/svgIcon/index.vue'
|
||||
import Item from './MenuItem.vue'
|
||||
|
||||
const props = defineProps({
|
||||
menuItem: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
const link = ref('http://gateway.feashow.cn/doc.html#/home')
|
||||
const handleGo = (path) => {
|
||||
if (path === "/tool/swagger") {
|
||||
return ''
|
||||
} else {
|
||||
return path
|
||||
}
|
||||
}
|
||||
|
||||
const checkMenuItem = (item) => {
|
||||
let children = item.children
|
||||
let childState = false;
|
||||
if (children){
|
||||
for (let child of children) {
|
||||
if (!child.hidden) {
|
||||
childState = true
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
return item?.children?.length>0 && !item.hidden && childState
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<!-- <style lang="scss" scoped>
|
||||
.menu-item-icon {
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
margin-left: 0;
|
||||
}
|
||||
</style> -->
|
||||
@@ -1,54 +1,54 @@
|
||||
<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>
|
||||
<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>
|
||||
|
||||
Reference in New Issue
Block a user