feat: 在应用菜单中添加工具提示功能

This commit is contained in:
alger
2025-05-15 21:16:48 +08:00
parent a8010c8ca7
commit 5084da333f
+11 -13
View File
@@ -9,19 +9,16 @@
</div>
<div class="app-menu-list">
<div v-for="(item, index) in menus" :key="item.path" class="app-menu-item">
<router-link class="app-menu-item-link" :to="item.path">
<i
class="iconfont app-menu-item-icon"
:style="iconStyle(index)"
:class="item.meta.icon"
></i>
<span
v-if="isText"
class="app-menu-item-text ml-3"
:class="isChecked(index) ? 'text-green-500' : ''"
>{{ item.meta.title }}</span
>
</router-link>
<n-tooltip :delay="200" :disabled="isText" placement="bottom">
<template #trigger>
<router-link class="app-menu-item-link" :to="item.path">
<i class="iconfont app-menu-item-icon" :style="iconStyle(index)" :class="item.meta.icon"></i>
<span v-if="isText" class="app-menu-item-text ml-3" :class="isChecked(index) ? 'text-green-500' : ''">{{
item.meta.title }}</span>
</router-link>
</template>
<div v-if="!isText">{{ item.meta.title }}</div>
</n-tooltip>
</div>
</div>
</div>
@@ -83,6 +80,7 @@ const isText = ref(false);
.app-menu-expanded {
@apply w-[160px];
.app-menu-item {
@apply hover:bg-gray-100 dark:hover:bg-gray-800 rounded mr-4;
}