Merge branch 'master' into staffNoFix

src/views/cameras/preview/CameraPreview.vue

@@ -82,16 +82,20 @@
   .cameraMain {
     display: flex;
     background: #fff;
+    height: calc(100vh - 90px);
   }
   .cameraTree {
     width: 250px;
     // height: 800px;
     // border: 1px solid #ccc;
+    border: 1px solid #f0f2f5;
+    margin: 5px;
   }
 
   .cameraPlaceholder {
-    color: #ccc;
+    color: #333;
     text-align: center;
     margin-top: 100px;
+    margin-left: 100px;
   }
 </style>

src/views/cameras/preview/components/CameraTree/CameraTree.vue

@@ -1,38 +1,40 @@
 <template>
   <div class="cameraTreeWrapper">
     <div class="cameraTreeTitle">场景树</div>
-    <el-input
-      v-model="filterText"
-      placeholder="请输入相机的名称进行搜索"
-      :suffix-icon="Search"
-      class="filterTextInput"
-    />
+    <div class="cameraTreeInputWrapper">
+      <el-input
+        v-model="filterText"
+        placeholder="请输入相机的名称进行搜索"
+        :suffix-icon="Search"
+        class="filterTextInput"
+      />
 
-    <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
-            ><span
-              class="cameraCommon"
-              :class="{
-                cameraSelect:
-                  data.nodeType === CameraTreeNodeType.camera && data.id === Number(cameraId),
-              }"
-            ></span
-            >{{ node.label }}</span
-          >
-        </span>
-      </template>
-    </el-tree>
+      <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
+              ><span
+                class="cameraCommon"
+                :class="{
+                  cameraSelect:
+                    data.nodeType === CameraTreeNodeType.camera && data.id === Number(cameraId),
+                }"
+              ></span
+              >{{ node.label }}</span
+            >
+          </span>
+        </template>
+      </el-tree>
+    </div>
   </div>
 </template>
 <script lang="ts" setup>
@@ -99,7 +101,7 @@
     padding: 12px;
   }
 
-  .cameraTreeWrapper {
+  .cameraTreeInputWrapper {
     padding: 8px;
   }
   .filterTextInput {