diff --git a/business-css/frontend/src/components/antvx6/index.vue b/business-css/frontend/src/components/antvx6/index.vue index 23135ce..1de97bd 100644 --- a/business-css/frontend/src/components/antvx6/index.vue +++ b/business-css/frontend/src/components/antvx6/index.vue @@ -44,7 +44,9 @@ const props = defineProps({ }, }) -const materialList:any = ref([]) // 物料列表 +const materialList:any = ref([]) // 模板物料颜色列表 + +const materialColorData:any = ref([]) // 项目物料颜色 function gettableData() { // 获取物料列表 let params = { @@ -53,6 +55,7 @@ function gettableData() { // 获取物料列表 }; searchMaterialsPage(params).then((result:any) => { materialList.value = result.records; + getMaterialsColor() }).catch((err) => { }); } @@ -81,7 +84,7 @@ let graph: Graph onMounted(() => { preWork() getSizeSchemaList() - gettableData() + // #region 初始化画布 graph = new Graph({ container: document.getElementById('graph-container') as HTMLElement, @@ -549,6 +552,7 @@ onMounted(() => { const cells = graph.getSelectedCells() if (cells.length) { graph.removeCells(cells) + getMaterialsColor() } }) @@ -996,11 +1000,57 @@ graph.on('blank:mouseup', (e) => { tabDeviceNum.value++ } } + gettableData() + } - + }) }) +function getMaterialsColor() { + let json = graph.toJSON() + let materialColors = [] + for(let i = 0; i < json.cells.length; i++){ + if(json.cells[i].materialInfo != null + && json.cells[i].materialInfo.materialId != '' + && json.cells[i].materialInfo.iconBase64 != null + && json.cells[i].materialInfo.iconBase64 != '' + ){ + materialColors.push(json.cells[i].materialInfo) + } + } + const map = new Map(); + materialColors.forEach(item => { + const key = `${item.name}|${item.iconBase64}`; + if (!map.has(key)) { + map.set(key, item); + } + }); + let result = Array.from(map.values()); + + + + + result = removeDuplicates( + result, + materialList.value + ); + materialColorData.value = result + console.log(result) +} +function removeDuplicates(mainArr:any, filterArr:any) { + // 构建去重集合 + const duplicateSet = new Set( + filterArr.map((item:any) => `${item.name}|${item.iconBase64}`) + ); + + // 过滤主数组 + return mainArr.filter((item:any) => { + const key = `${item.name}|${item.iconBase64}`; + return !duplicateSet.has(key); + }); +} + const tabDeviceNum = ref(0) const antvStatus = ref('初始化') function preWork() { @@ -1085,6 +1135,7 @@ function deleteNode() { // 删除节点 } } antvStatus.value = '删除设备' + getMaterialsColor() isMenuShow.value = false } @@ -1138,6 +1189,7 @@ function revokeClick(){ graph.undo() setTimeout(() => { isLock.value = false + getMaterialsColor() }, 500); } } @@ -1147,6 +1199,7 @@ function removeClick(){ graph.redo() setTimeout(() => { isLock.value = false + getMaterialsColor() }, 500); } } @@ -1613,6 +1666,7 @@ function saveDesign(is:any) { // 保存设计 message: "保存成功", }); } + getMaterialsColor() }); if(is == true){ antvStatus.value = '完成保存' @@ -1989,7 +2043,7 @@ function getName(code:any) {
-
物料信息
+
模板物料通用颜色
物料
颜色
@@ -2001,6 +2055,20 @@ function getName(code:any) {
+ +
项目物料特殊颜色
+
+
物料
+
颜色
+
+
+
{{ item.name }}
+
+
+
+
+ +