Merge branch '20230223_pad_vue_new_branch' of http://git.shengws.com/csx/Pad_New into 20230223_pad_vue_new_branch

src/pages/patientCenter/allCheck/index.vue

@@ -54,17 +54,20 @@
           <div class="nodata" v-else>
             <img src="../../../assets/images/none.png" alt />
           </div>
-          <div style="display: flex;justify-content: space-around;">
-            <div style="margin-right: 20px;">
-              <el-button type="primary">上一张</el-button>
-            </div>
-            <div><el-button type="primary">下一张</el-button></div>
-            <!-- <el-button>上一张</el-button>
-            <el-button>下一张</el-button> -->
-          </div>
         </van-tab>
       </van-tabs>
-      
+      <div class="fixedBox3" ref="butt">
+        <div @mousedown="down" @touchstart="down" @mousemove="move" 
+        @touchmove="move" @mouseup="end" @touchend="end" @touchcancel="end">
+          <el-button type="primary">上一张</el-button>
+        </div>
+      </div>
+      <div class="fixedBox4" ref="butt2">
+        <div @mousedown="down2" @touchstart="down2" @mousemove="move2" 
+        @touchmove="move2" @mouseup="end2" @touchend="end2" @touchcancel="end2">
+          <el-button type="primary">下一张</el-button>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -94,9 +97,61 @@ export default {
       patientid: 0,
       data: [],
       projectName: [],
-      restatus: 0
+      restatus: 0,
+      nx: '',
+      ny: '',
+      dx: '',
+      dy: '',
+      xPum: '',
+      yPum: '',
+      position: {
+        x: 0,
+        y: 0
+      },
+      moveBtnbut: {},
+      keyBoardShow:true,
+      flags: false,
+      nx2: '',
+      ny2: '',
+      dx2: '',
+      dy2: '',
+      xPum2: '',
+      yPum2: '',
+      position2: {
+        x: 0,
+        y: 0
+      },
+      moveBtnbut2: {},
+         
     };
   },
+  mounted(){
+    this.moveBtnbut = this.$refs.butt
+    if (sessionStorage.getItem('checkBtnTop2')) {
+      this.moveBtnbut.style.top = sessionStorage.getItem('checkBtnTop2')
+      this.moveBtnbut.style.bottom = 'initial'
+    }
+    if (sessionStorage.getItem('checkBtnLeft2')) {
+      this.moveBtnbut.style.left = sessionStorage.getItem('checkBtnLeft2')
+    }
+    this.moveBtnbut2 = this.$refs.butt2
+    if (sessionStorage.getItem('checkBtnTop3')) {
+      this.moveBtnbut2.style.top = sessionStorage.getItem('checkBtnTop3')
+      this.moveBtnbut2.style.bottom = 'initial'
+    }
+    if (sessionStorage.getItem('checkBtnLeft3')) {
+      this.moveBtnbut2.style.left = sessionStorage.getItem('checkBtnLeft3')
+    }
+    const originHeight = document.documentElement.clientHeight || document.body.clientHeight
+    window.addEventListener('resize', () => {
+      const resizeHeight = document.documentElement.clientHeight || document.body.clientHeight
+      if (resizeHeight < originHeight) {
+        this.keyBoardShow = false
+      } else {
+        this.keyBoardShow = true
+      }
+    }, false)
+  },
   methods: {
     GetAllProjectNameByDate(date, patientid) {
       GetAllProjectNameByDate(date, patientid).then(response => {
@@ -178,7 +233,121 @@ export default {
             this.activeTwo
         );
       }
-    }
+    },
+     // 拖动
+     down (event) {
+      this.flags = true
+      var touch
+      if (event.touches) {
+        touch = event.touches[0]
+      } else {
+        touch = event
+      }
+      console.log('touch',touch);
+      this.position.x = touch.clientX
+      this.position.y = touch.clientY
+      this.dx = this.moveBtnbut.offsetLeft
+      this.dy = this.moveBtnbut.offsetTop
+    },
+    move (event) {
+      if (this.flags) {
+        var touch
+        if (event.touches) {
+          touch = event.touches[0]
+        } else {
+          touch = event
+        }
+        this.nx = touch.clientX - this.position.x
+        this.ny = touch.clientY - this.position.y
+        this.xPum = this.dx + this.nx
+        this.yPum = this.dy + this.ny
+        var clientWidth = document.documentElement.clientWidth
+        var clientHeight = document.documentElement.clientHeight
+        if (
+          this.xPum > 0 &&
+          this.xPum < clientWidth - this.moveBtnbut.offsetWidth
+        ) {
+          this.moveBtnbut.style.left = this.xPum + 'px'
+        }
+        if (
+          this.yPum > 0 &&
+          this.yPum < clientHeight - this.moveBtnbut.offsetHeight
+        ) {
+          this.moveBtnbut.style.top = this.yPum + 'px'
+        }
+
+        // 阻止页面的滑动默认事件
+        document.addEventListener('touchmove', this.handler, {
+          passive: false
+        })
+      }
+    },
+    // 鼠标释放时候的函数
+    end () {
+      this.flags = false
+      sessionStorage.setItem('checkBtnTop2', this.moveBtnbut.style.top)
+      sessionStorage.setItem('checkBtnLeft2', this.moveBtnbut.style.left)
+      document.addEventListener('touchmove', this.handler, {
+        passive: false
+      })
+    },
+    // 拖动
+    down2 (event) {
+      this.flags = true
+      var touch
+      if (event.touches) {
+        touch = event.touches[0]
+      } else {
+        touch = event
+      }
+      console.log('touch',touch);
+      this.position2.x = touch.clientX
+      this.position2.y = touch.clientY
+      this.dx2 = this.moveBtnbut2.offsetLeft
+      this.dy2 = this.moveBtnbut2.offsetTop
+    },
+    move2 (event) {
+      if (this.flags) {
+        var touch
+        if (event.touches) {
+          touch = event.touches[0]
+        } else {
+          touch = event
+        }
+        this.nx2 = touch.clientX - this.position2.x
+        this.ny2 = touch.clientY - this.position2.y
+        this.xPum2 = this.dx2 + this.nx2
+        this.yPum2 = this.dy2 + this.ny2
+        var clientWidth = document.documentElement.clientWidth
+        var clientHeight = document.documentElement.clientHeight
+        if (
+          this.xPum2 > 0 &&
+          this.xPum2 < clientWidth - this.moveBtnbut2.offsetWidth
+        ) {
+          this.moveBtnbut2.style.left = this.xPum2 + 'px'
+        }
+        if (
+          this.yPum2 > 0 &&
+          this.yPum2 < clientHeight - this.moveBtnbut2.offsetHeight
+        ) {
+          this.moveBtnbut2.style.top = this.yPum2 + 'px'
+        }
+
+        // 阻止页面的滑动默认事件
+        document.addEventListener('touchmove', this.handler, {
+          passive: false
+        })
+      }
+    },
+    // 鼠标释放时候的函数
+    end2 () {
+      this.flags = false
+      sessionStorage.setItem('checkBtnTop3', this.moveBtnbut2.style.top)
+      sessionStorage.setItem('checkBtnLeft3', this.moveBtnbut2.style.left)
+      document.addEventListener('touchmove', this.handler, {
+        passive: false
+      })
+    },
   },
   created() {
     var patientid = this.$route.query.patientid ? this.$route.query.patientid : this.$route.query.patient_id;
@@ -291,6 +460,18 @@ export default {
     }
   }
 }
+.fixedBox3{
+  position: fixed;
+  bottom: 1.2rem;
+  right: 0.2rem;
+  z-index: 5;
+}
+.fixedBox4{
+  position: fixed;
+  bottom: 0.625rem;
+  right: 0.2rem;
+  z-index: 5;
+}
 </style>
 
 <style lang="scss">