diff --git a/src/pages/Questions/BranchingMap/CsComponent.tsx b/src/pages/Questions/BranchingMap/CsComponent.tsx index c6e6576b..33cbcf3d 100644 --- a/src/pages/Questions/BranchingMap/CsComponent.tsx +++ b/src/pages/Questions/BranchingMap/CsComponent.tsx @@ -175,17 +175,32 @@ export const CsComponent = ({ } const removeNode = ({ targetNodeContentId }: { targetNodeContentId: string }) => { + const deleteNodes = [] as string[] + const deleteEdges:any = [] console.log("remove") const cy = cyRef?.current - const a = getQuestionByContentId(targetNodeContentId) - console.log(a) - console.log(a.content) - console.log(a.content.rule.parentId) - console.log(a.content.rule.parentId === "root") - console.log(targetNodeContentId) + const findChildrenToDelete = (node) => { - if (a.content.rule.parentId === "root" && quiz) { + //Узнаём грани, идущие от этой ноды + cy?.$('edge[source = "' + node.id() + '"]')?.toArray().forEach((edge) => { + const edgeData = edge.data() + + //записываем id грани для дальнейшего удаления + deleteEdges.push(edge) + //ищем ноду на конце грани, записываем её ID для дальнейшего удаления + const targetNode = cy?.$("#" + edgeData.target) + deleteNodes.push(targetNode.data().id) + //вызываем функцию для анализа потомков уже у этой ноды + findChildrenToDelete(targetNode) + }) + + } + findChildrenToDelete(cy?.getElementById(targetNodeContentId)) + + const targetQuestion = getQuestionByContentId(targetNodeContentId) + + if (targetQuestion.content.rule.parentId === "root" && quiz) { console.log("click ROOT") updateQuestion(targetNodeContentId, question => { question.content.rule.parentId = "" @@ -198,10 +213,27 @@ export const CsComponent = ({ const parentQuestionContentId = cy?.$('edge[target = "' + targetNodeContentId + '"]')?.toArray()?.[0]?.data()?.source if (targetNodeContentId && parentQuestionContentId) { - clearDataAfterRemoveNode({ targetQuestionContentId: targetNodeContentId, parentQuestionContentId }) - cy?.remove(cy?.$('#' + targetNodeContentId)).layout(lyopts).run() + clearDataAfterRemoveNode({ targetQuestionContentId: targetNodeContentId, parentQuestionContentId }) + cy?.remove(cy?.$('#' + targetNodeContentId)).layout(lyopts).run() } + console.log(deleteNodes, deleteEdges) + //После всех манипуляций удаляем грани из CS и ноды из бекенда + + deleteNodes.forEach((nodeId) => {//Ноды + cy?.remove(cy?.$("#" + nodeId)) + updateQuestion(nodeId, question => { + question.content.rule.parentId = "" + question.content.rule.main = [] + question.content.rule.default = "" + }) + }) + + deleteEdges.forEach((edge:any) => {//Грани + cy?.remove(edge) + }) + + cy?.layout(lyopts).run() } } @@ -217,7 +249,10 @@ export const CsComponent = ({ question.content.rule.default = "" }) updateQuestion(parentQuestionContentId, question => { - if (question.content.rule.parentId === parentQuestionContentId) question.content.rule.parentId = "" + console.log("parent default " + question.content.rule.default) + console.log("target ID " + targetQuestionContentId) + console.log(question.content.rule.default === targetQuestionContentId) + if (question.content.rule.default === targetQuestionContentId) question.content.rule.default = "" }) } @@ -255,11 +290,11 @@ export const CsComponent = ({ name: 'preset', positions: (e) => { - console.log('BBBBBBBBBBBBBBB',e.cy().data('changed')) + console.log('BBBBBBBBBBBBBBB', e.cy().data('changed')) if (!e.cy().data('changed')) { console.log(e.cy().data('changed')) return e.data('oldPos') - } console.log('POSITIIIIIIIONS') + } console.log('POSITIIIIIIIONS') const id = e.id() const incomming = e.cy().edges(`[target="${id}"]`) const layer = 0 @@ -303,11 +338,11 @@ export const CsComponent = ({ task?.parent.data('subtreeWidth', task.children.reduce((p, n) => p + n.data('subtreeWidth'), 0)) } const pos = { x: 200 * e.data('layer'), y: 0 } - e.data('oldPos',pos) + e.data('oldPos', pos) return pos } else { const parent = e.cy().edges(`[target="${e.id()}"]`)[0].source() - const wing = (parent.data('children') === 1)?0:parent.data('subtreeWidth') / 2 + const wing = (parent.data('children') === 1) ? 0 : parent.data('subtreeWidth') / 2 const lastOffset = parent.data('lastChild') const step = wing * 2 / (parent.data('children') - 1) //e.removeData('subtreeWidth') @@ -315,14 +350,14 @@ export const CsComponent = ({ if (lastOffset !== undefined) { parent.data('lastChild', lastOffset + step) const pos = { x: 250 * e.data('layer'), y: (lastOffset + step) } - e.data('oldPos',pos) + e.data('oldPos', pos) return pos } else { parent.data('lastChild', parent.position().y - wing) const pos = { x: 250 * e.data('layer'), y: (parent.position().y - wing) } - e.data('oldPos',pos) + e.data('oldPos', pos) return pos - } + } } }, // map of (node id) => (position obj); or function(node){ return somPos; } zoom: undefined, // the zoom level to set (prob want fit = false if set) @@ -341,9 +376,9 @@ export const CsComponent = ({ document.querySelector("#root")?.addEventListener("mouseup", cleardragQuestionContentId); const cy = cyRef.current; const eles = cy?.add(storeToNodes(questions)) - cy.data('changed',true) + cy.data('changed', true) const elecs = eles.layout(lyopts).run() - cy?.on('add',()=>cy.data('changed',true)) + cy?.on('add', () => cy.data('changed', true)) cy?.fit() //cy?.layout().run() @@ -608,6 +643,7 @@ export const CsComponent = ({ }; return ( + <> + + ); };