Files
SmartOpsWeb/src/layout/siderbar/MenuItem.vue

65 lines
1.5 KiB
Vue

<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>