From 39d62a01859dae63011ef61ac602313dea197fb0 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期五, 18 九月 2020 16:43:48 +0800
Subject: [PATCH] 摄像机配置左侧目录树缩放修复

---
 src/pages/cameraAccess/index/App.vue |  113 +++++++++++++++++++++++++++++++++++++++++++++++++-------
 1 files changed, 99 insertions(+), 14 deletions(-)

diff --git a/src/pages/cameraAccess/index/App.vue b/src/pages/cameraAccess/index/App.vue
index fbe41cb..d7b7ab0 100644
--- a/src/pages/cameraAccess/index/App.vue
+++ b/src/pages/cameraAccess/index/App.vue
@@ -60,28 +60,31 @@
 
 <style lang="scss" scoped>
 .column {
-  overflow-y: hidden;
-  display: flex;
-  width: 100%;
+  overflow: hidden;
+  min-width: 1399px;
+  //min-width: 1920px;
   height: 100%;
 }
 .column-left {
-  height: 100%;
-  padding-bottom: 20px;
-  box-sizing: border-box;
-  // height: inherit;
   background-color: #fff;
   position: relative;
-  //float: left;
+  float: left;
+  height: 100vh;
 }
 .column-right {
-  position: relative;
-  flex: 1;
-  background-color: #fff;
+  height: 100vh;
+  background-color: #eee;
   box-sizing: border-box;
+  //overflow: hidden;
   overflow-y: hidden;
+  overflow-x: auto;
+}
+.heigher-index {
+  position: absolute;
+  top: 0;
+  z-index: 10;
+  width: 100%;
   height: 100%;
-  min-width: 1602px;
 }
 .resize-save {
   position: absolute;
@@ -89,7 +92,8 @@
   right: 5px;
   bottom: 0;
   left: 0;
-  padding: 14px;
+  padding: 16px;
+  padding-top: 8px;
   overflow-x: hidden;
   overflow-y: hidden;
 }
@@ -112,7 +116,6 @@
   border-right: 2px solid #efefef;
   border-left: 1px solid #e0e0e0;
   pointer-events: none;
-  //cursor: ew-resize;
 }
 .resize-bar:hover ~ .resize-line,
 .resize-bar:active ~ .resize-line {
@@ -141,4 +144,86 @@
     background-size: 100% 100%;
   }
 }
+// .column {
+//   overflow-y: hidden;
+//   display: flex;
+//   width: 100%;
+//   height: 100%;
+// }
+// .column-left {
+//   height: 100%;
+//   padding-bottom: 20px;
+//   box-sizing: border-box;
+//   // height: inherit;
+//   background-color: #fff;
+//   position: relative;
+//   //float: left;
+// }
+// .column-right {
+//   position: relative;
+//   flex: 1;
+//   background-color: #fff;
+//   box-sizing: border-box;
+//   overflow-y: hidden;
+//   height: 100%;
+//   min-width: 1602px;
+// }
+// .resize-save {
+//   position: absolute;
+//   top: 0;
+//   right: 5px;
+//   bottom: 0;
+//   left: 0;
+//   padding: 14px;
+//   overflow-x: hidden;
+//   overflow-y: hidden;
+// }
+// .resize-bar {
+//   width: 310px;
+//   height: inherit;
+//   resize: horizontal;
+//   cursor: ew-resize;
+//   opacity: 0;
+//   overflow: scroll;
+//   max-width: 500px; //璁惧畾鏈�澶ф媺浼搁暱搴�
+//   min-width: 33px; //璁惧畾鏈�灏忓搴�
+// }
+// /* 鎷栨嫿绾� */
+// .resize-line {
+//   position: absolute;
+//   right: 0;
+//   top: 0;
+//   bottom: 0;
+//   border-right: 2px solid #efefef;
+//   border-left: 1px solid #e0e0e0;
+//   pointer-events: none;
+//   //cursor: ew-resize;
+// }
+// .resize-bar:hover ~ .resize-line,
+// .resize-bar:active ~ .resize-line {
+//   border-left: 1px dashed skyblue;
+// }
+// .resize-bar::-webkit-scrollbar {
+//   width: 200px;
+//   height: inherit;
+// }
+
+// /* Firefox鍙湁涓嬮潰涓�灏忓潡鍖哄煙鍙互鎷変几 */
+// @supports (-moz-user-select: none) {
+//   .resize-bar:hover ~ .resize-line,
+//   .resize-bar:active ~ .resize-line {
+//     border-left: 1px solid #bbb;
+//   }
+//   .resize-bar:hover ~ .resize-line::after,
+//   .resize-bar:active ~ .resize-line::after {
+//     content: "";
+//     position: absolute;
+//     width: 16px;
+//     height: 16px;
+//     bottom: 0;
+//     right: -8px;
+//     // background: url(./resize.svg);
+//     background-size: 100% 100%;
+//   }
+// }
 </style>

--
Gitblit v1.8.0