From 1cc53e254d68b7168386c4f890bbb7a9e7b9a0a6 Mon Sep 17 00:00:00 2001
From: yiming <wang.yiming@hzleaper.com>
Date: Tue, 31 May 2022 10:57:42 +0800
Subject: [PATCH] =?UTF-8?q?=E7=90=83=E6=9C=BA=E9=A2=84=E5=88=B6=E7=82=B9?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/cameraManage/model.vue       | 10 ++++++-
 src/views/realTimeMonitoring/index.vue | 38 ++++++++++++++++----------
 src/views/realTimeMonitoring/model.vue | 12 +++++---
 3 files changed, 40 insertions(+), 20 deletions(-)

diff --git a/src/views/cameraManage/model.vue b/src/views/cameraManage/model.vue
index ff007c7..d6e7a05 100644
--- a/src/views/cameraManage/model.vue
+++ b/src/views/cameraManage/model.vue
@@ -143,7 +143,7 @@
                               @mouseup="leftDownStop" @mousemove="leftDownStop">
                          <img :src="downUrl" alt="" @mousedown="downStart" @mouseup="downStop" @mousemove="downStop">
                          <img :src="rightDownUrl" alt="" @mousedown="rightDownStart"
-                              @mouseup="rightDownStop" @mousemove=" ">
+                              @mouseup="rightDownStop" @mousemove="rightDownStop">
                      </div>
                  </div>
                  <div class="config-table">
@@ -768,6 +768,10 @@ export default {
             .operation-item{
                 img{
                     width: 42px;
+                    -webkit-user-select: none;
+                    -ms-user-select: none;
+                    -webkit-user-drag: none;
+                    user-select: none;
                 }
                 span{
                     padding: 5px 10px;
@@ -790,6 +794,10 @@ export default {
                 justify-content: space-between;
                 img{
                     width: 42px;
+                    -webkit-user-select: none;
+                    -ms-user-select: none;
+                    -webkit-user-drag: none;
+                    user-select: none;
                 }
             }
         }
diff --git a/src/views/realTimeMonitoring/index.vue b/src/views/realTimeMonitoring/index.vue
index 2e5df6f..1fdeda3 100644
--- a/src/views/realTimeMonitoring/index.vue
+++ b/src/views/realTimeMonitoring/index.vue
@@ -20,41 +20,41 @@
                 </video>
                 <div class="operation-list">
                      <div class="operation-item">
-                         <img :src="zoomSubUrl" alt="" @mousedown=zoomDecStart($event,item.id)
+                         <img :src="zoomSubUrl" alt="" @mousedown=zoomDecStart($event,item.id) @mousemove=zoomDecStop($event,item.id)
                               @mouseup=zoomDecStop($event,item.id)>
                          <span>变倍</span>
-                         <img :src="zoomAddUrl" alt="" @mousedown=zoomAddStart($event,item.id)
+                         <img :src="zoomAddUrl" alt="" @mousedown=zoomAddStart($event,item.id) @mousemove=zoomAddStop($event,item.id)
                               @mouseup=zoomAddStop($event,item.id)>
                      </div>
                      <div class="operation-item">
-                         <img :src="focusSubUrl" alt="" @mousedown=focusDecStart($event,item.id)
+                         <img :src="focusSubUrl" alt="" @mousedown=focusDecStart($event,item.id) @mousemove=focusDecStop($event,item.id)
                               @mouseup=focusDecStop($event,item.id)>
                          <span>变焦</span>
-                         <img :src="focusAddUrl" alt="" @mousedown=focusAddStart($event,item.id)
+                         <img :src="focusAddUrl" alt="" @mousedown=focusAddStart($event,item.id) @mousemove=focusAddStop($event,item.id)
                               @mouseup=focusAddStop($event,item.id)>
                      </div>
                      <div class="operation-item">
-                         <img :src="irisSubUrl" alt="" @mousedown=irisDecStart($event,item.id) @mouseup=irisDecStop($event,item.id)>
+                         <img :src="irisSubUrl" alt="" @mousedown=irisDecStart($event,item.id) @mouseup=irisDecStop($event,item.id) @mousemove=irisDecStop($event,item.id)>
                          <span>光圈</span>
-                         <img :src="irisAddUrl" alt="" @mousedown=irisAddStart($event,item.id) @mouseup=irisAddStop($event,item.id)>
+                         <img :src="irisAddUrl" alt="" @mousedown=irisAddStart($event,item.id) @mouseup=irisAddStop($event,item.id) @mousemove=irisAddStop($event,item.id)>
                      </div>
                  </div>
                  <div class="direction-list">
                      <div class="direction-item">
-                         <img :src="leftUpUrl" alt="" @mousedown=leftUpStart($event,item.id) @mouseup=leftUpStop($event,item.id)>
-                         <img :src="upUrl" alt="" @mousedown=upStart($event,item.id) @mouseup=upStop($event,item.id)>
-                         <img :src="rightUpUrl" alt="" @mousedown=rightUpStart($event,item.id) @mouseup=rightUpStop($event,item.id)>
+                         <img :src="leftUpUrl" alt="" @mousedown=leftUpStart($event,item.id) @mouseup=leftUpStop($event,item.id) @mousemove=leftUpStop($event,item.id)>
+                         <img :src="upUrl" alt="" @mousedown=upStart($event,item.id) @mouseup=upStop($event,item.id) @mousemove=upStop($event,item.id) >
+                         <img :src="rightUpUrl" alt="" @mousedown=rightUpStart($event,item.id) @mouseup=rightUpStop($event,item.id) @mousemove=rightUpStop($event,item.id) >
                      </div>
                      <div class="direction-item">
-                         <img :src="leftUrl" alt="" @mousedown=leftStart($event,item.id) @mouseup=leftStop($event,item.id)>
-                         <img :src="rightUrl" alt="" @mousedown=rightStart($event,item.id) @mouseup=rightStop($event,item.id)>
+                         <img :src="leftUrl" alt="" @mousedown=leftStart($event,item.id) @mouseup=leftStop($event,item.id) @mousemove=leftStop($event,item.id)>
+                         <img :src="rightUrl" alt="" @mousedown=rightStart($event,item.id) @mouseup=rightStop($event,item.id) @mousemove=rightStop($event,item.id)>
                      </div>
                      <div class="direction-item">
                          <img :src="leftDownUrl" alt="" @mousedown=leftDownStart($event,item.id)
-                              @mouseup=leftDownStop($event,item.id)>
-                         <img :src="downUrl" alt="" @mousedown=downStart($event,item.id) @mouseup=downStop($event,item.id)>
+                              @mouseup=leftDownStop($event,item.id) @mousemove=leftDownStop($event,item.id)>
+                         <img :src="downUrl" alt="" @mousedown=downStart($event,item.id) @mouseup=downStop($event,item.id) @mousemove=downStop($event,item.id)>
                          <img :src="rightDownUrl" alt="" @mousedown=rightDownStart($event,item.id)
-                              @mouseup=rightDownStop($event,item.id)>
+                              @mouseup=rightDownStop($event,item.id) @mousemove=rightDownStop($event,item.id)>
                      </div>
                  </div>
             </div>
@@ -535,7 +535,7 @@ export default {
     video::-webkit-media-controls-enclosure{ 
         display: none;
     }
-    .operation-list{
+    .operation-list {
             position: absolute;
             right: 200px;
             bottom: 20px;
@@ -545,6 +545,10 @@ export default {
             .operation-item{
                 img{
                     width: 32px;
+                    -webkit-user-select: none;
+                    -ms-user-select: none;
+                    -webkit-user-drag: none;
+                    user-select: none;
                 }
                 span{
                     padding: 3px 6px;
@@ -567,6 +571,10 @@ export default {
                 justify-content: space-between;
                 img{
                     width: 32px;
+                    -webkit-user-select: none;
+                    -ms-user-select: none;
+                    -webkit-user-drag: none;
+                    user-select: none;
                 }
             }
         }
diff --git a/src/views/realTimeMonitoring/model.vue b/src/views/realTimeMonitoring/model.vue
index e7ef1bf..d424ddc 100644
--- a/src/views/realTimeMonitoring/model.vue
+++ b/src/views/realTimeMonitoring/model.vue
@@ -37,9 +37,9 @@
                <img :src="rightUpUrl" alt="" @mousedown="rightUpStart" @mouseup="rightUpStop" @mousemove="rightUpStop">
            </div>
            <div class="direction-item">
-               <img :src="leftUrl" alt="" @mousedown="leftStart" @mouseup="leftStop" @mousemove="leftStop">
-               <img :src="rightUrl" alt="" @mousedown="rightStart" @mouseup="rightStop" @mousemove="rightStop">
-           </div>
+               <img :src="leftUrl" ondragstart="return false;"  @mousedown="leftStart" @mouseup="leftStop" @mousemove="leftStop">
+               <img :src="rightUrl" ondragstart="return false;" @mousedown="rightStart" @mouseup="rightStop" @mousemove="rightStop">
+           </div> 
            <div class="direction-item">
                <img :src="leftDownUrl" alt="" @mousedown="leftDownStart" @mouseup="leftDownStop" @mousemove="leftDownStop">
                <img :src="downUrl" alt="" @mousedown="downStart" @mouseup="downStop" @mousemove="downStop">
@@ -47,7 +47,7 @@
            </div>
        </div>
    </div>
-</template>
+</template>   
 <script>
 export default {
     data() {
@@ -486,6 +486,10 @@ export default {
 
                 img {
                     width: 42px;
+                    -webkit-user-select: none;
+                    -ms-user-select: none;
+                    -webkit-user-drag: none;
+                    user-select: none;
                 }
             }
         }