顶部分类--搜索回显

src/components/RouterSearch/index.vue

@@ -35,6 +35,7 @@
 </template>
 
 <script lang="ts" setup>
+import { useAppStore } from '@/store/modules/app'
 import { usePermissionStore } from '@/store/modules/permission'
 import { filterBreadcrumb } from '@/layout/components/Breadcrumb/src/helper'
 import { filter, treeToList } from '@/utils/tree'
@@ -46,6 +47,7 @@ defineProps({
     default: true
   }
 })
+const appStore = useAppStore()
 
 const permissionStore = usePermissionStore()
 const routersa = permissionStore.getRouters
@@ -123,6 +125,9 @@ const remoteMethod = (data) => {
 }
 
 const handleChange = (path) => {
+  if(path.split('/').length>1){
+    appStore.setCategoryRoutePath(`/${path.split('/')[1]}`)
+  }
   console.log(126,path)
   router.push({ path })
   console.log(128,11111)

src/layout/components/CategoryHeader.vue

@@ -36,16 +36,23 @@ const getPath = (route) => {
     return routePath
   }
 }
+const refresh = ref(true)
 
 export default defineComponent({
   name: 'CategoryHeader',
   setup() {
     console.log('useRouter()',useRouter())
-    const { push } = useRouter()
     // backgroundColor="var(--left-menu-bg-color)"
     // textColor="var(--left-menu-text-color)"
-    return () => (
-      <ElMenu
+
+    const categoryRouters =  unref(routers).filter(item=>item.meta.hidden!=true&&item.path!='/')
+    console.log('categoryRouters==',categoryRouters)
+    //默认展开第一行
+    if(categoryRouters.length>0){
+      appStore.setCategoryRoutePath(categoryRouters[0].path)
+    }
+    return () => !refresh.value?(<span></span>):(
+      <ElMenu v-if={refresh.value}
         id={`${variables.namespace}-tool-header`}
         popperOffset={16}
         class={['categoryheader',
@@ -64,23 +71,22 @@ export default defineComponent({
         {{
             default: () => {
               const { renderMenuTitle } = useRenderMenuTitle()
-              const categoryRouters =  unref(routers).filter(item=>item.meta.hidden!=true&&item.path!='/')
-              console.log('categoryRouters==',categoryRouters)
-              //默认展开第一行
-              if(categoryRouters.length>0){
-                appStore.setCategoryRoutePath(categoryRouters[0].path)
-              }
+              
               
               {/* default: () => renderMenuTitle(onlyOneChild ? onlyOneChild?.meta : meta) */}
               return categoryRouters.map((v) => {
                 const meta = (v.meta ?? {}) as RouteMeta
                 const { onlyOneChild } = hasOneShowingChild(v.children, v)
-                const fullPath = isUrl(v.path) ? v.path : pathResolve('/', v.path) // getAllParentPath<AppRouteRecordRaw>(allRouters, v.path).join('/')
-
+                const fullPath = isUrl(v.path) ? v.path : pathResolve('/', v.path)
                 return (
-                  <ElMenuItem index={fullPath} onClick={()=>{
-                    console.log(v)
+                  <ElMenuItem index={fullPath} class={{
+                    'is-active': appStore.getCategoryRoutePath === fullPath
+                  }} onClick={()=>{
+                    refresh.value = false;
                     appStore.setCategoryRoutePath(v.path)
+                    nextTick(()=>{
+                      refresh.value = true
+                    })
                   }}>
                     {{
                       default: () => renderMenuTitle(meta.title?meta:onlyOneChild?.meta)