github/basic
1
0
Fork 1
mirror of https://github.com/fantastic-admin/basic.git synced 2026-10-07 13:28:38 +08:00
Code Issues Packages Projects Releases Wiki Activity

导航title类型补充

Browse Source
This commit is contained in:
Hooray Hu
2023-11-21 14:26:49 +08:00
parent d8add2f6d8
commit 7c574a3897
5 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/layouts/components/Header/index.vue
+2 -2
View File
@@ -41,12 +41,12 @@ function handlerMouserScroll(event: WheelEvent) {
<div
v-if="item.children && item.children.length !== 0" class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-3 transition-all cursor-pointer group text-[var(--g-header-menu-color)] hover:(text-[var(--g-header-menu-hover-color)] bg-[var(--g-header-menu-hover-bg)])" :class="{
'text-[var(--g-header-menu-active-color)]! bg-[var(--g-header-menu-active-bg)]!': index === menuStore.actived,
}" :title="item.meta?.title" @click="switchTo(index)"
}" :title="typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title" @click="switchTo(index)"
>
<div class="inline-flex justify-center items-center gap-1 flex-1">
<SvgIcon v-if="item.meta?.icon" :name="item.meta?.icon" :size="20" class="menu-item-container-icon transition-transform group-hover:scale-120" async />
<span class="flex-1 text-sm w-full truncate transition-width transition-height transition-opacity">
{{ item.meta?.title }}
{{ typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title }}
</span>
</div>
</div>
src/layouts/components/MainSidebar/index.vue
+2 -2
View File
@@ -28,12 +28,12 @@ const { switchTo } = useMenu()
<div
v-if="item.children && item.children.length !== 0" class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-2! py-4 transition-all cursor-pointer group text-[var(--g-main-sidebar-menu-color)] hover:(text-[var(--g-main-sidebar-menu-hover-color)] bg-[var(--g-main-sidebar-menu-hover-bg)])" :class="{
'text-[var(--g-main-sidebar-menu-active-color)]! bg-[var(--g-main-sidebar-menu-active-bg)]!': index === menuStore.actived,
}" :title="item.meta?.title" @click="switchTo(index)"
}" :title="typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title" @click="switchTo(index)"
>
<div class="inline-flex flex-col justify-center items-center flex-1 gap-[2px] w-full">
<SvgIcon v-if="item.meta?.icon" :name="item.meta?.icon" :size="20" class="menu-item-container-icon transition-transform group-hover:scale-120" async />
<span class="flex-1 text-sm w-full text-center truncate transition-width transition-height transition-opacity">
{{ item.meta?.title }}
{{ typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title }}
</span>
</div>
</div>
src/layouts/components/Menu/item.vue
+2 -2
View File
@@ -47,7 +47,7 @@ defineExpose({
class="menu-item-container w-full h-full flex justify-between items-center gap-1 px-5 py-4 transition-all cursor-pointer group text-[var(--g-sub-sidebar-menu-color)] hover:(text-[var(--g-sub-sidebar-menu-hover-color)] bg-[var(--g-sub-sidebar-menu-hover-bg)])" :class="{
'text-[var(--g-sub-sidebar-menu-active-color)]! bg-[var(--g-sub-sidebar-menu-active-bg)]!': isItemActive,
'px-3!': rootMenu.isMenuPopup && level === 0,
}" :title="item.meta?.title"
}" :title="typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title"
>
<div
class="inline-flex justify-center items-center gap-[12px] flex-1" :class="{
@@ -64,7 +64,7 @@ defineExpose({
'w-full text-center': rootMenu.isMenuPopup && level === 0 && rootMenu.props.showCollapseName,
}"
>
{{ item.meta?.title }}
{{ typeof item.meta?.title === 'function' ? item.meta?.title() : item.meta?.title }}
</span>
</div>
<i
src/layouts/components/Search/index.vue
+18 -4
View File
@@ -48,7 +48,9 @@ interface listTypes {
icon?: string
title?: string | (() => string)
link?: string
breadcrumb: any[]
breadcrumb: {
title?: string | (() => string)
}[]
}
const isShow = ref(false)
@@ -82,7 +84,19 @@ const resultList = computed(() => {
if (item.path.includes(searchInput.value)) {
flag = true
}
if (item.breadcrumb.some((b: { title: any }) => b.title.includes(searchInput.value))) {
if (item.breadcrumb.some((b) => {
if (typeof b.title === 'function') {
if (b.title().includes(searchInput.value)) {
return true
}
}
else {
if (b.title?.includes(searchInput.value)) {
return true
}
}
return false
})) {
flag = true
}
return flag
@@ -280,10 +294,10 @@ function pageJump(path: listTypes['path'], link: listTypes['link']) {
<a v-for="(item, index) in resultList" ref="searchResultItemRef" :key="item.path" class="flex items-center cursor-pointer" :class="{ 'bg-stone-2/40 dark:bg-stone-7/40': index === actived }" :data-index="index" @click="pageJump(item.path, item.link)" @mouseover="actived = index">
<SvgIcon v-if="item.icon" :name="item.icon" :size="20" class="basis-16 transition" :class="{ 'scale-120 text-ui-primary': index === actived }" />
<div class="flex-1 flex flex-col gap-1 px-4 py-3 truncate" border-l="~ solid stone-2 dark:stone-7">
<div class="text-base font-bold truncate">{{ item.title ?? '[ 无标题 ]' }}</div>
<div class="text-base font-bold truncate">{{ (typeof item.title === 'function' ? item.title() : item.title) ?? '[ 无标题 ]' }}</div>
<Breadcrumb v-if="item.breadcrumb.length" class="truncate">
<BreadcrumbItem v-for="(bc, bcIndex) in item.breadcrumb" :key="bcIndex" class="text-xs">
{{ bc.title ?? '[ 无标题 ]' }}
{{ (typeof bc.title === 'function' ? bc.title() : bc.title) ?? '[ 无标题 ]' }}
</BreadcrumbItem>
</Breadcrumb>
</div>
src/types/global.d.ts
Vendored
+2 -2
View File
@@ -243,7 +243,7 @@ declare namespace Menu {
interface recordRaw {
path?: string
meta?: {
title?: string
title?: string | (() => string)
icon?: string
defaultOpened?: boolean
auth?: string | string[]
@@ -255,7 +255,7 @@ declare namespace Menu {
/** 主导航 */
interface recordMainRaw {
meta?: {
title?: string
title?: string | (() => string)
icon?: string
auth?: string | string[]
}