const dataSource = [
{
"id": "0A605B78899E8BE517CF4645879C121D",
"index": 1,
"operationType": "A",
"productNode": "1KD",
"componentCode": "DOK_000_0075",
"code": "13V995P",
"updateDate": "2021-10-19 03:38:47",
"vname": {
"oldValue": "",
"newValue": "00000100"
},
"materialNum": {
"oldValue": "",
"newValue": "000 000 072"
},
"quantity": {
"newValue": 0.0
},
"qunit": {
"oldValue": "",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": "+7PA"
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "D025743AA352518301E247C4C2DEECA1",
"index": 2,
"operationType": "A",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:38:33",
"vname": {
"oldValue": "",
"newValue": "00000680"
},
"materialNum": {
"oldValue": "",
"newValue": "038 100 151"
},
"quantity": {
"newValue": 0.0
},
"qunit": {
"oldValue": "",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "AB2462B33AD47838641DC5D407296DB3",
"parentId": "D025743AA352518301E247C4C2DEECA1",
"index": 4,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:40:27",
"vname": {
"oldValue": "00000680",
"newValue": "00000690"
},
"materialNum": {
"oldValue": "038 100 151",
"newValue": "06F 000 182"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "5E5D75C375669860CDB8CC6A414F65BA",
"parentId": "AB2462B33AD47838641DC5D407296DB3",
"index": 5,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:40:57",
"vname": {
"oldValue": "00000690",
"newValue": "00000700"
},
"materialNum": {
"oldValue": "06F 000 182",
"newValue": "06F 000 182 A"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "BA5DE9FE82E91BFE3DECA96BC9DB2F94",
"parentId": "5E5D75C375669860CDB8CC6A414F65BA",
"index": 6,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:39:28",
"vname": {
"oldValue": "00000700",
"newValue": "00000710"
},
"materialNum": {
"oldValue": "06F 000 182 A",
"newValue": "06D 000 182 A"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "A6D9C762368E6A022DA9320D59E5C072",
"parentId": "BA5DE9FE82E91BFE3DECA96BC9DB2F94",
"index": 7,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:37:43",
"vname": {
"oldValue": "00000710",
"newValue": "00000720"
},
"materialNum": {
"oldValue": "06D 000 182 A",
"newValue": "06F 000 182 C"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "DC92C5ABC71157F431037EA9F2B5BD84",
"parentId": "A6D9C762368E6A022DA9320D59E5C072",
"index": 8,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:42:40",
"vname": {
"oldValue": "00000720",
"newValue": "00000730"
},
"materialNum": {
"oldValue": "06F 000 182 C",
"newValue": "06F 000 182 D"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "E1EC305A203F5AE80F6C33318DD84193",
"parentId": "DC92C5ABC71157F431037EA9F2B5BD84",
"index": 9,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:40:57",
"vname": {
"oldValue": "00000730",
"newValue": "00000740"
},
"materialNum": {
"oldValue": "06F 000 182 D",
"newValue": "06F 000 182 G"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "D414CA8E53E55A1D60D231B2741CF13D",
"parentId": "E1EC305A203F5AE80F6C33318DD84193",
"index": 10,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:40:57",
"vname": {
"oldValue": "00000740",
"newValue": "00000750"
},
"materialNum": {
"oldValue": "06F 000 182 G",
"newValue": "06F 000 182 J"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "B41AD198CB4800A94DA6F13A8CBB0DE9",
"parentId": "D414CA8E53E55A1D60D231B2741CF13D",
"index": 11,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:39:44",
"vname": {
"oldValue": "00000750",
"newValue": "00000760"
},
"materialNum": {
"oldValue": "06F 000 182 J",
"newValue": "022 000 151 A"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "A0CA4AD3C6AA19550BFEE02F748E091A",
"parentId": "B41AD198CB4800A94DA6F13A8CBB0DE9",
"index": 12,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:42:55",
"vname": {
"oldValue": "00000760",
"newValue": "00000770"
},
"materialNum": {
"oldValue": "022 000 151 A",
"newValue": "036 000 151 A"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "2F9EA093BA1CD919B8B9943728DA9B80",
"parentId": "A0CA4AD3C6AA19550BFEE02F748E091A",
"index": 13,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:42:40",
"vname": {
"oldValue": "00000770",
"newValue": "00000780"
},
"materialNum": {
"oldValue": "036 000 151 A",
"newValue": "03C 000 151"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "5BEE2D752913AD77679F4D9E2929CD0B",
"parentId": "2F9EA093BA1CD919B8B9943728DA9B80",
"index": 14,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:38:48",
"vname": {
"oldValue": "00000780",
"newValue": "00000790"
},
"materialNum": {
"oldValue": "03C 000 151",
"newValue": "06G 000 151"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "2050CE9643A018ABC159D5543FD51096",
"parentId": "5BEE2D752913AD77679F4D9E2929CD0B",
"index": 15,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:39:58",
"vname": {
"oldValue": "00000790",
"newValue": "00000800"
},
"materialNum": {
"oldValue": "06G 000 151",
"newValue": "050 000 151 A"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "2935296B40A52DD6DABA82BE0BCC63BF",
"parentId": "2050CE9643A018ABC159D5543FD51096",
"index": 16,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "E93559",
"updateDate": "2021-10-19 03:38:48",
"vname": {
"oldValue": "00000800",
"newValue": "00000830"
},
"materialNum": {
"oldValue": "050 000 151 A",
"newValue": "000 000 072"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "5C8DC758C77CFC0D5358B91597F7B5CC",
"parentId": "2935296B40A52DD6DABA82BE0BCC63BF",
"index": 17,
"operationType": "R",
"productNode": "5KD",
"componentCode": "DOK",
"code": "14V995K",
"updateDate": "2021-10-19 03:39:58",
"vname": {
"oldValue": "00000830",
"newValue": "00000840"
},
"materialNum": {
"oldValue": "000 000 072",
"newValue": "1K0 000 340"
},
"quantity": {
"oldValue": 0.0,
"newValue": 0.0
},
"qunit": {
"oldValue": "ST",
"newValue": "ST"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
},
{
"id": "402883b9798d881d01798dcd49fb0013",
"index": 3,
"operationType": "A",
"productNode": "15D",
"componentCode": "15D_PL",
"updateDate": "2021-10-19 03:39:28",
"vname": {
"oldValue": "",
"newValue": ""
},
"materialNum": {
"oldValue": "",
"newValue": "000 000 072"
},
"quantity": {
"newValue": 0.0
},
"qunit": {
"oldValue": "",
"newValue": "毫升"
},
"tegue": {
"oldValue": "",
"newValue": ""
},
"drawingDate": {},
"matkstan": {
"oldValue": "",
"newValue": ""
}
}
]
function getTreeData(dataSourceProp) {
const dataSource = JSON.parse(JSON.stringify(dataSourceProp))
// 分组，一条线为一组，每一组都是一个数组
const idItemMap = {}
dataSource.forEach((item) => {
const { id } = item
idItemMap[id] = item
})
dataSource.forEach((item) => {
const { parentId } = item
if (parentId) {
const parent = idItemMap[parentId]
if (!parent) {
console.warn('parent不应该没有值')
}
if (parent.children) {
parent.children.push(item)
} else {
parent.children = [item]
}
}
})
const res = dataSource.filter(item => !item.parentId)
// console.log({res})
return {
treeData: res,
idItemMap,
}
}
function getUpdataLines(treeData) {
function getLine(item, lines = [[]], lineIndex = 0) {
const { children = [], ...rest } = item
const currentLine = lines[lineIndex]
let res = []
// 如果当前节点存在子节点
if (children.length == 0) {
currentLine.push(rest)
} else if (children.length == 1) {
currentLine.push(rest)
getLine(children[0], lines, lineIndex)
} else {
console.log('length>2')
}
}
const res = treeData.reduce((res, item) => {
const lines = [[]]
getLine(item, lines)
res = res.concat(lines)
return res
}, [])
// console.log({
// lines: res
// })
return res
}
const {treeData} = getTreeData(dataSource)
const lines = getUpdataLines(treeData)
function getGraphData(line) {
const data = {
nodes: [],
edges: []
}
const res = line.reduce((res, lineItem, index) => {
const { nodes, edges } = res
const { id, parentId } = lineItem
// 指定连接点的位置
const anchorPoints = []
if (index === 0 || index !== line.length - 1) {
anchorPoints.push([1, 0.5]) // 右侧中间
}
if (index > 0) {
anchorPoints.push([0, 0.5]) // 右侧中间
}
// 设置点的数据
nodes.push(
{
id: lineItem.id,
label: JSON.stringify(lineItem),
anchorPoints,
}
)
if (parentId) {
// 设置边的数据
edges.push({
source: parentId,
target: id,
data: lineItem,
})
}
return res
}, data)
console.log({
graphData: res
})
}
getGraphData(lines[1])
console