前言 📝

今天同事让我帮忙改一个代码,一个Cascader级联选择器组件。原因是前端做了限制,展示的数据少了。现在要把限制解开。我心想这个简单啊,又可以轻松完成了哈哈哈哈。当我找到对应的代码的时候,我直接傻眼了。这套了三四层的循环,而且一行注释都没有。小编直接哭了。但是哭归哭,该写的代码咱们还是得写,必须得让资本家挣到跑车🚁。秉着前人种树,后人放火的原则,小编直接复制出来一份,重写了一下。可能是自己写的代码,看着顺眼多了哈哈哈。

如果没有前辈的代码,小编也没有能力对代码进行改写。

咱们直接来看一下更改之后的代码吧。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
/**
 * 格式化数据
 * @param {*} list 树结构  工厂-车间-生产线-生产班组
 * @param {*} disabledIds
 * @returns {Object}
 */
function dataFormat(list, disabledIds = []) {
  if (isBlank(list)) {
    return {
      list: [],
      obj: {}
    }
  }

  /**
   * 存储生产班组对应的 工厂-车间-生产线-生产班组 信息
   * @key {string} 生产班组id
   * @value {Object} 生产班组对应的 工厂-车间-生产线-生产班组 信息
   */
  const _groupsObj = {}


  /**
   * 循环某个工厂下的 -> 某个车间下对应的 -> 某个生产线下对应的 -> 某个生产班组
   * @param {Array} groups 当前生产线数据下的生产班组数据
   * @param {Object} productionLine 当前生产下数据
   * @param {Object} workshop 当前车间数据
   * @param {Object} factoryshop 当前工厂数据
   * @returns
   */
  function processGroups(groups, productionLine, workshop, factoryshop) {
    return groups.map(group => {
      _groupsObj[group.id] = {
        productionLine: { id: productionLine.id, name: productionLine.name },
        workshop: { id: workshop.id, name: workshop.name },
        factoryshop: { id: factoryshop.id, name: factoryshop.name },
        groupsName: group.name
      }

      return {
        id: group.id,
        name: group.name,
        disabled: disabledIds.includes(group.id)
      }
    })
  }


  /**
   * 循环某个工厂下的 -> 某个车间下对应的 -> 生产线
   * @param {Array} productionLines 当前车间数据下的生产线数据
   * @param {Object} workshop 当前车间数据
   * @param {Object} factoryshop 当前工厂数据
   * @returns
   */
  function processProductionLines(productionLines, workshop, factoryshop) {
    return productionLines.map(line => {
      return {
        id: line.id,
        name: line.name,
        children: processGroups(line.groupsList, line, workshop, factoryshop)
      }
    })
  }


  /**
   * 循环某一个工厂下的车间
   * @param {Array} workshops 当前工厂数据下的车间数据
   * @param {Object} factoryshop 当前工厂数据
   * @returns
   */
  function processWorkshops(workshops, factoryshop) {
    return workshops.map(workshop => {
      return {
        id: workshop.id,
        name: workshop.name,
        children: processProductionLines(workshop.productionLineList, workshop, factoryshop)
      }
    })
  }



  // 循环工厂
  const _factoryshops = list.map(factoryshop => {
    return {
      id: factoryshop.id,
      name: factoryshop.name,
      children: processWorkshops(factoryshop.workshopList, factoryshop)
    }
  })

  return {
    list: _factoryshops,
    obj: _groupsObj
  }
}