fix: 现在树节点将不再重叠。

mock/routers/tree.js

@@ -57,215 +57,268 @@ router.post('/subNode/:parentId', (req, res) => {
 
 router.get('/:projectId', (req, res) => {
   res.json(wrapper(
-    Mock.mock([{
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 1,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 1,
-      leaf: false,
-      parent: null,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 2,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 2,
-      leaf: false,
-      parent: 1,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 2,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 3,
-      leaf: false,
-      parent: 1,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 3,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 4,
-      leaf: false,
-      parent: 3,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 3,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 5,
-      leaf: false,
-      parent: 3,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 4,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 6,
-      leaf: false,
-      parent: 5,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
+    Mock.mock([
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 2,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 3,
+        leaf: false,
+        parentId: 1,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 3,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 9,
+        leaf: false,
+        parentId: 2,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 3,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 10,
+        leaf: false,
+        parentId: 2,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 4,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 6,
+        leaf: false,
+        parentId: 5,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 3,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 4,
+        leaf: false,
+        parentId: 3,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 1,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 1,
+        leaf: false,
+        parentId: null,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 3,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 5,
+        leaf: false,
+        parentId: 3,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 2,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 2,
+        leaf: false,
+        parentId: 1,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
 
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 4,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 7,
-      leaf: false,
-      parent: 5,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
-    {
-      'commits|0-10': [
-        {
-          'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
-          'id|+1': 101,
-          message: 'git commit message',
-          timestamp: Random.datetime(),
-          title: 'titleeee',
-        },
-      ],
-      deep: 4,
-      description: Random.csentence(10, 40),
-      endTime: Random.datetime(),
-      id: 8,
-      leaf: false,
-      parent: 5,
-      'priority|1': ['紧急', '一般', '宽松'],
-      processorId: 101,
-      processorName: 'Jinyao',
-      projectId: 101,
-      startTime: Random.datetime(),
-      'state|1': ['已创建', '进行中', '已完成'],
-      timeToTake: 10,
-      title: Random.cname(),
-      'type|1': ['需求', '任务'],
-    },
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 4,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 7,
+        leaf: false,
+        parentId: 5,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
+      {
+        'commits|0-10': [
+          {
+            'gitlabUsername|1': ['hks', 'wph', 'zxr', 'cyt'],
+            'id|+1': 101,
+            message: 'git commit message',
+            timestamp: Random.datetime(),
+            title: 'titleeee',
+          },
+        ],
+        deep: 4,
+        description: Random.csentence(10, 40),
+        endTime: Random.datetime(),
+        id: 8,
+        leaf: false,
+        parentId: 5,
+        'priority|1': ['紧急', '一般', '宽松'],
+        processorId: 101,
+        processorName: 'Jinyao',
+        projectId: 101,
+        startTime: Random.datetime(),
+        'state|1': ['已创建', '进行中', '已完成'],
+        timeToTake: 10,
+        title: Random.cname(),
+        'type|1': ['需求', '任务'],
+      },
     ]),
   ));
 });

src/views/Project/Schedule.vue

@@ -53,7 +53,18 @@ export default {
           tempParent.childs.push(item);
         }
       });
-      return array;
+      // 返回前序遍历的列表
+      const newArr = [];
+      const preOrder = (node) => {
+        newArr.push(node);
+        if (!node.childs || node.childs.length === 0) return;
+        node.childs.sort((node1, node2) => node1.id - node2.id);
+        newArr.concat(node.childs);
+        node.childs.forEach((_node) => preOrder(_node));
+      };
+      const root = array.find((item) => !item.parentId);
+      preOrder(root);
+      return newArr;
     },
     async handleTreeChange(msg) {
       const { type, id } = msg;