no message

src/views/setting/departmentManagement/index.vue

@@ -6,7 +6,7 @@
           <el-button style="margin-right: 5px" size="mini" icon="el-icon-search" @click="getTreeListData"></el-button>
           <el-input size="mini" v-model="filterText" placeholder="请输入内容"></el-input>
         </div>
-        <zj-page-fill>
+        <zj-page-fill id="kakaka">
           <el-tree
             :data="treeList"
             :props="defaultProps"
@@ -18,7 +18,7 @@
             ref="listTree"
           >
             <span class="custom-tree-node" slot-scope="{ node, data }">
-              <span>{{ node.label }}</span>
+              {{ node.label }}
               <span>
                 <el-button v-if="node.level > 1" size="mini" type="text" @click="addbumen(data)">
                   <i class="el-icon-plus"></i>
@@ -185,6 +185,23 @@ export default {
       adminDeptTree().then(res => {
         this.treeList = res.data
         this.$refs.pageRef.refreshList()
+        this.$nextTick(() => {
+          const tree = document.getElementById('kakaka').getElementsByClassName('el-tree')
+          const elTreeNodeContent = document.getElementById('kakaka').getElementsByClassName('el-tree-node__content')
+          if (elTreeNodeContent.length) {
+            var maxwidth = 0
+            for (var item of elTreeNodeContent) {
+              if (maxwidth < item.scrollWidth) {
+                maxwidth = item.scrollWidth
+              }
+            }
+          }
+          if (tree.length) {
+            for (var item of tree) {
+              item.style.width = `${maxwidth}px`
+            }
+          }
+        })
       })
     },
     // 树形选中
@@ -311,6 +328,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+::v-deep .zj-page-fill-scroll {
+  overflow-x: auto;
+}
 .title {
   width: 100%;
   padding: 20px 0 10px 20px;
@@ -320,10 +340,14 @@ export default {
   border-bottom: 1px solid #cccccc;
   font-weight: bold;
 }
+
+::v-deep .el-tree-node__content {
+  display: inline-block; /* 根据内容宽度调整 */
+  white-space: nowrap; /* 防止换行 */
+}
 .custom-tree-node {
-  flex: 1;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
+  display: inline-block; /* 根据内容宽度调整 */
+  white-space: nowrap; /* 防止换行 */
+  box-sizing: border-box;
 }
 </style>

src/views/workOrder/automaticDispatchConfig/streetConfiguration/index.vue

@@ -6,7 +6,7 @@
           <el-button style="margin-right: 5px" size="mini" icon="el-icon-search" @click="getTreeListData"></el-button>
           <el-input size="mini" v-model="filterText" placeholder="请输入内容"></el-input>
         </div>
-        <zj-page-fill>
+        <zj-page-fill id="kakaka">
           <el-tree
             :data="treeList"
             :props="defaultProps"
@@ -18,7 +18,7 @@
             ref="listTree"
           >
             <span class="custom-tree-node" slot-scope="{ node }">
-              <span>{{ node.label }}</span>
+              {{ node.label }}
             </span>
           </el-tree>
         </zj-page-fill>
@@ -484,6 +484,24 @@ export default {
               value: item.websitId
             }
           })
+
+        this.$nextTick(() => {
+          const tree = document.getElementById('kakaka').getElementsByClassName('el-tree')
+          const elTreeNodeContent = document.getElementById('kakaka').getElementsByClassName('el-tree-node__content')
+          if (elTreeNodeContent.length) {
+            var maxwidth = 0
+            for (var item of elTreeNodeContent) {
+              if (maxwidth < item.scrollWidth) {
+                maxwidth = item.scrollWidth
+              }
+            }
+          }
+          if (tree.length) {
+            for (var item of tree) {
+              item.style.width = `${maxwidth}px`
+            }
+          }
+        })
       })
     },
     // 树形选中
@@ -597,13 +615,16 @@ export default {
   border-bottom: 1px solid #cccccc;
   font-weight: bold;
 }
+
+::v-deep .el-tree-node__content {
+  display: inline-block; /* 根据内容宽度调整 */
+  white-space: nowrap; /* 防止换行 */
+}
 .custom-tree-node {
-  display: inline-block;
-  width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
+  display: inline-block; /* 根据内容宽度调整 */
+  white-space: nowrap; /* 防止换行 */
 }
+
 .neibuview {
   box-sizing: border-box;
   padding-left: 16px;