Merge pull request #285 from Kori000/main

feat: internationalized menu search
This commit is contained in:
Soybean 2023-10-18 00:01:11 +08:00 committed by GitHub
commit 04d3330463
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 4 deletions

View File

@ -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 {

View File

@ -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' });