优化 分栏布局

src/layout/component/aside.vue

@@ -107,7 +107,8 @@ const onAsideEnterLeave = (bool: Boolean) => {
   let { layout } = themeConfig.value
   if (layout !== 'columns') return false
   if (!bool) mittBus.emit('restoreDefault')
-  stores.setColumnsMenuHover(bool)
+  // 开启 `分栏菜单鼠标悬停预加载` 才设置，防止 columnsAside.vue 监听 pinia.state
+  if (themeConfig.value.isColumnsMenuHoverPreload) stores.setColumnsMenuHover(bool)
 }
 // 页面加载前
 onBeforeMount(() => {
@@ -118,6 +119,7 @@ onBeforeMount(() => {
   mittBus.on('setSendColumnsChildren', (res: MittMenu) => {
     state.menuList = res.children
   })
+  // 开启经典布局分割菜单时，设置菜单数据
   mittBus.on('setSendClassicChildren', (res: MittMenu) => {
     let { layout, isClassicSplitMenu } = themeConfig.value
     if (layout === 'classic' && isClassicSplitMenu) {
@@ -125,9 +127,11 @@ onBeforeMount(() => {
       state.menuList = res.children
     }
   })
+  // 开启经典布局分割菜单时，重新处理菜单数据
   mittBus.on('getBreadcrumbIndexSetFilterRoutes', () => {
     setFilterRoutes()
   })
+  // 监听窗口大小改变时(适配移动端)
   mittBus.on('layoutMobileResize', (res: LayoutMobileResize) => {
     initMenuFixed(res.clientWidth)
     closeLayoutAsideMobileMode()

src/layout/component/columnsAside.vue

@@ -8,7 +8,7 @@
         <li
           v-for="(v, k) in state.columnsAsideList"
           :key="k"
-          @click="onColumnsAsideMenuClick(v, k)"
+          @click="onColumnsAsideMenuClick(v)"
           @mouseenter="onColumnsAsideMenuMouseenter(v, k)"
           :ref="
             (el) => {
@@ -89,11 +89,13 @@ const setColumnsAsideMove = (k: number) => {
   columnsAsideActiveRef.value.style.top = `${columnsAsideOffsetTopRefs.value[k].offsetTop + state.difference}px`
 }
 // 菜单高亮点击事件
-const onColumnsAsideMenuClick = (v: RouteItem, k: number) => {
-  setColumnsAsideMove(k)
+const onColumnsAsideMenuClick = async (v: RouteItem) => {
   let { path, redirect } = v
   if (redirect) router.push(redirect)
   else router.push(path)
+  // 一个路由设置自动收起菜单
+  if (!v.children) themeConfig.value.isCollapse = true
+  else if (v.children.length > 1) themeConfig.value.isCollapse = false
 }
 // 鼠标移入时，显示当前的子级菜单
 const onColumnsAsideMenuMouseenter = (v: RouteRecordRaw, k: number) => {
@@ -108,6 +110,7 @@ const onColumnsAsideMenuMouseenter = (v: RouteRecordRaw, k: number) => {
 }
 // 鼠标移走时，显示原来的子级菜单
 const onColumnsAsideMenuMouseleave = async () => {
+  if (!themeConfig.value.isColumnsMenuHoverPreload) return false
   await stores.setColumnsNavHover(false)
   // 添加延时器，防止拿到的 store.state.routesList 值不是最新的
   setTimeout(() => {
@@ -126,6 +129,8 @@ const setFilterRoutes = () => {
   const resData: MittMenu = setSendChildren(route.path)
   if (Object.keys(resData).length <= 0) return false
   onColumnsAsideDown(resData.item?.k)
+  // 刷新时，初始化一个路由设置自动收起菜单
+  resData.children.length <= 1 ? (themeConfig.value.isCollapse = true) : (themeConfig.value.isCollapse = false)
   mittBus.emit('setSendColumnsChildren', resData)
 }
 // 传送当前子级数据到菜单中