From ed35d0b4c2051e067bd9904c4b0158257d5db0d9 Mon Sep 17 00:00:00 2001
From: ZZJ <10913410+zzj2100@user.noreply.gitee.com>
Date: 星期二, 02 八月 2022 18:58:30 +0800
Subject: [PATCH] 摄像机树样式,导出数据样式

---
 src/views/hashrate/CameraManage/index.vue |   48 ++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 46 insertions(+), 2 deletions(-)

diff --git a/src/views/hashrate/CameraManage/index.vue b/src/views/hashrate/CameraManage/index.vue
index b738df9..5101a13 100644
--- a/src/views/hashrate/CameraManage/index.vue
+++ b/src/views/hashrate/CameraManage/index.vue
@@ -13,7 +13,10 @@
       </el-select>
     </div>
     <div class="content">
-      <CameraLeft :appName="'Camera'" ref="left"></CameraLeft>
+      <div class="column-left" ref="left">
+        <div class="resize-line" @mousedown="TextWidthChange"></div>
+        <CameraLeft :appName="'Camera'" ref="left"></CameraLeft>
+      </div>
       <div class="right">
         <div class="tabs">
           <div
@@ -165,6 +168,31 @@
     });
   },
   methods: {
+    TextWidthChange(e) {
+      console.log(1212);
+      let odivParent = e.currentTarget.parentNode; //鑾峰彇鐩爣鐖跺厓绱�
+      let dx = e.clientX; //褰撲綘绗竴娆″崟鍑荤殑鏃跺�欙紝瀛樺偍x杞寸殑鍧愭爣銆�
+      let dw = odivParent.offsetWidth; //瀛樺偍榛樿鐨刣iv鐨勫搴︺��
+      document.onmousemove = (e) => {
+        odivParent.style.width = dw + (e.clientX - dx) + "px";
+
+        if (odivParent.offsetWidth <= 100) {
+          //褰撶洅瀛愮缉灏忓埌涓�瀹氳寖鍥村唴鐨勬椂鍊欙紝璁╀粬淇濇寔涓�涓浐瀹氬�硷紝涓嶅啀缁х画鏀瑰彉
+          odivParent.style.width = "100px";
+        }
+
+        if (odivParent.offsetWidth + odivParent.offsetLeft >= this.pdfWidth) {
+          odivParent.style.width = this.pdfWidth - odivParent.offsetLeft + "px";
+        }
+      };
+      document.onmouseup = (e) => {
+        document.onmousemove = null;
+        document.onmouseup = null;
+      };
+      e.stopPropagation();
+      e.preventDefault();
+      return false;
+    },
     handAddDevice(node) {
       let _this = this;
       setTimeout(() => {
@@ -312,9 +340,25 @@
     margin-bottom: 60px;
     display: flex;
     align-items: stretch;
-    .CameraLeft {
+    .column-left {
+      position: relative;
       margin-right: 24px;
       width: 292px;
+      background-color: #fff;
+    }
+
+    .resize-line {
+      position: absolute;
+      right: 0;
+      top: 0;
+      bottom: 0;
+      border-right: 2px solid #efefef;
+      border-left: 2px solid #e0e0e0;
+      z-index: 1;
+      cursor: ew-resize;
+    }
+    .resize-line:hover {
+      border-left: 2px dashed skyblue;
     }
 
     .right {

--
Gitblit v1.8.0