feat: internationalized menu search
This commit is contained in:
parent
3eaf05bd4d
commit
9e115daeb9
@ -34,6 +34,7 @@ import { useRouter } from 'vue-router';
|
|||||||
import { onKeyStroke, useDebounceFn } from '@vueuse/core';
|
import { onKeyStroke, useDebounceFn } from '@vueuse/core';
|
||||||
import { useRouteStore } from '@/store';
|
import { useRouteStore } from '@/store';
|
||||||
import { useBasicLayout } from '@/composables';
|
import { useBasicLayout } from '@/composables';
|
||||||
|
import { $t } from '@/locales';
|
||||||
import SearchResult from './search-result.vue';
|
import SearchResult from './search-result.vue';
|
||||||
import SearchFooter from './search-footer.vue';
|
import SearchFooter from './search-footer.vue';
|
||||||
|
|
||||||
@ -82,9 +83,16 @@ watch(show, async val => {
|
|||||||
|
|
||||||
/** 查询 */
|
/** 查询 */
|
||||||
function search() {
|
function search() {
|
||||||
resultOptions.value = routeStore.searchMenus.filter(
|
resultOptions.value = routeStore.searchMenus.filter(menu => {
|
||||||
menu => keyword.value && menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
return (
|
||||||
);
|
(keyword.value &&
|
||||||
|
menu.meta?.i18nTitle &&
|
||||||
|
$t(menu.meta?.i18nTitle)
|
||||||
|
.toLocaleLowerCase()
|
||||||
|
.includes(keyword.value.toLocaleLowerCase().trim())) ||
|
||||||
|
menu.meta?.title.toLocaleLowerCase().includes(keyword.value.toLocaleLowerCase().trim())
|
||||||
|
);
|
||||||
|
});
|
||||||
if (resultOptions.value?.length > 0) {
|
if (resultOptions.value?.length > 0) {
|
||||||
activePath.value = resultOptions.value[0].path;
|
activePath.value = resultOptions.value[0].path;
|
||||||
} else {
|
} else {
|
||||||
|
@ -12,7 +12,9 @@
|
|||||||
@mouseenter="handleMouse(item)"
|
@mouseenter="handleMouse(item)"
|
||||||
>
|
>
|
||||||
<svg-icon :icon="item.meta.icon" :local-icon="item.meta.localIcon" />
|
<svg-icon :icon="item.meta.icon" :local-icon="item.meta.localIcon" />
|
||||||
<span class="flex-1 ml-5px">{{ item.meta?.title }}</span>
|
<span class="flex-1 ml-5px">
|
||||||
|
{{ (item.meta?.i18nTitle && $t(item.meta?.i18nTitle)) || item.meta?.title }}
|
||||||
|
</span>
|
||||||
<icon-ant-design-enter-outlined class="icon text-20px p-2px mr-3px" />
|
<icon-ant-design-enter-outlined class="icon text-20px p-2px mr-3px" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -23,6 +25,7 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import { useThemeStore } from '@/store';
|
import { useThemeStore } from '@/store';
|
||||||
|
import { $t } from '@/locales';
|
||||||
|
|
||||||
defineOptions({ name: 'SearchResult' });
|
defineOptions({ name: 'SearchResult' });
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user