From 5a295693c164157e5beb78c9988cb46975f27cd1 Mon Sep 17 00:00:00 2001 From: Moaz Dawalibi Date: Mon, 12 Aug 2024 15:55:01 +0300 Subject: [PATCH] fixess --- src/Layout/Dashboard/DeleteModels.tsx | 40 ++++----- src/Pages/Tags/Model/Add.tsx | 35 -------- src/Pages/Tags/Model/AddModel.tsx | 69 ++++----------- src/Pages/Tags/Model/Delete.tsx | 94 -------------------- src/Pages/Tags/Model/Edit.tsx | 24 ----- src/Pages/Tags/Model/EditModel.tsx | 77 +++++----------- src/Pages/Tags/Page.tsx | 14 +-- src/Pages/Tags/useTableColumns.tsx | 62 ++++--------- src/Pages/Unit/Model/AddModel.tsx | 72 ++++----------- src/Pages/Unit/Model/AddUnit.tsx | 27 ------ src/Pages/Unit/Model/Delete.tsx | 98 --------------------- src/Pages/Unit/Model/EditModel.tsx | 80 +++++------------ src/Pages/Unit/Model/EditUnit.tsx | 27 ------ src/Pages/Unit/Page.tsx | 12 ++- src/Pages/Unit/useTableColumns.tsx | 54 +++--------- src/Pages/lesson/Model/Add.tsx | 28 ------ src/Pages/lesson/Model/AddModel.tsx | 69 ++++----------- src/Pages/lesson/Model/Delete.tsx | 97 -------------------- src/Pages/lesson/Model/Edit.tsx | 16 ---- src/Pages/lesson/Model/EditModel.tsx | 59 +++---------- src/Pages/lesson/Page.tsx | 10 ++- src/Pages/lesson/useTableColumns.tsx | 62 +++---------- src/Pages/question/AddPage.tsx | 4 +- src/Pages/question/EditPage.tsx | 17 +--- src/Pages/question/Model/Add.tsx | 81 ----------------- src/Pages/question/Model/Delete.tsx | 95 -------------------- src/Pages/question/Model/Edit.tsx | 81 ----------------- src/Pages/question/Page.tsx | 12 ++- src/Pages/question/useTableColumns.tsx | 52 +++-------- src/Pages/subject/Model/Add.tsx | 34 ------- src/Pages/subject/Model/AddModel.tsx | 79 ++++------------- src/Pages/subject/Model/Delete.tsx | 93 ------------------- src/Pages/subject/Model/Edit.tsx | 33 ------- src/Pages/subject/Model/EditModel.tsx | 79 ++++------------- src/Pages/subject/Table/Page.tsx | 11 ++- src/Pages/subject/Table/useTableColumns.tsx | 66 ++++---------- src/Styles/App/classNames.scss | 31 +++++++ src/api/config.ts | 4 +- src/api/helper/useAddMutation.ts | 5 +- src/translate/ar.json | 6 +- src/translate/en.json | 3 +- 41 files changed, 318 insertions(+), 1594 deletions(-) delete mode 100644 src/Pages/Tags/Model/Add.tsx delete mode 100644 src/Pages/Tags/Model/Delete.tsx delete mode 100644 src/Pages/Tags/Model/Edit.tsx delete mode 100644 src/Pages/Unit/Model/AddUnit.tsx delete mode 100644 src/Pages/Unit/Model/Delete.tsx delete mode 100644 src/Pages/Unit/Model/EditUnit.tsx delete mode 100644 src/Pages/lesson/Model/Add.tsx delete mode 100644 src/Pages/lesson/Model/Delete.tsx delete mode 100644 src/Pages/lesson/Model/Edit.tsx delete mode 100644 src/Pages/question/Model/Add.tsx delete mode 100644 src/Pages/question/Model/Delete.tsx delete mode 100644 src/Pages/question/Model/Edit.tsx delete mode 100644 src/Pages/subject/Model/Add.tsx delete mode 100644 src/Pages/subject/Model/Delete.tsx delete mode 100644 src/Pages/subject/Model/Edit.tsx diff --git a/src/Layout/Dashboard/DeleteModels.tsx b/src/Layout/Dashboard/DeleteModels.tsx index 18b8a2d..f28ffdd 100644 --- a/src/Layout/Dashboard/DeleteModels.tsx +++ b/src/Layout/Dashboard/DeleteModels.tsx @@ -1,22 +1,20 @@ import React, { useEffect, useState } from "react"; import { Input, Modal, Spin } from "antd"; import { useModalState } from "../../zustand/Modal"; -import { ModalEnum } from "../../enums/Model"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; import { useTranslation } from "react-i18next"; +import { useNavigate } from "react-router-dom"; interface ModalFormProps { - modalType: ModalEnum; - objectType: string; deleteMutation: any; - objectValue: string; + ModelEnum: any; + isNavigate?: boolean; } const DeleteModels: React.FC = ({ - modalType, - objectType, deleteMutation, - objectValue, + ModelEnum, + isNavigate = false, }) => { const { isOpen, setIsOpen } = useModalState((state) => state); const [inputValue, setInputValue] = useState(""); @@ -24,10 +22,16 @@ const DeleteModels: React.FC = ({ const { mutate, isLoading, isSuccess } = deleteMutation; const { objectToEdit, setObjectToEdit } = useObjectToEdit(); + const iaDisabled = + Number(objectToEdit?.id) !== Number(inputValue) || isLoading; + const navigate = useNavigate(); useEffect(() => { if (isSuccess) { setIsOpen(""); setInputValue(""); + if (isNavigate) { + navigate(-1); + } } }, [isSuccess, setIsOpen]); @@ -48,7 +52,7 @@ const DeleteModels: React.FC = ({ }; const handleKeyPress = (e: React.KeyboardEvent) => { - if (e.key === "Enter" && objectToEdit?.[objectValue] === inputValue) { + if (e.key === "Enter" && !iaDisabled) { handleSubmit(); } }; @@ -60,24 +64,22 @@ const DeleteModels: React.FC = ({ centered width={"40vw"} footer={null} - open={isOpen === modalType} + open={isOpen === ModelEnum} onCancel={handleCancel} > -
- {t("practical.delete")} {t(`models.${objectType}`)} -
+
{t("practical.delete_this_item")}
= ({
{t("practical.cancel")}
-
-
- - - ); -}; - -export default ModalForm; diff --git a/src/Pages/Tags/Model/Edit.tsx b/src/Pages/Tags/Model/Edit.tsx deleted file mode 100644 index 98042d3..0000000 --- a/src/Pages/Tags/Model/Edit.tsx +++ /dev/null @@ -1,24 +0,0 @@ -import { Col, Row } from "reactstrap"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; -import { useEffect } from "react"; -import DynamicTags from "../synonyms/DynamicTags"; - -const Form = () => { - - return ( - - - - -
- - - -
- - ); -}; - -export default Form; diff --git a/src/Pages/Tags/Model/EditModel.tsx b/src/Pages/Tags/Model/EditModel.tsx index e2e0da8..1837a99 100644 --- a/src/Pages/Tags/Model/EditModel.tsx +++ b/src/Pages/Tags/Model/EditModel.tsx @@ -1,69 +1,36 @@ -import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./Edit"; +import React from "react"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import ModelForm from "./ModelForm"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; import { useUpdateTag } from "../../../api/tags"; -import { useTranslation } from "react-i18next"; -import ModelButtons from "../../../Components/models/ModelButtons"; -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - const { objectToEdit, setObjectToEdit } = useObjectToEdit( - (state) => state, - ); - const { mutate, isSuccess, isLoading } = useUpdateTag(); - // console.log(objectToEdit,"objectToEdit"); +const EditModel: React.FC = () => { + const { mutate, status } = useUpdateTag(); + const { objectToEdit } = useObjectToEdit((state) => state); + const handleSubmit = (values: any) => { - // const contactInformationJson = JSON.stringify({ - // phone_number: values?.number - // }); mutate({ ...values }); }; - const handleCancel = () => { - setIsOpen(""); - setObjectToEdit({}); - }; - - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - } - }, [setIsOpen, isSuccess]); - const [t] = useTranslation(); return ( - - {objectToEdit && ( - -
- {" "} - {t("practical.edit")} {t("practical.details")} {t("models.tags")}{" "} -
-
- - - -
- - )} - + <> + + + + ); }; -export default ModalForm; +export default EditModel; diff --git a/src/Pages/Tags/Page.tsx b/src/Pages/Tags/Page.tsx index b5c51f8..72645ef 100644 --- a/src/Pages/Tags/Page.tsx +++ b/src/Pages/Tags/Page.tsx @@ -1,18 +1,16 @@ - import { FaPlus } from "react-icons/fa"; - +import { FaPlus } from "react-icons/fa"; import useModalHandler from "../../utils/useModalHandler"; import { ModalEnum } from "../../enums/Model"; - -// import useSetPageTitle from "../../Hooks/useSetPageTitle"; import { useTranslation } from "react-i18next"; import { lazy, Suspense } from 'react'; import { Spin } from "antd"; import { canAddTags } from "../../utils/hasAbilityFn"; import useSetPageTitle from "../../Hooks/useSetPageTitle"; +import { useDeleteTag } from "../../api/tags"; const Table = lazy(() => import('./Table')); const AddModalForm = lazy(() => import('./Model/AddModel')); const EditModalForm = lazy(() => import('./Model/EditModel')); -const DeleteModalForm = lazy(() => import('./Model/Delete')); +const DeleteModels = lazy(() => import('../../Layout/Dashboard/DeleteModels')); const SearchField = lazy(() => import('../../Components/DataTable/SearchField')); @@ -22,6 +20,7 @@ const TableHeader = () => { useSetPageTitle( t(`page_header.tags`), ); + const deleteMutation = useDeleteTag(); return (
@@ -44,7 +43,10 @@ const TableHeader = () => { - + diff --git a/src/Pages/Tags/useTableColumns.tsx b/src/Pages/Tags/useTableColumns.tsx index 5a775aa..abd2395 100644 --- a/src/Pages/Tags/useTableColumns.tsx +++ b/src/Pages/Tags/useTableColumns.tsx @@ -1,25 +1,26 @@ -import { Space, TableColumnsType, Tooltip } from "antd"; +import { TableColumnsType } from "antd"; import { tags } from "../../types/Item"; - import { ModalEnum } from "../../enums/Model"; -import { MdOutlineEdit } from "react-icons/md"; -import { RiDeleteBin6Fill } from "react-icons/ri"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; import { useModalState } from "../../zustand/Modal"; import { useTranslation } from "react-i18next"; import { canDeleteTags, canEditTags } from "../../utils/hasAbilityFn"; +import ActionButtons from "../../Components/Table/ActionButtons"; export const useColumns = () => { + const [t] = useTranslation(); + const { setIsOpen } = useModalState((state) => state); const { setObjectToEdit } = useObjectToEdit((state) => state); - const handelDelete = (record: any) => { + const handelDelete = (record:any) => { setObjectToEdit(record); setIsOpen(ModalEnum?.TAGS_DELETE); }; - const [t] = useTranslation(); - - + const handleEdit = (record:any) => { + setObjectToEdit(record); + setIsOpen(ModalEnum?.TAGS_EDIT); + }; const columns: TableColumnsType = [ { @@ -40,44 +41,15 @@ export const useColumns = () => { key: "actions", align: "end", width: "25vw", - render: (text, record, index) => { - const handleEdit = (record: any) => { - // console.log(record,"record"); - setObjectToEdit(record); - setIsOpen(ModalEnum?.TAGS_EDIT); - }; - - const className = - index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction"; - + render: (_text, record, index) => { return ( - - {canEditTags && ( - - handleEdit(record)}> - - - - - )} - - {canDeleteTags && ( - handelDelete(record)} - size={22} - style={{ color: "#C11313" }} - /> - )} - + handelDelete(record)} + onEdit={() => handleEdit(record)} + /> ); }, }, diff --git a/src/Pages/Unit/Model/AddModel.tsx b/src/Pages/Unit/Model/AddModel.tsx index 5a41c6b..6961659 100644 --- a/src/Pages/Unit/Model/AddModel.tsx +++ b/src/Pages/Unit/Model/AddModel.tsx @@ -1,76 +1,36 @@ -import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./AddUnit"; +import React from "react"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; +import ModelForm from "./ModelForm"; import { useAddUnit } from "../../../api/unit"; import { useParams } from "react-router-dom"; -import { useTranslation } from "react-i18next"; -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - - const { mutate, isSuccess, isLoading } = useAddUnit(); +const AddModel: React.FC = () => { + const { mutate, status } = useAddUnit(); const { subject_id } = useParams(); - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - } - }, [setIsOpen, isSuccess]); - const handleSubmit = (values: any) => { - // console.log(values,"values"); mutate({ ...values, subject_id: subject_id, }); }; - - const handleCancel = () => { - setIsOpen(""); - }; - const [t] = useTranslation(); return ( <> - - -
- {" "} - {t("practical.add")} {t("models.unit")}{" "} -
-
- -
-
{t("practical.back")}
- -
-
- - + + ); }; -export default ModalForm; +export default AddModel; diff --git a/src/Pages/Unit/Model/AddUnit.tsx b/src/Pages/Unit/Model/AddUnit.tsx deleted file mode 100644 index 7373ac7..0000000 --- a/src/Pages/Unit/Model/AddUnit.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { Term_Select } from "../../../types/App"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; - -const Form = () => { - const formik = useFormikContext(); - const { isOpen } = useModalState((state) => state); - - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - formik.resetForm(); - } - }, [isOpen]); - return ( - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/Unit/Model/Delete.tsx b/src/Pages/Unit/Model/Delete.tsx deleted file mode 100644 index d42217c..0000000 --- a/src/Pages/Unit/Model/Delete.tsx +++ /dev/null @@ -1,98 +0,0 @@ -import React, { useEffect, useState } from "react"; -import { Input, Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import { ModalEnum } from "../../../enums/Model"; -import { useDeleteUnit } from "../../../api/unit"; -import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; -import { useQueryClient } from "react-query"; -import { useTranslation } from "react-i18next"; - -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - const [inputValue, setInputValue] = useState(""); - - const { mutate, isSuccess, isLoading } = useDeleteUnit(); - const { objectToEdit } = useObjectToEdit((state) => state); - const [t] = useTranslation(); - const handleSubmit = () => { - mutate({ - id: Number(objectToEdit?.id), - }); - }; - - const handleCancel = () => { - setInputValue(""); - setIsOpen(""); - }; - const queryClient = useQueryClient(); - - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - setInputValue(""); - queryClient.invalidateQueries(["unit"]); - } - }, [setIsOpen, isSuccess, queryClient]); - - const handleChange = (e: React.ChangeEvent) => { - // Step 2: Handle changes to the input field - setInputValue(e.target.value); - }; - - return ( - <> - -
- {" "} - {t("practical.delete")} {objectToEdit?.name}{" "} -
- -
-
- - - -
- -
-
{t("practical.cancel")}
- -
-
- - - ); -}; - -export default ModalForm; diff --git a/src/Pages/Unit/Model/EditModel.tsx b/src/Pages/Unit/Model/EditModel.tsx index 1223eb9..b4a8d96 100644 --- a/src/Pages/Unit/Model/EditModel.tsx +++ b/src/Pages/Unit/Model/EditModel.tsx @@ -1,82 +1,42 @@ -import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./AddUnit"; +import React from "react"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; -import { useUpdateUnit } from "../../../api/unit"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import ModelForm from "./ModelForm"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; +import { useUpdateTag } from "../../../api/tags"; +import { useUpdateUnit } from "../../../api/unit"; import { useParams } from "react-router-dom"; -import { useTranslation } from "react-i18next"; -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); +const EditModel: React.FC = () => { + const { mutate, status } = useUpdateUnit(); + const { objectToEdit } = useObjectToEdit((state) => state); - const { mutate, isSuccess, isLoading } = useUpdateUnit(); - const { objectToEdit, setObjectToEdit } = useObjectToEdit(); - - // console.log(objectToEdit,"objectToEdit"); const { subject_id } = useParams(); - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - } - }, [setIsOpen, isSuccess]); - const handleSubmit = (values: any) => { - // console.log(values,"values"); mutate({ ...values, subject_id: subject_id, }); }; - const handleCancel = () => { - setIsOpen(""); - }; - - const [t] = useTranslation(); return ( <> - - -
- {" "} - {t("practical.edit")} - {t("models.unit")}{" "} -
-
- -
-
{t("practical.cancel")}
- -
-
- - + + ); }; -export default ModalForm; +export default EditModel; diff --git a/src/Pages/Unit/Model/EditUnit.tsx b/src/Pages/Unit/Model/EditUnit.tsx deleted file mode 100644 index 7373ac7..0000000 --- a/src/Pages/Unit/Model/EditUnit.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { Term_Select } from "../../../types/App"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; - -const Form = () => { - const formik = useFormikContext(); - const { isOpen } = useModalState((state) => state); - - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - formik.resetForm(); - } - }, [isOpen]); - return ( - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/Unit/Page.tsx b/src/Pages/Unit/Page.tsx index f36c462..de96b60 100644 --- a/src/Pages/Unit/Page.tsx +++ b/src/Pages/Unit/Page.tsx @@ -5,15 +5,18 @@ import { useParams } from "react-router-dom"; import { ParamsEnum } from "../../enums/params"; import { useGetAllSubject } from "../../api/subject"; import useSetPageTitle from "../../Hooks/useSetPageTitle"; +import { ModalEnum } from "../../enums/Model"; +import { useDeleteUnit } from "../../api/unit"; const Table = lazy(() => import('./Table')); const AddModalForm = lazy(() => import('./Model/AddModel')); const EditModalForm = lazy(() => import('./Model/EditModel')); -const DeleteModels = lazy(() => import('./Model/Delete')); +const DeleteModels = lazy(() => import('../../Layout/Dashboard/DeleteModels')); const TableHeader = () => { const [t] = useTranslation(); - + const deleteMutation = useDeleteUnit(); + const { subject_id} = useParams(); const { data: Subject } = useGetAllSubject({ @@ -41,7 +44,10 @@ const TableHeader = () => {
- + diff --git a/src/Pages/Unit/useTableColumns.tsx b/src/Pages/Unit/useTableColumns.tsx index 6f04938..f5a650e 100644 --- a/src/Pages/Unit/useTableColumns.tsx +++ b/src/Pages/Unit/useTableColumns.tsx @@ -11,6 +11,7 @@ import { ABILITIES_ENUM } from "../../enums/abilities"; import { BsEyeFill } from "react-icons/bs"; import { useNavigate } from "react-router-dom"; import { canAddUnit, canDeleteUnit, canEditUnit, canShowUnit } from "../../utils/hasAbilityFn"; +import ActionButtons from "../../Components/Table/ActionButtons"; export const useColumns = () => { const { handel_open_model } = useModalHandler(); @@ -22,8 +23,6 @@ export const useColumns = () => { navigate(`${ABILITIES_ENUM?.UNIT}/${record?.id}`); }; - - const handelDelete = (data: any) => { setObjectToEdit(data); handel_open_model(ModalEnum?.UNIT_DELETE); @@ -70,48 +69,21 @@ export const useColumns = () => { ) : ( "" ), + key: "actions", align: "end", - className: "custom_add_button_column", - render: (text, record, index) => { - const className = - index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction"; - + width: "25vw", + render: (_text, record, index) => { return ( - - {canEditUnit && ( - - handleEdit(record)}> - - - - )} - {canDeleteUnit && ( - handelDelete(record)} - size={22} - style={{ color: "#C11313" }} - /> - )} - {canShowUnit && ( - - handelShow(record)} - size={22} - style={{ color: "green" }} - /> - - )} - - + handelDelete(record)} + onEdit={() => handleEdit(record)} + onShow={() => handelShow(record)} + /> ); }, }, diff --git a/src/Pages/lesson/Model/Add.tsx b/src/Pages/lesson/Model/Add.tsx deleted file mode 100644 index 6337d8c..0000000 --- a/src/Pages/lesson/Model/Add.tsx +++ /dev/null @@ -1,28 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; - -const Form = () => { - const formik = useFormikContext(); - const { isOpen } = useModalState((state) => state); - - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - formik.resetForm(); - } - }, [isOpen]); - - return ( - - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/lesson/Model/AddModel.tsx b/src/Pages/lesson/Model/AddModel.tsx index 468af21..06fd995 100644 --- a/src/Pages/lesson/Model/AddModel.tsx +++ b/src/Pages/lesson/Model/AddModel.tsx @@ -1,24 +1,20 @@ import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./Add"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; -import { useAddLesson } from "../../../api/lesson"; -import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; +import ModelForm from "./ModelForm"; import { useQueryClient } from "react-query"; -import { useTranslation } from "react-i18next"; +import { useAddLesson } from "../../../api/lesson"; import { useParams } from "react-router-dom"; import { ParamsEnum } from "../../../enums/params"; +import { useModalState } from "../../../zustand/Modal"; + +const AddModel: React.FC = () => { -const ModalForm: React.FC = () => { const { isOpen, setIsOpen } = useModalState((state) => state); - const { objectToEdit, setObjectToEdit } = useObjectToEdit(); - const queryClient = useQueryClient(); - - const { mutate, isSuccess, isLoading } = useAddLesson(); + const { mutate, isSuccess, status } = useAddLesson(); const {unit_id} = useParams() useEffect(() => { @@ -32,49 +28,20 @@ const ModalForm: React.FC = () => { mutate({ ...values, unit_id: unit_id }); }; - const handleCancel = () => { - setIsOpen(""); - }; - - const [t] = useTranslation(); return ( <> - - -
- {" "} - {t("practical.add")} {t("models.lesson")}{" "} -
-
- -
-
{t("practical.back")}
- -
-
- - + + ); }; -export default ModalForm; +export default AddModel; diff --git a/src/Pages/lesson/Model/Delete.tsx b/src/Pages/lesson/Model/Delete.tsx deleted file mode 100644 index c9aa56a..0000000 --- a/src/Pages/lesson/Model/Delete.tsx +++ /dev/null @@ -1,97 +0,0 @@ -import React, { useEffect, useState } from "react"; -import { Input, Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import { ModalEnum } from "../../../enums/Model"; -import { useDeleteLesson } from "../../../api/lesson"; -import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; -import { useQueryClient } from "react-query"; -import { useTranslation } from "react-i18next"; - -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - const [inputValue, setInputValue] = useState(""); - - const { mutate, isSuccess, isLoading } = useDeleteLesson(); - const { objectToEdit,setObjectToEdit } = useObjectToEdit((state) => state); - const queryClient = useQueryClient(); - const [t] = useTranslation(); - const handleSubmit = () => { - mutate({ - id: Number(objectToEdit?.id), - }); - }; - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - setInputValue(""); - - queryClient.invalidateQueries(["unit"]); - } - }, [setIsOpen, isSuccess, queryClient]); - - const handleCancel = () => { - setInputValue(""); - setIsOpen(""); - setObjectToEdit({}); - }; - - const handleChange = (e: React.ChangeEvent) => { - setInputValue(e.target.value); - }; - - return ( - <> - -
- {" "} - {t("practical.delete")} {objectToEdit?.name}{" "} -
- -
-
- - - -
- -
-
{t("practical.cancel")}
- -
-
- - - ); -}; - -export default ModalForm; diff --git a/src/Pages/lesson/Model/Edit.tsx b/src/Pages/lesson/Model/Edit.tsx deleted file mode 100644 index 3baff1d..0000000 --- a/src/Pages/lesson/Model/Edit.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; - -const Form = () => { - return ( - - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/lesson/Model/EditModel.tsx b/src/Pages/lesson/Model/EditModel.tsx index ac61dc6..a57a753 100644 --- a/src/Pages/lesson/Model/EditModel.tsx +++ b/src/Pages/lesson/Model/EditModel.tsx @@ -1,25 +1,23 @@ import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./Edit"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; import { useUpdateLesson } from "../../../api/lesson"; import { useQueryClient } from "react-query"; import { useTranslation } from "react-i18next"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; +import ModelForm from "./ModelForm"; const ModalForm: React.FC = () => { const { isOpen, setIsOpen } = useModalState((state) => state); - const { mutate, isSuccess, isLoading } = useUpdateLesson(); + const { mutate, isSuccess, status } = useUpdateLesson(); const { objectToEdit, setObjectToEdit } = useObjectToEdit(); const queryClient = useQueryClient(); - // console.log(objectToEdit,"objectToEdit"); - useEffect(() => { if (isSuccess) { queryClient.invalidateQueries(["unit"]); @@ -29,54 +27,25 @@ const ModalForm: React.FC = () => { }, [setIsOpen, isSuccess, queryClient]); const handleSubmit = (values: any) => { - // console.log(values,"values"); mutate({ id: values?.id, name: values?.name, }); }; - const handleCancel = () => { - setIsOpen(""); - }; - - const [t] = useTranslation(); return ( <> - - -
- {" "} - {t("practical.edit")} {t("practical.details")} {t("models.lesson")}{" "} -
-
- -
-
{t("practical.back")}
- -
-
- - + + ); }; diff --git a/src/Pages/lesson/Page.tsx b/src/Pages/lesson/Page.tsx index a250568..1c65f90 100644 --- a/src/Pages/lesson/Page.tsx +++ b/src/Pages/lesson/Page.tsx @@ -5,14 +5,17 @@ import useSetPageTitle from "../../Hooks/useSetPageTitle"; import { useParams } from "react-router-dom"; import { ParamsEnum } from "../../enums/params"; import { useGetAllUnit } from "../../api/unit"; +import { ModalEnum } from "../../enums/Model"; +import { useDeleteLesson } from "../../api/lesson"; const Table = lazy(() => import('./Table')); const AddModalForm = lazy(() => import('./Model/AddModel')); const EditModalForm = lazy(() => import('./Model/EditModel')); -const DeleteModels = lazy(() => import('./Model/Delete')); +const DeleteModels = lazy(() => import('../../Layout/Dashboard/DeleteModels')); const TableHeader = () => { const [t] = useTranslation(); + const deleteMutation = useDeleteLesson(); const { unit_id } = useParams(); const { data: unit } = useGetAllUnit({ show: unit_id }); @@ -45,7 +48,10 @@ const TableHeader = () => {
- + diff --git a/src/Pages/lesson/useTableColumns.tsx b/src/Pages/lesson/useTableColumns.tsx index ad84bb7..f1df564 100644 --- a/src/Pages/lesson/useTableColumns.tsx +++ b/src/Pages/lesson/useTableColumns.tsx @@ -1,20 +1,14 @@ -import { Space, TableColumnsType, Tooltip } from "antd"; +import { TableColumnsType } from "antd"; import { Lesson } from "../../types/Item"; import { FaPlus } from "react-icons/fa"; - import useModalHandler from "../../utils/useModalHandler"; import { ModalEnum } from "../../enums/Model"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; -import { RiDeleteBin6Fill } from "react-icons/ri"; -import { MdOutlineEdit } from "react-icons/md"; -import { findLabelByValue } from "../../utils/findLabelByValue"; import { useTranslation } from "react-i18next"; -import { hasAbility } from "../../utils/hasAbility"; import { ABILITIES_ENUM, ABILITIES_VALUES_ENUM } from "../../enums/abilities"; -import { formatNumber } from "../../utils/formatNumber"; -import { BsEyeFill } from "react-icons/bs"; import { useNavigate } from "react-router-dom"; import { canAddLesson, canDeleteLesson, canEditLesson, canShowLesson } from "../../utils/hasAbilityFn"; +import ActionButtons from "../../Components/Table/ActionButtons"; export const useColumns = () => { const { handel_open_model } = useModalHandler(); @@ -26,8 +20,6 @@ export const useColumns = () => { navigate(`${ABILITIES_ENUM.LESSON}/${record?.id}`); }; - - const handelDelete = (data: any) => { setObjectToEdit(data); handel_open_model(ModalEnum?.LESSON_DELETE); @@ -67,46 +59,18 @@ export const useColumns = () => { ), key: "actions", align: "end", - className: "custom_add_button_column", - render: (text, record, index) => { - const className = - index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction"; - + width: "25vw", + render: (_text, record, index) => { return ( - - {canEditLesson && ( - - handleEdit(record)}> - - - - )} - {canDeleteLesson && ( - handelDelete(record)} - size={22} - style={{ color: "#C11313" }} - /> - )} - {canShowLesson && ( - - handelShow(record)} - size={22} - style={{ color: "green" }} - /> - - )} - - + handelDelete(record)} + onEdit={() => handleEdit(record)} + onShow={() => handelShow(record)} + /> ); }, }, diff --git a/src/Pages/question/AddPage.tsx b/src/Pages/question/AddPage.tsx index 0618ded..f538935 100644 --- a/src/Pages/question/AddPage.tsx +++ b/src/Pages/question/AddPage.tsx @@ -11,7 +11,7 @@ import { useObjectToEdit } from "../../zustand/ObjectToEditState"; import Header from "../../Components/exercise/Header"; import { Question } from "../../types/Item"; import BaseForm from './Model/Malty/Add' -import Form from './Model/Add' +import ModelForm from './Model/ModelForm' const AcceptModal = lazy(() => import('./Model/AcceptModal')); import { useModalState } from "../../zustand/Modal"; @@ -193,7 +193,7 @@ const AddPage: React.FC = () => {
-
+
{t("practical.back")}
diff --git a/src/Pages/question/EditPage.tsx b/src/Pages/question/EditPage.tsx index 333c94a..dcf5ac9 100644 --- a/src/Pages/question/EditPage.tsx +++ b/src/Pages/question/EditPage.tsx @@ -1,16 +1,15 @@ import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; +import { Spin } from "antd"; import FormikForm from "../../Layout/Dashboard/FormikFormModel"; import { getInitialValues, getValidationSchema ,getInitialValuesBase, getValidationSchemaBase, processTags} from "./Model/formUtil"; import { useAddQuestion, useDeleteQuestion, useGetAllQuestion, useUpdateQuestion } from "../../api/Question"; -import { useQueryClient } from "react-query"; import { useTranslation } from "react-i18next"; import { useNavigate, useParams } from "react-router-dom"; import { ParamsEnum } from "../../enums/params"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; import { removeStringKeys } from "../../utils/removeStringKeys"; import SpinContainer from "../../Components/Layout/SpinContainer"; -import Form from './Model/Edit' +import ModelForm from './Model/ModelForm' import BaseForm from './Model/Malty/Edit' import { Question } from "../../types/Item"; import { toast } from "react-toastify"; @@ -155,12 +154,7 @@ const EditPage: React.FC = () => { const newQuestionOptions = [] as any; updatedObject?.QuestionOptions?.forEach((item:any) => { - if (item?.id) { - // if(!item?.answer_image){ - // item["answer_image"] = "" - // } - console.log(item); - + if (item?.id) { oldQuestionOptions.push(item); } else { newQuestionOptions.push(item); @@ -171,9 +165,6 @@ const EditPage: React.FC = () => { old: oldQuestionOptions, new: newQuestionOptions }; - console.log(QuestionOptions,"QuestionOptions"); - - mutate({ ...updatedObject,QuestionOptions,tags }); } }; @@ -259,7 +250,7 @@ const EditPage: React.FC = () => { {t("header.exercise") }
- +
{t("practical.back")}
-
-
- - - ); -}; - -export default ModalForm; diff --git a/src/Pages/question/Model/Edit.tsx b/src/Pages/question/Model/Edit.tsx deleted file mode 100644 index 3d93407..0000000 --- a/src/Pages/question/Model/Edit.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; -import PdfUploader from "../../../Components/CustomFields/PdfUploader"; -import ChoiceFields from "./Field/ChoiceFields"; -import { FaCirclePlus } from "react-icons/fa6"; -import { Choice } from "../../../types/Item"; -import { useTranslation } from "react-i18next"; -import DynamicTags from "./Tags/DynamicTags"; -import { useGetAllQuestion } from "../../../api/Question"; - -const Form = () => { - const formik = useFormikContext(); - const { isOpen } = useModalState((state) => state); - // const {data} = useGetAllQuestion(); - - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - formik.resetForm(); - } - }, [isOpen]); - - // console.log(formik?.errors); - - - const handleAddChoice = () => { - - - formik.setFieldValue('QuestionOptions', [...(formik?.values as any)?.QuestionOptions as Choice[], - - { - answer:null, - answer_image:null, - isCorrect:0 - }]) - } - const [t] = useTranslation() - - return ( - -
- - - - - {/* */} -
- -
- -
-
- {/* */} - - {/* */} - -
- { - (((formik?.values as any)?.QuestionOptions as Choice[])||[]) .map((item:Choice,index:number)=>{ - - return - } - ) - } - {formik?.values?.QuestionOptions?.length < 5 && ( -

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

- - )} - - - - - ); -}; - -export default Form; diff --git a/src/Pages/question/Page.tsx b/src/Pages/question/Page.tsx index 971e87a..d563eb1 100644 --- a/src/Pages/question/Page.tsx +++ b/src/Pages/question/Page.tsx @@ -7,12 +7,16 @@ import { ParamsEnum } from "../../enums/params"; import { useGetAllUnit } from "../../api/unit"; import useSetPageTitle from "../../Hooks/useSetPageTitle"; import { useGetAllLesson } from "../../api/lesson"; +import DeleteModels from "../../Layout/Dashboard/DeleteModels"; +import { ModalEnum } from "../../enums/Model"; +import { useDeleteQuestion } from "../../api/Question"; const Table = lazy(() => import('./Table')); const TableHeader = () => { const [t] = useTranslation(); - + const deleteMutation = useDeleteQuestion(); + const { unit_id,lesson_id } = useParams(); const { data: unit } = useGetAllUnit({ show: unit_id }); const { data: lesson } = useGetAllLesson({ show: lesson_id }); @@ -46,8 +50,10 @@ const TableHeader = () => {
- - + ); }; diff --git a/src/Pages/question/useTableColumns.tsx b/src/Pages/question/useTableColumns.tsx index d4e7786..4e27a43 100644 --- a/src/Pages/question/useTableColumns.tsx +++ b/src/Pages/question/useTableColumns.tsx @@ -1,15 +1,14 @@ -import { Space, TableColumnsType, Tooltip } from "antd"; +import { TableColumnsType } from "antd"; import { Question } from "../../types/Item"; import { FaPlus } from "react-icons/fa"; import { ModalEnum } from "../../enums/Model"; import { useObjectToEdit } from "../../zustand/ObjectToEditState"; -import { RiDeleteBin6Fill } from "react-icons/ri"; -import { MdOutlineEdit } from "react-icons/md"; import { useTranslation } from "react-i18next"; import { ABILITIES_ENUM } from "../../enums/abilities"; import { useNavigate } from "react-router-dom"; import { useModalState } from "../../zustand/Modal"; import { canAddQuestion, canDeleteQuestion, canEditQuestion } from "../../utils/hasAbilityFn"; +import ActionButtons from "../../Components/Table/ActionButtons"; export const useColumns = () => { const { setObjectToEdit } = useObjectToEdit((state) => state); @@ -78,45 +77,16 @@ export const useColumns = () => { ), key: "actions", align: "end", - className: "custom_add_button_column", - render: (text, record, index) => { - const className = - index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction"; - + width: "25vw", + render: (_text, record, index) => { return ( - - {canEditQuestion && ( - - handleEdit(record)}> - - - - )} - {canDeleteQuestion && ( - handelDelete(record)} - size={22} - style={{ color: "#C11313" }} - /> - )} - {/* {can_show_Question && ( - - handelShow(record)} - size={22} - style={{ color: "green" }} - /> - - )} */} - + handelDelete(record)} + onEdit={() => handleEdit(record)} + /> ); }, }, diff --git a/src/Pages/subject/Model/Add.tsx b/src/Pages/subject/Model/Add.tsx deleted file mode 100644 index 97e1a52..0000000 --- a/src/Pages/subject/Model/Add.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { useGetAllTeacher } from "../../../api/teacher"; -import useFormatDataToSelect from "../../../utils/useFormatDataToSelect"; -import { useFormikContext } from "formik"; -import { useModalState } from "../../../zustand/Modal"; -import useSearchQuery from "../../../api/utils/useSearchQuery"; - -const Form = () => { - - const { isOpen } = useModalState((state) => state); - const formik = useFormikContext(); - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - formik.resetForm(); - } - }, [isOpen]); - - return ( - - - - - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/subject/Model/AddModel.tsx b/src/Pages/subject/Model/AddModel.tsx index 4184537..771e57a 100644 --- a/src/Pages/subject/Model/AddModel.tsx +++ b/src/Pages/subject/Model/AddModel.tsx @@ -1,76 +1,31 @@ -import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import FormikForm from "../../../Layout/Dashboard/FormikFormModel"; -import ModelBody from "./Add"; +import React from "react"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; +import ModelForm from "./ModelForm"; import { useAddSubject } from "../../../api/subject"; -import { useParams } from "react-router-dom"; -import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; -import { useTranslation } from "react-i18next"; -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - const { mutate, isSuccess, isLoading } = useAddSubject(); - const { setObjectToEdit } = useObjectToEdit(); - - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - setObjectToEdit({}); - } - }, [setIsOpen, isSuccess]); +const AddModel: React.FC = () => { + const { mutate, status } = useAddSubject(); const handleSubmit = (values: any) => { - // console.log(values,"values"); - mutate({ - ...values, - - }); + mutate({ ...values }); }; - - const handleCancel = () => { - setIsOpen(""); - setObjectToEdit({}); - }; - const [t] = useTranslation(); return ( <> - - -
- {t("practical.add")} {t("models.subject")}{" "} -
-
- -
-
{t("practical.back")}
- -
-
- - + + ); }; -export default ModalForm; +export default AddModel; diff --git a/src/Pages/subject/Model/Delete.tsx b/src/Pages/subject/Model/Delete.tsx deleted file mode 100644 index f791526..0000000 --- a/src/Pages/subject/Model/Delete.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import React, { useEffect, useState } from "react"; -import { Input, Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import { ModalEnum } from "../../../enums/Model"; -import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; -import { useDeleteSubject } from "../../../api/subject"; -import { useTranslation } from "react-i18next"; - -const ModalForm: React.FC = () => { - const { isOpen, setIsOpen } = useModalState((state) => state); - const [inputValue, setInputValue] = useState(""); - - const { mutate, isSuccess, isLoading } = useDeleteSubject(); - const { objectToEdit, setObjectToEdit } = useObjectToEdit(); - - const full_name = objectToEdit?.name; - - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - setInputValue(""); - } - }, [isSuccess, setIsOpen]); - - const handleSubmit = () => { - mutate({ - id: Number(objectToEdit?.id), - }); - }; - - const handleCancel = () => { - setInputValue(""); - setIsOpen(""); - setObjectToEdit({}); - }; - - const handleChange = (e: React.ChangeEvent) => { - setInputValue(e.target.value); - }; - - const [t] = useTranslation(); - return ( - <> - -
- {" "} - {t("practical.delete")} {full_name}{" "} -
-
-
- - - -
- -
-
{t("practical.cancel")}
- -
-
- - - ); -}; - -export default ModalForm; diff --git a/src/Pages/subject/Model/Edit.tsx b/src/Pages/subject/Model/Edit.tsx deleted file mode 100644 index 8edf7a1..0000000 --- a/src/Pages/subject/Model/Edit.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import { Col, Row } from "reactstrap"; -import React, { useEffect } from "react"; -import ValidationField from "../../../Components/ValidationField/ValidationField"; -import { useGetAllTeacher } from "../../../api/teacher"; -import useFormatDataToSelect from "../../../utils/useFormatDataToSelect"; -import { useModalState } from "../../../zustand/Modal"; -import { useFormikContext } from "formik"; -import useSearchQuery from "../../../api/utils/useSearchQuery"; - -const Form = () => { - - const { isOpen } = useModalState((state) => state); - const formik = useFormikContext(); - useEffect(() => { - if (isOpen === "") { - formik.setErrors({}); - } - }, [isOpen]); - - return ( - - - - - - - - - - ); -}; - -export default Form; diff --git a/src/Pages/subject/Model/EditModel.tsx b/src/Pages/subject/Model/EditModel.tsx index 41f144a..ffbd934 100644 --- a/src/Pages/subject/Model/EditModel.tsx +++ b/src/Pages/subject/Model/EditModel.tsx @@ -1,83 +1,36 @@ -import React, { useEffect } from "react"; -import { Modal, Spin } from "antd"; -import { useModalState } from "../../../zustand/Modal"; -import ModelBody from "./Edit"; +import React from "react"; import { getInitialValues, getValidationSchema } from "./formUtil"; import { ModalEnum } from "../../../enums/Model"; import { useUpdateSubject } from "../../../api/subject"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; -import { Form, Formik } from "formik"; import { handelImageState } from "../../../utils/DataToSendImageState"; -import { useTranslation } from "react-i18next"; +import LayoutModel from "../../../Layout/Dashboard/LayoutModel"; +import { QueryStatusEnum } from "../../../enums/QueryStatus"; +import ModelForm from "./ModelForm"; const ModalForm: React.FC = () => { - const { objectToEdit, setObjectToEdit } = useObjectToEdit( - (state) => state, - ); - const { isOpen, setIsOpen } = useModalState((state) => state); + const { objectToEdit } = useObjectToEdit((state) => state); - const { mutate, isSuccess, isLoading } = useUpdateSubject(); - - useEffect(() => { - if (isSuccess) { - setIsOpen(""); - setObjectToEdit({}); - } - }, [isSuccess]); + const { mutate ,status} = useUpdateSubject(); const handleSubmit = (values: any) => { const Data_to_send = { ...values }; const handelImage = handelImageState(Data_to_send, "image"); mutate(handelImage); }; - - const handleCancel = () => { - setIsOpen(""); - setObjectToEdit(null); - }; - const [t] = useTranslation(); - return ( <> - - - {({ values }) => ( - -
- {t("practical.edit")} {t("models.subject")}{" "} -
-
- - -
-
{t("practical.cancel")}
- -
-
- - )} - - + + ); }; diff --git a/src/Pages/subject/Table/Page.tsx b/src/Pages/subject/Table/Page.tsx index 8710c26..a10b0ac 100644 --- a/src/Pages/subject/Table/Page.tsx +++ b/src/Pages/subject/Table/Page.tsx @@ -4,19 +4,19 @@ import useModalHandler from '../../../utils/useModalHandler'; import { FaPlus } from 'react-icons/fa'; import { useTranslation } from 'react-i18next'; import TablePage from './TablePage'; - - import AddSubjectModalForm from "../Model/AddModel"; import EditSubjectModalForm from "../Model/EditModel"; -import DeleteSubjectModalForm from "../Model/Delete"; import useSetPageTitle from '../../../Hooks/useSetPageTitle'; import { canAddSubject } from '../../../utils/hasAbilityFn'; +import DeleteModels from '../../../Layout/Dashboard/DeleteModels'; +import { useDeleteSubject } from '../../../api/subject'; const TableWithHeader = () => { const { handel_open_model } = useModalHandler(); const [t] = useTranslation(); + const deleteMutation = useDeleteSubject(); useSetPageTitle( t(`page_header.subject`), @@ -39,7 +39,10 @@ const TableWithHeader = () => { - + ) } diff --git a/src/Pages/subject/Table/useTableColumns.tsx b/src/Pages/subject/Table/useTableColumns.tsx index 3ffdb6f..0716bfb 100644 --- a/src/Pages/subject/Table/useTableColumns.tsx +++ b/src/Pages/subject/Table/useTableColumns.tsx @@ -1,35 +1,26 @@ -import { Space, TableColumnsType, Tooltip } from "antd"; +import { TableColumnsType } from "antd"; import { useModalState } from "../../../zustand/Modal"; import { ModalEnum } from "../../../enums/Model"; -import { MdOutlineEdit } from "react-icons/md"; -import { RiDeleteBin6Fill } from "react-icons/ri"; import { FaEye } from "react-icons/fa"; import ColumnsImage from "../../../Components/Columns/ColumnsImage"; -import { ImageBaseURL } from "../../../api/config"; import { useObjectToEdit } from "../../../zustand/ObjectToEditState"; import { useNavigate } from "react-router-dom"; -import useModalHandler from "../../../utils/useModalHandler"; import { useTranslation } from "react-i18next"; -import { - ABILITIES_ENUM, - ABILITIES_VALUES_ENUM, -} from "../../../enums/abilities"; -import { hasAbility } from "../../../utils/hasAbility"; +import ActionButtons from "../../../Components/Table/ActionButtons"; import { canDeleteSubject, canEditSubject } from "../../../utils/hasAbilityFn"; export const useColumns = () => { const navigate = useNavigate(); const { setObjectToEdit } = useObjectToEdit((state) => state); - const { handel_open_model } = useModalHandler(); + const { setIsOpen } = useModalState((state) => state); - const handelDeleteSubject = (data: any) => { - setObjectToEdit(data); - handel_open_model(ModalEnum?.SUBJECT_DELETE); - }; - - const handleEdit = (record: any) => { + const handelDelete = (record:any) => { setObjectToEdit(record); - handel_open_model(ModalEnum?.SUBJECT_EDIT); + setIsOpen(ModalEnum?.SUBJECT_DELETE); + }; + const handleEdit = (record:any) => { + setObjectToEdit(record); + setIsOpen(ModalEnum?.SUBJECT_EDIT); }; const [t] = useTranslation(); @@ -53,8 +44,6 @@ export const useColumns = () => { align: "center", render: (row: any) => { let str = row; - // console.log(row); - return ; }, }, @@ -81,36 +70,15 @@ export const useColumns = () => { key: "actions", align: "end", width: "25vw", - render: (text, record, index) => { - const className = - index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction"; - - + render: (_text, record, index) => { return ( - - {canEditSubject && ( - - handleEdit(record)}> - - - - )} - {canDeleteSubject && ( - handelDeleteSubject(record)} - size={22} - style={{ color: "#C11313" }} - /> - )} - + handelDelete(record)} + onEdit={() => handleEdit(record)} + /> ); }, }, diff --git a/src/Styles/App/classNames.scss b/src/Styles/App/classNames.scss index b031070..6ab94e1 100644 --- a/src/Styles/App/classNames.scss +++ b/src/Styles/App/classNames.scss @@ -273,4 +273,35 @@ button:disabled { text-align: center; font-weight: bold; +} + +.buttonAction { + display: flex; + align-items: center; + justify-content: center; + gap: 2vw; + + > button { + outline: none; + border: none; + border-radius: 20px; + padding: 0.3vw 1.5vw; + width: 8vw; + height: 2vw; + // background: var(--primary); + color: var(--white); + display: flex; + align-items: center; + justify-content: center; + gap: 5px; + font-size: 0.8vw; + } + .EditButton { + background: var(--bg); + border: 1px solid #d4d4d8; + color: var(--text); + } + .DeleteButton { + background: #dc2626; + } } \ No newline at end of file diff --git a/src/api/config.ts b/src/api/config.ts index 3e47958..94f2513 100644 --- a/src/api/config.ts +++ b/src/api/config.ts @@ -1,7 +1,7 @@ -// export const BaseURL = "http://192.168.1.107:8000/api/"; +export const BaseURL = "http://192.168.1.6:8000/api/"; // export const BaseURL = "http://127.0.0.1:8000/api/"; -export const BaseURL = "https://exercise-automation.point-dev.net/api/"; +// export const BaseURL = "https://exercise-automation.point-dev.net/api/"; // export const ImageBaseURL = "http://192.168.1.9:8000/"; diff --git a/src/api/helper/useAddMutation.ts b/src/api/helper/useAddMutation.ts index e8e9f07..7520b16 100644 --- a/src/api/helper/useAddMutation.ts +++ b/src/api/helper/useAddMutation.ts @@ -11,11 +11,10 @@ function useAddMutation( ): UseMutationResult { const axios = useAxios(); - console.log(toast,key); - + return useMutation( - + async (dataToSend) => { const filterDataToSend = filterData(dataToSend); diff --git a/src/translate/ar.json b/src/translate/ar.json index 8d28931..0361772 100644 --- a/src/translate/ar.json +++ b/src/translate/ar.json @@ -194,7 +194,8 @@ "no":"لا", "Are you sure you want to go back and not save any changes?":"هل أنت متأكد أنك تريد العودة وعدم حفظ أي تغييرات؟" , "accept_back":"قبول العودة ", - "accept":"قبول " + "accept":"قبول ", + "to_confirm_deletion_please_re_enter_id":"يرجى اعادة ادخال رقم التعريف" }, "Table": { "header": "", @@ -253,7 +254,8 @@ "lessons": "دروس", "sex": "الجنس", "Question":"اسئلة", - "tags":"كلمات مفتاحية" + "tags":"كلمات مفتاحية", + "tags_details":"تفاصيل الكلمة المفتاحية" }, "education_class_actions": { "Student_Records": "سجلات الطلاب", diff --git a/src/translate/en.json b/src/translate/en.json index b0e912b..94693ca 100644 --- a/src/translate/en.json +++ b/src/translate/en.json @@ -225,7 +225,8 @@ "subjectAttachmentType": "Subject Attachment Type", "param": "Param", "subjectProgress": "Subject Progress", - "main_page": "Main Page" + "main_page": "Main Page", + "tags_details":"tags details" }, "education_class_actions": { "Student_Records": "Student_Records",