fix: 修复执行: check:cspell 命令路径参数传入没有转义导致检测路径失效。添加菜单右键功能。优化:多余监听 activePath 变化，自动滚动到激活项 watch

package.json

@@ -37,7 +37,7 @@
     "changeset": "pnpm exec changeset",
     "check": "pnpm run check:circular && pnpm run check:dep && pnpm run check:type && pnpm check:cspell",
     "check:circular": "vsh check-circular",
-    "check:cspell": "cspell lint **/*.ts **/README.md .changeset/*.md --no-progress",
+    "check:cspell": "cspell lint \"**/*.ts\" \"**/README.md\" \".changeset/*.md\" --no-progress",
     "check:dep": "vsh check-dep",
     "check:type": "turbo run typecheck",
     "clean": "node ./scripts/clean.mjs",
@@ -59,7 +59,7 @@
     "reinstall": "pnpm clean --del-lock && pnpm install",
     "test:unit": "vitest run --dom",
     "test:e2e": "turbo run test:e2e",
-    "update:deps": "npx taze -r -w",
+    "up te:deps": "npx taze -r -w",
     "version": "pnpm exec changeset version && pnpm install --no-frozen-lockfile",
     "catalog": "pnpx codemod pnpm/catalog"
   },

packages/@core/base/typings/src/menu-record.ts

@@ -1,6 +1,8 @@
 import type { Component } from 'vue';
 import type { RouteRecordRaw } from 'vue-router';
 
+import type { Recordable } from './helper';
+
 /**
  * 扩展路由原始对象
  */
@@ -66,6 +68,10 @@ interface MenuRecordRaw extends MenuRecordBadgeRaw {
    * 菜单路径，唯一，可当作key
    */
   path: string;
+  /**
+   * 菜单参数
+   */
+  query?: Recordable<any>;
   /**
    * 是否显示菜单
    * @default true

packages/@core/ui-kit/layout-ui/src/components/layout-sidebar.vue

@@ -306,13 +306,13 @@ const handleDragSidebar = (e: MouseEvent) => {
     ref="asideRef"
     :style="style"
     class="fixed left-0 top-0 h-full transition-all duration-150"
+    :class="theme"
     @mouseenter="handleMouseenter"
     @mouseleave="handleMouseleave"
   >
     <div
       class="h-full"
       :class="[
-        theme,
         {
           'bg-sidebar-deep': isSidebarMixed,
           'border-r border-border bg-sidebar': !isSidebarMixed,

packages/@core/ui-kit/menu-ui/package.json

@@ -43,6 +43,10 @@
     "@vben-core/shared": "workspace:*",
     "@vben-core/typings": "workspace:*",
     "@vueuse/core": "catalog:",
+    "qs": "catalog:",
     "vue": "catalog:"
+  },
+  "devDependencies": {
+    "@types/qs": "catalog:"
   }
 }

packages/@core/ui-kit/menu-ui/src/components/menu-item.vue

@@ -6,6 +6,8 @@ import { computed, onBeforeUnmount, onMounted, reactive, useSlots } from 'vue';
 import { useNamespace } from '@vben-core/composables';
 import { VbenIcon, VbenTooltip } from '@vben-core/shadcn-ui';
 
+import qs from 'qs';
+
 import { MenuBadge } from '../components';
 import { useMenu, useMenuContext, useSubMenuContext } from '../hooks';
 
@@ -54,6 +56,7 @@ const item: MenuItemRegistered = reactive({
   active,
   parentPaths: parentPaths.value,
   path: props.path || '',
+  query: props.query,
 });
 
 /**
@@ -81,42 +84,50 @@ onBeforeUnmount(() => {
 });
 </script>
 <template>
-  <li
+  <a
-    :class="[
+    :href="
-      rootMenu.theme,
+      (item.parentPaths.at(-1) ?? '') +
-      b(),
+      (item?.query ? `?${qs.stringify(item?.query)}` : '')
-      is('active', active),
+    "
-      is('disabled', disabled),
+    @click.prevent.stop="handleClick"
-      is('collapse-show-title', collapseShowTitle),
-    ]"
-    role="menuitem"
-    @click.stop="handleClick"
   >
-    <VbenTooltip
+    <li
-      v-if="showTooltip"
+      :class="[
-      :content-class="[rootMenu.theme]"
+        rootMenu.theme,
-      side="right"
+        b(),
+        is('active', active),
+        is('disabled', disabled),
+        is('collapse-show-title', collapseShowTitle),
+      ]"
+      role="menuitem"
     >
-      <template #trigger>
+      <!-- -->
-        <div :class="[nsMenu.be('tooltip', 'trigger')]">
+      <VbenTooltip
-          <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
+        v-if="showTooltip"
-          <slot></slot>
+        :content-class="[rootMenu.theme]"
-          <span v-if="collapseShowTitle" :class="nsMenu.e('name')">
+        side="right"
-            <slot name="title"></slot>
+      >
-          </span>
+        <template #trigger>
-        </div>
+          <div :class="[nsMenu.be('tooltip', 'trigger')]">
-      </template>
+            <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" fallback />
-      <slot name="title"></slot>
+            <slot></slot>
-    </VbenTooltip>
+            <span v-if="collapseShowTitle" :class="nsMenu.e('name')">
-    <div v-show="!showTooltip" :class="[e('content')]">
+              <slot name="title"></slot>
-      <MenuBadge
+            </span>
-        v-if="rootMenu.props.mode !== 'horizontal'"
+          </div>
-        class="right-2"
+        </template>
-        v-bind="props"
+        <slot name="title"></slot>
-      />
+      </VbenTooltip>
-      <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" />
+      <div v-show="!showTooltip" :class="[e('content')]">
-      <slot></slot>
+        <MenuBadge
-      <slot name="title"></slot>
+          v-if="rootMenu.props.mode !== 'horizontal'"
-    </div>
+          class="right-2"
-  </li>
+          v-bind="props"
+        />
+        <VbenIcon :class="nsMenu.e('icon')" :icon="menuIcon" />
+        <slot></slot>
+        <slot name="title"></slot>
+      </div>
+    </li>
+  </a>
 </template>

packages/@core/ui-kit/menu-ui/src/components/menu.vue

@@ -212,15 +212,15 @@ const enableScroll = computed(
   () => props.scrollToActive && props.mode === 'vertical' && !props.collapse,
 );
 
-const { scrollToActiveItem } = useMenuScroll(activePath, {
+useMenuScroll(activePath, {
   enable: enableScroll,
   delay: 320,
 });
 
 // 监听 activePath 变化，自动滚动到激活项
-watch(activePath, () => {
+// watch(activePath, () => {
-  scrollToActiveItem();
+//   scrollToActiveItem();
-});
+// });
 
 // 默认展开菜单
 function initMenu() {

packages/@core/ui-kit/menu-ui/src/sub-menu.vue

@@ -41,6 +41,7 @@ const hasChildren = computed(() => {
     :badge-variants="menu.badgeVariants"
     :icon="menu.icon"
     :path="menu.path"
+    :query="menu.query"
   >
     <template #title>
       <span>{{ menu.name }}</span>

packages/@core/ui-kit/menu-ui/src/types.ts

@@ -1,6 +1,10 @@
 import type { Component, Ref } from 'vue';
 
-import type { MenuRecordBadgeRaw, ThemeModeType } from '@vben-core/typings';
+import type {
+  MenuRecordBadgeRaw,
+  Recordable,
+  ThemeModeType,
+} from '@vben-core/typings';
 
 interface MenuProps {
   /**
@@ -91,12 +95,17 @@ interface MenuItemProps extends MenuRecordBadgeRaw {
    * @zh_CN menuitem 名称
    */
   path: string;
+  /**
+   * @zh_CN 菜单所携带的参数
+   */
+  query?: Recordable<any>;
 }
 
 interface MenuItemRegistered {
   active: boolean;
   parentPaths: string[];
   path: string;
+  query?: Recordable<any>;
 }
 
 interface MenuItemClicked {

packages/utils/src/helpers/generate-menus.ts

@@ -43,6 +43,7 @@ function generateMenus(
       link,
       order,
       title = '',
+      query,
     } = meta;
 
     // 确保菜单名称不为空
@@ -71,6 +72,7 @@ function generateMenus(
       badgeVariants,
       icon,
       name,
+      query,
       order,
       parent: route.parent,
       parents: route.parents,