fix_update_question
This commit is contained in:
parent
2df73211a1
commit
6ec573a61d
|
|
@ -8,7 +8,7 @@ interface FormValues {
|
||||||
}
|
}
|
||||||
|
|
||||||
interface FormikFormProps {
|
interface FormikFormProps {
|
||||||
handleSubmit: (values: any) => void;
|
handleSubmit: any;
|
||||||
initialValues: FormValues;
|
initialValues: FormValues;
|
||||||
validationSchema: any;
|
validationSchema: any;
|
||||||
title?: string;
|
title?: string;
|
||||||
|
|
@ -30,6 +30,7 @@ const FormikFormModel: React.FC<FormikFormProps> = ({
|
||||||
initialValues={initialValues}
|
initialValues={initialValues}
|
||||||
validationSchema={validationSchema}
|
validationSchema={validationSchema}
|
||||||
onSubmit={handleSubmit}
|
onSubmit={handleSubmit}
|
||||||
|
|
||||||
>
|
>
|
||||||
{(formik) => {
|
{(formik) => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
|
|
@ -14,69 +14,71 @@ import { Question } from "../../types/Item";
|
||||||
import BaseForm from './Model/Malty/Add'
|
import BaseForm from './Model/Malty/Add'
|
||||||
import Form from './Model/Add'
|
import Form from './Model/Add'
|
||||||
import { toast } from "react-toastify";
|
import { toast } from "react-toastify";
|
||||||
|
import AcceptModal from "./Model/AcceptModal";
|
||||||
|
import { useModalState } from "../../zustand/Modal";
|
||||||
|
import { ModalEnum } from "../../enums/Model";
|
||||||
|
|
||||||
const AddPage: React.FC = () => {
|
const AddPage: React.FC = () => {
|
||||||
|
|
||||||
|
|
||||||
const { mutate, isSuccess, isLoading ,mutateAsync} = useAddQuestion();
|
const { mutate, isSuccess, isLoading ,mutateAsync} = useAddQuestion();
|
||||||
const {object_to_edit,set_Tags_search,set_object_to_edit} = useObjectToEdit()
|
const {object_to_edit,set_Tags_search,set_object_to_edit,set_Success} = useObjectToEdit()
|
||||||
|
|
||||||
const {subject_id} = useParams<ParamsEnum>()
|
const {subject_id} = useParams<ParamsEnum>()
|
||||||
const {isBseQuestion,set_isBseQuestion} = useObjectToEdit()
|
const {isBseQuestion,set_isBseQuestion} = useObjectToEdit()
|
||||||
|
const { setIsOpen } = useModalState((state) => state);
|
||||||
|
|
||||||
const handleSubmit = (values: Question) => {
|
|
||||||
|
|
||||||
|
const handleSubmit = (values: any, { resetForm }: { resetForm: () => void }) => {
|
||||||
const DataToSend = structuredClone(values);
|
const DataToSend = structuredClone(values);
|
||||||
console.log(DataToSend,"DataToSend");
|
console.log(DataToSend, "DataToSend");
|
||||||
set_Tags_search(null)
|
set_Tags_search(null);
|
||||||
|
|
||||||
if(isBseQuestion){
|
if (isBseQuestion) {
|
||||||
const newBseQuestion = {
|
const newBseQuestion = {
|
||||||
"subject_id" : subject_id,
|
"subject_id": subject_id,
|
||||||
"content" : DataToSend?.content,
|
"content": DataToSend?.content,
|
||||||
"image": DataToSend?.image ?? "",
|
"image": DataToSend?.image ?? "",
|
||||||
"isBase" : 1,
|
"isBase": 1,
|
||||||
}
|
};
|
||||||
|
|
||||||
mutateAsync(newBseQuestion).then((data)=>{
|
mutateAsync(newBseQuestion).then((data) => {
|
||||||
const newBseQuestionId = (data as any )?.data?.id ;
|
const newBseQuestionId = (data as any)?.data?.id;
|
||||||
const Questions = DataToSend?.Questions;
|
const Questions = DataToSend?.Questions;
|
||||||
|
|
||||||
|
Questions?.map((item: Question) => {
|
||||||
|
const tags = processTags(item);
|
||||||
|
|
||||||
|
mutate({
|
||||||
|
...item,
|
||||||
|
parent_id: newBseQuestionId,
|
||||||
|
"subject_id": subject_id,
|
||||||
|
tags
|
||||||
|
});
|
||||||
|
});
|
||||||
|
console.log(newBseQuestionId, "newBseQuestionId");
|
||||||
|
|
||||||
|
|
||||||
Questions?.map((item:Question)=>{
|
});
|
||||||
const tags = processTags(item)
|
} else {
|
||||||
|
const tags = processTags(DataToSend);
|
||||||
mutate({
|
mutate({ ...values, subject_id: subject_id, tags })
|
||||||
...item,
|
}
|
||||||
parent_id:newBseQuestionId,
|
|
||||||
"subject_id" : subject_id,
|
|
||||||
tags
|
|
||||||
})
|
|
||||||
|
|
||||||
})
|
|
||||||
console.log(newBseQuestionId,"newBseQuestionId");
|
|
||||||
|
|
||||||
|
|
||||||
})
|
|
||||||
}else{
|
|
||||||
const tags = processTags(DataToSend)
|
|
||||||
console.log(tags);
|
|
||||||
|
|
||||||
mutate({ ...values, subject_id:subject_id , tags });
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if(isSuccess){
|
if(isSuccess){
|
||||||
toast.success(t("validation.the_possess_done_successful"))
|
toast.success(t("validation.the_possess_done_successful"))
|
||||||
// navigate(-1)
|
|
||||||
set_object_to_edit(null)
|
set_object_to_edit(null)
|
||||||
|
set_Success(true)
|
||||||
|
|
||||||
}
|
}
|
||||||
}, [isSuccess])
|
}, [isSuccess])
|
||||||
|
|
||||||
const handleCancel = () => {
|
const handleCancel = () => {
|
||||||
navigate(-1)
|
setIsOpen(ModalEnum?.QUESTION_ACCEPT);
|
||||||
};
|
};
|
||||||
|
|
||||||
const [t] = useTranslation();
|
const [t] = useTranslation();
|
||||||
|
|
@ -108,7 +110,7 @@ const AddPage: React.FC = () => {
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</FormikForm>
|
</FormikForm>
|
||||||
|
<AcceptModal/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -119,6 +121,7 @@ const AddPage: React.FC = () => {
|
||||||
handleSubmit={handleSubmit}
|
handleSubmit={handleSubmit}
|
||||||
initialValues={getInitialValues(object_to_edit)}
|
initialValues={getInitialValues(object_to_edit)}
|
||||||
validationSchema={getValidationSchema}
|
validationSchema={getValidationSchema}
|
||||||
|
|
||||||
>
|
>
|
||||||
|
|
||||||
<main className="w-100 exercise_add_main">
|
<main className="w-100 exercise_add_main">
|
||||||
|
|
@ -139,7 +142,7 @@ const AddPage: React.FC = () => {
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
</FormikForm>
|
</FormikForm>
|
||||||
|
<AcceptModal/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -60,6 +60,7 @@ const EditPage: React.FC = () => {
|
||||||
mutate(UpdateBseQuestion)
|
mutate(UpdateBseQuestion)
|
||||||
|
|
||||||
const Questions = DataToSend?.Questions;
|
const Questions = DataToSend?.Questions;
|
||||||
|
console.log(Questions,"Questions");
|
||||||
|
|
||||||
Questions?.map((item:Question)=>{
|
Questions?.map((item:Question)=>{
|
||||||
console.log(item);
|
console.log(item);
|
||||||
|
|
@ -68,41 +69,59 @@ const EditPage: React.FC = () => {
|
||||||
const keysToRemove = ['image', 'answer_image'];
|
const keysToRemove = ['image', 'answer_image'];
|
||||||
const updatedObject = removeStringKeys(itemToSend, keysToRemove);
|
const updatedObject = removeStringKeys(itemToSend, keysToRemove);
|
||||||
console.log(updatedObject,"updatedObject");
|
console.log(updatedObject,"updatedObject");
|
||||||
if(updatedObject?.id){
|
|
||||||
const tags = processTags(updatedObject)
|
const tags = processTags(updatedObject)
|
||||||
console.log(tags);
|
const oldQuestionOptions = [] as any;
|
||||||
|
const newQuestionOptions = [] as any;
|
||||||
|
|
||||||
|
updatedObject?.QuestionOptions?.forEach((item:any) => {
|
||||||
|
if (item?.id) {
|
||||||
|
oldQuestionOptions.push(item);
|
||||||
|
} else {
|
||||||
|
newQuestionOptions.push(item);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const QuestionOptions = {
|
||||||
|
old: oldQuestionOptions,
|
||||||
|
new: newQuestionOptions
|
||||||
|
};
|
||||||
|
|
||||||
mutate({
|
mutate({
|
||||||
...updatedObject,
|
...updatedObject,
|
||||||
|
QuestionOptions,
|
||||||
tags
|
tags
|
||||||
|
|
||||||
})
|
})
|
||||||
}else{
|
|
||||||
|
|
||||||
const tags = processTags(updatedObject)
|
|
||||||
console.log(tags);
|
|
||||||
|
|
||||||
|
|
||||||
AddQuestion({
|
|
||||||
...updatedObject,
|
|
||||||
parent_id:UpdateBseQuestion?.id,
|
|
||||||
subject_id:subject_id,
|
|
||||||
tags
|
|
||||||
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
})
|
})
|
||||||
}else{
|
}else{
|
||||||
console.log(2);
|
|
||||||
|
|
||||||
const keysToRemove = ['image', 'answer_image'];
|
const keysToRemove = ['image', 'answer_image'];
|
||||||
const updatedObject = removeStringKeys(DataToSend, keysToRemove);
|
const updatedObject = removeStringKeys(DataToSend, keysToRemove);
|
||||||
delete updatedObject["parent_id"];
|
delete updatedObject["parent_id"];
|
||||||
const tags = processTags(updatedObject)
|
const tags = processTags(updatedObject)
|
||||||
console.log(tags);
|
console.log(updatedObject,"updatedObject");
|
||||||
mutate({ ...updatedObject,tags });
|
const oldQuestionOptions = [] as any;
|
||||||
|
const newQuestionOptions = [] as any;
|
||||||
|
|
||||||
|
updatedObject?.QuestionOptions?.forEach((item:any) => {
|
||||||
|
if (item?.id) {
|
||||||
|
oldQuestionOptions.push(item);
|
||||||
|
} else {
|
||||||
|
newQuestionOptions.push(item);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
const QuestionOptions = {
|
||||||
|
old: oldQuestionOptions,
|
||||||
|
new: newQuestionOptions
|
||||||
|
};
|
||||||
|
console.log(QuestionOptions,"QuestionOptions");
|
||||||
|
|
||||||
|
|
||||||
|
mutate({ ...updatedObject,QuestionOptions,tags });
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -116,7 +135,7 @@ const EditPage: React.FC = () => {
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if(isSuccess){
|
if(isSuccess){
|
||||||
toast.success(t("validation.the_possess_done_successful"))
|
toast.success(t("validation.the_possess_done_successful"))
|
||||||
navigate(-1)
|
// navigate(-1)
|
||||||
}
|
}
|
||||||
}, [isSuccess])
|
}, [isSuccess])
|
||||||
|
|
||||||
|
|
|
||||||
66
src/Pages/question/Model/AcceptModal.tsx
Normal file
66
src/Pages/question/Model/AcceptModal.tsx
Normal file
|
|
@ -0,0 +1,66 @@
|
||||||
|
import React, { useEffect, useState } from "react";
|
||||||
|
import { Input, Modal, Spin } from "antd";
|
||||||
|
import { useModalState } from "../../../zustand/Modal";
|
||||||
|
import { ModalEnum } from "../../../enums/Model";
|
||||||
|
import { useTranslation } from "react-i18next";
|
||||||
|
import { useNavigate } from "react-router-dom";
|
||||||
|
import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
|
||||||
|
|
||||||
|
const AcceptModal: React.FC = () => {
|
||||||
|
const { isOpen, setIsOpen } = useModalState((state) => state);
|
||||||
|
const navigate = useNavigate()
|
||||||
|
|
||||||
|
|
||||||
|
const handleSubmit = () => {
|
||||||
|
console.log("Handle submit clicked");
|
||||||
|
navigate(-1)
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleCancel = () => {
|
||||||
|
setIsOpen("");
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const [t] = useTranslation();
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Modal
|
||||||
|
className="ModalForm"
|
||||||
|
centered
|
||||||
|
width={"40vw"}
|
||||||
|
footer={null}
|
||||||
|
open={isOpen === ModalEnum?.QUESTION_ACCEPT}
|
||||||
|
onCancel={handleCancel}
|
||||||
|
>
|
||||||
|
<header>
|
||||||
|
{" "}
|
||||||
|
{t("practical.accept_back")}
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<main className="main_modal">
|
||||||
|
<div className="ValidationField w-100 mb-5">
|
||||||
|
<label className="text h1 ">
|
||||||
|
{t("practical.Are you sure you want to go back and not save any changes?")}{" "}
|
||||||
|
|
||||||
|
</label>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="buttons">
|
||||||
|
<div onClick={handleCancel}>{t("practical.cancel")}</div>
|
||||||
|
<div
|
||||||
|
onClick={handleSubmit}
|
||||||
|
|
||||||
|
>
|
||||||
|
{t("practical.accept")}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default AcceptModal;
|
||||||
|
|
@ -11,20 +11,21 @@ import { useTranslation } from "react-i18next";
|
||||||
import DynamicTags from "./Tags/DynamicTags";
|
import DynamicTags from "./Tags/DynamicTags";
|
||||||
import { useGetAllQuestion } from "../../../api/Question";
|
import { useGetAllQuestion } from "../../../api/Question";
|
||||||
import useKeyPress from "../../../Hooks/useKeyPress";
|
import useKeyPress from "../../../Hooks/useKeyPress";
|
||||||
|
import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
|
||||||
|
|
||||||
const Form = () => {
|
const Form = () => {
|
||||||
const formik = useFormikContext<any>();
|
const formik = useFormikContext<any>();
|
||||||
const { isOpen } = useModalState((state) => state);
|
const{set_Success,Success} = useObjectToEdit()
|
||||||
// const {data} = useGetAllQuestion();
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (isOpen === "") {
|
if (Success) {
|
||||||
formik.setErrors({});
|
formik.setErrors({});
|
||||||
formik.resetForm();
|
formik.resetForm({ values: {} });
|
||||||
|
set_Success(false)
|
||||||
}
|
}
|
||||||
}, [isOpen]);
|
}, [Success]);
|
||||||
|
|
||||||
|
|
||||||
// console.log(formik?.errors);
|
|
||||||
|
|
||||||
|
|
||||||
const handleAddChoice = () => {
|
const handleAddChoice = () => {
|
||||||
|
|
|
||||||
|
|
@ -14,10 +14,20 @@ const CheckboxField = ({
|
||||||
}: any) => {
|
}: any) => {
|
||||||
const formik = useFormikContext<any>()
|
const formik = useFormikContext<any>()
|
||||||
const [t] = useTranslation()
|
const [t] = useTranslation()
|
||||||
const CheckboxhandleChange = (value: any) => {
|
const CheckboxhandleChange = (value: any, index: number) => {
|
||||||
console.log(value?.target?.checked);
|
|
||||||
|
const allAreZero = formik?.values?.QuestionOptions?.some((item: any) => item.isCorrect === 1);
|
||||||
|
|
||||||
|
if (allAreZero) {
|
||||||
|
|
||||||
|
formik?.values.QuestionOptions.forEach((item: any,index:number) => {
|
||||||
|
|
||||||
|
formik.setFieldValue(`QuestionOptions[${index}].isCorrect`, 0);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
formik.setFieldValue(`QuestionOptions[${name}].isCorrect`, value?.target?.checked ? 1 : 0);
|
formik.setFieldValue(`QuestionOptions[${name}].isCorrect`, value?.target?.checked ? 1 : 0);
|
||||||
|
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className={Group ? "d-inline mt-5 Checkbox" : ``}>
|
<div className={Group ? "d-inline mt-5 Checkbox" : ``}>
|
||||||
|
|
|
||||||
|
|
@ -11,18 +11,23 @@ import { useTranslation } from "react-i18next";
|
||||||
import DynamicTags from "./Tags/DynamicTags";
|
import DynamicTags from "./Tags/DynamicTags";
|
||||||
import { useGetAllQuestion } from "../../../../api/Question";
|
import { useGetAllQuestion } from "../../../../api/Question";
|
||||||
import QuestionFIeld from "./QuestionFIeld/QuestionFIeld";
|
import QuestionFIeld from "./QuestionFIeld/QuestionFIeld";
|
||||||
|
import { useObjectToEdit } from "../../../../zustand/ObjectToEditState";
|
||||||
|
|
||||||
const Form = () => {
|
const Form = () => {
|
||||||
const formik = useFormikContext<any>();
|
const formik = useFormikContext<any>();
|
||||||
const { isOpen } = useModalState((state) => state);
|
const { isOpen } = useModalState((state) => state);
|
||||||
// const {data} = useGetAllQuestion();
|
// const {data} = useGetAllQuestion();
|
||||||
|
const{set_Success,Success} = useObjectToEdit()
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (isOpen === "") {
|
if (Success) {
|
||||||
|
console.log(1);
|
||||||
|
|
||||||
formik.setErrors({});
|
formik.setErrors({});
|
||||||
formik.resetForm();
|
formik.resetForm({ values: {} });
|
||||||
|
set_Success(false)
|
||||||
}
|
}
|
||||||
}, [isOpen]);
|
}, [Success]);
|
||||||
|
|
||||||
// console.log(formik?.errors);
|
// console.log(formik?.errors);
|
||||||
console.log(formik?.values?.Questions,"formik?.values?.Questions");
|
console.log(formik?.values?.Questions,"formik?.values?.Questions");
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,20 @@ const CheckboxField = ({
|
||||||
const CheckboxhandleChange = (value: any) => {
|
const CheckboxhandleChange = (value: any) => {
|
||||||
console.log(value?.target?.checked);
|
console.log(value?.target?.checked);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const allAreZero = formik?.values?.Questions?.[parent_index]?.QuestionOptions?.some((item: any) => item.isCorrect === 1);
|
||||||
|
if (allAreZero) {
|
||||||
|
|
||||||
|
formik?.values?.Questions?.[parent_index]?.QuestionOptions.forEach((item: any,index:number) => {
|
||||||
|
|
||||||
|
formik.setFieldValue(`Questions[${parent_index}].QuestionOptions[${index}].isCorrect`, 0);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
formik.setFieldValue(`Questions[${parent_index}].QuestionOptions[${name}].isCorrect`, value?.target?.checked ? 1 : 0);
|
formik.setFieldValue(`Questions[${parent_index}].QuestionOptions[${name}].isCorrect`, value?.target?.checked ? 1 : 0);
|
||||||
|
|
||||||
|
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className={Group ? "d-inline mt-5 Checkbox" : ``}>
|
<div className={Group ? "d-inline mt-5 Checkbox" : ``}>
|
||||||
|
|
|
||||||
|
|
@ -269,3 +269,8 @@ button:disabled {
|
||||||
.relative{
|
.relative{
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
.h1{
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -144,5 +144,6 @@ export enum ModalEnum {
|
||||||
|
|
||||||
///// Question
|
///// Question
|
||||||
QUESTION_DELETE = "Question.delete",
|
QUESTION_DELETE = "Question.delete",
|
||||||
|
QUESTION_ACCEPT = "Question.ACCEPT",
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -189,7 +189,10 @@
|
||||||
"presence": "الحضور",
|
"presence": "الحضور",
|
||||||
"add_new_role": "اضافة صلاحية جديدة",
|
"add_new_role": "اضافة صلاحية جديدة",
|
||||||
"yes":"نعم",
|
"yes":"نعم",
|
||||||
"no":"لا"
|
"no":"لا",
|
||||||
|
"Are you sure you want to go back and not save any changes?":"هل أنت متأكد أنك تريد العودة وعدم حفظ أي تغييرات؟" ,
|
||||||
|
"accept_back":"قبول العودة ",
|
||||||
|
"accept":"قبول "
|
||||||
},
|
},
|
||||||
"Table": {
|
"Table": {
|
||||||
"header": "",
|
"header": "",
|
||||||
|
|
|
||||||
|
|
@ -19,6 +19,8 @@ interface ModelState {
|
||||||
set_current_parent_index: (data: any) => void;
|
set_current_parent_index: (data: any) => void;
|
||||||
isBseQuestion: boolean;
|
isBseQuestion: boolean;
|
||||||
set_isBseQuestion: (data: any) => void;
|
set_isBseQuestion: (data: any) => void;
|
||||||
|
Success: boolean;
|
||||||
|
set_Success: (data: any) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useObjectToEdit = create<ModelState>((set) => ({
|
export const useObjectToEdit = create<ModelState>((set) => ({
|
||||||
|
|
@ -40,4 +42,6 @@ export const useObjectToEdit = create<ModelState>((set) => ({
|
||||||
set_current_parent_index: (data) => set(() => ({ current_parent_index: data })),
|
set_current_parent_index: (data) => set(() => ({ current_parent_index: data })),
|
||||||
isBseQuestion: false,
|
isBseQuestion: false,
|
||||||
set_isBseQuestion: (data) => set(() => ({ isBseQuestion: data })),
|
set_isBseQuestion: (data) => set(() => ({ isBseQuestion: data })),
|
||||||
|
Success: false,
|
||||||
|
set_Success: (data) => set(() => ({ Success: data })),
|
||||||
}));
|
}));
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user