feat(frontend): 顶栏高度调整为40px并支持页签滚轮滚动

- 顶栏高度全局变量与固定头部偏移同步改为 40px
- 多页签栏内容超出时支持鼠标滚轮横向滚动

ai-electron/frontend/src/core/design/var/index.less

@@ -2,8 +2,8 @@
 @import 'easing';
 @import 'breakpoint';
 
-// headers、HEADER_HEIGHT（顶栏全局统一：48 → 36，两个壳共用；传统壳写死 48 的地方见 MultipleHeader.vue）
-@header-height: 36px;
+// headers、HEADER_HEIGHT（顶栏全局统一：40，两个壳共用；传统壳写死 40 的地方见 MultipleHeader.vue）
+@header-height: 40px;
 
 // logo width（顶栏缩排同比：32 → 24，顶部 logo 行都按 @header-height 对齐，一起缩才不打架）
 @logo-width: 24px;

ai-electron/frontend/src/core/layouts/default/header/MultipleHeader.vue

@@ -20,8 +20,8 @@
   import { useLayoutHeight } from '../content/useContentViewHeight';
   import { useMultipleTabStore } from '@/core/store/modules/multipleTab';
 
-  /** 顶栏高度：与共享变量 @header-height 保持一致（顶栏全局统一 36，fixed 全 header 时页签栏要接在它下面） */
-  const HEADER_HEIGHT = 36;
+  /** 顶栏高度：与共享变量 @header-height 保持一致（顶栏全局统一 40，fixed 全 header 时页签栏要接在它下面） */
+  const HEADER_HEIGHT = 40;
   const TABS_HEIGHT = 35;
   const TABS_HEIGHT_LARGE = 35;
 

ai-electron/frontend/src/core/layouts/default/tabs/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div :class="getWrapClass">
+  <div :class="getWrapClass" ref="tabsRootRef">
     <Tabs
       type="editable-card"
       size="small"
@@ -28,7 +28,7 @@
 <script lang="ts">
   import { RouteLocationNormalized, RouteMeta, useRoute } from 'vue-router';
 
-  import { defineComponent, computed, unref, ref } from 'vue';
+  import { defineComponent, computed, unref, ref, onMounted, onBeforeUnmount } from 'vue';
 
   import { Tabs } from 'ant-design-vue';
   import TabContent from './components/TabContent.vue';
@@ -62,6 +62,7 @@
       const route = useRoute();
       const affixTextList = initAffixTabs();
       const activeKeyRef = ref('');
+      const tabsRootRef = ref<HTMLElement | null>(null);
 
       useTabsDrag(affixTextList);
       const tabStore = useMultipleTabStore();
@@ -88,6 +89,25 @@
         ];
       });
 
+      // 页签栏内容超出宽度时用滚轮横向滚动；rc-tabs 自带的 wheel 监听在页签重渲染后会丢失，这里自行接管
+      function handleTabsWheel(e: WheelEvent) {
+        const wrap = tabsRootRef.value?.querySelector<HTMLElement>('.ant-tabs-nav-wrap');
+        if (!wrap || !(e.target instanceof Node) || !wrap.contains(e.target)) return;
+        if (wrap.scrollWidth <= wrap.clientWidth) return;
+        const delta = Math.abs(e.deltaY) >= Math.abs(e.deltaX) ? e.deltaY : e.deltaX;
+        if (!delta) return;
+        e.preventDefault();
+        wrap.scrollLeft += delta * (e.deltaMode === 1 ? 16 : 1);
+      }
+
+      onMounted(() => {
+        tabsRootRef.value?.addEventListener('wheel', handleTabsWheel, { passive: false });
+      });
+
+      onBeforeUnmount(() => {
+        tabsRootRef.value?.removeEventListener('wheel', handleTabsWheel);
+      });
+
       listenerRouteChange((route) => {
         const { name } = route;
         // if (name === REDIRECT_NAME || !route || !userStore.getToken) {
@@ -140,6 +160,7 @@
         prefixCls,
         unClose,
         getWrapClass,
+        tabsRootRef,
         handleEdit,
         handleChange,
         activeKeyRef,