Quiz_dashboard/src/Pages/Admin/Reseller/Add/Page.tsx

78 lines
2.6 KiB
TypeScript

import { useTranslation } from "react-i18next";
import useSetPageTitle from "../../../../Hooks/useSetPageTitle";
import PageHeader from "../../../../Layout/Dashboard/PageHeader";
import { Suspense, useEffect } from "react";
import { Spin } from "antd";
import { ModalEnum } from "../../../../enums/Model";
import PersonalDetailsForm from "../Form/PersonalDetailsForm";
import { Formik, Form } from "formik";
import { getInitialValues, getValidationSchema } from "../Form/formUtils";
import TitleDetailsForm from "../Form/TitleDetailsForm";
import AttachmentForm from "../Form/AttachmentForm";
import { useAddReseller } from "../../../../api/reseller";
import { useNavigate } from "react-router-dom";
import { QueryStatusEnum } from "../../../../enums/QueryStatus";
const TableHeader = () => {
const [t] = useTranslation();
const Navigate = useNavigate();
const {mutate, isSuccess,status} = useAddReseller();
useSetPageTitle(t(`page_header.add_reseller`));
const handleSubmit = (values: any) => {
const DataToSend = {
...values,
location: {
lat: values.lat,
lng: values.lng,
},
};
mutate(DataToSend);
};
useEffect(() => {
if(isSuccess === true){
console.log(1);
Navigate('/reseller')
}
}, [isSuccess])
return (
<div className="TableWithHeader">
<Suspense fallback={<Spin />}>
<PageHeader
pageTitle="add_reseller"
ModelAbility={ModalEnum?.RE_SELLER_ADD}
canAdd={false}
/>
<div>
<Formik
initialValues={getInitialValues({})}
validationSchema={getValidationSchema}
onSubmit={handleSubmit}
>
{({ dirty }) => (
<Form className="Form_details_container">
<PersonalDetailsForm />
<TitleDetailsForm />
<AttachmentForm />
<div className="resellerButton">
<button type="button" onClick={() => Navigate('/reseller')}>{t("practical.cancel")}</button>
<button type="submit" disabled={!dirty}>
{t("practical.add")} {t("models.reseller")}
{status === QueryStatusEnum.LOADING && (
<span className="Spinier_Div">
<Spin />
</span>
)}
</button>
</div>
</Form>
)}
</Formik>
</div>
</Suspense>
</div>
);
};
export default TableHeader;