add new route navigater

This commit is contained in:
karimaldeen 2024-09-15 10:03:06 +03:00
parent b7276a2c6a
commit 0f54e21546
19 changed files with 171 additions and 86 deletions

View File

@ -15,6 +15,8 @@
.text,
.ant-form-item {
margin-bottom: 7px !important;
font-weight: bold;
font-size: 19px;
> span {
color: transparent;
}
@ -65,3 +67,15 @@
.ant-input-textarea-affix-wrapper.ant-input-affix-wrapper {
height: 120px;
}
//// malty select
///
.ant-select-multiple{
height: auto !important;
min-height: 40px;
.ant-select-selector{
min-height: 40px;
}
}

View File

@ -1,5 +1,4 @@
import React from "react";
import SearchBar from "../../Components/Ui/SearchBar/SearchBar";
import { Button } from "antd";
import { BsPlusCircleFill } from "react-icons/bs";
import { useNavigate } from "react-router-dom";
@ -8,8 +7,7 @@ import useModalHandler from "../../utils/useModalHandler";
import { MdOutlineArrowForwardIos } from "react-icons/md";
import { deletePathSegments } from "../../utils/deletePathSegments";
import { getPrevPathRoute } from "../../utils/getPrevPathRoute";
import { usePageTitleState } from "../../zustand/PageTitleState";
import FillterForm from "../Ui/FillterForm";
import PageTitleComponent from "./PageTitle";
const PageHeader = ({
canAdd,
@ -35,20 +33,20 @@ const PageHeader = ({
if (PrevPath === 0) {
return;
}
navigate(deletePathSegments(location.pathname, PrevPath));
// navigate(deletePathSegments(location.pathname, PrevPath));
};
const handleNavigateToPage = (location: string) => {
navigate(location);
// navigate(location);
};
console.log();
const { PageTitle } = usePageTitleState();
return (
<div className="page_header">
<header className="d-flex justify-content-between">
<span className="page_header_links" onClick={handelNavigate}>
<h1 className="page_title">{t(`PageTitle.${pageTitle}`)}</h1>
<span className="page_links">
<MdOutlineArrowForwardIos /> {PageTitle}
<MdOutlineArrowForwardIos /> <PageTitleComponent/>
</span>
</span>
{ addModal ? canAdd && (

View File

@ -0,0 +1,30 @@
import React from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import { usePageTitleState } from '../../zustand/PageTitleState'
const PageTitleComponent = () => {
const {PageTitle,setPageTitle} = usePageTitleState()
const navigate = useNavigate()
const location = useLocation()
const handleNavigate = (path:string)=>{
const currentPath = location.pathname ;
const newPath = currentPath?.split(path)?.[0] + path ;
if(newPath !== currentPath){
navigate(newPath)
}
}
return (
<div className='PageTitle'>
{(Array.isArray(PageTitle) ? PageTitle : [])?.map((item,index)=>{
return (
<div key={index} className='PageTitleItems' onClick={()=>handleNavigate(item?.path)}>
{item?.name} /
</div>
)
})}
</div>
)
}
export default PageTitleComponent

View File

@ -20,7 +20,10 @@ const TableHeader = () => {
const [t] = useTranslation();
const deleteMutation = useDeleteGrade();
useSetPageTitle(t(`page_header.grade`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.grade`)}`, path:"grade"}
]);
return (
<div className="TableWithHeader">

View File

@ -18,7 +18,11 @@ const DeleteModalForm = lazy(
const TableHeader = () => {
const [t] = useTranslation();
useSetPageTitle(t(`page_header.param`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.param`)}`, path:"param"}
]);
const deleteMutation = useDeleteParam();
return (
<div className="TableWithHeader">

View File

@ -20,8 +20,11 @@ const TableHeader = () => {
const [t] = useTranslation();
const deleteMutation = useDeleteQuestion();
useSetPageTitle(t(`page_header.QuestionBank`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.Question`)}`, path:"Question"}
]);
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>

View File

@ -21,9 +21,12 @@ const SearchField = lazy(
);
const TableHeader = () => {
const { handel_open_model } = useModalHandler();
const [t] = useTranslation();
useSetPageTitle(t(`page_header.report`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.report`)}`, path:"report"}
]);
const deleteMutation = useDeleteTag();
return (
<div className="TableWithHeader">

View File

@ -24,7 +24,10 @@ const SearchField = lazy(
const TableHeader = () => {
const [t] = useTranslation();
useSetPageTitle(t(`page_header.reseller`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.reseller`)}`, path:"reseller"}
]);
const deleteMutation = useDeleteTag();
return (
<div className="TableWithHeader">

View File

@ -20,8 +20,10 @@ const TableHeader = () => {
const [t] = useTranslation();
const deleteMutation = useDeleteStudent();
useSetPageTitle(t(`page_header.student`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.student`)}`, path:"student"}
]);
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>

View File

@ -16,14 +16,15 @@ const EditModalForm = lazy(() => import("./Model/EditModel"));
const DeleteModalForm = lazy(
() => import("../../../Layout/Dashboard/DeleteModels"),
);
const SearchField = lazy(
() => import("../../../Components/DataTable/SearchField"),
);
const TableHeader = () => {
const { handel_open_model } = useModalHandler();
const [t] = useTranslation();
useSetPageTitle(t(`page_header.tags`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.tags`)}`, path:"tag"}
]);
const deleteMutation = useDeleteTag();
return (
<div className="TableWithHeader">

View File

@ -35,15 +35,13 @@ const TableHeader = () => {
});
const gradeName = grade?.data?.name ?? "";
const SubjectName = Subject?.data?.name ?? "";
useSetPageTitle(
t(`page_header.grade`) +
" / " +
` ${t("header.subject_of_class")} (${gradeName})` +
" / " +
SubjectName,
);
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.grade`)}`, path:"grade"},
{name:` ${t("header.subject_of_class")} (${gradeName})`, path:`grade/${grade_id}`},
{name:SubjectName, path:`subject/${subject_id}`}
]);
return (
<div className="TableWithHeader">

View File

@ -18,7 +18,10 @@ const DeleteModalForm = lazy(
const TableHeader = () => {
const [t] = useTranslation();
useSetPageTitle(t(`page_header.user`));
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.user`)}`, path:"user"}
]);
const deleteMutation = useDeleteUser();
return (
<div className="TableWithHeader">

View File

@ -26,7 +26,7 @@ const TableHeader = () => {
const [t] = useTranslation();
const deleteMutation = useDeleteLesson();
const { unit_id, curriculum_id, grade_id, subject_id } =
const { unit_id, grade_id, subject_id } =
useParams<ParamsEnum>();
const { data: unit } = useGetAllUnit({ show: unit_id });
@ -41,15 +41,15 @@ const TableHeader = () => {
const SubjectName = Subject?.data?.name ?? "";
const unitName = unit?.data?.name ?? "";
useSetPageTitle(
t(`page_header.grade`) +
" / " +
` ${t("header.subject_of_class")} (${gradeName})` +
" / " +
SubjectName +
" / " +
unitName,
);
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.grade`)}`, path:"grade"},
{name:` ${t("header.subject_of_class")} (${gradeName})`, path:`grade/${grade_id}`},
{name:SubjectName, path:`subject/${subject_id}`},
{name:unitName, path:`unit/${unit_id}`}
]);
return (
<div className="TableWithHeader">

View File

@ -42,17 +42,15 @@ const TableHeader = () => {
const unitName = unit?.data?.name ?? "";
const LessonName = Lesson?.data?.name ?? "";
useSetPageTitle(
t(`page_header.grade`) +
" / " +
` ${t("header.subject_of_class")} (${gradeName})` +
" / " +
SubjectName +
" / " +
unitName +
" / " +
LessonName,
);
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.grade`)}`, path:"grade"},
{name:` ${t("header.subject_of_class")} (${gradeName})`, path:`grade/${grade_id}`},
{name:SubjectName, path:`subject/${subject_id}`},
{name:unitName, path:`unit/${unit_id}`},
{name:LessonName, path:`lesson/${lesson_id }`}
]);
return (
<div className="TableWithHeader">

View File

@ -32,11 +32,15 @@ const TableWithHeader = () => {
});
const gradeName = grade?.data?.name ?? "";
useSetPageTitle(
t(`page_header.grade`) +
" / " +
` ${t("header.subject_of_class")} (${gradeName})`,
);
useSetPageTitle([
{name:`${t(`page_header.home`)}`, path:"/"},
{name:`${t(`page_header.grade`)}`, path:"grade"},
{name:` ${t("header.subject_of_class")} (${gradeName})`, path:`grade/${grade_id}`}
]);
return (
<div className="TableWithHeader">

View File

@ -4,6 +4,7 @@ import { ABILITIES_ENUM } from "../../enums/abilities";
import useSetPageTitle from "../../Hooks/useSetPageTitle";
import useFilter from "../../Components/FilterField/components/useFilter";
import { Button, Popconfirm } from "antd";
import PageTitle from "../../Layout/Dashboard/PageTitle";
const Dummy = () => {
const [t] = useTranslation();
@ -11,8 +12,7 @@ const Dummy = () => {
const { FilterButton, FilterBody } = useFilter();
return (
<div className="DummyHomePage">
{/* <FilterButton />
<FilterBody>karim</FilterBody> */}
<PageTitle/>
</div>
);

View File

@ -9,6 +9,9 @@
}
.page_links {
color: var(--opacity);
display: flex;
align-items: center;
gap: 10px;
}
}
}
@ -16,3 +19,12 @@
.filter_header_top {
color: #202c4b;
}
.PageTitle{
display: flex;
gap: 10px;
.PageTitleItems{
cursor: pointer;
}
}

View File

@ -127,12 +127,14 @@
display: flex;
justify-content: space-between;
width: 100%;
padding: 14px 10px;
padding: 14px 20px;
background: #f2f4f8;
border-radius: 10px 10px 0 0;
margin: 0 !important;
box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1);
div{
margin-left: 25px;
}
img {
cursor: pointer;
}
@ -246,3 +248,10 @@
padding: 30px 2vw 10px 2vw;
}
}
.SelectTag{
label{
font-weight: bold;
font-size: 19px;
}
}

View File

@ -798,14 +798,14 @@
"QuestionBank":"بنك الأسئلة"
},
"page_header": {
"dashboard": "لوحة القيادة / الصفحة الرئيسية",
"course": " لوحة القيادة / الصفوف ",
"teacher": " لوحة القيادة / المعلمون",
"payment": " لوحة القيادة / الدفعات",
"branch": " لوحة القيادة / الفروع",
"role": " لوحة القيادة / الادوار",
"student": " لوحة القيادة / قائمة الطلاب ",
"admin": " لوحة القيادة / المسؤولون",
"home": "لوحة القيادة",
"course": " الصفوف ",
"teacher": " المعلمون",
"payment": " الدفعات",
"branch": " الفروع",
"role": " الادوار",
"student": " قائمة الطلاب ",
"admin": " المسؤولون",
"student_details": "تفاصيل الطالب",
"create_student": "إنشاء طالب",
"course_details": "تفاصيل الصف",
@ -813,27 +813,27 @@
"student_payment": "دفع الطالب",
"student_note": "ملاحظات الطالب",
"student_status": "حالة الطالب",
"education_class": "لوحة القيادة / الصفوف / الشعب",
"education_class_details": " لوحة القيادة / الصفوف / الشعب / تفاصيل الشعبة",
"subject_details": " لوحة القيادة / تفاصيل المادة ",
"cycle": "لوحة القيادة / السنة دراسية ",
"term": "لوحة القيادة / الفصل ",
"unit_details": "لوحة القيادة / تفاصيل المادة / تفاصيل الوحدة",
"lesson_details": "لوحة القيادة / تفاصيل المادة / تفاصيل الوحدة / تفاصيل الدرس",
"exercise_add": "لوحة القيادة / تفاصيل الدرس / إضافة تمارين ",
"subject": "لوحة القيادة / المادة",
"tags": "لوحة القيادة / كلمات مفتاحية",
"Question": "لوحة القيادة /اسئلة ",
"add_Question": "لوحة القيادة /إضافة اسئلة ",
"edit_Question": "لوحة القيادة /تعديل اسئلة ",
"grade": "لوحة القيادة / الصفوف",
"education_class": "الصفوف / الشعب",
"education_class_details": " الصفوف / الشعب / تفاصيل الشعبة",
"subject_details": " تفاصيل المادة ",
"cycle": " السنة دراسية ",
"term": "الفصل ",
"unit_details": "تفاصيل المادة / تفاصيل الوحدة",
"lesson_details": "تفاصيل المادة / تفاصيل الوحدة / تفاصيل الدرس",
"exercise_add": "تفاصيل الدرس / إضافة تمارين ",
"subject": "المادة",
"tags": "كلمات مفتاحية",
"Question": "سئلة ",
"add_Question": "ضافة اسئلة ",
"edit_Question": "عديل اسئلة ",
"grade": "الصفوف",
"report": "تقرير",
"users": "لوحة القيادة / المستخدمون",
"reseller": " لوحة القيادة / البائعين",
"add_reseller": " لوحة القيادة / البائعين / إضافة بائع ",
"users": "المستخدمون",
"reseller": " البائعين",
"add_reseller": " البائعين / إضافة بائع ",
"param": "معامل",
"student_package": "حزمة الطالب",
"QuestionBank":"لوحة القيادة / بنك الأسئلة"
"QuestionBank":"بنك الأسئلة"
},
"table": {
"student": "قائمة الطلاب",