Преглед на файлове

fix: 相机树加滚动条

sunhongyao341504 преди 2 години
родител
ревизия
6abe3c4d2e
променени са 1 файла, в които са добавени 36 реда и са изтрити 32 реда
  1. 36 32
      src/views/cameras/preview/components/CameraTree/CameraTree.vue

+ 36 - 32
src/views/cameras/preview/components/CameraTree/CameraTree.vue

@@ -8,38 +8,38 @@
         :suffix-icon="Search"
         class="filterTextInput"
       />
-      <!-- <el-scrollbar> -->
-      <el-tree
-        :data="props.cameraTree"
-        :props="defaultProps"
-        @node-click="handleNodeClick"
-        node-key="code"
-        :default-expand-all="true"
-        :filter-node-method="filterNode"
-        ref="treeRef"
-        v-loading="props.loading"
-      >
-        <template #default="{ node, data }">
-          <span class="custom-tree-node">
-            <span
-              class="cameraCommon"
-              :class="{
-                cameraSelect: isSelect(data),
-              }"
-            ></span>
-            <el-icon
-              v-if="data.nodeType === CameraTreeNodeType.camera"
-              class="cameraIcon"
-              :class="{
-                iconSelect: isSelect(data),
-              }"
-              ><VideoCamera
-            /></el-icon>
-            {{ node.label }}
-          </span>
-        </template>
-      </el-tree>
-      <!-- </el-scrollbar> -->
+      <el-scrollbar class="tree-scroll">
+        <el-tree
+          :data="props.cameraTree"
+          :props="defaultProps"
+          @node-click="handleNodeClick"
+          node-key="code"
+          :default-expand-all="true"
+          :filter-node-method="filterNode"
+          ref="treeRef"
+          v-loading="props.loading"
+        >
+          <template #default="{ node, data }">
+            <span class="custom-tree-node">
+              <span
+                class="cameraCommon"
+                :class="{
+                  cameraSelect: isSelect(data),
+                }"
+              ></span>
+              <el-icon
+                v-if="data.nodeType === CameraTreeNodeType.camera"
+                class="cameraIcon"
+                :class="{
+                  iconSelect: isSelect(data),
+                }"
+                ><VideoCamera
+              /></el-icon>
+              {{ node.label }}
+            </span>
+          </template>
+        </el-tree>
+      </el-scrollbar>
     </div>
   </div>
 </template>
@@ -102,6 +102,10 @@
     margin-right: 6px;
   }
 
+  .tree-scroll {
+    height: calc(100vh - 64px - 170px);
+  }
+
   .cameraSelect {
     width: 6px;
     height: 6px;