From b06f6a316b6a8293bb8aba6bfff33336b66c032a Mon Sep 17 00:00:00 2001 From: ahaos <8406649+lhailgl@user.noreply.gitee.com> Date: 星期三, 13 十二月 2023 09:01:52 +0800 Subject: [PATCH] !64 版本升级 * Merge branch 'dev' of gitee.com:JavaLionLi/plus-ui into ts * 升级依赖 * !61 fix: 删除重复环境变量ElUploadInstance * fix: 删除重复环境变量ElUploadInstance --- src/components/HeaderSearch/index.vue | 96 ++++++++++++++++++++++++----------------------- 1 files changed, 49 insertions(+), 47 deletions(-) diff --git a/src/components/HeaderSearch/index.vue b/src/components/HeaderSearch/index.vue index b922c6c..f6143d0 100644 --- a/src/components/HeaderSearch/index.vue +++ b/src/components/HeaderSearch/index.vue @@ -1,6 +1,6 @@ <template> - <div :class="{ 'show': show }" class="header-search"> - <svg-icon class-name="search-icon" icon-class="search" @click.stop="click"/> + <div :class="{ show: show }" class="header-search"> + <svg-icon class-name="search-icon" icon-class="search" @click.stop="click" /> <el-select ref="headerSearchSelectRef" v-model="search" @@ -12,23 +12,22 @@ class="header-search-select" @change="change" > - <el-option v-for="option in options" :key="option.item.path" :value="option.item" - :label="option.item.title.join(' > ')"/> + <el-option v-for="option in options" :key="option.item.path" :value="option.item" :label="option.item.title.join(' > ')" /> </el-select> </div> </template> <script setup lang="ts" name="HeaderSearch"> import Fuse from 'fuse.js'; -import {getNormalPath} from '@/utils/ruoyi'; -import {isHttp} from '@/utils/validate'; +import { getNormalPath } from '@/utils/ruoyi'; +import { isHttp } from '@/utils/validate'; import usePermissionStore from '@/store/modules/permission'; -import {RouteOption} from 'vue-router'; +import { RouteRecordRaw } from 'vue-router'; type Router = Array<{ path: string; title: string[]; -}> +}>; const search = ref(''); const options = ref<any>([]); @@ -40,36 +39,36 @@ const routes = computed(() => usePermissionStore().routes); const click = () => { - show.value = !show.value + show.value = !show.value; if (show.value) { - headerSearchSelectRef.value && headerSearchSelectRef.value.focus() + headerSearchSelectRef.value && headerSearchSelectRef.value.focus(); } }; const close = () => { - headerSearchSelectRef.value && headerSearchSelectRef.value.blur() - options.value = [] - show.value = false -} + headerSearchSelectRef.value && headerSearchSelectRef.value.blur(); + options.value = []; + show.value = false; +}; const change = (val: any) => { const path = val.path; const query = val.query; if (isHttp(path)) { // http(s):// 璺緞鏂扮獥鍙f墦寮� - const pindex = path.indexOf("http"); - window.open(path.substr(pindex, path.length), "_blank"); + const pindex = path.indexOf('http'); + window.open(path.substr(pindex, path.length), '_blank'); } else { if (query) { router.push({ path: path, query: JSON.parse(query) }); } else { - router.push(path) + router.push(path); } } - search.value = '' - options.value = [] + search.value = ''; + options.value = []; nextTick(() => { - show.value = false - }) -} + show.value = false; + }); +}; const initFuse = (list: Router) => { fuse.value = new Fuse(list, { shouldSort: true, @@ -77,20 +76,23 @@ location: 0, distance: 100, minMatchCharLength: 1, - keys: [{ - name: 'title', - weight: 0.7 - }, { - name: 'path', - weight: 0.3 - }] - }) -} + keys: [ + { + name: 'title', + weight: 0.7 + }, + { + name: 'path', + weight: 0.3 + } + ] + }); +}; // Filter out the routes that can be displayed in the sidebar // And generate the internationalized title -const generateRoutes = (routes: RouteOption[], basePath = '', prefixTitle: string[] = []) => { - let res: Router = [] - routes.forEach(r => { +const generateRoutes = (routes: RouteRecordRaw[], basePath = '', prefixTitle: string[] = []) => { + let res: Router = []; + routes.forEach((r) => { // skip hidden router if (!r.hidden) { const p = r.path.length > 0 && r.path[0] === '/' ? r.path : '/' + r.path; @@ -98,7 +100,7 @@ path: !isHttp(r.path) ? getNormalPath(basePath + p) : r.path, title: [...prefixTitle], query: '' - } + }; if (r.meta && r.meta.title) { data.title = [...data.title, r.meta.title]; if (r.redirect !== 'noRedirect') { @@ -109,7 +111,7 @@ } if (r.query) { - data.query = r.query + data.query = r.query; } // recursive child routes @@ -120,20 +122,20 @@ } } } - }) + }); return res; -} +}; const querySearch = (query: string) => { if (query !== '') { - options.value = fuse.value.search(query) + options.value = fuse.value.search(query); } else { - options.value = [] + options.value = []; } -} +}; onMounted(() => { searchPool.value = generateRoutes(routes.value); -}) +}); // watchEffect(() => { // searchPool.value = generateRoutes(routes.value) @@ -141,15 +143,15 @@ watch(show, (value) => { if (value) { - document.body.addEventListener('click', close) + document.body.addEventListener('click', close); } else { - document.body.removeEventListener('click', close) + document.body.removeEventListener('click', close); } -}) +}); watch(searchPool, (list) => { - initFuse(list) -}) + initFuse(list); +}); </script> <style lang="scss" scoped> -- Gitblit v1.9.3