施工管控

src/views/construction/manage/personManage/personManage.vue

@@ -747,11 +747,13 @@ export default {
       // 根据层级使用不同的图标
       let icon;
       if (node.level === 1) {
-        icon = 'el-icon-coin'; // 第一层使用主页图标
+        icon = 'pro_icon';
       } else if (node.level === 2) {
-        icon = 'el-icon-s-unfold'; // 第二层使用展开图标
+        icon = 'tower_nocheck_icon';
-      } else {
+      } else if (node.level === 3) {
-        icon = 'el-icon-user'; // 其他层级使用平台图标
+        icon = 'team_nocheck_icon';
+      } else if (node.level === 4) {
+        icon = '';
       }
 
       return (
@@ -1065,4 +1067,28 @@ export default {
   display: none !important;
 
 }
+
+::v-deep .pro_icon,
+::v-deep .tower_nocheck_icon,
+::v-deep .team_nocheck_icon {
+  vertical-align: top;
+  background-size: cover;
+  background-position: center;
+  display: inline-block;
+  margin-right: 4px;
+  width: 20px;
+  height: 20px;
+}
+
+::v-deep .pro_icon {
+  background-image: url("../../../../assets/images/pro_icon.png") !important;
+}
+
+::v-deep .tower_nocheck_icon {
+  background-image: url("../../../../assets/images/tower_nocheck_icon.png") !important;
+}
+
+::v-deep .team_nocheck_icon {
+  background-image: url("../../../../assets/images/team_nocheck_icon.png") !important;
+}
 </style>

src/views/construction/manage/realTimeManage/realTimeManage.vue

@@ -43,7 +43,12 @@
           style="margin: 10px 0;"></el-input>
         <el-tree :data="treeData" icon="el-icon-search" node-key="id" :default-expanded-keys="idArr"
           @node-click="handleNodeClick" :render-content="renderContent" style="font-size: 15px;letter-spacing: 1px;"
-          ref="tree" :highlight-current="true" :filter-node-method="filterNode" />
+          ref="tree" :highlight-current="true" :filter-node-method="filterNode">
+          <!-- <span class="custom-tree-node" slot-scope="{ node }">
+            <i :class="node.level == 1 ? 'pro_icon' : node.level == 2 ? 'pro_icon' : 'pro_icon'"></i>
+            <span>{{ node.label }}</span>
+          </span> -->
+        </el-tree>
       </div>
     </div>
     <!-- 视频 -->
@@ -282,18 +287,17 @@ export default {
         this.classStyle = 'ball-content-4'
       }
     },
-    //给梳妆街头不同层级设置不同的icon
+    //给tree不同层级设置不同的icon
     renderContent(h, { node, data }) {
       // 根据层级使用不同的图标
       let icon;
       if (node.level === 1) {
-        icon = 'el-icon-coin'; // 第一层使用主页图标
+        icon = 'pro_icon';
-      } else if (node.level === 2) {
+      } else if (node.level === 2 && data.devStatus === 0) {
-        icon = 'el-icon-s-unfold'; // 第二层使用展开图标
+        icon = 'ball_nocheck_icon';
-      } else {
+      } else if (node.level === 2 && data.devStatus === 1) {
-        icon = 'el-icon-user'; // 其他层级使用平台图标
+        icon = 'ball_check_icon';
       }
-
       return (
         <span class="custom-tree-node">
           <i class={icon}></i>
@@ -622,4 +626,33 @@ ul {
   margin-bottom: 10%;
   overflow: auto;
 }
+
+::v-deep .pro_icon,
+::v-deep .ball_nocheck_icon,
+::v-deep .ball_check_icon {
+  vertical-align: top;
+  background-size: cover;
+  background-position: center;
+  display: inline-block;
+  margin-right: 4px;
+}
+
+::v-deep .pro_icon {
+  background-image: url("../../../../assets/images/pro_icon.png") !important;
+  width: 20px;
+  height: 20px;
+
+}
+
+::v-deep .ball_nocheck_icon {
+  background-image: url("../../../../assets/images/ball_nocheck_icon.png") !important;
+  width: 24px;
+  height: 24px;
+}
+
+::v-deep .ball_check_icon {
+  background-image: url("../../../../assets/images/ball_check_icon.png") !important;
+  width: 24px;
+  height: 24px;
+}
 </style>