智慧种植页面首页 田间监测页面

This commit is contained in:
姚俊旭 2025-05-19 13:41:18 +08:00
parent edbbf59a3b
commit 47b8e18b56

View File

@ -6,36 +6,23 @@
* @LastEditTime: 2024-01-27 16:07:37 * @LastEditTime: 2024-01-27 16:07:37
--> -->
<template> <template>
<template v-if="item.children"> <template v-if="!item.hidden">
<!-- <template v-if="!item.alwaysShow && hasOneShowingChild(item.children, item)">--> <template v-if="!item.alwaysShow && hasOneShowingChild(item.children, item)">
<!-- <layout-link :to="onlyOneChild.path">--> <layout-link v-if="onlyOneChild.meta" :to="onlyOneChild.path">
<!-- <el-menu-item :index="onlyOneChild.path">--> <el-menu-item :index="onlyOneChild.path">
<!-- <template #title>{{ onlyOneChild.meta && onlyOneChild.meta?.title }}</template>--> <layout-icon :size="20" :icon="onlyOneChild?.meta?.icon" />
<!-- </el-menu-item>--> <template #title>{{ onlyOneChild.meta && onlyOneChild.meta?.title }}</template>
<!-- </layout-link>--> </el-menu-item>
<!-- </template>--> </layout-link>
<el-sub-menu :index="item.path" teleported> </template>
<el-sub-menu v-else :index="item.path" teleported>
<template #title> <template #title>
<!-- 左侧图标 --> <layout-icon :size="20" :icon="item?.meta?.icon" />
<img :src="getAssetsFile('images/smartFarm/' + item.icon)?.href ?? ''" alt="" /> <span>{{ item.meta && item.meta?.title }}</span>
<span>{{ item.title }}</span>
<!-- <layout-icon :size="20" :icon="item?.meta?.icon" />-->
<!-- <span>{{ item.meta && item.meta?.title }}</span>-->
</template>
<!-- 右侧图标替换默认箭头没生效 -->
<template #expand-icon>
<img alt="" :src="getAssetsFile('images/smartFarm/closing.png')" class="isOpen" />
</template> </template>
<sub-item v-for="child in item.children" :key="child.path" :item="child" /> <sub-item v-for="child in item.children" :key="child.path" :item="child" />
</el-sub-menu> </el-sub-menu>
</template> </template>
<template v-else>
<el-menu-item-group :title="item.title">
<el-menu-item v-for="child in item.children" :key="child.path" :index="child.path">
<span style="color: black !important">{{ child.title }}</span>
</el-menu-item>
</el-menu-item-group>
</template>
</template> </template>
<script setup name="sub-item"> <script setup name="sub-item">
@ -43,7 +30,6 @@ import { ref } from 'vue';
// import { isExternal } from '@/utils/validate.js'; // import { isExternal } from '@/utils/validate.js';
import LayoutLink from './Link'; import LayoutLink from './Link';
import LayoutIcon from './Icon'; import LayoutIcon from './Icon';
import { getAssetsFile } from '@/utils/index.js';
// import path from 'path-browserify'; // import path from 'path-browserify';
defineProps({ defineProps({
@ -93,35 +79,3 @@ const hasOneShowingChild = (children = [], parent) => {
// return path.resolve(props.basePath, routePath); // return path.resolve(props.basePath, routePath);
// }; // };
</script> </script>
<style scoped>
/* 强制覆盖默认样式 */
.isOpen {
width: 16px !important; /* 设置图片宽度 */
height: 16px !important; /* 设置图片高度 */
margin-left: auto !important; /* 让图标靠右 */
display: block !important; /* 避免被隐藏 */
transition: transform 0.3s; /* 添加旋转动画 */
}
/* 修复父元素可能存在的样式冲突 */
.el-sub-menu__title {
overflow: visible !important; /* 防止图片被裁剪 */
}
.item-children {
text-align: center;
font-size: 16px;
margin-top: 8px;
transition: transform 0.3s ease;
.dot {
display: inline-block;
height: 4px;
margin-right: 15px;
width: 4px;
border-radius: 90px;
background-color: black;
vertical-align: middle;
}
}
</style>