diff --git a/package.json b/package.json
index 0e0f54b88..1340f1a50 100644
--- a/package.json
+++ b/package.json
@@ -54,7 +54,7 @@
"@logicflow/extension": "^1.2.19",
"@pureadmin/descriptions": "^1.2.0",
"@pureadmin/table": "^3.0.1",
- "@pureadmin/utils": "^2.4.3",
+ "@pureadmin/utils": "^2.4.4",
"@vueuse/core": "^10.7.2",
"@vueuse/motion": "^2.0.0",
"@wangeditor/editor": "^5.1.23",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9f40066c4..5f029f2e7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -24,8 +24,8 @@ dependencies:
specifier: ^3.0.1
version: 3.0.1(element-plus@2.5.1)(typescript@5.3.3)
'@pureadmin/utils':
- specifier: ^2.4.3
- version: 2.4.3(echarts@5.4.3)(vue@3.4.14)
+ specifier: ^2.4.4
+ version: 2.4.4(echarts@5.4.3)(vue@3.4.14)
'@vueuse/core':
specifier: ^10.7.2
version: 10.7.2(vue@3.4.14)
@@ -1763,8 +1763,8 @@ packages:
string-hash: 1.1.3
dev: true
- /@pureadmin/utils@2.4.3(echarts@5.4.3)(vue@3.4.14):
- resolution: {integrity: sha512-2CT8HIFUWiFZCJnclBRpng5kVQawvZWdAH4ERPnDZGt5pPltGzNNodpsDVHBCKYAbf/xDKpiNUkYwNbPCCIM9Q==}
+ /@pureadmin/utils@2.4.4(echarts@5.4.3)(vue@3.4.14):
+ resolution: {integrity: sha512-dH1ml+/U50Te7KlZX8pkA08/o+XKYx8aFyds9aTBC34JDyn0GQSyhe0zFIfGwnFztWMToWn/cyitpXmDEcq3NA==}
peerDependencies:
echarts: '*'
vue: '*'
diff --git a/src/layout/components/tag/index.scss b/src/layout/components/tag/index.scss
index c87be26f2..28faf501c 100644
--- a/src/layout/components/tag/index.scss
+++ b/src/layout/components/tag/index.scss
@@ -109,7 +109,6 @@
overflow: visible;
white-space: nowrap;
list-style: none;
- transition: transform 0.5s ease-in-out;
.scroll-item {
transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
diff --git a/src/layout/components/tag/index.vue b/src/layout/components/tag/index.vue
index c2244db22..a2ea3e250 100644
--- a/src/layout/components/tag/index.vue
+++ b/src/layout/components/tag/index.vue
@@ -38,6 +38,7 @@ const {
pureSetting,
activeIndex,
getTabStyle,
+ isScrolling,
iconIsActive,
linkIsActive,
currentSelect,
@@ -138,6 +139,37 @@ const handleScroll = (offset: number): void => {
translateX.value = 0;
}
}
+ isScrolling.value = false;
+};
+
+const handleWheel = (event: WheelEvent): void => {
+ isScrolling.value = true;
+ const scrollIntensity = Math.abs(event.deltaX) + Math.abs(event.deltaY);
+ let offset = 0;
+ if (event.deltaX < 0) {
+ offset = scrollIntensity > 0 ? scrollIntensity : 100;
+ } else {
+ offset = scrollIntensity > 0 ? -scrollIntensity : -100;
+ }
+
+ smoothScroll(offset);
+};
+
+const smoothScroll = (offset: number): void => {
+ const scrollAmount = 20; // 每帧滚动的距离
+ let remaining = Math.abs(offset);
+
+ const scrollStep = () => {
+ const scrollOffset = Math.sign(offset) * Math.min(scrollAmount, remaining);
+ handleScroll(scrollOffset);
+ remaining -= Math.abs(scrollOffset);
+
+ if (remaining > 0) {
+ requestAnimationFrame(scrollStep);
+ }
+ };
+
+ requestAnimationFrame(scrollStep);
};
function dynamicRouteTag(value: string): void {
@@ -525,7 +557,11 @@ onBeforeUnmount(() => {