From f4e366d04ab2877063c54ac47be356f280e9cdfe Mon Sep 17 00:00:00 2001 From: amir-kedis Date: Tue, 26 Dec 2023 18:03:02 +0200 Subject: [PATCH 1/5] =?UTF-8?q?=F0=9F=A6=B4=20feat:=20insert=20sector=20ma?= =?UTF-8?q?rkup?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/common/UserActions.jsx | 9 +- .../components/insert-term/InsertTermPage.jsx | 89 +++++++++++++++++++ client/src/routes.jsx | 2 + 3 files changed, 95 insertions(+), 5 deletions(-) create mode 100644 client/src/components/insert-term/InsertTermPage.jsx diff --git a/client/src/components/common/UserActions.jsx b/client/src/components/common/UserActions.jsx index dd6a82f2..e019c128 100644 --- a/client/src/components/common/UserActions.jsx +++ b/client/src/components/common/UserActions.jsx @@ -72,21 +72,21 @@ export default function UserActions() { + +
+ + +
+ + ); +} diff --git a/client/src/routes.jsx b/client/src/routes.jsx index 4e621bad..573b7093 100644 --- a/client/src/routes.jsx +++ b/client/src/routes.jsx @@ -19,6 +19,7 @@ import TestTypo from "./components/testing/testTypo"; import TestLayout from "./components/testing/testLayout"; import Dashboard from "./components/dashboard/Dashboard"; import CaptainProfile from "./components/captain-profile/CaptainProfile"; +import InsertTermPage from "./components/insert-term/InsertTermPage"; function Routes() { return ( @@ -30,6 +31,7 @@ function Routes() { } /> } /> } /> + } /> {/* Testing Routes */} From a631a7d519da6c5ffe10c0211b412ccc3a545267 Mon Sep 17 00:00:00 2001 From: amir-kedis Date: Tue, 26 Dec 2023 18:13:43 +0200 Subject: [PATCH 2/5] =?UTF-8?q?=F0=9F=92=85=20feat:=20style=20insert=20ter?= =?UTF-8?q?m?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/insert-term/InsertTermPage.jsx | 25 +++++++++-------- .../insert-term/InsertTermPage.scss | 28 +++++++++++++++++++ 2 files changed, 41 insertions(+), 12 deletions(-) create mode 100644 client/src/components/insert-term/InsertTermPage.scss diff --git a/client/src/components/insert-term/InsertTermPage.jsx b/client/src/components/insert-term/InsertTermPage.jsx index 006da8bf..01b5557a 100644 --- a/client/src/components/insert-term/InsertTermPage.jsx +++ b/client/src/components/insert-term/InsertTermPage.jsx @@ -3,6 +3,7 @@ import PageTitle from "../common/PageTitle"; import TextInput from "../common/Inputs"; import Button from "../common/Button"; import CustomCheckbox from "../common/CustomCheckbox"; +import "./InsertTermPage.scss"; export default function InsertTermPage() { const [termName, setTermName] = useState(""); @@ -22,11 +23,11 @@ export default function InsertTermPage() { }; return ( -
- -
+
+ + - setUnderstandCheckbox(e.target.checked)} - name="understand" - /> + setUnderstandCheckbox(e.target.checked)} + name="understand" + /> - + +
); diff --git a/client/src/components/update-term-page/UpdateTermPage.jsx b/client/src/components/update-term-page/UpdateTermPage.jsx new file mode 100644 index 00000000..2d243866 --- /dev/null +++ b/client/src/components/update-term-page/UpdateTermPage.jsx @@ -0,0 +1,126 @@ +import { useEffect, useState } from "react"; +import PageTitle from "../common/PageTitle"; +import TextInput from "../common/Inputs"; +import Button from "../common/Button"; +import CustomCheckbox from "../common/CustomCheckbox"; +import "../insert-term/InsertTermPage.scss"; +import { + useUpdateTermMutation, + useGetCurTermQuery, +} from "../../redux/slices/termApiSlice"; +import { toast } from "react-toastify"; + +export default function UpdateTermPage() { + const [termName, setTermName] = useState(""); + const [termStartDate, setTermStartDate] = useState(""); + const [termEndDate, setTermEndDate] = useState(""); + const [understandCheckbox, setUnderstandCheckbox] = useState(false); + + const [updateTerm, { isLoading }] = useUpdateTermMutation(); + + const { data, isFetching: isFetchingTerm } = useGetCurTermQuery(); + + useEffect(() => { + if (data && data.body) { + setTermName(data.body.termName); + let date = new Date(data.body.startDate).toISOString().split("T")[0]; + setTermStartDate(date); + date = new Date(data.body.endDate).toISOString().split("T")[0]; + setTermEndDate(date); + } + }, [data]); + + const handleSubmit = (e) => { + e.preventDefault(); + // TODO: send request with this info to the server + console.log({ + termName, + startDate: termStartDate, + endDate: termEndDate, + understandCheckbox, + }); + try { + updateTerm({ + termName, + startDate: termStartDate, + endDate: termEndDate, + }); + toast.success("تم تعديل الفترة بنجاح"); + } catch (err) { + console.log(err); + toast.error("حدث خطأ أثناء تعديل الفترة"); + toast.error(JSON.stringify(err)); + } + }; + + return ( +
+ + {isFetchingTerm && ( +

+ جاري تحميل الفترة +

+ )} +
+ setTermName(e.target.value)} + placeholder="اسم الفترة" + required + /> + setTermStartDate(e.target.value)} + placeholder="تاريخ بداية الفترة" + required + /> + setTermEndDate(e.target.value)} + placeholder="تاريخ نهاية الفترة" + required + /> +

+ **إنشاء فترة هو إجراء لا رجعة به يجب مراعاة انه بعد إنشاء الفترة + ستتحول كل الصفحات الاخرى الى احدث فترة تم إنشاءها +

+ setUnderstandCheckbox(e.target.checked)} + name="understand" + required + /> + + + {isLoading && ( +

+ جاري تعديل الفترة +

+ )} +
+ ); +} diff --git a/client/src/redux/slices/termApiSlice.js b/client/src/redux/slices/termApiSlice.js index 3ea01060..737ca583 100644 --- a/client/src/redux/slices/termApiSlice.js +++ b/client/src/redux/slices/termApiSlice.js @@ -29,6 +29,13 @@ export const termApi = apiSlice.injectEndpoints({ body: term, }), }), + UpdateTerm: builder.mutation({ + query: (term) => ({ + url: `${TERM_URL}/`, + method: "PATCH", + body: term, + }), + }), }), }); @@ -37,4 +44,5 @@ export const { useGetCurWeekQuery, useGetRemainingWeeksQuery, useInsertTermMutation, + useUpdateTermMutation, } = termApi; diff --git a/client/src/routes.jsx b/client/src/routes.jsx index 573b7093..fee3514c 100644 --- a/client/src/routes.jsx +++ b/client/src/routes.jsx @@ -20,6 +20,7 @@ import TestLayout from "./components/testing/testLayout"; import Dashboard from "./components/dashboard/Dashboard"; import CaptainProfile from "./components/captain-profile/CaptainProfile"; import InsertTermPage from "./components/insert-term/InsertTermPage"; +import UpdateTermPage from "./components/update-term-page/UpdateTermPage"; function Routes() { return ( @@ -32,6 +33,7 @@ function Routes() { } /> } /> } /> + } /> {/* Testing Routes */} From 5bbb1ffa4f2a231475840327e147f19f9d8a078b Mon Sep 17 00:00:00 2001 From: amir-kedis Date: Tue, 26 Dec 2023 19:09:48 +0200 Subject: [PATCH 5/5] =?UTF-8?q?=F0=9F=90=9B=20fix:=20fix=20unhandled=20sta?= =?UTF-8?q?tus=20codes=20in=20insert=20and=20update=20term?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/components/insert-term/InsertTermPage.jsx | 9 ++++++--- .../src/components/update-term-page/UpdateTermPage.jsx | 8 +++++--- 2 files changed, 11 insertions(+), 6 deletions(-) diff --git a/client/src/components/insert-term/InsertTermPage.jsx b/client/src/components/insert-term/InsertTermPage.jsx index 087ffc6e..c8d27f49 100644 --- a/client/src/components/insert-term/InsertTermPage.jsx +++ b/client/src/components/insert-term/InsertTermPage.jsx @@ -15,7 +15,7 @@ export default function InsertTermPage() { const [insertTerm, { isLoading }] = useInsertTermMutation(); - const handleSubmit = (e) => { + const handleSubmit = async (e) => { e.preventDefault(); // TODO: send request with this info to the server console.log({ @@ -25,11 +25,14 @@ export default function InsertTermPage() { understandCheckbox, }); try { - insertTerm({ + const res = await insertTerm({ termName, startDate: termStartDate, endDate: termEndDate, - }); + }).unwrap(); + console.log(res); + if (res.status === 400 || res.status === 500 ) + throw new Error("Something went wrong while inserting the term"); toast.success("تم إنشاء الفترة بنجاح"); } catch (err) { console.log(err); diff --git a/client/src/components/update-term-page/UpdateTermPage.jsx b/client/src/components/update-term-page/UpdateTermPage.jsx index 2d243866..eba3d313 100644 --- a/client/src/components/update-term-page/UpdateTermPage.jsx +++ b/client/src/components/update-term-page/UpdateTermPage.jsx @@ -30,7 +30,7 @@ export default function UpdateTermPage() { } }, [data]); - const handleSubmit = (e) => { + const handleSubmit = async (e) => { e.preventDefault(); // TODO: send request with this info to the server console.log({ @@ -40,11 +40,13 @@ export default function UpdateTermPage() { understandCheckbox, }); try { - updateTerm({ + const res = updateTerm({ termName, startDate: termStartDate, endDate: termEndDate, - }); + }).unwrap(); + if (res.status === 400 || res.status === 500) + throw new Error("Something went wrong while updating the term"); toast.success("تم تعديل الفترة بنجاح"); } catch (err) { console.log(err);