el-tree树数据展示处理并排序展示

后端返回数据格式是平铺的格式，给的数据是一个大数组包含树的对象数据；但是是没有什么顺序的 需要自己拼接，拼接好的数据 需要按照 "冲、焊、涂、总"的顺序排序。

//首先要返回的数据组装成树的结构
          <el-tree
            ref="tree"
            :data="treeData"
            :default-expanded-keys="showList"
            :highlight-current="true"
            node-key="id"
            :props="Props"
            @node-click="clickTree"
          >
            <span slot-scope="{ data }" class="custom-tree-node">
              <span>{{ data.node_name }}</span>
            </span>
          </el-tree>


async getTree(){
     const res = await getDigitalTree({ parentId: 'root' })
      const list = res.rows
      const order = ['冲', '焊', '涂', '总']
      const map = {}
      list.forEach(item => {
        map[item.id] = { ...item, children: [] }
      })

      const tree = []
      list.forEach(item => {
        if (item.parent_id === 'root') {
          tree.push(map[item.id])
        } else {
          const parent = map[item.parent_id]
          if (parent) {
            parent.children.push(map[item.id])
          }
        }
      })
      // 排序子节点
      const sortNodes = (nodes) => {
        return nodes
          .sort((a, b) => {
            const indexA = order.indexOf(a.node_name)
            const indexB = order.indexOf(b.node_name)
            return indexA - indexB // 按照定义的顺序排序
          })
          .map(node => {
            if (node.children && node.children.length) {
              node.children = sortNodes(node.children) // 递归排序子节点
            }
            return node
          })
      }

      this.treeData = sortNodes(tree)
      this.showList = []
      this.$nextTick(() => {
        this.$refs.tree.setCurrentKey(this.treeData[0].id)
        this.showList.push(this.treeData[0].id)
      })
}