fix add notification section

This commit is contained in:
Moaz Dawalibi 2024-11-12 15:13:59 +03:00
parent 60e4349628
commit 8eeb3b6d03
6 changed files with 37 additions and 17 deletions

View File

@ -51,12 +51,12 @@ const TableHeader = () => {
> >
{({ dirty }) => ( {({ dirty }) => (
<Form className="Form_details_container"> <Form className="Form_details_container">
<PersonalDetailsForm />
<TitleDetailsForm /> <TitleDetailsForm />
<PersonalDetailsForm />
<div className="resellerButton"> <div className="resellerButton">
<button type="button" onClick={() => Navigate('/add_Notifications')}>{t("practical.cancel")}</button> <button type="button" onClick={() => Navigate('/add_Notifications')}>{t("practical.cancel")}</button>
<button type="submit" disabled={!dirty}> <button type="submit" disabled={!dirty}>
{t("practical.add")} {t("models.notification")} {t("practical.send")} {t("models.notifications")}
{status === QueryStatusEnum.LOADING && ( {status === QueryStatusEnum.LOADING && (
<span className="Spinier_Div"> <span className="Spinier_Div">
<Spin /> <Spin />

View File

@ -5,15 +5,15 @@ import ValidationField from "../../../../../Components/ValidationField/Validatio
import { convert_data_to_select } from "../../../../../Layout/app/Const"; import { convert_data_to_select } from "../../../../../Layout/app/Const";
import { userTypeOptions } from "../../../../../config/userTypeOptions"; import { userTypeOptions } from "../../../../../config/userTypeOptions";
import { statusType } from "../../../../../config/statusType"; import { statusType } from "../../../../../config/statusType";
import { IoIosNotifications } from "react-icons/io"; import { FaUsers } from "react-icons/fa6";
const PersonalDetailsForm = ({isEdit}:{isEdit?:boolean}) => { const PersonalDetailsForm = ({isEdit}:{isEdit?:boolean}) => {
const [t] = useTranslation(); const [t] = useTranslation();
return ( return (
<div className="PersonalDetailsForm"> <div className="PersonalDetailsForm">
<header className="header_form"> <header className="header_form">
<IoIosNotifications /> <FaUsers />
<h4>{t("header.notification_details")}</h4> <h4>{t("header.users")}</h4>
</header> </header>
<main className="main_form_body"> <main className="main_form_body">
<ValidationField <ValidationField

View File

@ -4,7 +4,7 @@ import { FaRegAddressBook } from "react-icons/fa";
import ValidationField from "../../../../../Components/ValidationField/ValidationField"; import ValidationField from "../../../../../Components/ValidationField/ValidationField";
import { useGetAllArea } from "../../../../../api/Area"; import { useGetAllArea } from "../../../../../api/Area";
import { useGetAllCity } from "../../../../../api/City"; import { useGetAllCity } from "../../../../../api/City";
import { FaUsers } from "react-icons/fa6"; import { IoIosNotifications } from "react-icons/io";
const TitleDetailsForm = () => { const TitleDetailsForm = () => {
const [t] = useTranslation(); const [t] = useTranslation();
@ -18,11 +18,24 @@ const TitleDetailsForm = () => {
return ( return (
<div className="TitleDetailsForm"> <div className="TitleDetailsForm">
<header className="header_form"> <header className="header_form">
<FaUsers /> <IoIosNotifications />
<h4>{t("header.users")}</h4> <h4>{t("header.notification_details")}</h4>
</header> </header>
<main className="main_form_body"> <main className="main_form_body notification_details">
{/* <ValidationField name={"address"} placeholder={"_"} label={"address"} /> */} <ValidationField
name={"title"}
placeholder={"_"}
label={"title"}
type="TextArea"
width={500}
/>
<ValidationField
name={"body"}
placeholder={"_"}
label={"body"}
type="TextArea"
/>
</main> </main>
</div> </div>
); );

View File

@ -1,5 +1,4 @@
import { Form, Formik } from 'formik'; import { Form, Formik } from 'formik';
import React from 'react'
import { MdOutlineArrowForwardIos } from 'react-icons/md'; import { MdOutlineArrowForwardIos } from 'react-icons/md';
import { useLocation, useNavigate } from 'react-router-dom'; import { useLocation, useNavigate } from 'react-router-dom';
import { getInitialValues, getValidationSchema } from '../../formUtil'; import { getInitialValues, getValidationSchema } from '../../formUtil';
@ -88,7 +87,7 @@ const FormContainer = ({objectToEdit,handleSubmit,Loading,handleValidateSingleQu
<div className="exercise_add_buttons"> <div className="exercise_add_buttons">
<div onClick={handleCancel}>{t("practical.back")}</div> <div onClick={handleCancel}>{t("practical.back")}</div>
<div <div
className={`relative ${dirty ? "" : "disabled"}`} // className={`relative ${dirty ? "" : "disabled"}`}
onClick={()=>{ Loading ? ()=>{} : handleValidateSingleQuestion(values,isValid,handleSubmit,t) }} onClick={()=>{ Loading ? ()=>{} : handleValidateSingleQuestion(values,isValid,handleSubmit,t) }}
> {t("practical.edit")} > {t("practical.edit")}
{Loading && ( {Loading && (

View File

@ -1,9 +1,9 @@
.main_form_body { .main_form_body {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 20px; gap: 27px;
background: var(--bg); background: var(--bg);
padding: 40px 10px; padding: 40px 15px 40px 0px;
.ValidationField{ .ValidationField{
label{ label{
font-weight: 600; font-weight: 600;
@ -13,7 +13,13 @@
} }
> * { > * {
// max-width: 30%; // max-width: 30%;
flex-basis: 31%; flex-basis: 31.3%;
}
}
.notification_details{
> * {
flex-basis: 48%;
} }
} }

View File

@ -336,7 +336,8 @@
"student_name":"اسم الطالب", "student_name":"اسم الطالب",
"report_content":"محتوى التقرير", "report_content":"محتوى التقرير",
"with_report":"يوجد تقرير", "with_report":"يوجد تقرير",
"add_notification":"إرسال إشعار" "add_notification":"إرسال إشعار",
"send":"إرسال"
}, },
"Table": { "Table": {
"header": "", "header": "",
@ -433,7 +434,8 @@
"show_collection":"حصيلة", "show_collection":"حصيلة",
"city":"مدينة", "city":"مدينة",
"financialCollection":"التحصيلات", "financialCollection":"التحصيلات",
"notification":"إدارة الاشعارات" "notification":"إدارة الاشعارات",
"notifications":"إشعار"
}, },
"education_class_actions": { "education_class_actions": {
"Student_Records": "سجلات الطلاب", "Student_Records": "سجلات الطلاب",