nerd_project_dashboard/src/Components/Layout/Tabs/TabsSubmite.tsx
2024-08-13 15:06:10 +03:00

51 lines
1.4 KiB
TypeScript

import React from "react";
import { useModalTabsState } from "../../../zustand/ModalTabsState";
import { useModalState } from "../../../zustand/Modal";
import { useFormikContext } from "formik";
import { toast } from "react-toastify";
interface TabsSubmiteProps {
steps: number;
}
const TabsSubmite: React.FC<TabsSubmiteProps> = ({ steps }) => {
const formik = useFormikContext<any>();
const { isOpen, setIsOpen } = useModalState((state) => state);
const { ActiveTab, setActiveTab } = useModalTabsState((state) => state);
function handelNext() {
// console.log("submited");
if (Number(ActiveTab) >= steps) {
return;
}
setActiveTab(Number(ActiveTab) + 1);
}
function handelPre() {
setActiveTab(Number(ActiveTab) - 1);
}
const handleSubmit = () => {
if (formik.isValid) {
formik.submitForm();
} else {
toast.error("الرجاء ادخال جنيع البيانات المطلوبة");
}
};
return (
<div className="SubmitButton">
<div onClick={handelPre}>
{ActiveTab > 0 ? "رجوع للخطوة السابقة" : ""}
</div>
<button
onClick={ActiveTab + 1 !== steps ? handelNext : () => handleSubmit()}
>
{ActiveTab + 1 !== steps ? "الخطوة التالية" : "إضافة الطالب"}
</button>
</div>
);
};
export default TabsSubmite;