el-tree数据太多 做文字提示 左侧tree 右侧表

<el-tree
        class="filter-tree"
        :data="data"
        :props="defaultProps"
        default-expand-all
        :filter-node-method="filterNode"
        y
        ref="tree"
        @node-click="channelchange"
      >
        <span class="span-ellipsis" slot-scope="{ node, data }">
          <span :title="node.label" >{{ node.label }}</span>
           <span :class="data.status == '报警' ? 'wait' : ''">
            {{ node.label | ellipsis(10) }}
          </span>
        </span>
      </el-tree>
      
      // 左侧树点击文字高亮
        ::v-deep .el-tree-node:focus > .el-tree-node__content {
          color: rgb(8, 101, 214) !important;
          // background: rgba(0, 0, 0, 0.15) !important;
        }
        //左侧树鼠标提示
        .span-ellipsis {
          width: 100%;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
        }
        .wait {
      color: #d44b42;
    }
    
    

            function getinit() {
              getDeptRelation().then((res) => {
                deviceList.value = res.data;
                state.cityTreeData = res.data;
                // .map((node) => {
                //   if (node.children && !node.children.length) {
                //     delete node.children;
                //   }
                //   return {
                //     id: node.id, //字段名的替换
                //     label: node.deptName,
                //     children: node.children,
                //   };
                // });
                transferKey(state.cityTreeData);
              });
            }
            // 过滤节点筛选部门名称

            const filterNode = (value, data) => {
              if (!value) return true;
              return data.label.indexOf(value) !== -1;
            };

            const handleNodeClick = (data) => {
              console.log("data", data);
            };
            /** 根据名称筛选部门树 */
            watch(deptName, (val) => {
              proxy.$refs["deptTreeRef"].filter(val);
            });
            // 递归tree结构字段名
            function transferKey(arr) {
              arr.forEach((obj) => {
                obj.label = obj.deptName;
                delete obj["deptName"];
                if (obj.children instanceof Array) {
                  transferKey(obj.children);
                }
              });
              return arr;
            }