From 16f6507f001cf0e7c1a14a39fe0d5f85e1782b8b Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Wed, 18 Sep 2024 10:30:46 +0300 Subject: [PATCH] make question one_of_image_and_content_should_be_enter_in_question --- .../ImageBoxField/ImageBoxField.tsx | 2 - src/Pages/Admin/question/AddPage.tsx | 52 +++++++++++++++---- src/Pages/Admin/question/EditPage.tsx | 24 ++++++++- src/Pages/Admin/question/Model/Malty/Form.tsx | 6 ++- src/Pages/Admin/question/formUtil.ts | 40 +++++++++++--- src/Styles/Pages/exercise.scss | 4 +- src/translate/ar.json | 3 +- 7 files changed, 103 insertions(+), 28 deletions(-) diff --git a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx index 89888fc..6287c81 100644 --- a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx +++ b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx @@ -38,12 +38,10 @@ const ImageBoxField = ({ name }: any) => { } // Process the file - console.log('File selected:', file); } if (file) { generateImagePreview(file, setImagePreview); - console.log(file,"file"); formik.setFieldValue(name, file); } diff --git a/src/Pages/Admin/question/AddPage.tsx b/src/Pages/Admin/question/AddPage.tsx index af073d3..78a951a 100644 --- a/src/Pages/Admin/question/AddPage.tsx +++ b/src/Pages/Admin/question/AddPage.tsx @@ -1,4 +1,4 @@ -import React, { Suspense, lazy, useEffect } from "react"; +import React, { useEffect } from "react"; import { Spin } from "antd"; import { getInitialValues, @@ -20,6 +20,7 @@ import ModelForm from "./Model/ModelForm"; import { toast } from "react-toastify"; import { Form, Formik } from "formik"; import { MdOutlineArrowForwardIos } from "react-icons/md"; +import { getCharFromNumber } from "../../../utils/getCharFromNumber"; const AddPage: React.FC = () => { const location = useLocation(); @@ -99,12 +100,19 @@ const AddPage: React.FC = () => { mutate(NewQuestion); } }; - - const handleValidateSingleQuestion = (values:any)=>{ const haveMoreThanOneAnswer = values?.answers?.length > 1; const haveOneAnswerRight = haveMoreThanOneAnswer && values?.answers?.some((item:any)=> item?.isCorrect === 1 || item.isCorrect === true ) const haveImageOrContent = haveOneAnswerRight && values?.answers?.some((item:any)=> !(item?.content) && !(item.content_image) ) + const content = values.content ; + const content_image = values.content_image ; + const haveContentOrContentImage = !!content || !!content_image ; + + console.log(haveImageOrContent,"haveImageOrContent"); + if(!haveContentOrContentImage){ + toast.error(`${t("validation.one_of_image_and_content_should_be_enter_in_question")}`); + return false; + } if(!haveMoreThanOneAnswer){ toast.error(t("validation.it_should_have_more_than_one_answers")) ; @@ -115,21 +123,43 @@ const AddPage: React.FC = () => { return false ; } if(haveImageOrContent){ - toast.error(t("validation.one_of_image_and_content_should_be_enter")) + toast.error(t("validation.one_of_image_and_content_should_be_enter_in_answer_in_answer")) return false } } - const handleValidateBaseQuestion = (values: any) => { - const haveAnswers = values?.Questions?.every((Question: any, QuestionsIndex: number) => { + const content = values.content ; + const content_image = values.content_image ; + const haveContentOrContentImage = !!content || !!content_image ; + + if(!haveContentOrContentImage){ + toast.error(`${t("validation.one_of_image_and_content_should_be_enter_in_question")}`); + return false; + } + + values?.Questions?.every((Question: any, QuestionsIndex: number) => { + + + const content = Question.content ; + const content_image = Question.content_image ; + const haveContentOrContentImage = !!content || !!content_image ; + if(!haveContentOrContentImage){ + toast.error(`${t("validation.one_of_image_and_content_should_be_enter_in_question")}`); + return false; + } + + + //// answers const answers = Question?.answers; - const haveAnswers = answers?.length > 0; + const haveAnswers = answers?.length > 0; const haveMoreThanOneAnswer = haveAnswers && answers?.length > 1; const haveOneAnswerRight = haveMoreThanOneAnswer && answers?.some((item: any) => item?.isCorrect === 1 || item.isCorrect === true); const haveImageOrContent = haveOneAnswerRight && answers?.some((item:any)=> !(item?.content) && !(item.content_image) ) - console.log(haveImageOrContent,"haveImageOrContent"); + + + if (!haveAnswers) { toast.error(t("validation.it_should_have_more_than_one_answers")); return false; @@ -146,14 +176,14 @@ const AddPage: React.FC = () => { } if(haveImageOrContent){ - toast.error(t("validation.one_of_image_and_content_should_be_enter")) + toast.error(t("validation.one_of_image_and_content_should_be_enter_in_answer")) return false } return true; }); - - console.log(haveAnswers, "haveAnswers"); + + }; const navigate = useNavigate(); diff --git a/src/Pages/Admin/question/EditPage.tsx b/src/Pages/Admin/question/EditPage.tsx index 08cdb76..af248df 100644 --- a/src/Pages/Admin/question/EditPage.tsx +++ b/src/Pages/Admin/question/EditPage.tsx @@ -194,7 +194,15 @@ const EditPage: React.FC = () => { const haveMoreThanOneAnswer = values?.answers?.length > 1; const haveOneAnswerRight = haveMoreThanOneAnswer && values?.answers?.some((item:any)=> item?.isCorrect === 1 || item.isCorrect === true ) const haveImageOrContent = haveOneAnswerRight && values?.answers?.some((item:any)=> !(item?.content) && !(item.content_image) ) + const content = values.content ; + const content_image = values.content_image ; + const haveContentOrContentImage = !!content || !!content_image ; + console.log(haveImageOrContent,"haveImageOrContent"); + if(!haveContentOrContentImage){ + toast.error(`${t("validation.one_of_image_and_content_should_be_enter_in_question")}`); + return false; + } if(!haveMoreThanOneAnswer){ toast.error(t("validation.it_should_have_more_than_one_answers")) ; return false ; @@ -204,7 +212,7 @@ const EditPage: React.FC = () => { return false ; } if(haveImageOrContent){ - toast.error(t("validation.one_of_image_and_content_should_be_enter")) + toast.error(t("validation.one_of_image_and_content_should_be_enter_in_answer")) return false } @@ -212,6 +220,18 @@ const EditPage: React.FC = () => { const handleValidateBaseQuestion = (values: any) => { const haveAnswers = values?.Questions?.every((Question: any, QuestionsIndex: number) => { + + + const content = Question.content ; + const content_image = Question.content_image ; + const haveContentOrContentImage = !!content || !!content_image ; + if(!haveContentOrContentImage){ + toast.error(`${t("validation.one_of_image_and_content_should_be_enter_in_question")}`); + return false; + } + + + //// answers const answers = Question?.answers; const haveAnswers = answers?.length > 0; const haveMoreThanOneAnswer = haveAnswers && answers?.length > 1; @@ -235,7 +255,7 @@ const handleValidateBaseQuestion = (values: any) => { } if(haveImageOrContent){ - toast.error(t("validation.one_of_image_and_content_should_be_enter")) + toast.error(t("validation.one_of_image_and_content_should_be_enter_in_answer")) return false } diff --git a/src/Pages/Admin/question/Model/Malty/Form.tsx b/src/Pages/Admin/question/Model/Malty/Form.tsx index 4764553..f0509d2 100644 --- a/src/Pages/Admin/question/Model/Malty/Form.tsx +++ b/src/Pages/Admin/question/Model/Malty/Form.tsx @@ -17,7 +17,8 @@ import { toast } from "react-toastify"; const Form = () => { const formik = useFormikContext(); const { setSuccess, Success, setSavedQuestionData ,ShowHint} = useObjectToEdit(); - + console.log(formik.errors); + useEffect(() => { setSavedQuestionData(formik.values); }, [formik?.values]); @@ -33,7 +34,8 @@ const Form = () => { { answer: null, - answer_image: null, + content_image: null, + content:null, isCorrect: 0, }, ]); diff --git a/src/Pages/Admin/question/formUtil.ts b/src/Pages/Admin/question/formUtil.ts index b604573..59f488e 100644 --- a/src/Pages/Admin/question/formUtil.ts +++ b/src/Pages/Admin/question/formUtil.ts @@ -43,7 +43,16 @@ export const getValidationSchema = () => { return hasCorrectAnswer && !haveImageOrContent ; }, ), - }); + }).test( + "content-or-image-required", + "At least one of content or content_image must be provided", + (obj:any) => { + const isValid = !!obj.content || !!obj.content_image; + console.log(isValid,"isValid"); + + return isValid; + } + ); }; export const getInitialValuesBase = (objectToEdit: Question): any => { @@ -89,16 +98,16 @@ export const getValidationSchemaBase = () => { // validate input return Yup.object().shape({ content_image: Yup.string().nullable(), - content: Yup.string().required("validation.required"), + content: Yup.string(), Questions: Yup.array().of( Yup.object().shape({ - image: Yup.string().nullable(), - content: Yup.string().required("validation.required"), + content_image: Yup.string().nullable(), + content: Yup.string().nullable(), answers: Yup.array() .of( Yup.object().shape({ - content: Yup.string(), - answer_image: Yup.string().nullable(), + content: Yup.string().nullable(), + content_image: Yup.string().nullable(), isCorrect: Yup.boolean(), }), ).min(2) @@ -114,9 +123,24 @@ export const getValidationSchemaBase = () => { return hasCorrectAnswer && !haveImageOrContent ; }, ), - }), + }).test( + "content-or-image-required", + "At least one of content or content_image must be provided in question", + (obj:any) => { + + const isValid = !!obj.content || !!obj.content_image; + return isValid; + } + ), ).min(1), - }); + }).test( + "content-or-image-required", + "At least one of content or content_image must be provided in base", + (obj:any) => { + const isValid = !!obj.content || !!obj.content_image; + return isValid; + } + ); }; export function processTags(DataToSend: any) { diff --git a/src/Styles/Pages/exercise.scss b/src/Styles/Pages/exercise.scss index 542afa3..c4158e8 100644 --- a/src/Styles/Pages/exercise.scss +++ b/src/Styles/Pages/exercise.scss @@ -322,12 +322,12 @@ .Choices { transition: 0.5s ease-in-out ; - animation: fadeIn .5s ease-in-out ; + animation: fadeIn .5s ease-in-out forwards ; } .exit { transition: 0.5s ease-in-out ; - animation: fadeOut .5s ease-in-out ; + animation: fadeOut .7s ease-in-out forwards ; } diff --git a/src/translate/ar.json b/src/translate/ar.json index a92114c..b9b2379 100644 --- a/src/translate/ar.json +++ b/src/translate/ar.json @@ -50,7 +50,8 @@ "it_should_have_more_than_one_answers": "يجب أن يحتوي على أكثر من إجابة", "it_should_have_more_than_one_correct_answers": "يجب أن يحتوي على إجابة صحيحة", "File_size_exceeds_2_MB_limit.":"حجم الملف يتجاوز الحد الأقصى البالغ 2 ميجابايت", - "one_of_image_and_content_should_be_enter":"يجب إدخال صورة أو محتوى واحد على الأقل" + "one_of_image_and_content_should_be_enter_in_answer":"يجب إدخال صورة أو محتوى واحد على الأقل في الاجابة", + "one_of_image_and_content_should_be_enter_in_question":"يجب إدخال صورة أو محتوى واحد على الأقل في السؤال" }, "header": { "register_students": "تسجيل الطلاب",