This commit is contained in:
karimaldeen 2024-08-17 11:10:32 +03:00
parent aece39ae8f
commit a0000066ab
64 changed files with 6338 additions and 3702 deletions

File diff suppressed because it is too large Load Diff

View File

@ -15,7 +15,6 @@ const ColumnsImage = ({ src }: any) => {
const handleError = useImageError;
return (
<Image
width={45}

View File

@ -4,7 +4,6 @@ import { Button } from "antd";
import React, { useContext } from "react";
export const DragHandle: React.FC = () => {
interface RowContextProps {
setActivatorNodeRef?: (element: HTMLElement | null) => void;
listeners?: SyntheticListenerMap;
@ -17,10 +16,9 @@ interface RowContextProps {
type="text"
size="small"
icon={<HolderOutlined />}
style={{ cursor: 'move' }}
style={{ cursor: "move" }}
ref={setActivatorNodeRef}
{...listeners}
/>
);
};

View File

@ -1,18 +1,18 @@
import React, { useContext, useMemo } from 'react';
import { HolderOutlined } from '@ant-design/icons';
import type { DragEndEvent } from '@dnd-kit/core';
import { DndContext } from '@dnd-kit/core';
import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
import React, { useContext, useMemo } from "react";
import { HolderOutlined } from "@ant-design/icons";
import type { DragEndEvent } from "@dnd-kit/core";
import { DndContext } from "@dnd-kit/core";
import type { SyntheticListenerMap } from "@dnd-kit/core/dist/hooks/utilities";
import { restrictToVerticalAxis } from "@dnd-kit/modifiers";
import {
arrayMove,
SortableContext,
useSortable,
verticalListSortingStrategy,
} from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
import { Button, Table } from 'antd';
import type { TableColumnsType } from 'antd';
} from "@dnd-kit/sortable";
import { CSS } from "@dnd-kit/utilities";
import { Button, Table } from "antd";
import type { TableColumnsType } from "antd";
interface DataType {
key: string;
@ -36,7 +36,7 @@ const DragHandle: React.FC = () => {
type="text"
size="small"
icon={<HolderOutlined />}
style={{ cursor: 'move' }}
style={{ cursor: "move" }}
ref={setActivatorNodeRef}
{...listeners}
/>
@ -44,20 +44,20 @@ const DragHandle: React.FC = () => {
};
const columns: TableColumnsType<DataType> = [
{ key: 'sort', align: 'center', width: 80, render: () => <DragHandle /> },
{ title: 'Name', dataIndex: 'name' },
{ title: 'Age', dataIndex: 'age' },
{ title: 'Address', dataIndex: 'address' },
{ key: "sort", align: "center", width: 80, render: () => <DragHandle /> },
{ title: "Name", dataIndex: "name" },
{ title: "Age", dataIndex: "age" },
{ title: "Address", dataIndex: "address" },
];
const initialData: DataType[] = [
{ key: '1', order: 1, name: '1', age: 32, address: 'Long text Long' },
{ key: '4', order: 4, name: '4', age: 42, address: 'London No. 1 Lake Park' },
{ key: '3', order: 3, name: '3', age: 32, address: 'Sidney No. 1 Lake Park' },
{ key: "1", order: 1, name: "1", age: 32, address: "Long text Long" },
{ key: "4", order: 4, name: "4", age: 42, address: "London No. 1 Lake Park" },
{ key: "3", order: 3, name: "3", age: 32, address: "Sidney No. 1 Lake Park" },
].sort((a, b) => a.order - b.order);
interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
'data-row-key': string;
"data-row-key": string;
}
const Row: React.FC<RowProps> = (props) => {
@ -69,13 +69,13 @@ const Row: React.FC<RowProps> = (props) => {
transform,
transition,
isDragging,
} = useSortable({ id: props['data-row-key'] });
} = useSortable({ id: props["data-row-key"] });
const style: React.CSSProperties = {
...props.style,
transform: CSS.Translate.toString(transform),
transition,
...(isDragging ? { position: 'relative', zIndex: 9999 } : {}),
...(isDragging ? { position: "relative", zIndex: 9999 } : {}),
};
const contextValue = useMemo<RowContextProps>(
@ -99,8 +99,12 @@ const DrapableTable: React.FC = () => {
console.log("Old Data:", dataSource);
setDataSource((prevState) => {
const activeIndex = prevState.findIndex((record) => record.key === active?.id);
const overIndex = prevState.findIndex((record) => record.key === over?.id);
const activeIndex = prevState.findIndex(
(record) => record.key === active?.id,
);
const overIndex = prevState.findIndex(
(record) => record.key === over?.id,
);
const newState = arrayMove(prevState, activeIndex, overIndex);
// Log the new state after reordering
@ -113,7 +117,10 @@ const DrapableTable: React.FC = () => {
return (
<DndContext modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>
<SortableContext items={dataSource.map((i) => i.key)} strategy={verticalListSortingStrategy}>
<SortableContext
items={dataSource.map((i) => i.key)}
strategy={verticalListSortingStrategy}
>
<Table
rowKey="key"
components={{ body: { row: Row } }}

View File

@ -1,4 +1,3 @@
import React from "react";
import useFormField from "../../../Hooks/useFormField";
import { Checkbox, Form } from "antd";

View File

@ -1,18 +1,18 @@
import React, { useContext, useMemo } from 'react';
import { HolderOutlined } from '@ant-design/icons';
import type { DragEndEvent } from '@dnd-kit/core';
import { DndContext } from '@dnd-kit/core';
import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
import React, { useContext, useMemo } from "react";
import { HolderOutlined } from "@ant-design/icons";
import type { DragEndEvent } from "@dnd-kit/core";
import { DndContext } from "@dnd-kit/core";
import type { SyntheticListenerMap } from "@dnd-kit/core/dist/hooks/utilities";
import { restrictToVerticalAxis } from "@dnd-kit/modifiers";
import {
arrayMove,
SortableContext,
useSortable,
verticalListSortingStrategy,
} from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
import { Button, Table } from 'antd';
import type { TableColumnsType } from 'antd';
} from "@dnd-kit/sortable";
import { CSS } from "@dnd-kit/utilities";
import { Button, Table } from "antd";
import type { TableColumnsType } from "antd";
interface DataType {
key: string;
@ -36,7 +36,7 @@ const DragHandle: React.FC = () => {
type="text"
size="small"
icon={<HolderOutlined />}
style={{ cursor: 'move' }}
style={{ cursor: "move" }}
ref={setActivatorNodeRef}
{...listeners}
/>
@ -44,20 +44,20 @@ const DragHandle: React.FC = () => {
};
const columns: TableColumnsType<DataType> = [
{ key: 'sort', align: 'center', width: 80, render: () => <DragHandle /> },
{ title: 'Name', dataIndex: 'name' },
{ title: 'Age', dataIndex: 'age' },
{ title: 'Address', dataIndex: 'address' },
{ key: "sort", align: "center", width: 80, render: () => <DragHandle /> },
{ title: "Name", dataIndex: "name" },
{ title: "Age", dataIndex: "age" },
{ title: "Address", dataIndex: "address" },
];
const initialData: DataType[] = [
{ key: '1', order: 1, name: '1', age: 32, address: 'Long text Long' },
{ key: '4', order: 4, name: '4', age: 42, address: 'London No. 1 Lake Park' },
{ key: '3', order: 3, name: '3', age: 32, address: 'Sidney No. 1 Lake Park' },
{ key: "1", order: 1, name: "1", age: 32, address: "Long text Long" },
{ key: "4", order: 4, name: "4", age: 42, address: "London No. 1 Lake Park" },
{ key: "3", order: 3, name: "3", age: 32, address: "Sidney No. 1 Lake Park" },
].sort((a, b) => a.order - b.order);
interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
'data-row-key': string;
"data-row-key": string;
}
const Row: React.FC<RowProps> = (props) => {
@ -69,13 +69,13 @@ const Row: React.FC<RowProps> = (props) => {
transform,
transition,
isDragging,
} = useSortable({ id: props['data-row-key'] });
} = useSortable({ id: props["data-row-key"] });
const style: React.CSSProperties = {
...props.style,
transform: CSS.Translate.toString(transform),
transition,
...(isDragging ? { position: 'relative', zIndex: 9999 } : {}),
...(isDragging ? { position: "relative", zIndex: 9999 } : {}),
};
const contextValue = useMemo<RowContextProps>(
@ -99,8 +99,12 @@ const App: React.FC = () => {
console.log("Old Data:", dataSource);
setDataSource((prevState) => {
const activeIndex = prevState.findIndex((record) => record.key === active?.id);
const overIndex = prevState.findIndex((record) => record.key === over?.id);
const activeIndex = prevState.findIndex(
(record) => record.key === active?.id,
);
const overIndex = prevState.findIndex(
(record) => record.key === over?.id,
);
const newState = arrayMove(prevState, activeIndex, overIndex);
// Log the new state after reordering
@ -113,7 +117,10 @@ const App: React.FC = () => {
return (
<DndContext modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>
<SortableContext items={dataSource.map((i) => i.key)} strategy={verticalListSortingStrategy}>
<SortableContext
items={dataSource.map((i) => i.key)}
strategy={verticalListSortingStrategy}
>
<Table
rowKey="key"
components={{ body: { row: Row } }}

View File

@ -9,10 +9,12 @@ import { ModalEnum } from "../../enums/Model";
import { useDeleteCurriculum } from "../../api/curriculum";
import { useGetAllGrade } from "../../api/grade";
const Table = lazy(() => import('./Table'));
const AddModalForm = lazy(() => import('./Model/AddModel'));
const EditModalForm = lazy(() => import('./Model/EditModel'));
const DeleteModalForm = lazy(() => import('../../Layout/Dashboard/DeleteModels'));
const Table = lazy(() => import("./Table"));
const AddModalForm = lazy(() => import("./Model/AddModel"));
const EditModalForm = lazy(() => import("./Model/EditModel"));
const DeleteModalForm = lazy(
() => import("../../Layout/Dashboard/DeleteModels"),
);
const TableHeader = () => {
const [t] = useTranslation();
@ -31,16 +33,23 @@ const TableHeader = () => {
const SubjectName = Subject?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum"),
);
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>
<header>
<h6>
{t("models.curriculum")}
</h6>
<h6>{t("models.curriculum")}</h6>
</header>
<Table />
<AddModalForm />

View File

@ -7,7 +7,10 @@ import { ParamsEnum } from "../../enums/params";
const App: React.FC = () => {
const { subject_id } = useParams<ParamsEnum>();
const response = useGetAllCurriculum({ subject_id: subject_id, pagination: true });
const response = useGetAllCurriculum({
subject_id: subject_id,
pagination: true,
});
console.log(response?.data?.data, "response?.data");
return <DataTable response={response} useColumns={useColumns} />;

View File

@ -52,7 +52,6 @@ export const useColumns = () => {
render: (text, record) => record?.name,
},
{
title: canAddCurriculum ? (
<button

View File

@ -1,7 +1,9 @@
import * as Yup from "yup";
import { Grade, GradeInitialValues } from "../../../types/Grade";
export const getInitialValues = (objectToEdit: Partial<Grade>): GradeInitialValues => {
export const getInitialValues = (
objectToEdit: Partial<Grade>,
): GradeInitialValues => {
return {
id: objectToEdit?.id,
name: objectToEdit?.name ?? "",
@ -13,6 +15,5 @@ export const getValidationSchema = () => {
// validate input
return Yup.object().shape({
name: Yup.string().required("validation.required"),
});
};

View File

@ -5,10 +5,12 @@ import useSetPageTitle from "../../Hooks/useSetPageTitle";
import { ModalEnum } from "../../enums/Model";
import { useDeleteGrade } from "../../api/grade";
const Table = lazy(() => import('./Table'));
const AddModalForm = lazy(() => import('./Model/AddModel'));
const EditModalForm = lazy(() => import('./Model/EditModel'));
const DeleteModalForm = lazy(() => import('../../Layout/Dashboard/DeleteModels'));
const Table = lazy(() => import("./Table"));
const AddModalForm = lazy(() => import("./Model/AddModel"));
const EditModalForm = lazy(() => import("./Model/EditModel"));
const DeleteModalForm = lazy(
() => import("../../Layout/Dashboard/DeleteModels"),
);
const TableHeader = () => {
const [t] = useTranslation();
@ -20,9 +22,7 @@ const TableHeader = () => {
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>
<header>
<h6>
{t("models.grade")}
</h6>
<h6>{t("models.grade")}</h6>
</header>
<Table />
<AddModalForm />

View File

@ -10,7 +10,9 @@ 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("../../Layout/Dashboard/DeleteModels"));
const DeleteModalForm = lazy(
() => import("../../Layout/Dashboard/DeleteModels"),
);
const SearchField = lazy(
() => import("../../Components/DataTable/SearchField"),
);
@ -18,9 +20,7 @@ const SearchField = lazy(
const TableHeader = () => {
const { handel_open_model } = useModalHandler();
const [t] = useTranslation();
useSetPageTitle(
t(`page_header.tags`),
);
useSetPageTitle(t(`page_header.tags`));
const deleteMutation = useDeleteTag();
return (

View File

@ -1,21 +1,21 @@
import React, { useContext, useEffect, useMemo } from 'react';
import { HolderOutlined } from '@ant-design/icons';
import type { DragEndEvent } from '@dnd-kit/core';
import { DndContext } from '@dnd-kit/core';
import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
import { restrictToVerticalAxis } from '@dnd-kit/modifiers';
import React, { useContext, useEffect, useMemo } from "react";
import { HolderOutlined } from "@ant-design/icons";
import type { DragEndEvent } from "@dnd-kit/core";
import { DndContext } from "@dnd-kit/core";
import type { SyntheticListenerMap } from "@dnd-kit/core/dist/hooks/utilities";
import { restrictToVerticalAxis } from "@dnd-kit/modifiers";
import {
arrayMove,
SortableContext,
useSortable,
verticalListSortingStrategy,
} from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
import { Button, Table } from 'antd';
import type { TableColumnsType } from 'antd';
import { useParams } from 'react-router-dom';
import { ParamsEnum } from '../../enums/params';
import { useGetAllUnit } from '../../api/unit';
} from "@dnd-kit/sortable";
import { CSS } from "@dnd-kit/utilities";
import { Button, Table } from "antd";
import type { TableColumnsType } from "antd";
import { useParams } from "react-router-dom";
import { ParamsEnum } from "../../enums/params";
import { useGetAllUnit } from "../../api/unit";
interface DataType {
id: string; // Unique identifier for each row
@ -39,7 +39,7 @@ const DragHandle: React.FC = () => {
type="text"
size="small"
icon={<HolderOutlined />}
style={{ cursor: 'move' }}
style={{ cursor: "move" }}
ref={setActivatorNodeRef}
{...listeners}
/>
@ -47,14 +47,14 @@ const DragHandle: React.FC = () => {
};
const columns: TableColumnsType<DataType> = [
{ key: 'sort', align: 'center', width: 80, render: () => <DragHandle /> },
{ title: 'Name', dataIndex: 'name' },
{ title: 'Age', dataIndex: 'age' },
{ title: 'Address', dataIndex: 'address' },
{ key: "sort", align: "center", width: 80, render: () => <DragHandle /> },
{ title: "Name", dataIndex: "name" },
{ title: "Age", dataIndex: "age" },
{ title: "Address", dataIndex: "address" },
];
interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {
'data-row-key': string;
"data-row-key": string;
}
const Row: React.FC<RowProps> = (props) => {
@ -66,13 +66,13 @@ const Row: React.FC<RowProps> = (props) => {
transform,
transition,
isDragging,
} = useSortable({ id: props['data-row-key'] });
} = useSortable({ id: props["data-row-key"] });
const style: React.CSSProperties = {
...props.style,
transform: CSS.Translate.toString(transform),
transition,
...(isDragging ? { position: 'relative', zIndex: 9999 } : {}),
...(isDragging ? { position: "relative", zIndex: 9999 } : {}),
};
const contextValue = useMemo<RowContextProps>(
@ -92,7 +92,8 @@ const DrapableTable: React.FC = () => {
const response = useGetAllUnit({ subject_id: subject_id, pagination: false });
// Assuming the response contains a unique id for each item
const data = response?.data?.data?.map((item: any, index: number) => ({
const data =
response?.data?.data?.map((item: any, index: number) => ({
id: item.id, // Ensure this is a unique identifier
order: index + 1, // Assign order based on index
name: item.name,
@ -112,8 +113,12 @@ const DrapableTable: React.FC = () => {
const onDragEnd = ({ active, over }: DragEndEvent) => {
if (active.id !== over?.id) {
setDataSource((prevState) => {
const activeIndex = prevState.findIndex((record) => record.id === active.id);
const overIndex = prevState.findIndex((record) => record.id === over.id);
const activeIndex = prevState.findIndex(
(record) => record.id === active.id,
);
const overIndex = prevState.findIndex(
(record) => record.id === over.id,
);
// Move the items in the array
const newState = arrayMove(prevState, activeIndex, overIndex);
@ -129,7 +134,10 @@ const DrapableTable: React.FC = () => {
return (
<DndContext modifiers={[restrictToVerticalAxis]} onDragEnd={onDragEnd}>
<SortableContext items={dataSource.map((i) => i.id)} strategy={verticalListSortingStrategy}>
<SortableContext
items={dataSource.map((i) => i.id)}
strategy={verticalListSortingStrategy}
>
<Table
rowKey="id"
components={{ body: { row: Row } }}

View File

@ -11,20 +11,18 @@ import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
const AddModel: React.FC = () => {
const { mutate, status } = useAddUnit();
const { curriculum_id } = useParams();
const {OldObjectToEdit} = useObjectToEdit()
const { OldObjectToEdit } = useObjectToEdit();
const handleSubmit = (values: any) => {
let order = 0;
if (OldObjectToEdit?.order || OldObjectToEdit?.order === 0) {
order = Number(OldObjectToEdit.order) + 1;
}
mutate({
...values,
curriculum_id: curriculum_id,
order:order
order: order,
});
};
return (

View File

@ -11,7 +11,6 @@ const EditModel: React.FC = () => {
const { mutate, status } = useUpdateUnit();
const { objectToEdit } = useObjectToEdit((state) => state);
const handleSubmit = (values: any) => {
mutate({
...values,

View File

@ -4,7 +4,6 @@ import { TermEnum } from "../../../enums/Term";
import { enumToArray } from "../../../utils/enumToArray";
const Form = () => {
const termsArray = enumToArray(TermEnum);
console.log(termsArray, "termsArray");
@ -14,7 +13,13 @@ console.log(termsArray,"termsArray");
<ValidationField name="name" placeholder="name" label="name" />
</Col>
<Col>
<ValidationField name="term" type="Select" placeholder="term" label="term" option={termsArray} />
<ValidationField
name="term"
type="Select"
placeholder="term"
label="term"
option={termsArray}
/>
</Col>
</Row>
);

View File

@ -1,7 +1,9 @@
import * as Yup from "yup";
import { UnitInitialValues, Unit } from "../../../types/Unit";
export const getInitialValues = (objectToEdit: Partial<Unit>): UnitInitialValues => {
export const getInitialValues = (
objectToEdit: Partial<Unit>,
): UnitInitialValues => {
return {
id: objectToEdit?.id,
name: objectToEdit?.name ?? null,

View File

@ -11,10 +11,12 @@ import DrapableTable from "./DrapableTable";
import { useGetAllGrade } from "../../api/grade";
import { useGetAllCurriculum } from "../../api/curriculum";
const Table = lazy(() => import('./Table'));
const AddModalForm = lazy(() => import('./Model/AddModel'));
const EditModalForm = lazy(() => import('./Model/EditModel'));
const DeleteModalForm = lazy(() => import('../../Layout/Dashboard/DeleteModels'));
const Table = lazy(() => import("./Table"));
const AddModalForm = lazy(() => import("./Model/AddModel"));
const EditModalForm = lazy(() => import("./Model/EditModel"));
const DeleteModalForm = lazy(
() => import("../../Layout/Dashboard/DeleteModels"),
);
const TableHeader = () => {
const [t] = useTranslation();
@ -36,18 +38,27 @@ const TableHeader = () => {
const SubjectName = Subject?.data?.name ?? "";
const CurriculumName = Curriculum?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum")+"/"+CurriculumName+"/"+t("PageTitle.unit"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum") +
"/" +
CurriculumName +
"/" +
t("PageTitle.unit"),
);
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>
<header>
<h6>
{t("models.units")}
</h6>
<h6>{t("models.units")}</h6>
</header>
<Table />
<AddModalForm />

View File

@ -9,17 +9,18 @@ import { useObjectToEdit } from "../../zustand/ObjectToEditState";
const App: React.FC = () => {
const { subject_id } = useParams<ParamsEnum>();
const response = useGetAllUnit({ subject_id: subject_id, pagination: true });
const {setOldObjectToEdit} = useObjectToEdit()
const { setOldObjectToEdit } = useObjectToEdit();
console.log(response?.data?.data, "response?.data");
const data = response?.data?.data;
const lastElement = response?.data?.data && response?.data?.data[data?.length - 1]
const lastElement =
response?.data?.data && response?.data?.data[data?.length - 1];
console.log(lastElement);
useEffect(() => {
if (lastElement) {
setOldObjectToEdit(lastElement)
setOldObjectToEdit(lastElement);
}
}, [lastElement])
}, [lastElement]);
return <DataTable response={response} useColumns={useColumns} />;
};

View File

@ -12,11 +12,10 @@ import { useModalState } from "../../../zustand/Modal";
import { useObjectToEdit } from "../../../zustand/ObjectToEditState";
const AddModel: React.FC = () => {
const { isOpen, setIsOpen } = useModalState((state) => state);
const queryClient = useQueryClient();
const { mutate, isSuccess, status } = useAddLesson();
const {OldObjectToEdit} = useObjectToEdit()
const { OldObjectToEdit } = useObjectToEdit();
const { unit_id } = useParams<ParamsEnum>();
useEffect(() => {
if (isSuccess) {
@ -26,11 +25,9 @@ const AddModel: React.FC = () => {
}, [setIsOpen, isSuccess, queryClient]);
const handleSubmit = (values: any) => {
let order = 0;
if (OldObjectToEdit?.order || OldObjectToEdit?.order === 0) {
order = Number(OldObjectToEdit.order) + 1;
}
mutate({ ...values, unit_id: unit_id });

View File

@ -11,19 +11,21 @@ import { useGetAllGrade } from "../../api/grade";
import { useGetAllCurriculum } from "../../api/curriculum";
import { useGetAllSubject } from "../../api/subject";
const Table = lazy(() => import('./Table'));
const AddModalForm = lazy(() => import('./Model/AddModel'));
const EditModalForm = lazy(() => import('./Model/EditModel'));
const DeleteModelsForm = lazy(() => import('../../Layout/Dashboard/DeleteModels'));
const Table = lazy(() => import("./Table"));
const AddModalForm = lazy(() => import("./Model/AddModel"));
const EditModalForm = lazy(() => import("./Model/EditModel"));
const DeleteModelsForm = lazy(
() => import("../../Layout/Dashboard/DeleteModels"),
);
const TableHeader = () => {
const [t] = useTranslation();
const deleteMutation = useDeleteLesson();
const { unit_id,curriculum_id,grade_id ,subject_id} = useParams<ParamsEnum>();
const { unit_id, curriculum_id, grade_id, subject_id } =
useParams<ParamsEnum>();
const { data: unit } = useGetAllUnit({ show: unit_id });
const { data: Subject } = useGetAllSubject({
show: subject_id,
});
@ -39,10 +41,25 @@ const TableHeader = () => {
const CurriculumName = Curriculum?.data?.name ?? "";
const unitName = unit?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum")+"/"+CurriculumName+"/"+t("PageTitle.unit")+"/"+unitName+"/"+t("PageTitle.lesson"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum") +
"/" +
CurriculumName +
"/" +
t("PageTitle.unit") +
"/" +
unitName +
"/" +
t("PageTitle.lesson"),
);
return (
<div className="TableWithHeader">

View File

@ -10,17 +10,18 @@ const App: React.FC = () => {
const { unit_id } = useParams<ParamsEnum>();
const response = useGetAllLesson({ unit_id: unit_id, pagination: true });
const {setOldObjectToEdit} = useObjectToEdit()
const { setOldObjectToEdit } = useObjectToEdit();
console.log(response?.data?.data, "response?.data");
const data = response?.data?.data;
const lastElement = response?.data?.data && response?.data?.data[data?.length - 1]
const lastElement =
response?.data?.data && response?.data?.data[data?.length - 1];
console.log(lastElement);
useEffect(() => {
if (lastElement) {
setOldObjectToEdit(lastElement)
setOldObjectToEdit(lastElement);
}
}, [lastElement])
}, [lastElement]);
return <DataTable response={response} useColumns={useColumns} />;
};

View File

@ -16,9 +16,9 @@ import { useObjectToEdit } from "../../zustand/ObjectToEditState";
import Header from "../../Components/exercise/Header";
import { Question } from "../../types/Item";
import BaseForm from './Model/Malty/Add'
import ModelForm from './Model/ModelForm'
const AcceptModal = lazy(() => import('./Model/AcceptModal'));
import BaseForm from "./Model/Malty/Add";
import ModelForm from "./Model/ModelForm";
const AcceptModal = lazy(() => import("./Model/AcceptModal"));
import { useModalState } from "../../zustand/Modal";
import { ModalEnum } from "../../enums/Model";
@ -48,12 +48,11 @@ const AddPage: React.FC = () => {
const { setIsOpen } = useModalState((state) => state);
const [t] = useTranslation();
const { unit_id,curriculum_id,grade_id ,subject_id,lesson_id} = useParams<ParamsEnum>();
const { unit_id, curriculum_id, grade_id, subject_id, lesson_id } =
useParams<ParamsEnum>();
const { data: unit } = useGetAllUnit({ show: unit_id });
const { data: Subject } = useGetAllSubject({
show: subject_id,
});
@ -73,7 +72,31 @@ const AddPage: React.FC = () => {
const unitName = unit?.data?.name ?? "";
const LessonName = Lesson?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum")+"/"+CurriculumName+"/"+t("PageTitle.unit")+"/"+unitName+"/"+t("PageTitle.lesson")+"/"+LessonName+"/"+t("PageTitle.question")+"/"+t("practical.add"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum") +
"/" +
CurriculumName +
"/" +
t("PageTitle.unit") +
"/" +
unitName +
"/" +
t("PageTitle.lesson") +
"/" +
LessonName +
"/" +
t("PageTitle.question") +
"/" +
t("practical.add"),
);
const handleSubmit = (
values: any,
{ resetForm }: { resetForm: () => void },
@ -90,8 +113,7 @@ const AddPage: React.FC = () => {
isBase: 1,
lessons_ids: [lesson_id],
canAnswersBeShuffled,
hint:DataToSend?.hint
hint: DataToSend?.hint,
};
mutateAsync(newBseQuestion).then((data: any) => {
@ -120,7 +142,7 @@ const AddPage: React.FC = () => {
subject_id: subject_id,
tags,
lessons_ids: [lesson_id],
canAnswersBeShuffled
canAnswersBeShuffled,
});
}
};

View File

@ -21,8 +21,8 @@ import { ParamsEnum } from "../../enums/params";
import { useObjectToEdit } from "../../zustand/ObjectToEditState";
import { removeStringKeys } from "../../utils/removeStringKeys";
import SpinContainer from "../../Components/Layout/SpinContainer";
import ModelForm from './Model/ModelForm'
import BaseForm from './Model/Malty/Edit'
import ModelForm from "./Model/ModelForm";
import BaseForm from "./Model/Malty/Edit";
import { Question } from "../../types/Item";
import { toast } from "react-toastify";
import useSetPageTitle from "../../Hooks/useSetPageTitle";
@ -33,7 +33,14 @@ import { useGetAllGrade } from "../../api/grade";
import { useGetAllCurriculum } from "../../api/curriculum";
const EditPage: React.FC = () => {
const { unit_id,curriculum_id,grade_id ,subject_id,lesson_id,question_id } = useParams<ParamsEnum>();
const {
unit_id,
curriculum_id,
grade_id,
subject_id,
lesson_id,
question_id,
} = useParams<ParamsEnum>();
const { isBseQuestion, setIsBseQuestion, setTagsSearch, DeletedQuestions } =
useObjectToEdit();
@ -59,12 +66,9 @@ const EditPage: React.FC = () => {
}
}, [objectToEdit?.isBase]);
const [t] = useTranslation();
const { data: unit } = useGetAllUnit({ show: unit_id });
const { data: Subject } = useGetAllSubject({
show: subject_id,
});
@ -84,7 +88,31 @@ const EditPage: React.FC = () => {
const unitName = unit?.data?.name ?? "";
const LessonName = Lesson?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum")+"/"+CurriculumName+"/"+t("PageTitle.unit")+"/"+unitName+"/"+t("PageTitle.lesson")+"/"+LessonName+"/"+t("PageTitle.question")+"/"+t("practical.edit"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum") +
"/" +
CurriculumName +
"/" +
t("PageTitle.unit") +
"/" +
unitName +
"/" +
t("PageTitle.lesson") +
"/" +
LessonName +
"/" +
t("PageTitle.question") +
"/" +
t("practical.edit"),
);
const handleSubmit = (values: any) => {
const DataToSend = structuredClone(values);
@ -96,8 +124,6 @@ const EditPage: React.FC = () => {
id: DataToSend?.id,
content: DataToSend?.content,
image: DataToSend?.image ?? "",
};
if (
typeof UpdateBseQuestion?.image === "string" &&
@ -157,8 +183,6 @@ const EditPage: React.FC = () => {
tags,
lessons_ids: [lesson_id],
parent_id: values?.id,
});
}
});

View File

@ -57,13 +57,7 @@ const ChoiceFields = ({ index, data }: { index: number; data: Choice }) => {
</p>
</div>
<div>
<HintField
placeholder={"hint"}
name={index}
label="hint"
id={`hint`}
/>
<HintField placeholder={"hint"} name={index} label="hint" id={`hint`} />
</div>
</>
);

View File

@ -1,8 +1,8 @@
import React from 'react';
import { Choice } from '../../../../types/Item';
import ChoiceFields from './ChoiceFields';
import { useFormikContext } from 'formik';
import { DragDropContext, Droppable, Draggable } from 'react-beautiful-dnd';
import React from "react";
import { Choice } from "../../../../types/Item";
import ChoiceFields from "./ChoiceFields";
import { useFormikContext } from "formik";
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
const Choices = () => {
const formik = useFormikContext<any>();
@ -22,31 +22,34 @@ const Choices = () => {
// Update the order keys based on the new indices
const updatedItems = items.map((item, index) => ({
...item ?? {},
...(item ?? {}),
order: index + 1, // Update order to be 1-based index
}));
// Update the formik state with the new order
console.log(updatedItems, "updatedItems");
formik.setFieldValue('QuestionOptions', updatedItems);
formik.setFieldValue("QuestionOptions", updatedItems);
};
return (
<DragDropContext onDragEnd={handleDragEnd}>
<Droppable droppableId="choices">
{(provided) => (
<div
{...provided.droppableProps}
ref={provided.innerRef}
>
{formik?.values?.QuestionOptions?.map((item: Choice, index: number) => {
<div {...provided.droppableProps} ref={provided.innerRef}>
{formik?.values?.QuestionOptions?.map(
(item: Choice, index: number) => {
// Use a unique identifier for draggableId
const draggableId = item.name ? item.name.toString() : `item-${index}`;
const draggableId = item.name
? item.name.toString()
: `item-${index}`;
return (
<Draggable key={draggableId} draggableId={draggableId} index={index}>
<Draggable
key={draggableId}
draggableId={draggableId}
index={index}
>
{(provided) => (
<div
ref={provided.innerRef}
@ -58,7 +61,8 @@ const Choices = () => {
)}
</Draggable>
);
})}
},
)}
{provided.placeholder} {/* Placeholder for spacing */}
</div>
)}

View File

@ -1,13 +1,12 @@
import React from 'react'
import ChoiceFields from './ChoiceFields';
import { Choice } from '../../../../../types/Item';
import { useFormikContext } from 'formik';
import { DragDropContext, Draggable, Droppable } from 'react-beautiful-dnd';
import React from "react";
import ChoiceFields from "./ChoiceFields";
import { Choice } from "../../../../../types/Item";
import { useFormikContext } from "formik";
import { DragDropContext, Draggable, Droppable } from "react-beautiful-dnd";
const Choices = ({ parent_index }: { parent_index: number }) => {
const formik = useFormikContext<any>();
const handleDragEnd = (result: any) => {
// Check if the item was dropped outside the list
if (!result.destination) return;
@ -23,14 +22,14 @@ const Choices = ({parent_index}:{parent_index:number}) => {
// Update the order keys based on the new indices
const updatedItems = items.map((item, index) => ({
...item ?? {},
...(item ?? {}),
order: index + 1, // Update order to be 1-based index
}));
// Update the formik state with the new order
console.log(updatedItems, "updatedItems");
formik.setFieldValue('QuestionOptions', updatedItems);
formik.setFieldValue("QuestionOptions", updatedItems);
};
return (
@ -38,26 +37,27 @@ const Choices = ({parent_index}:{parent_index:number}) => {
<DragDropContext onDragEnd={handleDragEnd}>
<Droppable droppableId="choices">
{(provided) => (
<div
{...provided.droppableProps}
ref={provided.innerRef}
>
<div {...provided.droppableProps} ref={provided.innerRef}>
{(
(formik?.values as any)?.Questions?.[parent_index]
?.QuestionOptions || []
).map((item: Choice, index: number) => {
const draggableId = item.name ? item.name.toString() : `item-${index}`;
const draggableId = item.name
? item.name.toString()
: `item-${index}`;
return (
<Draggable key={draggableId} draggableId={draggableId} index={index}>
<Draggable
key={draggableId}
draggableId={draggableId}
index={index}
>
{(provided) => (
<div
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
>
<ChoiceFields
key={index}
parent_index={parent_index}
@ -67,7 +67,6 @@ const Choices = ({parent_index}:{parent_index:number}) => {
</div>
)}
</Draggable>
);
})}
@ -76,12 +75,8 @@ const Choices = ({parent_index}:{parent_index:number}) => {
)}
</Droppable>
</DragDropContext>
</>
)
}
);
};
export default Choices
export default Choices;

View File

@ -51,7 +51,6 @@ const QuestionFIeld = ({ index, data }: { index: number; data: Choice }) => {
className="canAnswersBeShuffled"
label={"canAnswersBeShuffled"}
name={index}
/>
<p className="delete_question_options">

View File

@ -11,7 +11,7 @@ import { useEffect } from "react";
import Choices from "./Field/Choices";
const Form = () => {
const [t] = useTranslation()
const [t] = useTranslation();
const formik = useFormikContext<any>();
const { setSuccess, Success, setSavedQuestionData } = useObjectToEdit();
@ -24,34 +24,55 @@ const Form = () => {
}, [Success]);
useEffect(() => {
setSavedQuestionData(formik.values)
}, [formik?.values])
setSavedQuestionData(formik.values);
}, [formik?.values]);
const handleAddChoice = () => {
formik.setFieldValue('QuestionOptions', [...(formik?.values as any)?.QuestionOptions as Choice[],
formik.setFieldValue("QuestionOptions", [
...((formik?.values as any)?.QuestionOptions as Choice[]),
{
answer: null,
answer_image: null,
isCorrect: 0,
}])
}
},
]);
};
return (
<Row className="w-100">
<div className="exercise_form">
<ValidationField className="textarea_exercise" name="content" label="details" type="TextArea" />
<ValidationField className="file_exercise" name="image" label="attachment" type="File" />
<ValidationField name="canAnswersBeShuffled" label="canAnswersBeShuffled" type="Checkbox" />
<ValidationField
className="textarea_exercise"
name="content"
label="details"
type="TextArea"
/>
<ValidationField
className="file_exercise"
name="image"
label="attachment"
type="File"
/>
<ValidationField
name="canAnswersBeShuffled"
label="canAnswersBeShuffled"
type="Checkbox"
/>
</div>
<div>
<ValidationField className="hint" name="hint" label="hint" type="text" style={{width:200}} />
<ValidationField
className="hint"
name="hint"
label="hint"
type="text"
style={{ width: 200 }}
/>
</div>
<Choices />
{formik?.values?.QuestionOptions?.length < 5 && (
<p className="add_new_button">
<FaCirclePlus onClick={handleAddChoice} size={23} /> {t("header.add_new_choice")}
<FaCirclePlus onClick={handleAddChoice} size={23} />{" "}
{t("header.add_new_choice")}
</p>
)}
<DynamicTags />

View File

@ -39,7 +39,6 @@ export const getValidationSchema = () => {
};
export const getInitialValuesBase = (objectToEdit: Question): any => {
const newQuestions = objectToEdit?.Questions?.map((item: any) => {
const tags = item?.tags?.map((tag: any) => ({
id: tag?.id,
@ -69,7 +68,6 @@ export const getInitialValuesBase = (objectToEdit: Question): any => {
};
};
export const getValidationSchemaBase = () => {
// validate input
return Yup.object().shape({

View File

@ -19,10 +19,10 @@ const TableHeader = () => {
const deleteMutation = useDeleteQuestion();
const { unit_id,curriculum_id,grade_id ,subject_id,lesson_id} = useParams<ParamsEnum>();
const { unit_id, curriculum_id, grade_id, subject_id, lesson_id } =
useParams<ParamsEnum>();
const { data: unit } = useGetAllUnit({ show: unit_id });
const { data: Subject } = useGetAllSubject({
show: subject_id,
});
@ -42,15 +42,35 @@ const TableHeader = () => {
const unitName = unit?.data?.name ?? "";
const LessonName = Lesson?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ gradeName +"/"+t(`PageTitle.subject`)+"/"+SubjectName+"/"+t("PageTitle.curriculum")+"/"+CurriculumName+"/"+t("PageTitle.unit")+"/"+unitName+"/"+t("PageTitle.lesson")+"/"+LessonName+"/"+t("PageTitle.question"));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
gradeName +
"/" +
t(`PageTitle.subject`) +
"/" +
SubjectName +
"/" +
t("PageTitle.curriculum") +
"/" +
CurriculumName +
"/" +
t("PageTitle.unit") +
"/" +
unitName +
"/" +
t("PageTitle.lesson") +
"/" +
LessonName +
"/" +
t("PageTitle.question"),
);
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>
<header>
<h6>
{t("models.Question")}
</h6>
<h6>{t("models.Question")}</h6>
</header>
<Table />
</Suspense>

View File

@ -10,7 +10,7 @@ import { ParamsEnum } from "../../../enums/params";
const AddModel: React.FC = () => {
const { mutate, status } = useAddSubject();
const {grade_id} = useParams<ParamsEnum>()
const { grade_id } = useParams<ParamsEnum>();
const handleSubmit = (values: any) => {
mutate({ ...values, grade_id });
};

View File

@ -1,16 +1,16 @@
import * as Yup from "yup";
import { SubjectInitialValues } from "../../../types/Subject";
export const getInitialValues = (objectToEdit: Partial<SubjectInitialValues>): SubjectInitialValues => {
export const getInitialValues = (
objectToEdit: Partial<SubjectInitialValues>,
): SubjectInitialValues => {
// console.log(objectToEdit,"objectToEdit");
return {
id: objectToEdit?.id ?? null,
name: objectToEdit?.name ?? null,
icon: objectToEdit?.icon ?? null,
grade_id: objectToEdit?.grade_id ?? null,
};
};

View File

@ -13,7 +13,9 @@ import { useGetAllGrade } from "../../../api/grade";
const Table = lazy(() => import("./TablePage"));
const AddModalForm = lazy(() => import("../Model/AddModel"));
const EditModalForm = lazy(() => import("../Model/EditModel"));
const DeleteModalForm = lazy(() => import("../../../Layout/Dashboard/DeleteModels"));
const DeleteModalForm = lazy(
() => import("../../../Layout/Dashboard/DeleteModels"),
);
const TableWithHeader = () => {
const { handel_open_model } = useModalHandler();
@ -27,8 +29,13 @@ const TableWithHeader = () => {
});
const gradeName = grade?.data?.name ?? "";
useSetPageTitle( t(`page_header.grade`)+ "/"+ `${gradeName}` +"/"+t(`PageTitle.subject`));
useSetPageTitle(
t(`page_header.grade`) +
"/" +
`${gradeName}` +
"/" +
t(`PageTitle.subject`),
);
return (
<div className="TableWithHeader">
@ -52,7 +59,7 @@ const TableWithHeader = () => {
ModelEnum={ModalEnum?.SUBJECT_DELETE}
/>
</div>
)
}
);
};
export default TableWithHeader;

View File

@ -63,8 +63,6 @@ export const menuItems: TMenuItem[] = [
];
export const CrudRoute: TCrudRoute[] = [
{
header: "page_header.grade_details",
element: <Subject />,
@ -74,7 +72,6 @@ export const CrudRoute: TCrudRoute[] = [
prevPath: 1,
},
{
header: "page_header.subject_details",
element: <Curriculum />,

View File

@ -5,7 +5,6 @@
@import "./Segmented.scss";
@import "./Mix.scss";
.draggable-row {
cursor: move; /* Change cursor to indicate draggable rows */
}

View File

@ -272,7 +272,6 @@ button:disabled {
.h1 {
text-align: center;
font-weight: bold;
}
.buttonAction {

View File

@ -121,9 +121,7 @@
left: 100px;
}
.hint_canAnswersBeShuffled {
display: flex;
gap: 5px;
}

View File

@ -15,7 +15,6 @@ const KEY = "grade";
export const useGetAllGrade = (params?: any, options?: any) =>
useGetQuery(KEY, API.GET, params, options);
export const useAddGrade = () => useAddMutation(KEY, API.ADD);
export const useUpdateGrade = (params?: any) =>
useUpdateMutation(KEY, API.GET);
export const useUpdateGrade = (params?: any) => useUpdateMutation(KEY, API.GET);
export const useDeleteGrade = (params?: any) =>
useDeleteMutation(KEY, API.DELETE);

View File

@ -141,7 +141,6 @@ export enum ModalEnum {
QUESTION_DELETE = "Question.delete",
QUESTION_ACCEPT = "Question.ACCEPT",
///Grade
GRADE_EDIT = "GRADE.edit",
@ -153,7 +152,4 @@ export enum ModalEnum {
CURRICULUM_EDIT = "CURRICULUM.edit",
CURRICULUM_ADD = "CURRICULUM.add",
CURRICULUM_DELETE = "CURRICULUM.delete",
}

View File

@ -2,4 +2,3 @@ export enum TermEnum {
FIRST_TERM = "first_term",
SECOND_TERM = "second_term",
}

View File

@ -108,7 +108,6 @@
"add_new_question": "اضافة سؤال جديد",
"exercise": "تمارين",
"icon": "الايقونة"
},
"columns": {
"id": "الرقم التعريفي",

View File

@ -404,5 +404,4 @@ export interface showAdmin {
branches: BranchRole[];
}
export type Nullable<T> = { [K in keyof T]: T[K] | null };

View File

@ -6,12 +6,10 @@ export interface InitialValues {
id: number; // Unique identifier for the user
name: string; // Name of the user
icon: string; // URL of the user's icon
}
export type Curriculum = {
id: number; // Unique identifier for the user
name: string; // Name of the user
icon: string; // URL of the user's icon
}
};
export type CurriculumInitialValues = Partial<Nullable<InitialValues>>;

View File

@ -6,12 +6,10 @@ export interface InitialValues {
id: number; // Unique identifier for the user
name: string; // Name of the user
icon: string; // URL of the user's icon
}
export type Grade = {
id: number; // Unique identifier for the user
name: string; // Name of the user
icon: string; // URL of the user's icon
}
};
export type GradeInitialValues = Partial<Nullable<InitialValues>>;

View File

@ -1,5 +1,5 @@
export const enumToArray = (enumObj: any) => {
return Object.keys(enumObj).map(key => ({
return Object.keys(enumObj).map((key) => ({
value: enumObj[key],
label: enumObj[key],
}));

View File

@ -21,7 +21,7 @@ class AbilityManager {
}
private loadAbilities(): Set<string> {
const abilitiesString = getLocalStorage(ABILITIES_KEY)
const abilitiesString = getLocalStorage(ABILITIES_KEY);
if (!abilitiesString) {
return new Set<string>();

View File

@ -518,8 +518,6 @@ export const canShowQuestion = hasAbility(
ABILITIES_VALUES_ENUM.SHOW,
);
///// Grade
export const canAddGrade = hasAbility(
@ -543,7 +541,6 @@ export const canIndexGrade = hasAbility(
ABILITIES_VALUES_ENUM.INDEX,
);
///// Curriculum
export const canAddCurriculum = hasAbility(
@ -566,4 +563,3 @@ export const canIndexCurriculum = hasAbility(
ABILITIES_ENUM.EDUCATION_CLASS,
ABILITIES_VALUES_ENUM.INDEX,
);