diff --git a/package-lock.json b/package-lock.json index fe3a7724..b5045349 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,6 +40,7 @@ "react": "^18.2.0", "react-beautiful-dnd": "^13.1.1", "react-cytoscapejs": "^2.0.0", + "react-datepicker": "^4.24.0", "react-dnd": "^16.0.1", "react-dnd-html5-backend": "^16.0.1", "react-dom": "^18.2.0", @@ -61,7 +62,8 @@ "@emoji-mart/react": "^1.1.1", "@types/cytoscape-popper": "^2.0.4", "@types/react-beautiful-dnd": "^13.1.4", - "@types/react-cytoscapejs": "^1.2.5", + "@types/react-cytoscapejs": "^1.2.4", + "@types/react-datepicker": "^4.19.3", "craco-alias": "^3.0.1", "cypress": "^13.4.0" } @@ -4524,6 +4526,18 @@ "@types/react": "*" } }, + "node_modules/@types/react-datepicker": { + "version": "4.19.3", + "resolved": "https://registry.npmjs.org/@types/react-datepicker/-/react-datepicker-4.19.3.tgz", + "integrity": "sha512-85F9eKWu9fGiD9r4KVVMPYAdkJJswR3Wci9PvqplmB6T+D+VbUqPeKtifg96NZ4nEhufjehW+SX4JLrEWVplWw==", + "dev": true, + "dependencies": { + "@popperjs/core": "^2.9.2", + "@types/react": "*", + "date-fns": "^2.0.1", + "react-popper": "^2.2.5" + } + }, "node_modules/@types/react-dnd": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/@types/react-dnd/-/react-dnd-3.0.2.tgz", @@ -6374,6 +6388,11 @@ "integrity": "sha512-cOU9usZw8/dXIXKtwa8pM0OTJQuJkxMN6w30csNRUerHfeQ5R6U3kkU/FtJeIf3M202OHfY2U8ccInBG7/xogA==", "license": "MIT" }, + "node_modules/classnames": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" + }, "node_modules/clean-css": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-5.3.1.tgz", @@ -7438,6 +7457,21 @@ "node": ">=10" } }, + "node_modules/date-fns": { + "version": "2.30.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz", + "integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==", + "dependencies": { + "@babel/runtime": "^7.21.0" + }, + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } + }, "node_modules/dayjs": { "version": "1.11.10", "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz", @@ -15126,6 +15160,23 @@ "react": ">=15.0.0" } }, + "node_modules/react-datepicker": { + "version": "4.24.0", + "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-4.24.0.tgz", + "integrity": "sha512-2QUC2pP+x4v3Jp06gnFllxKsJR0yoT/K6y86ItxEsveTXUpsx+NBkChWXjU0JsGx/PL8EQnsxN0wHl4zdA1m/g==", + "dependencies": { + "@popperjs/core": "^2.11.8", + "classnames": "^2.2.6", + "date-fns": "^2.30.0", + "prop-types": "^15.7.2", + "react-onclickoutside": "^6.13.0", + "react-popper": "^2.3.0" + }, + "peerDependencies": { + "react": "^16.9.0 || ^17 || ^18", + "react-dom": "^16.9.0 || ^17 || ^18" + } + }, "node_modules/react-dev-utils": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz", @@ -15308,6 +15359,38 @@ "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==", "license": "MIT" }, + "node_modules/react-onclickoutside": { + "version": "6.13.0", + "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.13.0.tgz", + "integrity": "sha512-ty8So6tcUpIb+ZE+1HAhbLROvAIJYyJe/1vRrrcmW+jLsaM+/powDRqxzo6hSh9CuRZGSL1Q8mvcF5WRD93a0A==", + "funding": { + "type": "individual", + "url": "https://github.com/Pomax/react-onclickoutside/blob/master/FUNDING.md" + }, + "peerDependencies": { + "react": "^15.5.x || ^16.x || ^17.x || ^18.x", + "react-dom": "^15.5.x || ^16.x || ^17.x || ^18.x" + } + }, + "node_modules/react-popper": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", + "integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==", + "dependencies": { + "react-fast-compare": "^3.0.1", + "warning": "^4.0.2" + }, + "peerDependencies": { + "@popperjs/core": "^2.0.0", + "react": "^16.8.0 || ^17 || ^18", + "react-dom": "^16.8.0 || ^17 || ^18" + } + }, + "node_modules/react-popper/node_modules/react-fast-compare": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz", + "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==" + }, "node_modules/react-redux": { "version": "7.2.9", "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.2.9.tgz", @@ -18037,6 +18120,14 @@ "makeerror": "1.0.12" } }, + "node_modules/warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "dependencies": { + "loose-envify": "^1.0.0" + } + }, "node_modules/watchpack": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz", diff --git a/src/api/question.ts b/src/api/question.ts index 0bae585f..56983d76 100644 --- a/src/api/question.ts +++ b/src/api/question.ts @@ -30,7 +30,6 @@ async function getQuestionList(body?: Partial) { } function editQuestion(body: EditQuestionRequest, signal?: AbortSignal) { - console.log("`${baseUrl}/question/edit` start") return makeRequest({ url: `${baseUrl}/question/edit`, body, diff --git a/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx b/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx index 0667d316..467132ab 100644 --- a/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx +++ b/src/pages/Questions/AnswerDraggableList/AnswerItem.tsx @@ -1,7 +1,7 @@ import { MessageIcon } from "@icons/messagIcon"; import { PointsIcon } from "@icons/questionsPage/PointsIcon"; import { DeleteIcon } from "@icons/questionsPage/deleteIcon"; -import TextareaAutosize from "@mui/base/TextareaAutosize"; +import {TextareaAutosize} from "@mui/base/TextareaAutosize"; import { Box, FormControl, diff --git a/src/pages/Questions/BranchingMap/CsComponent.tsx b/src/pages/Questions/BranchingMap/CsComponent.tsx index afb5317b..bd363a00 100644 --- a/src/pages/Questions/BranchingMap/CsComponent.tsx +++ b/src/pages/Questions/BranchingMap/CsComponent.tsx @@ -1,4 +1,4 @@ -import { useEffect, useRef, useState } from "react"; +import { useEffect, useLayoutEffect, useRef, useState } from "react"; import Cytoscape from "cytoscape"; import CytoscapeComponent from "react-cytoscapejs"; import popper from "cytoscape-popper"; @@ -122,16 +122,21 @@ export const CsComponent = ({ const crossesContainer = useRef(null); const gearsContainer = useRef(null); + useLayoutEffect(() => { + updateOpenedModalSettingsId() + }, []) useEffect(() => { + console.log("modalQuestionTargetContentId " + modalQuestionTargetContentId) if (modalQuestionTargetContentId.length !== 0 && modalQuestionParentContentId.length !== 0) { - console.log("был выбран вопрос " + modalQuestionTargetContentId) - addNode({ parentNodeContentId:modalQuestionParentContentId, targetNodeContentId:modalQuestionTargetContentId }) + addNode({ parentNodeContentId: modalQuestionParentContentId, targetNodeContentId: modalQuestionTargetContentId }) } + setModalQuestionParentContentId("") + setModalQuestionTargetContentId("") + console.log("modalQuestionTargetContentId " + modalQuestionTargetContentId) }, [modalQuestionTargetContentId]) const addNode = ({ parentNodeContentId, targetNodeContentId }: { parentNodeContentId: string, targetNodeContentId?: string }) => { - console.log("dragQuestionContentId " + dragQuestionContentId) const cy = cyRef?.current const parentNodeChildren = cy?.$('edge[source = "' + parentNodeContentId + '"]')?.length //если есть инфо о выбранном вопросе из модалки - берём родителя из инфо модалки. Иначе из значения дропа @@ -139,7 +144,7 @@ export const CsComponent = ({ if (Object.keys(targetQuestion).length !== 0 && Object.keys(targetQuestion).length !== 0 && parentNodeContentId && parentNodeChildren !== undefined) { clearDataAfterAddNode({ parentNodeContentId, targetQuestion, parentNodeChildren }) - cy?.data('changed',true) + cy?.data('changed', true) cy?.add([ { data: { @@ -161,8 +166,6 @@ export const CsComponent = ({ } const clearDataAfterAddNode = ({ parentNodeContentId, targetQuestion, parentNodeChildren }: { parentNodeContentId: string, targetQuestion: AnyQuizQuestion, parentNodeChildren: number }) => { - console.log("записываю на бек ид родителя") - console.log({ parentNodeContentId, targetQuestion, parentNodeChildren }) //предупреждаем добавленный вопрос о том, кто его родитель updateQuestion(targetQuestion.content.id, question => { question.content.rule.parentId = parentNodeContentId @@ -170,8 +173,8 @@ export const CsComponent = ({ }) //Если детей больше 1 - предупреждаем стор вопросов об открытии модалки ветвления - if (parentNodeChildren > 1) { - updateOpenedModalSettingsId(parentNodeContentId) + if (parentNodeChildren >= 1) { + updateOpenedModalSettingsId(targetQuestion.content.id) } else { //Если ребёнок первый - добавляем его родителю как дефолтный updateQuestion(parentNodeContentId, question => question.content.rule.default = targetQuestion.content.id) @@ -179,9 +182,8 @@ export const CsComponent = ({ } const removeNode = ({ targetNodeContentId }: { targetNodeContentId: string }) => { - const deleteNodes = [] as string[] - const deleteEdges:any = [] - console.log("remove") + const deleteNodes = [] as string[] + const deleteEdges: any = [] const cy = cyRef?.current const findChildrenToDelete = (node) => { @@ -205,60 +207,54 @@ export const CsComponent = ({ const targetQuestion = getQuestionByContentId(targetNodeContentId) if (targetQuestion.content.rule.parentId === "root" && quiz) { - console.log("click ROOT") + console.log("ROOT") + console.log(quiz) + updateRootContentId(quiz?.id, "") updateQuestion(targetNodeContentId, question => { question.content.rule.parentId = "" question.content.rule.main = [] question.content.rule.default = "" }) - updateRootContentId(quiz?.id, false) + console.log(quiz, getQuestionByContentId(targetNodeContentId)) } else { - console.log("click not ROOT") 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)) - removeButtons(nodeId) - updateQuestion(nodeId, question => { - question.content.rule.parentId = "" - question.content.rule.main = [] - question.content.rule.default = "" - }) - }) - - deleteEdges.forEach((edge:any) => {//Грани - cy?.remove(edge) - }) - - removeButtons(targetNodeContentId) - cy?.data('changed',true) - cy?.layout(lyopts).run() - } + + //После всех манипуляций удаляем грани из CS и ноды из бекенда + + deleteNodes.forEach((nodeId) => {//Ноды + cy?.remove(cy?.$("#" + nodeId)) + removeButtons(nodeId) + updateQuestion(nodeId, question => { + question.content.rule.parentId = "" + question.content.rule.main = [] + question.content.rule.default = "" + }) + }) + + deleteEdges.forEach((edge: any) => {//Грани + cy?.remove(edge) + }) + + removeButtons(targetNodeContentId) + cy?.data('changed', true) + cy?.layout(lyopts).run() } const clearDataAfterRemoveNode = ({ targetQuestionContentId, parentQuestionContentId }: { targetQuestionContentId: string, parentQuestionContentId: string }) => { - - - - console.log({ targetQuestionContentId, parentQuestionContentId }) - updateQuestion(targetQuestionContentId, question => { question.content.rule.parentId = "" question.content.rule.main = [] question.content.rule.default = "" }) + updateQuestion(parentQuestionContentId, question => { - console.log("parent default " + question.content.rule.default) - console.log("target ID " + targetQuestionContentId) - console.log(question.content.rule.default === targetQuestionContentId) + //Заменяем id удаляемого вопроса либо на id одного из оставшихся, либо на пустую строку if (question.content.rule.default === targetQuestionContentId) question.content.rule.default = "" }) @@ -282,22 +278,20 @@ export const CsComponent = ({ const readyLO = (e) => { -console.log(e.cy.data('firstNode'),"SKEEER",e.cy.data('changed')) if (e.cy.data('firstNode') === 'nonroot') { - e.cy.data('firstNode','root') - e.cy.nodes().sort((a,b) => (a.data('root')?1:-1)).layout(lyopts).run() - - } else { + e.cy.data('firstNode', 'root') + e.cy.nodes().sort((a, b) => (a.data('root') ? 1 : -1)).layout(lyopts).run() - - e.cy.data('changed', false) - e.cy.removeData('firstNode') - } + } else { + + + e.cy.data('changed', false) + e.cy.removeData('firstNode') + } //удаляем иконки e.cy.nodes().forEach((ele: any) => { const data = ele.data() - console.log(data) data.id && removeButtons(data.id); }) initialPopperIcons(e) @@ -307,11 +301,9 @@ console.log(e.cy.data('firstNode'),"SKEEER",e.cy.data('changed')) name: 'preset', positions: (e) => { - console.log('BBBBBBBBBBBBBBB', e.cy().data('changed')) if (!e.cy().data('changed')) { return e.data('oldPos') - } else {e.removeData('oldPos')} - console.log('POSITIIIIIIIONS') + } else { e.removeData('oldPos') } const id = e.id() const incomming = e.cy().edges(`[target="${id}"]`) const layer = 0 @@ -319,7 +311,7 @@ console.log(e.cy.data('firstNode'),"SKEEER",e.cy.data('changed')) if (incomming.length === 0) { if (e.cy().data('firstNode') === undefined) - e.cy().data('firstNode','root') + e.cy().data('firstNode', 'root') e.data('root', true) const children = e.cy().edges(`[source="${id}"]`).targets() e.data('layer', layer) @@ -341,7 +333,6 @@ console.log(e.cy.data('firstNode'),"SKEEER",e.cy.data('changed')) queue.push({ parent: e, children: children }) while (queue.length) { const task = queue.pop() -console.log('WIIIING',task.parent.data(),task.children.length) if (task.children.length === 0) { task.parent.data('subtreeWidth', task.parent.height()) continue @@ -360,22 +351,20 @@ console.log('WIIIING',task.parent.data(),task.children.length) task?.parent.data('subtreeWidth', task.children.reduce((p, n) => p + n.data('subtreeWidth'), 0)) } const pos = { x: 0, y: 0 } - console.log(e.data()) e.data('oldPos', pos) return pos } else { -if (e.cy().data('firstNode') !== 'root') { - e.cy().data('firstNode','nonroot') - return {x:0,y:0} + if (e.cy().data('firstNode') !== 'root') { + e.cy().data('firstNode', 'nonroot') + return { x: 0, y: 0 } } if (e.cy().data('firstNode') === undefined) - e.cy().data('firstNode','nonroot') + e.cy().data('firstNode', 'nonroot') const parent = e.cy().edges(`[target="${e.id()}"]`)[0].source() const wing = (parent.data('children') === 1) ? 0 : parent.data('subtreeWidth') / 2 + 50 const lastOffset = parent.data('lastChild') const step = wing * 2 / (parent.data('children') - 1) //e.removeData('subtreeWidth') - console.log('AAAAAAAAAAa', e.data(), lastOffset, step, parent.position().y, wing) if (lastOffset !== undefined) { parent.data('lastChild', lastOffset + step) const pos = { x: 250 * e.data('layer'), y: (lastOffset + step) } @@ -386,7 +375,7 @@ if (e.cy().data('firstNode') !== 'root') { const pos = { x: 250 * e.data('layer'), y: (parent.position().y - wing) } 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) @@ -502,7 +491,7 @@ if (e.cy().data('firstNode') !== 'root') { layoutElement.classList.add("popper-layout"); layoutElement.setAttribute("data-id", item.id()); layoutElement.addEventListener("mouseup", () => { - //Узнаём грани, идущие от этой ноды + //Узнаём грани, идущие от этой ноды setModalQuestionParentContentId(item.id()) setOpenedModalQuestions(true) }); @@ -533,7 +522,7 @@ if (e.cy().data('firstNode') !== 'root') { plusElement.addEventListener("mouseup", () => { setStartCreate(node.id()); }); - + plusesContainer.current?.appendChild(plusElement); return plusElement; @@ -594,7 +583,6 @@ if (e.cy().data('firstNode') !== 'root') { gearElement.style.zIndex = "1" gearsContainer.current?.appendChild(gearElement); gearElement.addEventListener("mouseup", (e) => { - console.log(item.id()) updateOpenedModalSettingsId(item.id()) }); @@ -672,23 +660,27 @@ if (e.cy().data('firstNode') !== 'root') { return ( <> - { - cyRef.current = cy; - }} - /> - + { + cyRef.current = cy; + }} + /> + + ); }; diff --git a/src/pages/Questions/BranchingMap/FirstNodeField.tsx b/src/pages/Questions/BranchingMap/FirstNodeField.tsx index 3ae599d7..007a763a 100644 --- a/src/pages/Questions/BranchingMap/FirstNodeField.tsx +++ b/src/pages/Questions/BranchingMap/FirstNodeField.tsx @@ -2,8 +2,8 @@ import { Box } from "@mui/material" import { useEffect, useRef, useState } from "react"; import { updateDragQuestionContentId, updateQuestion } from "@root/questions/actions" import { updateRootContentId } from "@root/quizes/actions" +import { useCurrentQuiz } from "@root/quizes/hooks" import { useQuestionsStore } from "@root/questions/store" -import { useCurrentQuiz } from "@root/quizes/hooks"; import { enqueueSnackbar } from "notistack"; interface Props { @@ -11,17 +11,15 @@ interface Props { modalQuestionTargetContentId: string; } export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetContentId }: Props) => { - const { dragQuestionContentId } = useQuestionsStore() - const Container = useRef(null); const quiz = useCurrentQuiz(); - console.log(dragQuestionContentId) + const { dragQuestionContentId, questions } = useQuestionsStore() + console.log(questions) + const Container = useRef(null); const modalOpen = () => setOpenedModalQuestions(true) const newRootNode = () => { if (quiz) { - console.log(dragQuestionContentId) - if (dragQuestionContentId) { updateRootContentId(quiz?.id, dragQuestionContentId) updateQuestion(dragQuestionContentId, (question) => question.content.rule.parentId = "root") @@ -29,6 +27,7 @@ export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetCon } else { enqueueSnackbar("Нет информации о взятом опроснике") } + } useEffect(() => { @@ -53,6 +52,7 @@ export const FirstNodeField = ({ setOpenedModalQuestions, modalQuestionTargetCon }, [modalQuestionTargetContentId]) + return ( { - console.log(questions) const nodes: Nodes[] = [] const edges: Edges[] = [] questions.forEach((question) => { - console.log(question) if (question.content.rule.parentId) { nodes.push({data: { id: question.content.id, @@ -38,6 +36,5 @@ export const storeToNodes = (questions: AnyQuizQuestion[]) => { }}) } }) - console.log([...nodes, ...edges]) return [...nodes, ...edges]; } diff --git a/src/pages/Questions/BranchingMap/index.tsx b/src/pages/Questions/BranchingMap/index.tsx index 443d55ca..07ec91f5 100644 --- a/src/pages/Questions/BranchingMap/index.tsx +++ b/src/pages/Questions/BranchingMap/index.tsx @@ -14,6 +14,8 @@ export const BranchingMap = () => { const [modalQuestionTargetContentId, setModalQuestionTargetContentId] = useState("") const [openedModalQuestions, setOpenedModalQuestions] = useState(false) + + return ( (getQuestionById(openedModalSettingsId) || getQuestionByContentId(openedModalSettingsId)) - console.log(targetQuestion) const [parentQuestion, setParentQuestion] = useState(getQuestionByContentId(targetQuestion?.content.rule.parentId)) - console.log(parentQuestion) + console.log(parentQuestion.content.rule.default) + console.log(targetQuestion.content.id) + console.log(parentQuestion.content.rule.default === targetQuestion.content.id) useLayoutEffect(() => { if (parentQuestion === null) return - if (parentQuestion.content.rule.main.length === 0) updateQuestion(parentQuestion.id, question => question.content.rule.main.push({ - next: targetQuestion.content.id, - or: true, - rules: [{ - question: parentQuestion.content.id, - answers: [] + if (parentQuestion.content.rule.main.length === 0) { + let mutate = JSON.parse(JSON.stringify(parentQuestion)) + mutate.content.rule.main = [{ + next: targetQuestion.content.id, + or: true, + rules: [{ + question: parentQuestion.content.id, + answers: [] + }] }] - })) + setParentQuestion(mutate) + } }) - + + console.log({targetQuestion, parentQuestion}) if (targetQuestion === null || parentQuestion === null) { - - console.log(openedModalSettingsId) enqueueSnackbar("Невозможно найти данные ветвления для этого вопроса") return <> } const saveData = () => { - console.log(parentQuestion) if (parentQuestion !== null) { - updateQuestion(parentQuestion.content.id, question => question.content = parentQuestion.content) + updateQuestion(parentQuestion.content.id, question => question.content = parentQuestion.content) } handleClose() @@ -149,11 +152,11 @@ export default function BranchingQuestions() { marginBottom: "10px", cursor: "pointer" }} - onClick={() => { - const mutate = JSON.parse(JSON.stringify(parentQuestion)) - mutate.content.rule.main.push(createBranchingRuleMain(targetQuestion.content.id, parentQuestion.content.id)) - setParentQuestion(mutate) - }} + onClick={() => { + const mutate = JSON.parse(JSON.stringify(parentQuestion)) + mutate.content.rule.main.push(createBranchingRuleMain(targetQuestion.content.id, parentQuestion.content.id)) + setParentQuestion(mutate) + }} > Добавить условие @@ -164,7 +167,7 @@ export default function BranchingQuestions() { sx={{ margin: 0 }} - checked={parentQuestion.content.rule.default === targetQuestion.id} + checked={parentQuestion.content.rule.default === targetQuestion.content.id} onClick={() => { let mutate = JSON.parse(JSON.stringify(parentQuestion)) diff --git a/src/pages/Questions/BranchingModal/Settings.tsx b/src/pages/Questions/BranchingModal/Settings.tsx index 7de6cc51..02558ff1 100644 --- a/src/pages/Questions/BranchingModal/Settings.tsx +++ b/src/pages/Questions/BranchingModal/Settings.tsx @@ -264,21 +264,43 @@ const NumberInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParent (Укажите один или несколько вариантов) - {/* ) => { let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) - newParentQuestion.content.rule.main[ruleIndex].rules[0].answers = [(event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")] + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) + if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = 0 setParentQuestion(newParentQuestion) }} - /> */} + /> + {parentQuestion.content.chooseRange && + ) => { + + let newParentQuestion = JSON.parse(JSON.stringify(parentQuestion)) + newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[1] = Number((event.target as HTMLInputElement).value.replace(/[^0-9,\s]/g, "")) + if (newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] === undefined) newParentQuestion.content.rule.main[ruleIndex].rules[0].answers[0] = 0 + setParentQuestion(newParentQuestion) + + }} + /> + + } @@ -338,7 +360,7 @@ const TextInputsType = ({ parentQuestion, targetQuestion, ruleIndex, setParentQu (Укажите текст, при совпадении с которым пользователь попадёт на этот вопрос) - {/* */} + /> diff --git a/src/pages/Questions/BranchingPanel/QuestionsList.tsx b/src/pages/Questions/BranchingPanel/QuestionsList.tsx index 62896cad..dfde30c6 100644 --- a/src/pages/Questions/BranchingPanel/QuestionsList.tsx +++ b/src/pages/Questions/BranchingPanel/QuestionsList.tsx @@ -23,7 +23,6 @@ type AnyQuestion = UntypedQuizQuestion | AnyTypedQuizQuestion export const QuestionsList = () => { const { questions } = useQuestionsStore() - console.log(questions) return ( diff --git a/src/pages/Questions/BranchingQuestionsModal/index.tsx b/src/pages/Questions/BranchingQuestionsModal/index.tsx index 1dfdbee3..31194d29 100644 --- a/src/pages/Questions/BranchingQuestionsModal/index.tsx +++ b/src/pages/Questions/BranchingQuestionsModal/index.tsx @@ -1,24 +1,30 @@ -import { useParams } from "react-router-dom"; import { Box, Modal, Button, Typography } from "@mui/material"; import { useQuestionsStore } from "@root/questions/store"; -import { AnyTypedQuizQuestion, UntypedQuizQuestion } from "@model/questionTypes/shared"; - -type AnyQuestion = UntypedQuizQuestion | AnyTypedQuizQuestion +import { AnyTypedQuizQuestion } from "@model/questionTypes/shared"; interface Props { openedModalQuestions: boolean; - setModalQuestionTargetContentId: (contentId:string) => void; - setOpenedModalQuestions: (open:boolean) => void; + setModalQuestionTargetContentId: (contentId: string) => void; + setOpenedModalQuestions: (open: boolean) => void; + setModalQuestionParentContentId: (open: string) => void; } -export const BranchingQuestionsModal = ({ openedModalQuestions, setOpenedModalQuestions, setModalQuestionTargetContentId}:Props) => { - const quizId = Number(useParams().quizId); +export const BranchingQuestionsModal = ({ + openedModalQuestions, + setOpenedModalQuestions, + setModalQuestionTargetContentId, + setModalQuestionParentContentId +}: Props) => { const { questions } = useQuestionsStore(); const handleClose = () => { setOpenedModalQuestions(false); }; + const typedQuestions: AnyTypedQuizQuestion[] = questions.filter( + (question) => question.type && !question.content.rule.parentId + ) as AnyTypedQuizQuestion[]; + return ( - {questions.filter((q:AnyQuestion) => { -console.log(q.content) -if (q.content === null) return true - return (q.type && !q.content.rule.parentId)}).map((question: AnyTypedQuizQuestion, index:number) => ( + {typedQuestions.map((question) => (