From 7577e0d40354021d70b78d58b712ff8c2e8ad485 Mon Sep 17 00:00:00 2001 From: ludc <ludc@vci-tech.com> Date: 星期五, 03 一月 2025 10:47:33 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- Source/plt-web/plt-web-ui/src/page/index/sidebar/sidebarItem.vue | 34 ++++++++++++++++++++++------------ 1 files changed, 22 insertions(+), 12 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/page/index/sidebar/sidebarItem.vue b/Source/plt-web/plt-web-ui/src/page/index/sidebar/sidebarItem.vue index c9cddc3..ade24e2 100644 --- a/Source/plt-web/plt-web-ui/src/page/index/sidebar/sidebarItem.vue +++ b/Source/plt-web/plt-web-ui/src/page/index/sidebar/sidebarItem.vue @@ -6,19 +6,22 @@ :class="{'is-active':vaildActive(item)}" :index="item[pathKey]" @click="open(item)"> - <i :class="item[iconKey]"></i> - <span slot="title" - :alt="item[pathKey]">{{ generateTitle(item) }}</span> + <div style="display: flex"> + <icon-show :name="item[iconKey]" class="iconShowSpan" :style="{ height: iconSize, width: iconSize }"></icon-show> + <span slot="title" + :alt="item[pathKey]" + :class="{'el-menu--display':collapse && first}">{{ generateTitle(item) }}</span> + </div> </el-menu-item> <el-submenu v-else-if="!validatenull(item[childrenKey])&&vaildRoles(item)" :key="item[labelKey]" :index="item[pathKey]"> <template slot="title"> - <div style="display: flex"> - <icon-show :name="item[iconKey]" class="iconShowSpan"></icon-show> - <span slot="title" - :class="{'el-menu--display':collapse && first}">{{ generateTitle(item) }}</span> - </div> + <div style="display: flex"> + <icon-show :name="item[iconKey]" class="iconShowSpan" :style="{ height: iconSize, width: iconSize }"></icon-show> + <span slot="title" + :class="{'el-menu--display':collapse && first}">{{ generateTitle(item) }}</span> + </div> </template> <template v-for="(child,cindex) in item[childrenKey]"> <el-menu-item v-if="validatenull(child[childrenKey])" @@ -27,7 +30,7 @@ :index="child[pathKey],cindex" @click="open(child)"> <div style="display: flex"> - <icon-show :name="child[iconKey]" class="iconShowSpan"></icon-show> + <icon-show :name="child[iconKey]" class="iconShowSpan" :style="{ height: iconSize, width: iconSize }"></icon-show> <span slot="title">{{ generateTitle(child) }}</span> </div> </el-menu-item> @@ -81,6 +84,9 @@ }, computed: { ...mapGetters(["roles"]), + iconSize() { + return this.collapse ? '20px' : '16px'; + }, labelKey() { return this.props.label || this.config.propsDefault.label; }, @@ -160,10 +166,14 @@ .iconShowSpan{ display: inline-block; margin-top: -2px; - width: 16px !important; - height: 16px !important; margin-right: 10px; - color: #eeeeea; + color: rgba(255, 255, 255, 0.7); +} +.el-submenu__title:hover .iconShowSpan{ + color: #ffffff; +} +.el-submenu__title:hover .iconShowSpan svg{ + fill: #ffffff; } </style> -- Gitblit v1.9.3