Browse Source

fix: 滑动问题修改

chenzhen2 2 years ago
parent
commit
9235be652d
1 changed files with 19 additions and 8 deletions
  1. 19 8
      src/views/envmonitor/components/workOvertime/index.vue

+ 19 - 8
src/views/envmonitor/components/workOvertime/index.vue

@@ -208,8 +208,15 @@ export default defineComponent({
         // 获取当前时间的下标
         let sliderList: any = document.querySelector("#sliderListId");
         let slidersWrapper: any = document.querySelector("#slidersWrapperId");
+        let leftInit: any = 0;
         let width: any =
           sliderList.offsetWidth - proxyData.screenInfo.screenWidth;
+        sliderList.addEventListener("touchstart", function (e: any) {
+          leftInit = isNaN(parseInt(sliderList.style.left))
+            ? 0
+            : parseInt(sliderList.style.left);
+          leftInit = Math.abs(leftInit);
+        });
         swiper(sliderList, {
           swipeLeft: function (e: any) {
             if (!proxyData.checkMoveTarget(e)) {
@@ -221,7 +228,7 @@ export default defineComponent({
                 sliderList.style.left = -width + "px";
               } else {
                 sliderList.style.left =
-                  -left - Math.abs(e.mation.moveX - e.mation.startX) + "px";
+                  -leftInit - Math.abs(e.mation.moveX - e.mation.startX) + "px";
               }
             }
           },
@@ -234,7 +241,7 @@ export default defineComponent({
                 sliderList.style.left = 0 + "px";
               } else {
                 sliderList.style.left =
-                  left + Math.abs(e.mation.moveX - e.mation.startX) + "px";
+                  -leftInit + Math.abs(e.mation.moveX - e.mation.startX) + "px";
               }
             }
           },
@@ -305,13 +312,13 @@ export default defineComponent({
           startElLeft = isNaN(parseInt(startEl.style.left))
             ? 0
             : parseInt(startEl.style.left);
-          sliderInitLeft = isNaN(parseInt(sliderList.style.left))
-            ? 0
-            : parseInt(sliderList.style.left);
+          // sliderInitLeft = isNaN(parseInt(sliderList.style.left))
+          //   ? 0
+          //   : parseInt(sliderList.style.left);
           sliderBtnLeft = isNaN(parseInt(sliderBtnEl.style.left))
             ? 0
             : parseInt(sliderBtnEl.style.left);
-          sliderInitLeft = Math.abs(sliderInitLeft);
+          // sliderInitLeft = Math.abs(sliderInitLeft);
           sliderBtnWidth = sliderBtnEl.offsetWidth;
           sliderBoxWidth = sliderBoxEl.offsetWidth;
         });
@@ -357,7 +364,11 @@ export default defineComponent({
                 sliderBtnLeft + (sliderBtnWidth - moveRealX) - sliderBoxWidth <
                 sliderLeft
               ) {
-                let left: any =-sliderInitLeft +(sliderInitLeft +sliderBoxWidth -(sliderBtnLeft + sliderBtnWidth - moveRealX));
+                let left: any =
+                  -sliderLeft +
+                  (sliderLeft +
+                    sliderBoxWidth -
+                    (sliderBtnLeft + sliderBtnWidth - moveRealX));
                 if (left > 0) {
                   sliderList.style.left = 0 + "px";
                 } else {
@@ -387,7 +398,7 @@ export default defineComponent({
                 screenLeft
               ) {
                 let left: any =
-                  -sliderInitLeft -
+                  -sliderLeft -
                   (sliderBtnLeft +
                     sliderBtnWidth +
                     moveRealX +