From 32f87910ea471354c3b70217208ea2f344b1277c Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Mon, 16 Sep 2024 15:29:53 +0300 Subject: [PATCH 1/5] fix tag --- .../ImageBoxField/ImageBoxField.tsx | 5 +- src/Components/CustomFields/SelectTag.tsx | 15 +++-- src/Components/exercise/Header.tsx | 15 +++++ src/Pages/Admin/question/AddPage.tsx | 9 +-- src/Pages/Admin/question/EditPage.tsx | 45 +++++++-------- .../question/Model/Field/ChoiceFields.tsx | 56 +++++++++++++------ .../Model/Malty/ChoiceField/ChoiceFields.tsx | 31 +++++++++- src/Pages/Admin/question/Model/Malty/Form.tsx | 5 ++ .../Malty/QuestionFIeld/QuestionFIeld.tsx | 36 +++++++++++- src/Pages/Home/Dummy.tsx | 8 ++- src/Styles/Layout/FilterLayout.scss | 12 ---- src/Styles/Layout/index.scss | 1 + src/translate/ar.json | 3 +- src/utils/removeStringKeys.ts | 2 +- 14 files changed, 177 insertions(+), 66 deletions(-) diff --git a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx index 65ef83e..574815d 100644 --- a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx +++ b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx @@ -27,6 +27,7 @@ const ImageBoxField = ({ name }: any) => { const handleFileChange = (event: any) => { const file = event.target.files[0]; + if (file) { const maxSize = 2 * 1024 * 1024; @@ -42,6 +43,8 @@ const ImageBoxField = ({ name }: any) => { if (file) { generateImagePreview(file, setImagePreview); + console.log(file,"file"); + formik.setFieldValue(name, file); } }; @@ -55,7 +58,7 @@ const ImageBoxField = ({ name }: any) => { const handleCancel = () => { setImagePreview(""); - formik.setFieldValue(name, ""); + formik.setFieldValue(name, null); if (fileInputRef.current) { fileInputRef.current.value = ""; diff --git a/src/Components/CustomFields/SelectTag.tsx b/src/Components/CustomFields/SelectTag.tsx index eb4685b..aa91902 100644 --- a/src/Components/CustomFields/SelectTag.tsx +++ b/src/Components/CustomFields/SelectTag.tsx @@ -9,20 +9,27 @@ const SelectTag: React.FC = () => { const [searchValue, setSearchValue] = useState(""); const [fieldValue, setFieldValue] = useState(""); + const [NewAdditionalData, setNewAdditionalData] = useState({}) const formik = useFormikContext(); - const handleChange = (value: string[]) => { - console.log(value); - + const handleChange = (value: any,option:any) => { + const newSelectedOption = option?.pop() + const newObject = { + id:newSelectedOption?.id, + name:newSelectedOption?.name + } + setNewAdditionalData(newObject) formik.setFieldValue("tags", value); setSearchValue(""); setFieldValue(""); }; const handleSearch = useDebounce((value: string) => { + setSearchValue(value); }); const handleFieldChange = (value: string) => { + setFieldValue(value); }; @@ -46,7 +53,7 @@ const SelectTag: React.FC = () => { const value = formik?.values?.tags?.map((item: any) => item?.id ?? item) ?? []; - const AllOptions = [...options, ...additionalData]; + const AllOptions = [...options, ...additionalData,NewAdditionalData]; return (
diff --git a/src/Components/exercise/Header.tsx b/src/Components/exercise/Header.tsx index a524b5f..a896af2 100644 --- a/src/Components/exercise/Header.tsx +++ b/src/Components/exercise/Header.tsx @@ -13,7 +13,22 @@ const Header = () => { const { values, setFieldValue, setValues } = useFormikContext(); const { isBseQuestion, setIsBseQuestion } = useObjectToEdit(); const { setSavedQuestionData } = useObjectToEdit(); + console.log(values,"values"); + + const isEdited = ()=>{ + + if(isBseQuestion || values?.isBase === 1){ + + }else{ + const content = !!values?.content ; + const content_image = !!values?.content_image ; + const hint = !values?.hint ; + const answers = !values?.answers ; + } + + } + const handleChange = () => { setSavedQuestionData(null); localStorage.removeItem(QUESTION_OBJECT_KEY); diff --git a/src/Pages/Admin/question/AddPage.tsx b/src/Pages/Admin/question/AddPage.tsx index 0aa7986..ea94e47 100644 --- a/src/Pages/Admin/question/AddPage.tsx +++ b/src/Pages/Admin/question/AddPage.tsx @@ -115,7 +115,7 @@ const AddPage: React.FC = () => { return false ; } if(haveImageOrContent){ - toast.error("validation.one_of_image_and_content_should_be_enter") + toast.error(t("validation.one_of_image_and_content_should_be_enter")) return false } @@ -127,8 +127,9 @@ const AddPage: React.FC = () => { 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 && values?.answers?.some((item:any)=> !(item?.content) && !(item.content_image) ) - + 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; @@ -145,7 +146,7 @@ const AddPage: React.FC = () => { } if(haveImageOrContent){ - toast.error("validation.one_of_image_and_content_should_be_enter") + toast.error(t("validation.one_of_image_and_content_should_be_enter")) return false } diff --git a/src/Pages/Admin/question/EditPage.tsx b/src/Pages/Admin/question/EditPage.tsx index 7c6427c..a6e8fff 100644 --- a/src/Pages/Admin/question/EditPage.tsx +++ b/src/Pages/Admin/question/EditPage.tsx @@ -89,6 +89,8 @@ const EditPage: React.FC = () => { if (item?.id) { const itemToSend = structuredClone(item); const keysToRemove = ["content_image"]; + console.log(itemToSend,"itemToSend"); + const updatedObject = removeStringKeys(itemToSend, keysToRemove); console.log(updatedObject, "updatedObject"); @@ -96,16 +98,6 @@ const EditPage: React.FC = () => { const oldAnswers = [] as any; const newAnswers = [] as any; - if (updatedObject?.answers?.length > 0) { - const isValidAnswers = updatedObject?.answers?.some( - (answer: any) => answer?.isCorrect === 1, - ); - - // if(!isValidAnswers){ - // toast.error(t("validation.at_least_one_answer_should_be_correct")); - // return; - // } - } updatedObject?.answers?.forEach((item: any) => { if (item?.id) { oldAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); @@ -149,19 +141,17 @@ const EditPage: React.FC = () => { const oldAnswers = [] as any; const newAnswers = [] as any; - if (updatedObject?.answers?.length > 0) { - // const isValidAnswers = updatedObject?.answers?.some((answer:any) => answer?.isCorrect === 1 || answer?.isCorrect === true) - // const isValidAnswers2 = updatedObject?.answers?.filter((answer: any) => answer?.isCorrect === 1 || answer?.isCorrect === true ).length > 1; - // console.log(isValidAnswers2); - // console.log(isValidAnswers,"isValidAnswers"); - // if(!isValidAnswers || isValidAnswers2){ - // toast.error(t("validation.at_least_one_answer_should_be_correct")); - // return; - // } - } updatedObject?.answers?.forEach((item: any) => { if (item?.id) { - oldAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); + console.log(item,"item"); + const deletedImage = item?.content_image === null + if(deletedImage){ + oldAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0, content_image:"" }); + + }else{ + oldAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); + + } } else { newAnswers.push({ ...item, isCorrect: item?.isCorrect ? 1 : 0 }); } @@ -181,7 +171,6 @@ const EditPage: React.FC = () => { }; const location = useLocation(); - const navigate = useNavigate(); const handleCancel = () => { navigate(-1); @@ -191,6 +180,7 @@ const EditPage: React.FC = () => { 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) ) if(!haveMoreThanOneAnswer){ toast.error(t("validation.it_should_have_more_than_one_answers")) ; @@ -200,6 +190,10 @@ const EditPage: React.FC = () => { toast.error(t("validation.it_should_have_more_than_one_correct_answers")) ; return false ; } + if(haveImageOrContent){ + toast.error(t("validation.one_of_image_and_content_should_be_enter")) + return false + } } @@ -210,6 +204,7 @@ const handleValidateBaseQuestion = (values: any) => { 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) ) if (!haveAnswers) { toast.error(t("validation.it_should_have_more_than_one_answers")); @@ -226,6 +221,12 @@ const handleValidateBaseQuestion = (values: any) => { return false; } + if(haveImageOrContent){ + toast.error(t("validation.one_of_image_and_content_should_be_enter")) + return false + } + + return true; }); diff --git a/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx b/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx index cc35eab..89ea85a 100644 --- a/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx +++ b/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx @@ -26,6 +26,16 @@ const ChoiceFields = ({ index, data }: { index: number; data: Choice }) => { formik.setFieldValue("answers", updatedAnswers); }; + const values = formik?.values?.answers?.[index] ; + const handelCanDeleteAnswers = ()=>{ + const content = values?.content ; + const content_image = values?.content_image ; + if(!content && !content_image ){ + return true + } + return false + } + return ( <>
@@ -52,26 +62,38 @@ const ChoiceFields = ({ index, data }: { index: number; data: Choice }) => { name={index} type="Checkbox" /> + {handelCanDeleteAnswers() ? +

{handleDeleteChoice()}}> + {t("header.delete_choice")} + +

+ : {handleDeleteChoice()}} - defaultOpen={false} - - > -

- {t("header.delete_choice")} - -

+ title={t("header.this_will_un_do_all_your_changes")} + okText={t("practical.yes")} + cancelText={t("practical.no")} + onConfirm={()=>{handleDeleteChoice()}} + defaultOpen={false} - - + > +

+ {t("header.delete_choice")} + +

+ + + + } +
diff --git a/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx b/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx index 35940e2..a3f12a1 100644 --- a/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx +++ b/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx @@ -42,6 +42,19 @@ const ChoiceFields = ({ formik.setFieldValue(`Questions[${parent_index}].answers`, updatedAnswers); }; + const values = formik.values.Questions?.[parent_index]?.answers?.[index] ; + console.log(values,"values"); + + const handelCanDeleteAnswers = ()=>{ + const content = values?.content ; + const content_image = values?.content_image ; + if(!content && !content_image ){ + return true + } + return false + } + + return ( <>
@@ -71,7 +84,19 @@ const ChoiceFields = ({ parent_index={parent_index} /> -{handleDeleteChoice()}} > + {t("header.delete_choice")} + +

+ : + + + + } + +
diff --git a/src/Pages/Admin/question/Model/Malty/Form.tsx b/src/Pages/Admin/question/Model/Malty/Form.tsx index 8effc15..34088d7 100644 --- a/src/Pages/Admin/question/Model/Malty/Form.tsx +++ b/src/Pages/Admin/question/Model/Malty/Form.tsx @@ -94,6 +94,11 @@ const Form = () => { } }, [Success]); + + + + + return (
diff --git a/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx b/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx index 13b7aed..813d106 100644 --- a/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx +++ b/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx @@ -29,6 +29,22 @@ const QuestionFIeld = ({ index, data }: { index: number; data: Choice }) => { formik.setFieldValue(`Questions`, updatedAnswers); }; + + + const values = formik.values.Questions?.[index] ; + console.log(values,"values"); + + const handelCanDeleteAnswers = ()=>{ + const content = values?.content ; + const content_image = values?.content_image ; + if(!content && !content_image ){ + return true + } + return false + } + + + return ( <>
@@ -48,7 +64,22 @@ const QuestionFIeld = ({ index, data }: { index: number; data: Choice }) => { -
+ {handelCanDeleteAnswers() ? +
+

{handleDeleteQuestion()}}> + {t("header.delete_question")} + +

+
+ + : + +
+ {
+ } + +
diff --git a/src/Pages/Home/Dummy.tsx b/src/Pages/Home/Dummy.tsx index 6b178d0..34b0596 100644 --- a/src/Pages/Home/Dummy.tsx +++ b/src/Pages/Home/Dummy.tsx @@ -1,6 +1,7 @@ import React from "react"; import { useTranslation } from "react-i18next"; import useFilter from "../../Components/FilterField/components/useFilter"; +import { Select } from "antd"; const Dummy = () => { const [t] = useTranslation(); @@ -12,8 +13,11 @@ const Dummy = () => { karim - - karim2 + + /> */}
); From de71606e88557a52dc9e24f64ea9c9581c54bcf3 Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Mon, 16 Sep 2024 20:22:07 +0300 Subject: [PATCH 3/5] fix --- src/Components/CustomFields/SelectTag.tsx | 11 +++-- src/Components/exercise/Header.tsx | 42 ++++++++++++++++--- src/Layout/Dashboard/FormikFormModel.tsx | 2 +- src/Layout/Dashboard/Table/DataTable.tsx | 4 +- src/Pages/Admin/Grade/useTableColumns.tsx | 6 +-- src/Pages/Admin/question/EditPage.tsx | 8 ++-- .../Model/Malty/Tags/MaltySelectTag.tsx | 5 ++- src/Pages/Admin/question/formUtil.ts | 1 + src/api/helper/useAxios.ts | 4 +- src/api/helper/useGetQuery.ts | 6 +-- 10 files changed, 62 insertions(+), 27 deletions(-) diff --git a/src/Components/CustomFields/SelectTag.tsx b/src/Components/CustomFields/SelectTag.tsx index 27bfc35..182af50 100644 --- a/src/Components/CustomFields/SelectTag.tsx +++ b/src/Components/CustomFields/SelectTag.tsx @@ -49,11 +49,14 @@ const SelectTag: React.FC = () => { options.length < 1 && searchValue.length > 1 && !isLoading ? [{ id: searchValue, name: searchValue }] : []; - + console.log(formik?.values?.tags,"formik?.values?.tags"); + const value = formik?.values?.tags?.map((item: any) => item?.id ?? item) ?? []; - const AllOptions = [...options, ...additionalData,NewAdditionalData]; + const AllOptions = [...options, ...additionalData,NewAdditionalData,...(formik?.values?.tags ?? {})]; + console.log(AllOptions,"AllOptions"); + const uniqueOptions = Array.from( new Map( AllOptions @@ -61,7 +64,9 @@ const SelectTag: React.FC = () => { .map(item => [item.id, item]) // Create [id, item] pairs to ensure uniqueness ).values() ); - + + console.log(uniqueOptions,"uniqueOptions"); + return (
diff --git a/src/Components/exercise/Header.tsx b/src/Components/exercise/Header.tsx index a896af2..869dcdc 100644 --- a/src/Components/exercise/Header.tsx +++ b/src/Components/exercise/Header.tsx @@ -20,15 +20,28 @@ const Header = () => { if(isBseQuestion || values?.isBase === 1){ + const content = !values?.content ; + const content_image = !values?.content_image ; + const hint = !values?.hint ; + const Questions = values?.Questions?.length <= 1 && values?.Questions?.[0]?.answers?.length === 0 ; + + if(content && content_image && hint && Questions) { + return false + } }else{ - const content = !!values?.content ; - const content_image = !!values?.content_image ; + const content = !values?.content ; + const content_image = !values?.content_image ; const hint = !values?.hint ; const answers = !values?.answers ; + const tags = !(values?.tags?.length > 0) ; + if(content && content_image && hint && answers && tags) { + return false + } } - + return true } - + console.log(isEdited(),"isEdited"); + const handleChange = () => { setSavedQuestionData(null); localStorage.removeItem(QUESTION_OBJECT_KEY); @@ -77,7 +90,9 @@ const Header = () => {
- { : t("header.exercise")} + + + : + + <> + + + confirm()} className="m-2" /> + {isBseQuestion || values?.isBase === 1 + ? t("header.malty_exercise") + : t("header.exercise")} + + + + + } +
); diff --git a/src/Layout/Dashboard/FormikFormModel.tsx b/src/Layout/Dashboard/FormikFormModel.tsx index 3f99817..e738956 100644 --- a/src/Layout/Dashboard/FormikFormModel.tsx +++ b/src/Layout/Dashboard/FormikFormModel.tsx @@ -33,7 +33,7 @@ const FormikFormModel: React.FC = ({ > {(formik) => { useEffect(() => { - if (isOpen === "") { + if (isOpen === "" || isOpen === "isSuccess") { formik.setErrors({}); formik.resetForm(); } diff --git a/src/Layout/Dashboard/Table/DataTable.tsx b/src/Layout/Dashboard/Table/DataTable.tsx index a5569c4..8b51496 100644 --- a/src/Layout/Dashboard/Table/DataTable.tsx +++ b/src/Layout/Dashboard/Table/DataTable.tsx @@ -14,7 +14,6 @@ const DataTable: React.FC = ({ ...props }) => { const data: any[] = response?.data?.data || []; - const dataSource = useAddKeyToData(data); const columns = useColumns(); const { pagination, handlePageChange } = usePagination(response?.data); const [t] = useTranslation(); @@ -28,7 +27,8 @@ const DataTable: React.FC = ({ getRowClassName(record, index)} className="DataTable" loading={{ diff --git a/src/Pages/Admin/Grade/useTableColumns.tsx b/src/Pages/Admin/Grade/useTableColumns.tsx index 437b3c8..bc10a12 100644 --- a/src/Pages/Admin/Grade/useTableColumns.tsx +++ b/src/Pages/Admin/Grade/useTableColumns.tsx @@ -1,13 +1,10 @@ import { TableColumnsType } from "antd"; -import { FaPlus } from "react-icons/fa"; import useModalHandler from "../../../utils/useModalHandler"; import { ModalEnum } from "../../../enums/Model"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; import { useTranslation } from "react-i18next"; -import { ABILITIES_ENUM } from "../../../enums/abilities"; import { useNavigate } from "react-router-dom"; import { - canAddGrade, canDeleteGrade, canEditGrade, canShowGrade, @@ -15,7 +12,6 @@ import { import ActionButtons from "../../../Components/Table/ActionButtons"; import ColumnsImage from "../../../Components/Columns/ColumnsImage"; import { Grade } from "../../../types/Grade"; -import { useFilterState } from "../../../Components/Utils/Filter/FilterState"; import { useFilterStateState } from "../../../zustand/Filter"; export const useColumns = () => { @@ -26,7 +22,7 @@ export const useColumns = () => { const { setFilter } = useFilterStateState(); - + const handelShow = (record: Grade) => { setFilter({}) navigate(`${record?.id}`); diff --git a/src/Pages/Admin/question/EditPage.tsx b/src/Pages/Admin/question/EditPage.tsx index a6e8fff..739d11f 100644 --- a/src/Pages/Admin/question/EditPage.tsx +++ b/src/Pages/Admin/question/EditPage.tsx @@ -59,7 +59,7 @@ const EditPage: React.FC = () => { const DataToSend = structuredClone(values); setTagsSearch(null); console.log(DataToSend); - + if (isBseQuestion) { const UpdateBseQuestion = { id: DataToSend?.id, @@ -110,7 +110,6 @@ const EditPage: React.FC = () => { new: newAnswers, }; console.log(answers); - mutate({ ...updatedObject, answers, @@ -119,7 +118,10 @@ const EditPage: React.FC = () => { } else { console.log(values?.id); - const tags = processTags(DataToSend); + const tags = processTags(item); + console.log(item,"DataToSend"); + + console.log(tags,"tags"); mutateAdd({ ...item, subject_id: subject_id, diff --git a/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx b/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx index 5e73b65..cb3687e 100644 --- a/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx +++ b/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx @@ -49,13 +49,14 @@ const MaltySelectTag = ({ parent_index }: { parent_index: number }) => { options.length < 1 && searchValue.length > 1 && !isLoading ? [{ id: searchValue, name: searchValue }] : []; - + console.log(formik?.values?.Questions[parent_index]?.tags,"formik?.values?.Questions[parent_index]?.tags"); + const value = formik?.values?.Questions[parent_index]?.tags?.map( (item: any) => item?.id ?? item, ) ?? []; - const AllOptions = [...options, ...additionalData,NewAdditionalData]; + const AllOptions = [...options, ...additionalData,NewAdditionalData , ...(formik?.values?.Questions[parent_index]?.tags ?? [])]; const uniqueOptions = Array.from( new Map( diff --git a/src/Pages/Admin/question/formUtil.ts b/src/Pages/Admin/question/formUtil.ts index f8f43ed..5fc1bf3 100644 --- a/src/Pages/Admin/question/formUtil.ts +++ b/src/Pages/Admin/question/formUtil.ts @@ -123,6 +123,7 @@ export const getValidationSchemaBase = () => { export function processTags(DataToSend: any) { console.log(DataToSend?.tags); + console.log(DataToSend); const oldTags = DataToSend?.tags ?.map((item: any, index: number) => { diff --git a/src/api/helper/useAxios.ts b/src/api/helper/useAxios.ts index 69da961..cf4856c 100644 --- a/src/api/helper/useAxios.ts +++ b/src/api/helper/useAxios.ts @@ -32,6 +32,8 @@ function useAxios() { build_Axios.interceptors.response.use( function (response: any) { + console.log(response?.data); + const responseMsg = response?.data?.message; const method = response.config.method; @@ -53,7 +55,7 @@ function useAxios() { console.log(error?.response); const status = error?.request?.status; - const errorMsg = error?.response?.data?.message; + const errorMsg = error?.response?.data?.error; const errorField = error?.response?.data; const method = error.config.method; diff --git a/src/api/helper/useGetQuery.ts b/src/api/helper/useGetQuery.ts index eb3bffd..0c13d60 100644 --- a/src/api/helper/useGetQuery.ts +++ b/src/api/helper/useGetQuery.ts @@ -1,7 +1,5 @@ import { useQuery } from "react-query"; import useAxios from "./useAxios"; -import { useLocation } from "react-router-dom"; -import { PaginationParams } from "../utils/PaginationParams"; import { filterParams } from "../utils/filterParams"; import { useFilterStateState } from "../../zustand/Filter"; function useGetQuery( @@ -13,11 +11,9 @@ function useGetQuery( const axios = useAxios(); const { show, pagination, ...remainingParams } = params; - const location = useLocation(); - const { Filter ,setFilter } = useFilterStateState(); + const { Filter } = useFilterStateState(); const page = Filter?.page ; const per_page = Filter?.per_page ; - // const { per_page } = PaginationParams(location); const paramToSend = pagination From af89180d0755aa16b1894c9968b574464b792699 Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Tue, 17 Sep 2024 10:41:04 +0300 Subject: [PATCH 4/5] fix --- src/Components/CustomFields/SelectTag.tsx | 18 ++++++++---- src/Components/exercise/Header.tsx | 28 +++++++------------ src/Layout/Dashboard/Table/DataTable.tsx | 12 ++++++-- src/Layout/Dashboard/usePagination.ts | 4 --- src/Pages/Admin/Tags/field/SelectTag.tsx | 2 +- src/Pages/Admin/question/EditPage.tsx | 1 - .../Admin/question/Model/Field/Choices.tsx | 1 + src/Pages/Admin/question/Model/Malty/Form.tsx | 2 -- .../Malty/QuestionFIeld/QuestionFIeld.tsx | 1 - .../Model/Malty/Tags/MaltySelectTag.tsx | 10 +++++-- src/Pages/Admin/question/Page.tsx | 1 - src/Pages/Admin/question/formUtil.ts | 2 -- src/api/helper/useAxios.ts | 4 +-- src/api/helper/useDeleteMutation.ts | 22 ++++++++++++++- src/zustand/ObjectToEditState.ts | 2 +- src/zustand/TabState.ts | 12 ++++++++ 16 files changed, 77 insertions(+), 45 deletions(-) create mode 100644 src/zustand/TabState.ts diff --git a/src/Components/CustomFields/SelectTag.tsx b/src/Components/CustomFields/SelectTag.tsx index 182af50..96fc9db 100644 --- a/src/Components/CustomFields/SelectTag.tsx +++ b/src/Components/CustomFields/SelectTag.tsx @@ -12,7 +12,11 @@ const SelectTag: React.FC = () => { const [NewAdditionalData, setNewAdditionalData] = useState({}) const formik = useFormikContext(); const handleChange = (value: any,option:any) => { + console.log(option); + console.log(value); const newSelectedOption = option?.pop() + console.log(newSelectedOption); + const newObject = { id:newSelectedOption?.id, name:newSelectedOption?.name @@ -24,7 +28,8 @@ const SelectTag: React.FC = () => { }; const handleSearch = useDebounce((value: string) => { - + console.log(value,"value"); + setSearchValue(value); }); @@ -43,19 +48,23 @@ const SelectTag: React.FC = () => { }); const [t] = useTranslation(); + const initialData = formik?.values?.tags?.filter((item:any)=>{ + return item?.id + + }) ?? [] + + const options = data?.data ?? []; const additionalData = options.length < 1 && searchValue.length > 1 && !isLoading ? [{ id: searchValue, name: searchValue }] : []; - console.log(formik?.values?.tags,"formik?.values?.tags"); const value = formik?.values?.tags?.map((item: any) => item?.id ?? item) ?? []; - const AllOptions = [...options, ...additionalData,NewAdditionalData,...(formik?.values?.tags ?? {})]; - console.log(AllOptions,"AllOptions"); + const AllOptions = [...options, ...additionalData,NewAdditionalData, ...(initialData)]; const uniqueOptions = Array.from( new Map( @@ -65,7 +74,6 @@ const SelectTag: React.FC = () => { ).values() ); - console.log(uniqueOptions,"uniqueOptions"); return (
diff --git a/src/Components/exercise/Header.tsx b/src/Components/exercise/Header.tsx index 869dcdc..a595208 100644 --- a/src/Components/exercise/Header.tsx +++ b/src/Components/exercise/Header.tsx @@ -3,36 +3,34 @@ import React from "react"; import { useTranslation } from "react-i18next"; import { GoArrowSwitch } from "react-icons/go"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; -import { QUESTION_OBJECT_KEY } from "../../config/AppKey"; import { Popconfirm, Popover } from "antd"; import { CombinationKeyEnum } from "../../enums/CombinationKeyEnum"; import { PopconfirmProps } from "antd/lib"; const Header = () => { const [t] = useTranslation(); - const { values, setFieldValue, setValues } = useFormikContext(); + const { values, setValues } = useFormikContext(); const { isBseQuestion, setIsBseQuestion } = useObjectToEdit(); - const { setSavedQuestionData } = useObjectToEdit(); - console.log(values,"values"); - - const isEdited = ()=>{ if(isBseQuestion || values?.isBase === 1){ const content = !values?.content ; const content_image = !values?.content_image ; - const hint = !values?.hint ; - const Questions = values?.Questions?.length <= 1 && values?.Questions?.[0]?.answers?.length === 0 ; - if(content && content_image && hint && Questions) { + const Questions = values?.Questions?.length <= 1 && values?.Questions?.[0]?.answers?.length === 0 ; + const defaultQuestionHint = Object.keys(values?.Questions?.[0] ?? {})?.length <= 1 + + + + if(content && content_image && Questions && defaultQuestionHint) { return false } - }else{ + }else{ const content = !values?.content ; const content_image = !values?.content_image ; const hint = !values?.hint ; - const answers = !values?.answers ; + const answers = !(values?.answers?.length > 0) ; const tags = !(values?.tags?.length > 0) ; if(content && content_image && hint && answers && tags) { return false @@ -40,26 +38,20 @@ const Header = () => { } return true } - console.log(isEdited(),"isEdited"); const handleChange = () => { - setSavedQuestionData(null); - localStorage.removeItem(QUESTION_OBJECT_KEY); if (isBseQuestion) { setIsBseQuestion(false); setValues(null); - setFieldValue("isBase", 0); } else { setIsBseQuestion(true); setValues(null); - setFieldValue("isBase", 1); } }; const confirm: PopconfirmProps['onConfirm'] = (e) => { - console.log(e); setTimeout(() => { - handleChange() + handleChange() ; }, 500); }; diff --git a/src/Layout/Dashboard/Table/DataTable.tsx b/src/Layout/Dashboard/Table/DataTable.tsx index 8b51496..b8de0a3 100644 --- a/src/Layout/Dashboard/Table/DataTable.tsx +++ b/src/Layout/Dashboard/Table/DataTable.tsx @@ -1,6 +1,7 @@ -import React, { lazy, Suspense } from "react"; +import React, { lazy, Suspense, useEffect } from "react"; import { useAddKeyToData, Table, useTranslation, usePagination } from "."; import { DataTableProps } from "../../../types/Table"; +import { useDataTableState } from "../../../zustand/TabState"; const NotFoundLottie = React.lazy( () => import("../../../Components/Lottie/NotFound/NotFoundLottie"), ); @@ -17,12 +18,17 @@ const DataTable: React.FC = ({ const columns = useColumns(); const { pagination, handlePageChange } = usePagination(response?.data); const [t] = useTranslation(); - const getRowClassName = (record: any, index: number): string => { + const getRowClassName = (_record: any, index: number): string => { return index % 2 === 0 ? "even-row" : "odd-row"; }; const isRefetching = response?.isRefetching; const isLoading = response?.isLoading; - + const dataLength = data?.length ; + const {setDataTableLength} = useDataTableState() + useEffect(() => { + setDataTableLength(dataLength) + }, [dataLength]) + return (
{ - const navigate = useNavigate(); - const location = useLocation(); const { Filter ,setFilter } = useFilterStateState(); const [pagination, setPagination] = useState({ @@ -29,7 +26,6 @@ const usePagination = (data: Data) => { }, [data]); const handlePageChange = (page: number) => { - // navigate(`?page=${page}`); setFilter({ ...Filter, page:page diff --git a/src/Pages/Admin/Tags/field/SelectTag.tsx b/src/Pages/Admin/Tags/field/SelectTag.tsx index 5a307cb..3b276ed 100644 --- a/src/Pages/Admin/Tags/field/SelectTag.tsx +++ b/src/Pages/Admin/Tags/field/SelectTag.tsx @@ -11,7 +11,7 @@ const SelectTag: React.FC = () => { const [fieldValue, setFieldValue] = useState(""); const formik = useFormikContext(); const handleChange = (value: string[]) => { - console.log(value); + console.log(value,"value"); formik.setFieldValue("tags", value); setSearchValue(""); diff --git a/src/Pages/Admin/question/EditPage.tsx b/src/Pages/Admin/question/EditPage.tsx index 739d11f..10ecad9 100644 --- a/src/Pages/Admin/question/EditPage.tsx +++ b/src/Pages/Admin/question/EditPage.tsx @@ -58,7 +58,6 @@ const EditPage: React.FC = () => { const handleSubmit = (values: any) => { const DataToSend = structuredClone(values); setTagsSearch(null); - console.log(DataToSend); if (isBseQuestion) { const UpdateBseQuestion = { diff --git a/src/Pages/Admin/question/Model/Field/Choices.tsx b/src/Pages/Admin/question/Model/Field/Choices.tsx index dfe7d95..c3759ab 100644 --- a/src/Pages/Admin/question/Model/Field/Choices.tsx +++ b/src/Pages/Admin/question/Model/Field/Choices.tsx @@ -40,6 +40,7 @@ const Choices = () => { {formik?.values?.answers?.map((item: Choice, index: number) => { return (
diff --git a/src/Pages/Admin/question/Model/Malty/Form.tsx b/src/Pages/Admin/question/Model/Malty/Form.tsx index 34088d7..34d569c 100644 --- a/src/Pages/Admin/question/Model/Malty/Form.tsx +++ b/src/Pages/Admin/question/Model/Malty/Form.tsx @@ -22,8 +22,6 @@ const Form = () => { setSavedQuestionData(formik.values); }, [formik?.values]); - // console.log(formik?.errors); - const handleAddChoice = ( parent_index: number, fromKeyCombination: boolean = false, diff --git a/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx b/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx index 813d106..4b239f8 100644 --- a/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx +++ b/src/Pages/Admin/question/Model/Malty/QuestionFIeld/QuestionFIeld.tsx @@ -32,7 +32,6 @@ const QuestionFIeld = ({ index, data }: { index: number; data: Choice }) => { const values = formik.values.Questions?.[index] ; - console.log(values,"values"); const handelCanDeleteAnswers = ()=>{ const content = values?.content ; diff --git a/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx b/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx index cb3687e..571050f 100644 --- a/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx +++ b/src/Pages/Admin/question/Model/Malty/Tags/MaltySelectTag.tsx @@ -49,14 +49,20 @@ const MaltySelectTag = ({ parent_index }: { parent_index: number }) => { options.length < 1 && searchValue.length > 1 && !isLoading ? [{ id: searchValue, name: searchValue }] : []; - console.log(formik?.values?.Questions[parent_index]?.tags,"formik?.values?.Questions[parent_index]?.tags"); const value = formik?.values?.Questions[parent_index]?.tags?.map( (item: any) => item?.id ?? item, ) ?? []; - const AllOptions = [...options, ...additionalData,NewAdditionalData , ...(formik?.values?.Questions[parent_index]?.tags ?? [])]; + + const initialData = formik?.values?.Questions[parent_index]?.tags?.filter((item:any)=>{ + return item?.id + + }) ?? [] + + + const AllOptions = [...options, ...additionalData,NewAdditionalData , ...(initialData)]; const uniqueOptions = Array.from( new Map( diff --git a/src/Pages/Admin/question/Page.tsx b/src/Pages/Admin/question/Page.tsx index 31537df..c4685ec 100644 --- a/src/Pages/Admin/question/Page.tsx +++ b/src/Pages/Admin/question/Page.tsx @@ -51,7 +51,6 @@ const TableHeader = () => { {name:LessonName, path:`lesson/${lesson_id }`} ]); - return (
}> diff --git a/src/Pages/Admin/question/formUtil.ts b/src/Pages/Admin/question/formUtil.ts index 5fc1bf3..da9f3ee 100644 --- a/src/Pages/Admin/question/formUtil.ts +++ b/src/Pages/Admin/question/formUtil.ts @@ -1,6 +1,5 @@ import * as Yup from "yup"; import { Question } from "../../../types/Item"; -import { toast } from "react-toastify"; export const getInitialValues = (objectToEdit: Question): any => { const tags = objectToEdit?.tags?.map((item: any, index: number) => { @@ -60,7 +59,6 @@ export const getInitialValuesBase = (objectToEdit: Question): any => { } }) - console.log(newAnswers,"newAnswers"); return { ...item, diff --git a/src/api/helper/useAxios.ts b/src/api/helper/useAxios.ts index cf4856c..a269a92 100644 --- a/src/api/helper/useAxios.ts +++ b/src/api/helper/useAxios.ts @@ -31,9 +31,7 @@ function useAxios() { const build_Axios = buildAxios.build(); build_Axios.interceptors.response.use( - function (response: any) { - console.log(response?.data); - + function (response: any) { const responseMsg = response?.data?.message; const method = response.config.method; diff --git a/src/api/helper/useDeleteMutation.ts b/src/api/helper/useDeleteMutation.ts index d631b90..389b634 100644 --- a/src/api/helper/useDeleteMutation.ts +++ b/src/api/helper/useDeleteMutation.ts @@ -2,6 +2,8 @@ import { useMutation, UseMutationResult } from "react-query"; import useAxios from "./useAxios"; import { HEADER_KEY } from "../config"; import { AxiosResponse } from "../../types/Axios"; +import { useDataTableState } from "../../zustand/TabState"; +import { useFilterStateState } from "../../zustand/Filter"; type DataToSend = { id?: number | string | any; @@ -14,8 +16,12 @@ function useDeleteMutation( toast: boolean = true, ): UseMutationResult { const axios = useAxios(); + const {DataTableLength} = useDataTableState() + const { setFilter ,Filter } = useFilterStateState(); + const page = Filter?.page ; return useMutation( async (dataToSend) => { + const { data } = await axios.delete(url + `/` + dataToSend?.id, { headers: { [HEADER_KEY]: key, @@ -25,7 +31,21 @@ function useDeleteMutation( return data; }, - ); + { + onSuccess : (data) =>{ + if(DataTableLength === 1 && page > 1){ + setFilter( + { + ...Filter, + page: page - 1 + } + ) + } + } + } + + ) + } export default useDeleteMutation; diff --git a/src/zustand/ObjectToEditState.ts b/src/zustand/ObjectToEditState.ts index d973c95..b0c56c6 100644 --- a/src/zustand/ObjectToEditState.ts +++ b/src/zustand/ObjectToEditState.ts @@ -27,7 +27,7 @@ interface ModelState { } export const useObjectToEdit = create((set) => ({ - c: null, + objectToEdit: null, setObjectToEdit: (data) => set(() => ({ objectToEdit: data })), OldObjectToEdit: null, setOldObjectToEdit: (data) => set(() => ({ OldObjectToEdit: data })), diff --git a/src/zustand/TabState.ts b/src/zustand/TabState.ts new file mode 100644 index 0000000..acc7f1d --- /dev/null +++ b/src/zustand/TabState.ts @@ -0,0 +1,12 @@ +import { create } from "zustand"; + +interface DataTableState { + + DataTableLength: number; + setDataTableLength: (Key: number) => void; +} + +export const useDataTableState = create((set) => ({ + DataTableLength: 0, + setDataTableLength: (Key) => set((state) => ({ DataTableLength: Key })), +})); From 9409c7256de1f98dddaf4883a16c8c8f1a69bbad Mon Sep 17 00:00:00 2001 From: karimaldeen Date: Tue, 17 Sep 2024 11:38:06 +0300 Subject: [PATCH 5/5] add option --- .../ImageBoxField/ImageBoxField.tsx | 4 +- .../utils/ValidationField.scss | 1 - src/Components/exercise/Header.tsx | 35 ++++++++++++-- src/Pages/Admin/Grade/Table.tsx | 2 +- .../question/Model/Field/ChoiceFields.tsx | 7 ++- .../Admin/question/Model/Field/Choices.tsx | 1 + .../Model/Malty/ChoiceField/ChoiceFields.tsx | 8 +++- .../Model/Malty/ChoiceField/Choices.tsx | 3 +- src/Pages/Admin/question/Model/Malty/Form.tsx | 7 ++- src/Pages/Admin/question/Model/ModelForm.tsx | 6 ++- src/Styles/Layout/FilterLayout.scss | 2 +- src/Styles/Pages/exercise.scss | 47 +++++++++++++++++++ src/translate/ar.json | 4 +- src/zustand/ObjectToEditState.ts | 5 ++ 14 files changed, 116 insertions(+), 16 deletions(-) diff --git a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx index 574815d..89888fc 100644 --- a/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx +++ b/src/Components/CustomFields/ImageBoxField/ImageBoxField.tsx @@ -82,9 +82,9 @@ const ImageBoxField = ({ name }: any) => {
{imagePreview ? ( - Preview + Preview ) : ( - + )}
* { width: 100% !important; min-width: 150px; diff --git a/src/Components/exercise/Header.tsx b/src/Components/exercise/Header.tsx index a595208..325ee98 100644 --- a/src/Components/exercise/Header.tsx +++ b/src/Components/exercise/Header.tsx @@ -1,16 +1,18 @@ import { useFormikContext } from "formik"; -import React from "react"; +import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import { GoArrowSwitch } from "react-icons/go"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; -import { Popconfirm, Popover } from "antd"; +import { Checkbox, CheckboxProps, Popconfirm, Popover } from "antd"; import { CombinationKeyEnum } from "../../enums/CombinationKeyEnum"; import { PopconfirmProps } from "antd/lib"; +import { SettingFilled } from "@ant-design/icons"; const Header = () => { const [t] = useTranslation(); const { values, setValues } = useFormikContext(); - const { isBseQuestion, setIsBseQuestion } = useObjectToEdit(); + const { isBseQuestion, setIsBseQuestion,ShowHint,setShowHint } = useObjectToEdit(); + // const [Setting, setSetting] = useState(false) const isEdited = ()=>{ if(isBseQuestion || values?.isBase === 1){ @@ -70,6 +72,25 @@ const Header = () => { ); + + const handleOpenChange = (newOpen: boolean) => { + // setSetting(newOpen); + }; + const onChange: CheckboxProps['onChange'] = (e) => { + setShowHint(e.target.checked); + }; + + + const contentSetting = ( +
+ + + { t("header.show_hint")} + + +
+ ); + return (
@@ -82,6 +103,14 @@ const Header = () => {
+ +
+ + + + +
+ { isEdited() ? { sort_by }); - return ; + return ; }; export default App; diff --git a/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx b/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx index 89ea85a..5698eac 100644 --- a/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx +++ b/src/Pages/Admin/question/Model/Field/ChoiceFields.tsx @@ -9,11 +9,13 @@ import TextField from "./TextField"; import ImageBoxField from "../../../../../Components/CustomFields/ImageBoxField/ImageBoxField"; import { GoTrash } from "react-icons/go"; import { Popconfirm } from "antd"; +import { useObjectToEdit } from "../../../../../zustand/ObjectToEditState"; const ChoiceFields = ({ index, data }: { index: number; data: Choice }) => { const formik = useFormikContext(); const [t] = useTranslation(); + const { ShowHint } = useObjectToEdit(); const handleDeleteChoice = () => { console.log(index); @@ -98,8 +100,9 @@ const ChoiceFields = ({ index, data }: { index: number; data: Choice }) => {
+ {ShowHint && { showCount={false} autoSize={{ minRows: 2, maxRows: 10 }} /> + + }
); diff --git a/src/Pages/Admin/question/Model/Field/Choices.tsx b/src/Pages/Admin/question/Model/Field/Choices.tsx index c3759ab..c3d5148 100644 --- a/src/Pages/Admin/question/Model/Field/Choices.tsx +++ b/src/Pages/Admin/question/Model/Field/Choices.tsx @@ -41,6 +41,7 @@ const Choices = () => { return (
diff --git a/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx b/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx index a3f12a1..584f803 100644 --- a/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx +++ b/src/Pages/Admin/question/Model/Malty/ChoiceField/ChoiceFields.tsx @@ -10,6 +10,7 @@ import { toast } from "react-toastify"; import ImageBoxField from "../../../../../../Components/CustomFields/ImageBoxField/ImageBoxField"; import { GoTrash } from "react-icons/go"; import { Popconfirm } from "antd"; +import { useObjectToEdit } from "../../../../../../zustand/ObjectToEditState"; const ChoiceFields = ({ index, @@ -23,7 +24,7 @@ const ChoiceFields = ({ const formik = useFormikContext(); const [t] = useTranslation(); - + const { ShowHint } = useObjectToEdit(); const handleDeleteChoice = () => { const arrayLength = formik.values.Questions?.[parent_index].answers?.length; @@ -122,8 +123,9 @@ const ChoiceFields = ({
+ {ShowHint && + + }
); diff --git a/src/Pages/Admin/question/Model/Malty/ChoiceField/Choices.tsx b/src/Pages/Admin/question/Model/Malty/ChoiceField/Choices.tsx index af7cbf9..0e1fb95 100644 --- a/src/Pages/Admin/question/Model/Malty/ChoiceField/Choices.tsx +++ b/src/Pages/Admin/question/Model/Malty/ChoiceField/Choices.tsx @@ -52,7 +52,8 @@ const Choices = ({ parent_index }: { parent_index: number }) => { ).map((item: Choice, index: number) => { return (
{ const formik = useFormikContext(); - const { setSuccess, Success, setSavedQuestionData } = useObjectToEdit(); + const { setSuccess, Success, setSavedQuestionData ,ShowHint} = useObjectToEdit(); useEffect(() => { setSavedQuestionData(formik.values); @@ -116,7 +116,7 @@ const Form = () => { (item: Choice, parent_index: number) => { return (
-
+
{ )}
+ {ShowHint && { autoSize={{ minRows: 2, maxRows: 10 }} showCount={false} /> + + }
diff --git a/src/Pages/Admin/question/Model/ModelForm.tsx b/src/Pages/Admin/question/Model/ModelForm.tsx index 6de101f..25d0668 100644 --- a/src/Pages/Admin/question/Model/ModelForm.tsx +++ b/src/Pages/Admin/question/Model/ModelForm.tsx @@ -16,7 +16,7 @@ import { toast } from "react-toastify"; const Form = () => { const [t] = useTranslation(); const formik = useFormikContext(); - const { setSuccess, Success } = useObjectToEdit(); + const { setSuccess, Success,ShowHint } = useObjectToEdit(); const handleAddChoice = (fromKeyCombination: boolean = false) => { formik.setFieldValue("answers", [ @@ -68,7 +68,9 @@ const Form = () => {

)} +
+ {ShowHint && { autoSize={{ minRows: 2, maxRows: 10 }} /> + + }
diff --git a/src/Styles/Layout/FilterLayout.scss b/src/Styles/Layout/FilterLayout.scss index 356d055..b138b96 100644 --- a/src/Styles/Layout/FilterLayout.scss +++ b/src/Styles/Layout/FilterLayout.scss @@ -1,7 +1,7 @@ .filter_header { padding: 20px 20px; border-radius: 10px 10px 0 0; - box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.1); + box-shadow: 0px 0px 32px 2px #080F3414; > div { display: flex; diff --git a/src/Styles/Pages/exercise.scss b/src/Styles/Pages/exercise.scss index 12f1087..6ebdd9e 100644 --- a/src/Styles/Pages/exercise.scss +++ b/src/Styles/Pages/exercise.scss @@ -133,6 +133,7 @@ .exercise_add_header { display: flex; + gap: 30px; justify-content: space-between; width: 100%; padding: 14px 20px; @@ -142,6 +143,7 @@ box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1); div{ margin-left: 25px; + display: flex; } img { cursor: pointer; @@ -262,4 +264,49 @@ font-weight: bold; font-size: 19px; } +} + + +.Choices{ + padding-inline: 20px; + .textarea_exercise,.hint{ + width: calc(50vw - 10px) !important; + } + .ValidationField{ + + .text{ + font-size: 14px; + } + } +} + +.QuestionFIeld{ + padding-inline: 10px; + .textarea_exercise{ + width: calc(50vw - 10px) !important; + + } + + .ValidationField{ + .text{ + font-size: 17px; + } + } +} + +.Choices.ChoicesMalty{ + .textarea_exercise,.hint{ + width: calc(50vw - 20px) !important; + } + .ValidationField{ + + .text{ + font-size: 14px; + } + } +} + + +.question_header_setting{ + margin-inline: 40px; } \ No newline at end of file diff --git a/src/translate/ar.json b/src/translate/ar.json index b8c0203..a92114c 100644 --- a/src/translate/ar.json +++ b/src/translate/ar.json @@ -138,7 +138,9 @@ "edit": "تعديل", "change": "تغيير", "role_list": "قائمة الأدوار", - "managers":"مدراء" + "managers":"مدراء", + "hide_hint":"اخفاء الشرح", + "show_hint":"عرض الشرح" }, "columns": { "id": "الرقم التعريفي", diff --git a/src/zustand/ObjectToEditState.ts b/src/zustand/ObjectToEditState.ts index b0c56c6..76bdd64 100644 --- a/src/zustand/ObjectToEditState.ts +++ b/src/zustand/ObjectToEditState.ts @@ -24,6 +24,9 @@ interface ModelState { SavedQuestionData: any; setSavedQuestionData: (data: any) => void; + + ShowHint: any; + setShowHint: (data: any) => void; } export const useObjectToEdit = create((set) => ({ @@ -49,4 +52,6 @@ export const useObjectToEdit = create((set) => ({ setDeletedQuestions: (data) => set(() => ({ DeletedQuestions: data })), SavedQuestionData: [], setSavedQuestionData: (data) => set(() => ({ SavedQuestionData: data })), + ShowHint: true, + setShowHint: (data) => set(() => ({ ShowHint: data })), }));