perf: 标签页可按滑动力度进行左右滑动 (#884)

* perf: 标签页可按滑动力度进行左右滑动

* fix: login keypress

src/layout/hooks/useTag.ts

@@ -42,6 +42,7 @@ export function useTags() {
   const activeIndex = ref(-1);
   // 当前右键选中的路由信息
   const currentSelect = ref({});
+  const isScrolling = ref(false);
 
   /** 显示模式，默认灵动模式 */
   const showModel = ref(
@@ -152,7 +153,8 @@ export function useTags() {
 
   const getTabStyle = computed((): CSSProperties => {
     return {
-      transform: `translateX(${translateX.value}px)`
+      transform: `translateX(${translateX.value}px)`,
+      transition: isScrolling.value ? "none" : "transform 0.5s ease-in-out"
     };
   });
 
@@ -228,6 +230,7 @@ export function useTags() {
     pureSetting,
     activeIndex,
     getTabStyle,
+    isScrolling,
     iconIsActive,
     linkIsActive,
     currentSelect,