diff --git a/src/assets/styles/components/loading.module.scss b/src/assets/styles/components/loading.module.scss
new file mode 100644
index 0000000..eab817f
--- /dev/null
+++ b/src/assets/styles/components/loading.module.scss
@@ -0,0 +1,13 @@
+.loading__wrapper {
+ width: 100%;
+ height: 80%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ &__body {
+ // margin-top: 100px;
+ span {
+
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/assets/styles/newForm.module.scss b/src/assets/styles/newForm.module.scss
index afd128c..e18c9bd 100644
--- a/src/assets/styles/newForm.module.scss
+++ b/src/assets/styles/newForm.module.scss
@@ -171,5 +171,4 @@
}
}
}
-}
-
+}
\ No newline at end of file
diff --git a/src/components/AnswerModal.jsx b/src/components/AnswerModal.jsx
index f565d6c..0d79fb8 100644
--- a/src/components/AnswerModal.jsx
+++ b/src/components/AnswerModal.jsx
@@ -25,7 +25,8 @@ const AnswerModal = ({
setQuestion,
setComment,
setCurrentTypeAnswer,
- setFile
+ setFile,
+ removeOptionAnswer
}) => {
return (
@@ -67,7 +68,7 @@ const AnswerModal = ({
{optionAnswer.map((item, i) =>
{item.id}) {item.text}
- setOptionAnswer([...optionAnswer].filter(answer => answer.id !== item.id))}>
+ removeOptionAnswer(item.id)}>
)}
diff --git a/src/components/Loading.jsx b/src/components/Loading.jsx
new file mode 100644
index 0000000..bc33479
--- /dev/null
+++ b/src/components/Loading.jsx
@@ -0,0 +1,15 @@
+import React from "react";
+import classes from "../assets/styles/components/loading.module.scss";
+
+const Loading = () => {
+
+ return (
+
+ )
+}
+
+export default Loading;
\ No newline at end of file
diff --git a/src/components/typeAnswer/DropDownList.jsx b/src/components/typeAnswer/DropDownList.jsx
index 89cba66..621a9dd 100644
--- a/src/components/typeAnswer/DropDownList.jsx
+++ b/src/components/typeAnswer/DropDownList.jsx
@@ -2,7 +2,7 @@ import React, { useState } from "react";
import classes from "../../assets/styles/components/typeAnswer/dropDownList.module.scss"
const DropDownList = ({postfix, optionAnswer, answers, updateAnswersForm}) => {
- console.log(optionAnswer)
+ // console.log(optionAnswer)
return (
)
:
- }
+ }
diff --git a/src/pages/Forms.jsx b/src/pages/Forms.jsx
index 236ee7e..0d636f4 100644
--- a/src/pages/Forms.jsx
+++ b/src/pages/Forms.jsx
@@ -34,7 +34,7 @@ const Forms = () => {
};
listForms();
- }, [])
+ }, []);
async function createForm() {
setStateLoading(true);
@@ -43,7 +43,6 @@ const Forms = () => {
if (response.data) {
const token = await newFormTokenApi(cookies.token, response.data.id)
-
navigate(`/forms/${response.data.id}/edit`)
}
else {
@@ -64,8 +63,6 @@ const Forms = () => {
else {
console.log(response);
}
-
- setRemoveIdForm(false);
};
async function openFormView(formId) {
@@ -90,7 +87,7 @@ const Forms = () => {
}
};
- const filterFormsBySearch = () => [...forms].filter(item => item.title.toLowerCase().includes(searchForm))
+ const filterFormsBySearch = () => [...forms].filter(item => item.title.toLowerCase().includes(searchForm));
return (
diff --git a/src/pages/NewForm.jsx b/src/pages/NewForm.jsx
index 41015bd..cba1e00 100644
--- a/src/pages/NewForm.jsx
+++ b/src/pages/NewForm.jsx
@@ -4,11 +4,12 @@ import { useCookies } from "react-cookie";
import classes from "../assets/styles/newForm.module.scss";
import MyButton from "../components/MyButton.jsx";
import AnswerModal from "../components/AnswerModal.jsx";
-import PreviewModal from "../components/PreviewModal.jsx"
+import PreviewModal from "../components/PreviewModal.jsx";
+import Loading from "../components/Loading.jsx";
import { FormsData, TypeAnswerData } from "../context";
import { listFormsApi, updateTitleFormApi } from "../hooks/api/listFormsApi.js";
-import { saveFormApi, addFormBlockApi, listFormBlockApi, updateBlockApi, updateOrderBlockApi, removeBlockApi } from "../hooks/api/formApi.js";
-import { responseDataToListBlock } from "../hooks/sundry/parseListBlock.js";
+import { saveFormApi, addFormBlockApi, listFormBlockApi, updateBlockApi, updateOrderBlockApi, removeBlockApi, getBlockApi } from "../hooks/api/formApi.js";
+import { responseDataToListBlock, numberingBlocks } from "../hooks/sundry/parseListBlock.js";
import MyInput from "../components/MyInput.jsx";
const NewForm = () => {
@@ -17,6 +18,7 @@ const NewForm = () => {
const { formId } = useParams();
const [dragElem, setDragElem] = useState(null);
const [dropElem, setDropElem] = useState(null);
+ const [loading, setLoading] = useState(false);
const [cookies, _, __] = useCookies(["user"]);
@@ -43,10 +45,6 @@ const NewForm = () => {
const [stateModal, setStateModal] = useState(false);
- function removeAnswerByForm(id) {
- setListBlock([...listBlock.filter(item => item.id !== id)]);
- };
-
function cleanStates() {
setStateModal(false)
setQuestion("");
@@ -65,7 +63,6 @@ const NewForm = () => {
const responseBlock = await listFormBlockApi(cookies.token, formId);
if (responseBlock.status === 200 && responseBlock.data && responseForms.status === 200) {
- console.log(responseDataToListBlock(responseBlock.data))
setListBlock(responseDataToListBlock(responseBlock.data));
const title = responseForms.data.find(item => item.id === formId).title
setNewTitleForm(title);
@@ -76,20 +73,33 @@ const NewForm = () => {
setNewTitleForm("Новыя форма");
setOldTitleForm("Новыя форма");
}
+ setLoading(true);
};
totalData();
}, []);
- function addOptionAnswer(text) {
- setOptionAnswer([...optionAnswer, {
- id: nextID(optionAnswer, "id"),
- text: currentOptionAnswer
- }]);
+ function addOptionAnswer() {
+ setOptionAnswer(numberingBlocks(
+ [...optionAnswer, {
+ id: nextID(optionAnswer, "id"),
+ text: currentOptionAnswer
+ }],
+ "id",
+ 1
+ ));
setCurrentOptionAnswer("");
};
- function editAnswerByForm(id, order) {
+ function removeOptionAnswer(id) {
+ setOptionAnswer(numberingBlocks(
+ [...optionAnswer].filter(answer => answer.id !== id),
+ "id",
+ 1
+ ));
+ };
+
+ function editAnswerByForm(id) {
const obj = listBlock.find(item => item.id === id);
setQuestion(obj.question);
setComment(obj.comment);
@@ -102,6 +112,8 @@ const NewForm = () => {
};
async function updateBlock() {
+ console.log(optionAnswer)
+
const data = {
question: question,
comment: comment,
@@ -118,15 +130,16 @@ const NewForm = () => {
data,
listBlock.find(item => item.id === stateModal).order
);
- console.log(response)
if (response.status === 200) {
- setListBlock(listBlock.map(item => {
- if (item.id === stateModal) {
- item = data
- }
- return item
- }))
+ const responseBlock = await listFormBlockApi(cookies.token, formId);
+
+ if (responseBlock.status === 200) {
+ setListBlock(responseDataToListBlock(responseBlock.data));
+ }
+ else {
+ setListBlock([])
+ }
}
else {
console.log(response)
@@ -144,9 +157,11 @@ const NewForm = () => {
else {
console.log(response)
}
- }
+ };
async function addFormBlock() {
+ console.log(optionAnswer)
+
const newBlock = {
question: question,
typeAnswer: currentTypeAnswer,
@@ -160,7 +175,14 @@ const NewForm = () => {
const response = await addFormBlockApi(cookies.token, formId, newBlock)
if (response.status === 200) {
- setListBlock([...listBlock, {...newBlock, order: nextID(listBlock, "order")}]);
+ const responseBlock = await listFormBlockApi(cookies.token, formId);
+
+ if (responseBlock.status === 200) {
+ setListBlock(responseDataToListBlock(responseBlock.data));
+ }
+ else {
+ setListBlock([])
+ }
}
else {
console.log(response)
@@ -198,26 +220,10 @@ const NewForm = () => {
tListBlock.splice(dragElem, 1);
};
+ tListBlock.forEach((value, i) => tListBlock[i].order = i)
+
setListBlock(tListBlock);
}
- }
-
- function updateFormByForms() {
- updateFormByFormsApi(location.state.id, "Новая форма", listBlock)
- .then((resolve, _) => {
- console.log(resolve);
- setForms(
- forms.map(item => {
- if (item.id === location.state.id) {
- item.title = "Новая форма",
- item.questions = listBlock
- }
- return item
- })
- );
- cleanStates();
- navigate("/forms");
- })
};
async function saveForm() {
@@ -284,6 +290,7 @@ const NewForm = () => {
addOptionAnswer={addOptionAnswer}
updateBlock={updateBlock}
setCurrentTypeAnswer={setCurrentTypeAnswer}
+ removeOptionAnswer={removeOptionAnswer}
/>
@@ -291,7 +298,7 @@ const NewForm = () => {
Новая форма
- {listBlock.map((item, i) =>
+ {loading ? listBlock.map((item, i) =>
{
removeBlock(item.order)}>
- )}
+ ) :
+
}
diff --git a/src/pages/ViewForm.jsx b/src/pages/ViewForm.jsx
index d81d972..4d85568 100644
--- a/src/pages/ViewForm.jsx
+++ b/src/pages/ViewForm.jsx
@@ -41,7 +41,6 @@ const ViewForm = () => {
}, []);
function updateAnswersForm(value, id) {
- console.log(value)
setAnswers(
answers.map((item, i) => {
if (id === i) {