Brizco
/
web
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

shidtplan

main
حسین معصومی پور 2023-11-20 00:07:55 +03:30
parent bd46dfafa9
commit 97b41c1160
23 changed files with 3060 additions and 721 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/AppHeader/page.jsx
View File

@ -1,5 +1,6 @@
import Avatar from "boring-avatars"; import Avatar from "boring-avatars";
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/navigation";
import React from "react"; import React from "react";
const AppHeader = ({ const AppHeader = ({

4
components/ShiftComponent/ShiftCard/page.jsx → components/EmployeesComponent/Shifts/page.jsx
View File

@ -6,7 +6,7 @@ import PersianNumber from "plugins/PersianNumber";
import { getTimeOfDay } from "plugins/TimeOfDay/page"; import { getTimeOfDay } from "plugins/TimeOfDay/page";
import React, { useContext } from "react"; import React, { useContext } from "react";
const ShiftCard = () => { const ShiftsEmployees = () => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
const shiftsData = CTX.state.shiftsData; const shiftsData = CTX.state.shiftsData;
@ -134,4 +134,4 @@ const ShiftCard = () => {
); );
}; };
export default ShiftCard; export default ShiftsEmployees;

4
components/NavBar/NavBAr.jsx
View File

@ -180,9 +180,9 @@ const NavBAr = (props) => {
</> </>
</Link> </Link>
<Link href={"/routine"} className="w-full !no-underline ml-5"> <Link href={"/tasks"} className="w-full !no-underline ml-5">
<> <>
{usePath.includes("/routine") ? ( {usePath.includes("/tasks") ? (
<div className="flex justify-center w-full"> <div className="flex justify-center w-full">
<div className="w-[32px] mt-2"> <div className="w-[32px] mt-2">
<Image src={logo} /> <Image src={logo} />

4
components/TaskCard/page.jsx → components/TaskPage/ActivityCard/page.jsx
View File

@ -3,7 +3,7 @@ import Buttonbriz from "plugins/Buttonbriz/page";
import Input from "plugins/Input/page"; import Input from "plugins/Input/page";
import React, { useState } from "react"; import React, { useState } from "react";
const TaskCard = () => { const ActivityCard = () => {
const [conditionTask, setConditionTask] = useState(0); const [conditionTask, setConditionTask] = useState(0);
const handleConditionTaskCircle = () => { const handleConditionTaskCircle = () => {
@ -211,4 +211,4 @@ const TaskCard = () => {
); );
}; };
export default TaskCard; export default ActivityCard;

173
components/TaskPage/TasksCard/page.jsx 100644
View File

@ -0,0 +1,173 @@
"use client";
import AppContext from "@ctx/AppContext";
import moment from "jalali-moment";
import { useRouter } from "next/navigation";
import PersianNumber from "plugins/PersianNumber";
import React, { useContext, useEffect, useState } from "react";
import { Swiper, SwiperSlide } from "swiper/react";
const TasksCard = () => {
const CTX = useContext(AppContext);
const tasksData = CTX.state.tasksData;
const router = useRouter();
const [showAllTasks, setShowAllTasks] = useState(false);
const [showJust5TasksData, setShowJust5TasksData] = useState(null);
useEffect(() => {
if (tasksData.length > 5) {
setShowJust5TasksData(tasksData.slice(0, 5));
} else {
setShowJust5TasksData(tasksData);
}
}, [tasksData]);
const goToEditTask = (id) => {
CTX.setGoToEditTask(true);
router.push("/tasks/add-task?new=false");
CTX.GetTask(id);
CTX.setIdEditTask(id);
};
return (
<>
{showAllTasks ? (
<div className="grid grid-cols-2 gap-3">
{tasksData.map((e) => (
<div
className=" bg-white p-1 rounded-3xl overflow-hidden relative mt-5"
onClick={() => goToEditTask(e.id)}
>
<div className="flex mx-2">
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
{e?.scheduleType == 0
? "روزانه"
: e?.scheduleType == 1
? "هفتگی"
: e?.scheduleType == 2
? "مخصوص"
: ""}
</div>
</div>
<div className=" relative m-2 text-white">
<div className="text-right">
<h4 className="mb-0 text-primary-300 font-semibold text-sm">
{e?.title}{" "}
</h4>
</div>
</div>
<div className="flex">
{e?.scheduleType == 2 && (
<div className=" w-fit relative text-[12px] my-2 pr-1 rounded-3xl text-primary-200">
<PersianNumber
number={moment(e?.setFor).format("jYYYY/jM/jD")}
/>{" "}
</div>
)}
<div className="bg-primary-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-primary-300">
{e?.shifts[0]}
</div>
</div>
</div>
))}
</div>
) : (
<Swiper
spaceBetween={20}
slidesPerView={1.6}
onSlideChange={() => console.log("slide change")}
onSwiper={(swiper) => console.log(swiper)}
>
{showJust5TasksData?.map((e) => (
<SwiperSlide>
<div
className=" bg-white p-1 rounded-3xl overflow-hidden relative mt-5"
onClick={() => goToEditTask(e.id)}
>
<div className="flex mx-2">
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
{e?.scheduleType == 0
? "روزانه"
: e?.scheduleType == 1
? "هفتگی"
: e?.scheduleType == 2
? "مخصوص"
: ""}
</div>
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
{e?.shifts[0]}
</div>
</div>
<div className=" relative m-2 text-white">
<div className="text-right h-[45px] overflow-hidden">
<h4 className="mb-0 text-primary-300 font-semibold text-sm ">
{e?.title}{" "}
</h4>
</div>
<div className="flex">
<div className="flex rtl mt-2 w-full">
<div className="absolute right-[0px] bg-red-900 w-[40px] h-[40px] rounded-full border-2 z-[1]"></div>
<div className="absolute right-[13px] bg-green-900 w-[40px] h-[40px] rounded-full border-2 z-[2]"></div>
<div className="absolute right-[26px] bg-sky-900 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
</div>
<div className="relative w-full">
<p className="text-black text-sm mt-4">
+
<strong className="mx-1">
<PersianNumber number={3} />
</strong>
نفر دیگر
</p>
</div>
</div>
<div className="flex mt-6 relative">
<div>
<svg
width="20"
height="20"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.0833 2.33332H9.91667V1.74999C9.91667 1.59528 9.85522 1.44691 9.74582 1.33751C9.63642 1.22811 9.48805 1.16666 9.33334 1.16666C9.17863 1.16666 9.03026 1.22811 8.92086 1.33751C8.81146 1.44691 8.75001 1.59528 8.75001 1.74999V2.33332H5.25001V1.74999C5.25001 1.59528 5.18855 1.44691 5.07915 1.33751C4.96975 1.22811 4.82138 1.16666 4.66667 1.16666C4.51196 1.16666 4.36359 1.22811 4.25419 1.33751C4.1448 1.44691 4.08334 1.59528 4.08334 1.74999V2.33332H2.91667C2.45254 2.33332 2.00742 2.5177 1.67923 2.84589C1.35105 3.17408 1.16667 3.61919 1.16667 4.08332V11.0833C1.16667 11.5475 1.35105 11.9926 1.67923 12.3208C2.00742 12.6489 2.45254 12.8333 2.91667 12.8333H11.0833C11.5475 12.8333 11.9926 12.6489 12.3208 12.3208C12.649 11.9926 12.8333 11.5475 12.8333 11.0833V4.08332C12.8333 3.61919 12.649 3.17408 12.3208 2.84589C11.9926 2.5177 11.5475 2.33332 11.0833 2.33332ZM11.6667 11.0833C11.6667 11.238 11.6052 11.3864 11.4958 11.4958C11.3864 11.6052 11.238 11.6667 11.0833 11.6667H2.91667C2.76196 11.6667 2.61359 11.6052 2.50419 11.4958C2.3948 11.3864 2.33334 11.238 2.33334 11.0833V6.99999H11.6667V11.0833ZM11.6667 5.83332H2.33334V4.08332C2.33334 3.92861 2.3948 3.78024 2.50419 3.67084C2.61359 3.56145 2.76196 3.49999 2.91667 3.49999H4.08334V4.08332C4.08334 4.23803 4.1448 4.38641 4.25419 4.4958C4.36359 4.6052 4.51196 4.66666 4.66667 4.66666C4.82138 4.66666 4.96975 4.6052 5.07915 4.4958C5.18855 4.38641 5.25001 4.23803 5.25001 4.08332V3.49999H8.75001V4.08332C8.75001 4.23803 8.81146 4.38641 8.92086 4.4958C9.03026 4.6052 9.17863 4.66666 9.33334 4.66666C9.48805 4.66666 9.63642 4.6052 9.74582 4.4958C9.85522 4.38641 9.91667 4.23803 9.91667 4.08332V3.49999H11.0833C11.238 3.49999 11.3864 3.56145 11.4958 3.67084C11.6052 3.78024 11.6667 3.92861 11.6667 4.08332V5.83332Z"
fill="#888888"
/>
</svg>
</div>
<p className="mb-0 text-textMain-100 text-sm opacity-70 mr-1">
<PersianNumber
number={moment(e?.setFor).format("jYYYY/jM/jD")}
/>
</p>
</div>
</div>
</div>
</SwiperSlide>
))}
<SwiperSlide>
{tasksData.length > 5 && (
<div
className=" bg-white p-1 rounded-3xl overflow-hidden h-[180px] mt-5 w-4/12"
onClick={() => setShowAllTasks(true)}
>
<div className="pt-[60px]">
<p className="mb-0 text-sm text-center text-primary-300 font-bold">
مشاهده بیشتر
</p>
</div>
</div>
)}
</SwiperSlide>
</Swiper>
)}
</>
);
};
export default TasksCard;

1
package.json
View File

@ -14,6 +14,7 @@
"autoprefixer": "10.4.15", "autoprefixer": "10.4.15",
"axios": "^1.5.1", "axios": "^1.5.1",
"boring-avatars": "^1.10.1", "boring-avatars": "^1.10.1",
"chart.js": "^4.4.0",
"core-util-is": "^1.0.3", "core-util-is": "^1.0.3",
"framer-motion": "^10.16.1", "framer-motion": "^10.16.1",
"jalali-moment": "^3.3.11", "jalali-moment": "^3.3.11",

161
plugins/BottomSheet/BottomSheetAddUserToPositionShiftPlan.jsx 100644
View File

@ -0,0 +1,161 @@
"use client";
import React, { useContext, useEffect, useRef, useState } from "react";
import { BottomSheet } from "react-spring-bottom-sheet";
import Input from "plugins/Input/page";
import AppContext from "@ctx/AppContext";
import SimpleReactValidator from "simple-react-validator";
import CheckBoxBriz from "plugins/CheckBoxBriz/page";
import Buttonbriz from "plugins/Buttonbriz/page";
import { toast } from "react-toastify";
const BottomSheetAddUserToPositionShiftPlan = ({
setUserAndPositionIds,
userAndPositionIds,
positionId,
positionName,
}) => {
const CTX = useContext(AppContext);
const [, forceUpdate] = useState();
const usersData = CTX.state.usersData;
const validator = useRef(
new SimpleReactValidator({
messages: {
required: "پر کردن این فیلد الزامی میباشد",
},
element: (message) => (
<>
<div className="text-right px-1 ">
<small className="text-red-600 t-ig-small ">{message}</small>
</div>
</>
),
})
);
// const body = {
// persianName,
// englishName,
// description,
// permissions: permissionsChoose,
// };
// const bodyUpdate = {
// persianName,
// englishName,
// description,
// permissions: permissionsChoose,
// roleId: roleData.roleId,
// };
// const clear = () => {
// setPersianName("");
// setEnglishName("");
// setDescription("");
// CTX.setPermissionsChoose([]);
// };
// const handleCreateRole = (update) => {
// if (validator.current.allValid()) {
// if (update == "UPDATE") {
// CTX.UpdateRole(bodyUpdate);
// } else {
// CTX.CreateRole(body);
// }
// } else {
// toast.error("پرکردن همه ی فیلد ها واجب است", {
// position: "bottom-right",
// autoClose: 2000,
// hideProgressBar: false,
// closeOnClick: true,
// pauseOnHover: true,
// draggable: true,
// progress: undefined,
// });
// validator.current.showMessages();
// forceUpdate(1);
// }
// };
const handleBottomSheetAddUserToPositionShiftPlan = (e) => {
if (e.type == "OPEN") {
CTX.GetUsers();
} else if (e.type == "CLOSE") {
// clear();
// CTX.setGoToEditRole(false);
// CTX.setIdEditRole(null);
// CTX.setRoleData([]);
}
};
// useEffect(() => {
// if (goToEditRole) {
// setPersianName(roleData.persianName);
// setEnglishName(roleData.englishName);
// setDescription(roleData.description);
// CTX.setPermissionsChoose(roleData.permissions);
// }
// }, [roleData]);
return (
<BottomSheet
onSpringStart={(e) => handleBottomSheetAddUserToPositionShiftPlan(e)}
open={CTX.state.BottomSheetAddUserToPositionShiftPlanOpen}
onDismiss={() => CTX.setBottomSheetAddUserToPositionShiftPlanOpen(false)}
blocking={false}
>
<div className="text-center py-2 bg-primary-300 ">
<p className="mb-0 text-white relative top-[-5px]">
افزودن یوزر به پوزیشن {positionName}
</p>
</div>
{usersData?.map((e) => (
<div
className={`rounded-2xl m-3 tr03 ${
userAndPositionIds.find(
(item) => item.value === e.userId && item.key == positionId
)
? "bg-primary-100"
: "bg-gray-100"
}`}
onClick={() => {
const userExistsIndex = userAndPositionIds.findIndex(
(item) => item.value === e.userId && item.key === positionId
);
if (userExistsIndex !== -1) {
setUserAndPositionIds((current) => [
...current.slice(0, userExistsIndex),
...current.slice(userExistsIndex + 1),
]);
} else {
setUserAndPositionIds((current) => [
...current,
{
key: positionId,
value: e.userId,
},
]);
}
}}
>
<div className="flex rtl justify-between p-3">
<p className="mb-0 m-1">
{e?.firstName} {e?.lastName}
</p>
<p className="mb-0 bg-primary-100 text-primary-300 rounded-full p-2 text-sm">
{e?.roleNames[0]}
</p>
</div>
</div>
))}
</BottomSheet>
);
};
export default BottomSheetAddUserToPositionShiftPlan;

44
plugins/BottomSheet/BottomSheetCreateEmployees.jsx
View File

@ -23,7 +23,7 @@ const BottomSheetCreateEmployees = (props) => {
const [roleSelectCurrntData, setRoleSelectCurrntData] = useState(""); const [roleSelectCurrntData, setRoleSelectCurrntData] = useState("");
const [roleSelectData, setRoleSelectData] = useState([]); const [roleSelectData, setRoleSelectData] = useState([]);
const [positionId, setPositionId] = useState(""); // const [positionId, setPositionId] = useState("");
const [positionIdSelectData, setPositionIdSelectData] = useState(""); const [positionIdSelectData, setPositionIdSelectData] = useState("");
const [, forceUpdate] = useState(); const [, forceUpdate] = useState();
@ -64,7 +64,7 @@ const BottomSheetCreateEmployees = (props) => {
gender: parseInt(gender), gender: parseInt(gender),
// nationalId, // nationalId,
roleIds: rolesChoose, roleIds: rolesChoose,
positionId, // positionId,
}; };
const bodyUpdate = { const bodyUpdate = {
@ -83,7 +83,7 @@ const BottomSheetCreateEmployees = (props) => {
// nationalId, // nationalId,
roleIds: rolesChoose, roleIds: rolesChoose,
userId: userData.id, userId: userData.id,
positionId, // positionId,
}; };
console.log(bodyUpdate); console.log(bodyUpdate);
@ -97,7 +97,7 @@ const BottomSheetCreateEmployees = (props) => {
// setBirthDate(""); // setBirthDate("");
setRoleSelectCurrntData(""); setRoleSelectCurrntData("");
setRoleSelectData([]); setRoleSelectData([]);
setPositionId(""); // setPositionId("");
CTX.setRolesChoose([]); CTX.setRolesChoose([]);
}; };
@ -148,12 +148,12 @@ const BottomSheetCreateEmployees = (props) => {
})) }))
); );
setPositionIdSelectData( // setPositionIdSelectData(
positionsData.map((item) => ({ // positionsData.map((item) => ({
key: item.name, // key: item.name,
value: item.id, // value: item.id,
})) // }))
); // );
console.log(idEditUser); console.log(idEditUser);
@ -190,7 +190,7 @@ const BottomSheetCreateEmployees = (props) => {
// }); // });
// setRoleSelectCurrntData(""); // setRoleSelectCurrntData("");
CTX.setRolesChoose(userData.roleIds); CTX.setRolesChoose(userData.roleIds);
setPositionId(userData.positionId); // setPositionId(userData.positionId);
console.log("userData2", userData); console.log("userData2", userData);
} }
@ -361,27 +361,14 @@ const BottomSheetCreateEmployees = (props) => {
))} ))}
</div> </div>
<div className=""> {/* <div className="">
<Input <Input
lable="پوزیشن مد نظر" lable="پوزیشن مد نظر"
id="positionId-id" id="positionId-id"
name="positionId" name="positionId"
type={"text"} type={"text"}
// value={sectionIdSelectCurrntData}
inputEvent={(e) => { inputEvent={(e) => {
setPositionId(e.target.value); setPositionId(e.target.value);
// setSectionId(e.target.value);
// if (!!sectionIdChoose.find((b) => b == e.target.value)) {
// toast.error("سکشن تکراری است", {
// position: "bottom-right",
// closeOnClick: true,
// });
// } else {
// CTX.setSectionIdChoose((current) => [
// ...current,
// e.target.value,
// ]);
// }
}} }}
style="text-right" style="text-right"
validatorData={validator.current.message( validatorData={validator.current.message(
@ -397,18 +384,13 @@ const BottomSheetCreateEmployees = (props) => {
<div className="flex flex-wrap mt-3 rtl"> <div className="flex flex-wrap mt-3 rtl">
<div className="flex bg-gray-300 p-1 rounded-full m-1 justify-start"> <div className="flex bg-gray-300 p-1 rounded-full m-1 justify-start">
{/* <div
className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deleteSection(e)}
></div> */}
<div> <div>
<p className="mb-0 px-3 text-sm mt-1"> <p className="mb-0 px-3 text-sm mt-1">
{positionsData?.find((b) => b.id == positionId)?.name} {positionsData?.find((b) => b.id == positionId)?.name}
</p> </p>
</div> </div>
</div> </div>
</div> </div> */}
{goToEditUser ? ( {goToEditUser ? (
<Buttonbriz <Buttonbriz

4
plugins/BottomSheet/BottomSheetCreateRoutine.jsx
View File

@ -36,12 +36,12 @@ const BottomSheetCreateRoutine = (props) => {
const body = { const body = {
description, description,
title, name: title,
}; };
const bodyUpdate = { const bodyUpdate = {
description, description,
title, name: title,
id: idEditRoutine, id: idEditRoutine,
}; };

47
plugins/BottomSheet/BottomSheetCreateShifts.jsx
View File

@ -13,6 +13,9 @@ const BottomSheetCreateShifts = (props) => {
const [title, setTitle] = useState(""); const [title, setTitle] = useState("");
const [description, setDescription] = useState(""); const [description, setDescription] = useState("");
const [dayOfWeeksCurrent, setDayOfWeeksCurrent] = useState(""); const [dayOfWeeksCurrent, setDayOfWeeksCurrent] = useState("");
const [routineId, setRoutineId] = useState([]);
const [routineIdSelectData, setRoutineIdSelectData] = useState("");
const [, forceUpdate] = useState(); const [, forceUpdate] = useState();
const dayOfWeeksChoose = CTX.state.dayOfWeeksChoose; const dayOfWeeksChoose = CTX.state.dayOfWeeksChoose;
@ -21,6 +24,7 @@ const BottomSheetCreateShifts = (props) => {
const goToEditShift = CTX.state.goToEditShift; const goToEditShift = CTX.state.goToEditShift;
const idEditShift = CTX.state.idEditShift; const idEditShift = CTX.state.idEditShift;
const shiftData = CTX.state.shiftData; const shiftData = CTX.state.shiftData;
const routinesData = CTX.state.routinesData;
const validator = useRef( const validator = useRef(
new SimpleReactValidator({ new SimpleReactValidator({
@ -53,6 +57,7 @@ const BottomSheetCreateShifts = (props) => {
setDayOfWeeksCurrent(""); setDayOfWeeksCurrent("");
setDescription(""); setDescription("");
setTitle(""); setTitle("");
setRoutineId([]);
CTX.setEndAtTimeShift(["00", "00"]); CTX.setEndAtTimeShift(["00", "00"]);
CTX.setStartAtTimeShift(["00", "00"]); CTX.setStartAtTimeShift(["00", "00"]);
CTX.setDayOfWeeksChoose([]); CTX.setDayOfWeeksChoose([]);
@ -64,6 +69,7 @@ const BottomSheetCreateShifts = (props) => {
endAt: endAtTimeShift[0] + ":" + endAtTimeShift[1] + ":00", endAt: endAtTimeShift[0] + ":" + endAtTimeShift[1] + ":00",
startAt: startAtTimeShift[0] + ":" + startAtTimeShift[1] + ":00", startAt: startAtTimeShift[0] + ":" + startAtTimeShift[1] + ":00",
dayOfWeeks: dayOfWeeksChoose, dayOfWeeks: dayOfWeeksChoose,
routines: routineId,
}; };
const bodyUpdate = { const bodyUpdate = {
@ -73,6 +79,7 @@ const BottomSheetCreateShifts = (props) => {
startAt: startAtTimeShift[0] + ":" + startAtTimeShift[1] + ":00", startAt: startAtTimeShift[0] + ":" + startAtTimeShift[1] + ":00",
dayOfWeeks: dayOfWeeksChoose, dayOfWeeks: dayOfWeeksChoose,
id: shiftData.id, id: shiftData.id,
routines: routineId,
}; };
const handleCreateShift = (update) => { const handleCreateShift = (update) => {
if (validator.current.allValid()) { if (validator.current.allValid()) {
@ -100,6 +107,13 @@ const BottomSheetCreateShifts = (props) => {
console.log(body); console.log(body);
const handleBottomSheetCreateShift = (e) => { const handleBottomSheetCreateShift = (e) => {
setRoutineIdSelectData(
routinesData.map((item) => ({
key: item.name,
value: item.id,
}))
);
if (e.type == "OPEN") { if (e.type == "OPEN") {
if (goToEditShift) { if (goToEditShift) {
CTX.GetShift(idEditShift); CTX.GetShift(idEditShift);
@ -129,11 +143,13 @@ const BottomSheetCreateShifts = (props) => {
shiftData.endAt.split(":")[0], shiftData.endAt.split(":")[0],
shiftData.endAt.split(":")[1], shiftData.endAt.split(":")[1],
]); ]);
setRoutineId(shiftData.routines.map((item) => item.routineId));
CTX.setDayOfWeeksChoose(shiftData.days); CTX.setDayOfWeeksChoose(shiftData.days);
} }
}, [shiftData]); }, [shiftData]);
console.log("routineId", routineId);
return ( return (
<BottomSheet <BottomSheet
onSpringStart={(e) => handleBottomSheetCreateShift(e)} onSpringStart={(e) => handleBottomSheetCreateShift(e)}
@ -272,7 +288,6 @@ const BottomSheetCreateShifts = (props) => {
defaultValue={"انتخاب کنید"} defaultValue={"انتخاب کنید"}
/> />
</div> </div>
<div className="flex flex-wrap mt-3 rtl"> <div className="flex flex-wrap mt-3 rtl">
{dayOfWeeksChoose && {dayOfWeeksChoose &&
dayOfWeeksChoose.map((e) => ( dayOfWeeksChoose.map((e) => (
@ -290,6 +305,36 @@ const BottomSheetCreateShifts = (props) => {
</div> </div>
))} ))}
</div> </div>
<div className="">
<Input
lable="روتین شیفت"
id="routineId-id"
name="routineId"
type={"text"}
inputEvent={(e) => {
setRoutineId([e.target.value]);
}}
style="text-right"
validatorData={validator.current.message(
"routineId",
routineId[0],
"required"
)}
select={true}
selectData={routineIdSelectData}
defaultValue={"انتخاب کنید"}
/>
</div>
<div className="flex flex-wrap mt-3 rtl">
<div className="flex bg-gray-300 p-1 rounded-full m-1 justify-start">
<div>
<p className="mb-0 px-3 text-sm mt-1">
{routinesData?.find((b) => b.id == routineId[0])?.name}
</p>
</div>
</div>
</div>
<div className=""> <div className="">
<Input <Input

20
plugins/DatePickerIran/page.jsx
View File

@ -6,7 +6,15 @@ import Buttonbriz from "plugins/Buttonbriz/page";
import { Calendar } from "react-modern-calendar-datepicker"; import { Calendar } from "react-modern-calendar-datepicker";
import AppContext from "@ctx/AppContext"; import AppContext from "@ctx/AppContext";
const DatePickerIran = ({ datePickerEvent, date, zindex }) => { const DatePickerIran = ({
datePickerEvent,
date,
zindex,
title,
validator,
validatorData,
name,
}) => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
const [selectedDay, setSelectedDay] = useState(null); const [selectedDay, setSelectedDay] = useState(null);
@ -26,7 +34,7 @@ const DatePickerIran = ({ datePickerEvent, date, zindex }) => {
className={`flex justify-end relative top-[22px] right-3 ltr ${zindex}`} className={`flex justify-end relative top-[22px] right-3 ltr ${zindex}`}
> >
<div className="bg-body-100 px-2"> <div className="bg-body-100 px-2">
<p className="mb-0 text-sm mr-0 mx-auto">تاریخ تولد</p> <p className="mb-0 text-sm mr-0 mx-auto">{title}</p>
</div> </div>
</div> </div>
@ -38,7 +46,15 @@ const DatePickerIran = ({ datePickerEvent, date, zindex }) => {
2 == 1 ? "form-control-white" : "form-control" 2 == 1 ? "form-control-white" : "form-control"
}`} }`}
locale="fa" locale="fa"
name={name}
/> />
<div className="flex justify-start w-full absolute mt-[-2px]">
<small className="absolute ">
{" "}
{validator ? <>{validatorData}</> : ""}
</small>
</div>
</div> </div>
); );
}; };

1076
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff

169
src/app/add-task/page.jsx
View File

@ -1,169 +0,0 @@
import AppHeader from "@comp/AppHeader/page";
import Buttonbriz from "plugins/Buttonbriz/page";
import Input from "plugins/Input/page";
import PersianNumber from "plugins/PersianNumber";
import React from "react";
const AddTask = () => {
return (
<div className="pb-20">
<AppHeader
title=" افزودن فعالیت جدید"
sub=" قابلیت افزودن فعالیت جدید مختلف"
icon2={true}
iconName2="ARROW"
iconHref2="/home"
/>
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl">
<div>
<div className="">
<Input
lable="عنوان فعالیت "
id="taskTitle-id"
name="taskTitle"
type={"text"}
/>
</div>
<div className="">
<Input
lable="توضیحات کلی فعالیت "
id="taskDetail-id"
name="taskDetail"
type={"text"}
textarea={true}
/>
</div>
<div className="">
<Input
lable="عنوان فعالیت "
id="taskTitle-id"
name="taskTitle"
type={"text"}
/>
<div className="flex ">
<div className="flex relative rtl mt-2 w-6/12 ">
<div className="absolute right-[0px] bg-red-900 w-[40px] h-[40px] rounded-full border-2 z-[1]"></div>
<div className="absolute right-[13px] bg-green-900 w-[40px] h-[40px] rounded-full border-2 z-[2]"></div>
<div className="absolute right-[26px] bg-sky-900 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
<div className="absolute right-[39px] bg-sky-300 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
<div className="absolute right-[52px] bg-green-300 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
<div className="absolute right-[65px] bg-red-300 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
</div>
<div className="relative w-full">
<p className="text-black text-sm mt-4">
+
<strong className="mx-1">
<PersianNumber number={3} />
</strong>
نفر دیگر
</p>
</div>
</div>
</div>
</div>
<div>
<div className="flex rtl mt-10">
<div>
<input
type="checkbox"
className="w-[40px] h-[40px] !rounded-xl mx-2 custom-checkbox mt-1"
/>
</div>
<div className="mt-1">
<h6 className="text-sm text-textMain-100 font-bold">
آیا این تسک تکرار پذیر است ؟
</h6>
<p className="mb-0 text-textMain-100 text-right text-[12px]">
تسک با قابلیت تکرار در زمان های متناوب تکرار میشوند
</p>
</div>
</div>
<div className="">
<Input
lable="توضیحات کلی فعالیت "
id="taskDetail-id"
name="taskDetail"
type={"text"}
mt="2"
disabled={true}
/>
</div>
</div>
<div>
<div className="flex rtl mt-5">
<div>
<input
type="checkbox"
className="w-[40px] h-[40px] !rounded-xl mx-2 custom-checkbox mt-1"
/>
</div>
<div className="mt-1">
<h6 className="text-sm text-textMain-100 font-bold">
ایا این تسک به گروهی متصل است ؟{" "}
</h6>
<p className="mb-0 text-textMain-100 text-right text-[12px]">
شما میتوانید یک تسک را به گروهی از افراد متصل کنید{" "}
</p>
</div>
</div>
<div className="">
<Input
lable="توضیحات کلی فعالیت "
id="taskDetail-id"
name="taskDetail"
type={"text"}
mt="2"
disabled={true}
/>
</div>
</div>
<div>
<div className="flex rtl mt-5">
<div>
<input
type="checkbox"
className="w-[40px] h-[40px] !rounded-xl mx-2 custom-checkbox mt-1"
/>
</div>
<div className="mt-1">
<h6 className="text-sm text-textMain-100 font-bold">
ایا این تسک به فرد متصل است ؟{" "}
</h6>
<p className="mb-0 text-textMain-100 text-right text-[12px]">
شما میتوانید یک تسک را به تنها یک فرد خاص متصل کنید{" "}
</p>
</div>
</div>
<div className="">
<Input
lable="توضیحات کلی فعالیت "
id="taskDetail-id"
name="taskDetail"
type={"text"}
mt="2"
disabled={true}
/>
</div>
</div>
<Buttonbriz title="ثبت فعالیت" color="INFO" icon="CHECK" />
</div>
</div>
);
};
export default AddTask;

116
src/app/employees/page.jsx
View File

@ -13,8 +13,10 @@ import BottomSheetCreatePosition from "plugins/BottomSheet/BottomSheetCreatePosi
import BottomSheetCreateRole from "plugins/BottomSheet/BottomSheetCreateRole"; import BottomSheetCreateRole from "plugins/BottomSheet/BottomSheetCreateRole";
import BottomSheetCreateRoutine from "plugins/BottomSheet/BottomSheetCreateRoutine"; import BottomSheetCreateRoutine from "plugins/BottomSheet/BottomSheetCreateRoutine";
import BottomSheetCreateSection from "plugins/BottomSheet/BottomSheetCreateSection"; import BottomSheetCreateSection from "plugins/BottomSheet/BottomSheetCreateSection";
import BottomSheetCreateShifts from "plugins/BottomSheet/BottomSheetCreateShifts";
import PersianNumber from "plugins/PersianNumber"; import PersianNumber from "plugins/PersianNumber";
import React, { useContext, useEffect, useState } from "react"; import React, { useContext, useEffect, useState } from "react";
import ShiftsEmployees from "@comp/EmployeesComponent/Shifts/page";
// import second from "@img/test.png"; // import second from "@img/test.png";
@ -24,17 +26,46 @@ const Employees = (props) => {
const [activeSection, setActiveSection] = useState(0); const [activeSection, setActiveSection] = useState(0);
useEffect(() => { useEffect(() => {
CTX.GetRoles();
CTX.GetUsers();
CTX.GetRoutines(); CTX.GetRoutines();
CTX.GetSections();
CTX.GetPositions();
}, []); }, []);
const routinesData = CTX.state.routinesData; const handleGetApi = (num) => {
const sectionsData = CTX.state.sectionsData; setActiveSection(num);
const usersData = CTX.state.usersData; switch (num) {
const positionsData = CTX.state.positionsData; case 0:
if (activeSection != num) {
CTX.GetRoutines();
}
break;
case 1:
if (activeSection != num) {
CTX.GetSections();
}
break;
case 2:
if (activeSection != num) {
CTX.GetPositions();
}
break;
case 3:
if (activeSection != num) {
CTX.GetUsers();
CTX.GetRoles();
}
break;
case 4:
if (activeSection != num) {
CTX.GetShifts();
CTX.GetRoutines();
}
break;
default:
break;
}
};
// const justLength = CTX.state.justLength;
return ( return (
<div className="pb-20"> <div className="pb-20">
@ -53,7 +84,7 @@ const Employees = (props) => {
<div> <div>
<div <div
className="flex justify-between mt-7 bg-white rounded-2xl" className="flex justify-between mt-7 bg-white rounded-2xl"
onClick={() => setActiveSection(0)} onClick={() => handleGetApi(0)}
> >
<div className="flex p-2"> <div className="flex p-2">
<div className="bg-gray-100 rounded-xl p-3 w-fit"> <div className="bg-gray-100 rounded-xl p-3 w-fit">
@ -68,7 +99,7 @@ const Employees = (props) => {
<p className="mb-0 text-[10px] opacity-90 "> <p className="mb-0 text-[10px] opacity-90 ">
شما شما
<strong className="mx-1 text-primary-300"> <strong className="mx-1 text-primary-300">
<PersianNumber number={routinesData?.length} /> {/* <PersianNumber number={routinesData?.length} /> */}
</strong> </strong>
روتین فعال دارید روتین فعال دارید
</p> </p>
@ -145,7 +176,7 @@ const Employees = (props) => {
<div> <div>
<div <div
className="flex justify-between mt-7 bg-white rounded-2xl" className="flex justify-between mt-7 bg-white rounded-2xl"
onClick={() => setActiveSection(1)} onClick={() => handleGetApi(1)}
> >
<div className="flex p-2"> <div className="flex p-2">
<div className="bg-gray-100 rounded-xl p-3 w-fit"> <div className="bg-gray-100 rounded-xl p-3 w-fit">
@ -158,7 +189,7 @@ const Employees = (props) => {
<p className="mb-0 text-[10px] opacity-90 "> <p className="mb-0 text-[10px] opacity-90 ">
شما شما
<strong className="mx-1 text-primary-300"> <strong className="mx-1 text-primary-300">
<PersianNumber number={sectionsData?.length} /> {/* <PersianNumber number={sectionsData?.length} /> */}
</strong> </strong>
سکشن فعال دارید سکشن فعال دارید
</p> </p>
@ -196,7 +227,7 @@ const Employees = (props) => {
<div> <div>
<div <div
className="flex justify-between mt-7 bg-white rounded-2xl" className="flex justify-between mt-7 bg-white rounded-2xl"
onClick={() => setActiveSection(2)} onClick={() => handleGetApi(2)}
> >
<div className="flex p-2"> <div className="flex p-2">
<div className="bg-gray-100 rounded-xl p-3 w-fit"> <div className="bg-gray-100 rounded-xl p-3 w-fit">
@ -211,7 +242,7 @@ const Employees = (props) => {
<p className="mb-0 text-[10px] opacity-90 "> <p className="mb-0 text-[10px] opacity-90 ">
شما شما
<strong className="mx-1 text-primary-300"> <strong className="mx-1 text-primary-300">
<PersianNumber number={positionsData?.length} /> {/* <PersianNumber number={positionsData?.length} /> */}
</strong> </strong>
پوزیشن فعال دارید پوزیشن فعال دارید
</p> </p>
@ -249,7 +280,7 @@ const Employees = (props) => {
<div> <div>
<div <div
className="flex justify-between mt-7 bg-white rounded-2xl" className="flex justify-between mt-7 bg-white rounded-2xl"
onClick={() => setActiveSection(3)} onClick={() => handleGetApi(3)}
> >
<div className="flex p-2"> <div className="flex p-2">
<div className="bg-gray-100 rounded-xl p-3 w-fit"> <div className="bg-gray-100 rounded-xl p-3 w-fit">
@ -262,7 +293,7 @@ const Employees = (props) => {
<p className="mb-0 text-[10px] opacity-90 "> <p className="mb-0 text-[10px] opacity-90 ">
شما شما
<strong className="mx-1 text-primary-300"> <strong className="mx-1 text-primary-300">
<PersianNumber number={usersData?.length} /> {/* <PersianNumber number={usersData?.length} /> */}
</strong> </strong>
کارمند فعال دارید کارمند فعال دارید
</p> </p>
@ -297,12 +328,65 @@ const Employees = (props) => {
</div> </div>
{activeSection == 3 && <UsersEmployees />} {activeSection == 3 && <UsersEmployees />}
</div> </div>
<div>
<div
className="flex justify-between mt-7 bg-white rounded-2xl"
onClick={() => handleGetApi(4)}
>
<div className="flex p-2">
<div className="bg-gray-100 rounded-xl p-3 w-fit">
<p className="mb-0 text-center pt-3">
<PersianNumber number={5} style="text-[30px] " />
</p>
</div>
<div className="m-2">
<h4 className="text-base font-bold">مدیریت شیفت های مجموعه</h4>
<p className="mb-0 text-[10px] opacity-90 ">
شما
<strong className="mx-1 text-primary-300">
{/* <PersianNumber number={shiftsData?.length} /> */}
</strong>
شیفت فعال دارید
</p>
</div>
</div>
{activeSection == 4 ? (
<div
className="w-[40px] h-[40px] bg-gray-100 shadow-sm rounded-xl m-[15px] "
onClick={() => CTX.setBottomSheetCreateShiftsOpen(true)}
>
<svg
width="22"
height="22"
viewBox="0 0 16 16"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-2 opacity-70"
>
<path
d="M8 1V15M1 8H15"
stroke="#2B2B2B"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</div>
) : (
<div className="w-[10px] h-[10px] bg-gray-200 shadow-sm rounded-xl m-[15px] "></div>
)}
</div>
{activeSection == 4 && <ShiftsEmployees />}
</div>
</div> </div>
{/* <BottomSheetCreateRole /> */} {/* <BottomSheetCreateRole /> */}
<BottomSheetCreateEmployees /> <BottomSheetCreateEmployees />
<BottomSheetCreateSection /> <BottomSheetCreateSection />
<BottomSheetCreateRoutine /> <BottomSheetCreateRoutine />
<BottomSheetCreatePosition /> <BottomSheetCreatePosition />
<BottomSheetCreateShifts />
</div> </div>
); );
}; };

95
src/app/home/page.jsx
View File

@ -10,6 +10,37 @@ import { ParseJwt } from "plugins/ParseJwt/page";
import PersianNumber from "plugins/PersianNumber"; import PersianNumber from "plugins/PersianNumber";
import React, { useContext, useEffect } from "react"; import React, { useContext, useEffect } from "react";
// import { Swiper, SwiperSlide } from "swiper/react"; // import { Swiper, SwiperSlide } from "swiper/react";
import { Chart as ChartJS, ArcElement, Tooltip, Legend } from "chart.js";
import { Doughnut, Pie } from "react-chartjs-2";
ChartJS.register(ArcElement, Tooltip, Legend);
export const data = {
datasets: [
{
label: ["پوزیشن"],
data: [60, 38, 95, 60, 20, 30],
backgroundColor: [
"rgba(46, 161, 134, 0.8)",
"rgba(52, 115, 101, 0.41)",
"rgba(80, 143, 114, 0.61)",
"rgba(75, 155, 138, 0.61)",
"rgba(85, 155, 138, 0.91)",
"rgba(12, 75, 61, 0.51)",
],
borderColor: [
"rgba(255, 99, 132, 1)",
"rgba(54, 162, 235, 1)",
"rgba(255, 206, 86, 1)",
"rgba(75, 192, 192, 1)",
"rgba(153, 102, 255, 1)",
"rgba(255, 159, 64, 1)",
],
borderWidth: 1,
borderColor: " #356859",
},
],
};
const Home = (props) => { const Home = (props) => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
@ -53,8 +84,68 @@ const Home = (props) => {
/> />
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-5 rtl"> <div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-5 rtl">
<div className="w-[200px] mx-auto flex "> <div className=" p-2 rounded-xl my-3">
<Pie data={data} /> <div className="m-2">
<h2 className="mb-0 font-bold text-base">مسیر فرایند شروع</h2>
<p className="mb-0 text-sm text-gray-600 mt-2">
شما
<PersianNumber number={60} style="font-bold mx-1" />
درصد از فرایند شروع را انجام داده اید
</p>
</div>
<div className=" border-[2px] border-primary-300 opacity-70 p-3 rounded-full z-10 relative"></div>
<div className="relative flex justify-end">
<div className=" bg-secondary-100 absolute w-[70%] p-3 rounded-full mt-[-26px] z-0"></div>
</div>
<div className="flex justify-end mt-3">
<p className="mb-0 w-fit text-sm">ادامه فرایند</p>
<div>
{" "}
<svg
width="12"
height="12"
viewBox="0 0 11 18"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className=" mt-[3px] mx-1"
>
<path d="M10 1L2 9L10 17" stroke="#555555" stroke-width="2" />
</svg>
</div>
</div>
</div>
<div className="bg-white rounded-2xl p-3">
<div className="flex justify-between ">
<div>
<div className="flex mt-3">
<div className="w-[35px] h-[10px] mt-2 bg-primary-300 rounded-full"></div>
<p className="mb-0 text-sm mx-2"> پوزیشن</p>
</div>
<div className="flex mt-3">
<div className="w-[15px] h-[10px] mt-2 bg-primary-300 rounded-full"></div>
<p className="mb-0 text-sm mx-2"> سکشن</p>
</div>
<div className="flex mt-3">
<div className="w-[20px] h-[10px] mt-2 bg-primary-300 rounded-full"></div>
<p className="mb-0 text-sm mx-2"> روتین</p>
</div>
<div className="flex mt-3">
<div className="w-[70px] h-[10px] mt-2 bg-primary-300 rounded-full"></div>
<p className="mb-0 text-sm mx-2"> یوزر</p>
</div>
<div className="flex mt-3">
<div className="w-[10px] h-[10px] mt-2 bg-primary-300 rounded-full"></div>
<p className="mb-0 text-sm mx-2"> شبفت</p>
</div>
</div>
<div className="w-[190px]">
<Doughnut data={data} />
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

230
src/app/layout.jsx
View File

@ -46,6 +46,11 @@ export default function RootLayout({ children }) {
const [BottomSheetCreatePositionOpen, setBottomSheetCreatePositionOpen] = const [BottomSheetCreatePositionOpen, setBottomSheetCreatePositionOpen] =
useState(false); useState(false);
const [
BottomSheetAddUserToPositionShiftPlanOpen,
setBottomSheetAddUserToPositionShiftPlanOpen,
] = useState(false);
// BigPlus // BigPlus
const [BigPlusOpen, setBigPlusOpen] = useState(false); const [BigPlusOpen, setBigPlusOpen] = useState(false);
const [BigPlusRotateIcon, setBigPlusRotateIcon] = useState(false); const [BigPlusRotateIcon, setBigPlusRotateIcon] = useState(false);
@ -86,6 +91,7 @@ export default function RootLayout({ children }) {
// createroutine/ routine // createroutine/ routine
const [routinesData, setRoutinesData] = useState([]); const [routinesData, setRoutinesData] = useState([]);
const [routineData, setRoutineData] = useState([]); const [routineData, setRoutineData] = useState([]);
const [routineShiftPlan, setRoutineShiftPlan] = useState([]);
const [goToEditRoutine, setGoToEditRoutine] = useState(false); const [goToEditRoutine, setGoToEditRoutine] = useState(false);
const [idEditRoutine, setIdEditRoutine] = useState(null); const [idEditRoutine, setIdEditRoutine] = useState(null);
@ -98,7 +104,6 @@ export default function RootLayout({ children }) {
// shift // shift
const [dayOfWeeksChoose, setDayOfWeeksChoose] = useState([]); const [dayOfWeeksChoose, setDayOfWeeksChoose] = useState([]);
const [startAtTimeShift, setStartAtTimeShift] = useState(["00", "00"]); const [startAtTimeShift, setStartAtTimeShift] = useState(["00", "00"]);
const [endAtTimeShift, setEndAtTimeShift] = useState(["00", "00"]); const [endAtTimeShift, setEndAtTimeShift] = useState(["00", "00"]);
const [shiftsData, setShiftsData] = useState([null]); const [shiftsData, setShiftsData] = useState([null]);
@ -106,6 +111,16 @@ export default function RootLayout({ children }) {
const [goToEditShift, setGoToEditShift] = useState(false); const [goToEditShift, setGoToEditShift] = useState(false);
const [idEditShift, setIdEditShift] = useState(null); const [idEditShift, setIdEditShift] = useState(null);
// task
const [routineForTaskChoose, setRoutineForTaskChoose] = useState([]);
const [positionsForTaskChoose, setPositionsForTaskChoose] = useState([]);
const [shiftsForTaskChoose, setShiftsForTaskChoose] = useState([]);
const [shiftsDaysChoose, setShiftsDaysChoose] = useState([]);
const [tasksData, setTasksData] = useState([null]);
const [taskData, setTaskData] = useState([null]);
const [goToEditTask, setGoToEditTask] = useState(false);
const [idEditTask, setIdEditTask] = useState(null);
// shift manage-shift // shift manage-shift
const [searchUserChoose, setSearchUserChoose] = useState([]); const [searchUserChoose, setSearchUserChoose] = useState([]);
@ -854,6 +869,58 @@ export default function RootLayout({ children }) {
setLoading(false); setLoading(false);
} }
}; };
const GetRoutineShiftPlan = async (id) => {
setLoading(true);
try {
const data = await Chapar.get(
`${process.env.NEXT_PUBLIC_API_URL}/routine/${id}/shift`,
{
headers: {
Authorization: getToken(),
},
}
);
console.log("GetRoutineShift", data);
setRoutineShiftPlan(data);
setLoading(false);
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const CreateShifPlan = async (body) => {
setLoading(true);
try {
const data = await Chapar.post(
`${process.env.NEXT_PUBLIC_API_URL}/shift/plan`,
JSON.stringify(body),
{
headers: {
Authorization: getToken(),
},
}
);
toast.success(`مدیریت شیفت ساخته شد`, {
position: "bottom-right",
closeOnClick: true,
});
router.push("/shifts");
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const DeleteRoutine = async (id) => { const DeleteRoutine = async (id) => {
setLoading(true); setLoading(true);
try { try {
@ -1008,6 +1075,140 @@ export default function RootLayout({ children }) {
} }
}; };
const CreateTask = async (body) => {
setLoading(true);
try {
const data = await Chapar.post(
`${process.env.NEXT_PUBLIC_API_URL}/task`,
JSON.stringify(body),
{
headers: {
Authorization: getToken(),
},
}
);
toast.success(`فعالیت ساخته شد`, {
position: "bottom-right",
closeOnClick: true,
});
// router->
setLoading(false);
GetTasks();
router.push("/tasks");
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const UpdateTask = async (body) => {
setLoading(true);
try {
const data = await Chapar.put(
`${process.env.NEXT_PUBLIC_API_URL}/task`,
body,
{
headers: {
Authorization: getToken(),
},
}
);
toast.success(`فعالیت ویرایش شد`, {
position: "bottom-right",
closeOnClick: true,
});
// router->
setLoading(false);
GetTasks();
router.push("/tasks");
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const GetTasks = async () => {
setLoading(true);
try {
const data = await Chapar.get(
`${process.env.NEXT_PUBLIC_API_URL}/task?page=0`,
{
headers: {
Authorization: getToken(),
},
}
);
console.log("GetTasks", data);
setTasksData(data);
setLoading(false);
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const GetTask = async (id) => {
setLoading(true);
try {
const data = await Chapar.get(
`${process.env.NEXT_PUBLIC_API_URL}/task/${id}`,
{
headers: {
Authorization: getToken(),
},
}
);
console.log("GetPosition", data);
setTaskData(data);
setLoading(false);
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const DeleteTask = async (id) => {
setLoading(true);
try {
const data = await Chapar.delete(
`${process.env.NEXT_PUBLIC_API_URL}/task/${id}`,
{
headers: {
Authorization: getToken(),
},
}
);
setLoading(false);
GetTasks();
router.push("/tasks");
} catch ({ error, status }) {
toast.error(`${error.response.data.message}`, {
position: "bottom-right",
closeOnClick: true,
});
setLoading(false);
}
};
const CheckUser = async () => { const CheckUser = async () => {
setLoading(true); setLoading(true);
try { try {
@ -1091,6 +1292,16 @@ export default function RootLayout({ children }) {
positionsData, positionsData,
BottomSheetCreatePositionOpen, BottomSheetCreatePositionOpen,
sectionIdChoose, sectionIdChoose,
routineForTaskChoose,
positionsForTaskChoose,
shiftsForTaskChoose,
shiftsDaysChoose,
idEditTask,
goToEditTask,
taskData,
tasksData,
routineShiftPlan,
BottomSheetAddUserToPositionShiftPlanOpen,
}, },
setBottomSheetCreateRoleOpen, setBottomSheetCreateRoleOpen,
setBottomSheetCreateEmployeesOpen, setBottomSheetCreateEmployeesOpen,
@ -1174,6 +1385,23 @@ export default function RootLayout({ children }) {
UpdatePosition, UpdatePosition,
CreatePosition, CreatePosition,
setSectionIdChoose, setSectionIdChoose,
setRoutineForTaskChoose,
setPositionsForTaskChoose,
setShiftsForTaskChoose,
setShiftsDaysChoose,
DeleteTask,
GetTask,
GetTasks,
UpdateTask,
CreateTask,
setIdEditTask,
setGoToEditTask,
setTaskData,
setTasksData,
setRoutineShiftPlan,
GetRoutineShiftPlan,
setBottomSheetAddUserToPositionShiftPlanOpen,
CreateShifPlan,
}} }}
> >
<html lang="en"> <html lang="en">

244
src/app/routine/page.jsx
View File

@ -1,244 +0,0 @@
"use client";
import AppHeader from "@comp/AppHeader/page";
import AppContext from "@ctx/AppContext";
import BottomSheetCreateRoutine from "plugins/BottomSheet/BottomSheetCreateRoutine";
import PersianNumber from "plugins/PersianNumber";
import React, { useContext } from "react";
import { Swiper, SwiperSlide } from "swiper/react";
import TaskCard from "@comp/TaskCard/page";
import Link from "next/link";
const page = () => {
const CTX = useContext(AppContext);
const routinesData = CTX.state.routinesData;
// const goToEditRole = (id) => {
// CTX.setGoToEditRole(true);
// CTX.setBottomSheetCreateRoleOpen(true);
// CTX.setIdEditRole(id);
// };
return (
<div className="pb-20">
<AppHeader
title=" تسک های مجموعه"
sub=" شما 12 تسک در مجموعه دارید"
icon1={true}
iconName1="PLUS"
iconHref1="#"
// iconEvent1={() => CTX.setBottomSheetCreateRoutineOpen(true)}
icon2={true}
iconName2="ARROW"
iconHref2="/home"
iconEvent2={() => {
return undefined;
}}
/>
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-5 rtl">
<div className="flex justify-between">
<div>
<h4 className="text-base font-bold">تسک های هفتگی مجموعه</h4>
<p className="mb-0 text-sm">
امروز
<strong className="mx-1 text-primary-300">
<PersianNumber number={24} />
</strong>
تسک فعال دارید
</p>
</div>
<div className="w-[40px] h-[40px] bg-white shadow-sm rounded-xl">
<svg
width="23"
height="27"
viewBox="0 0 16 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-[6px]"
>
<path
d="M5 3.00001C4.73478 3.00001 4.48043 3.10537 4.29289 3.2929C4.10536 3.48044 4 3.73479 4 4.00001C4 4.26523 4.10536 4.51958 4.29289 4.70712C4.48043 4.89465 4.73478 5.00001 5 5.00001C5.26522 5.00001 5.51957 4.89465 5.70711 4.70712C5.89464 4.51958 6 4.26523 6 4.00001C6 3.73479 5.89464 3.48044 5.70711 3.2929C5.51957 3.10537 5.26522 3.00001 5 3.00001ZM2.17 3.00001C2.3766 2.41448 2.75974 1.90744 3.2666 1.5488C3.77346 1.19015 4.37909 0.997559 5 0.997559C5.62091 0.997559 6.22654 1.19015 6.7334 1.5488C7.24026 1.90744 7.6234 2.41448 7.83 3.00001H15C15.2652 3.00001 15.5196 3.10537 15.7071 3.2929C15.8946 3.48044 16 3.73479 16 4.00001C16 4.26523 15.8946 4.51958 15.7071 4.70712C15.5196 4.89465 15.2652 5.00001 15 5.00001H7.83C7.6234 5.58554 7.24026 6.09258 6.7334 6.45122C6.22654 6.80986 5.62091 7.00246 5 7.00246C4.37909 7.00246 3.77346 6.80986 3.2666 6.45122C2.75974 6.09258 2.3766 5.58554 2.17 5.00001H1C0.734784 5.00001 0.48043 4.89465 0.292893 4.70712C0.105357 4.51958 0 4.26523 0 4.00001C0 3.73479 0.105357 3.48044 0.292893 3.2929C0.48043 3.10537 0.734784 3.00001 1 3.00001H2.17ZM11 9.00001C10.7348 9.00001 10.4804 9.10537 10.2929 9.2929C10.1054 9.48044 10 9.73479 10 10C10 10.2652 10.1054 10.5196 10.2929 10.7071C10.4804 10.8947 10.7348 11 11 11C11.2652 11 11.5196 10.8947 11.7071 10.7071C11.8946 10.5196 12 10.2652 12 10C12 9.73479 11.8946 9.48044 11.7071 9.2929C11.5196 9.10537 11.2652 9.00001 11 9.00001ZM8.17 9.00001C8.3766 8.41448 8.75974 7.90744 9.2666 7.5488C9.77346 7.19015 10.3791 6.99756 11 6.99756C11.6209 6.99756 12.2265 7.19015 12.7334 7.5488C13.2403 7.90744 13.6234 8.41448 13.83 9.00001H15C15.2652 9.00001 15.5196 9.10537 15.7071 9.2929C15.8946 9.48044 16 9.73479 16 10C16 10.2652 15.8946 10.5196 15.7071 10.7071C15.5196 10.8947 15.2652 11 15 11H13.83C13.6234 11.5855 13.2403 12.0926 12.7334 12.4512C12.2265 12.8099 11.6209 13.0025 11 13.0025C10.3791 13.0025 9.77346 12.8099 9.2666 12.4512C8.75974 12.0926 8.3766 11.5855 8.17 11H1C0.734784 11 0.48043 10.8947 0.292893 10.7071C0.105357 10.5196 0 10.2652 0 10C0 9.73479 0.105357 9.48044 0.292893 9.2929C0.48043 9.10537 0.734784 9.00001 1 9.00001H8.17ZM5 15C4.73478 15 4.48043 15.1054 4.29289 15.2929C4.10536 15.4804 4 15.7348 4 16C4 16.2652 4.10536 16.5196 4.29289 16.7071C4.48043 16.8947 4.73478 17 5 17C5.26522 17 5.51957 16.8947 5.70711 16.7071C5.89464 16.5196 6 16.2652 6 16C6 15.7348 5.89464 15.4804 5.70711 15.2929C5.51957 15.1054 5.26522 15 5 15ZM2.17 15C2.3766 14.4145 2.75974 13.9074 3.2666 13.5488C3.77346 13.1902 4.37909 12.9976 5 12.9976C5.62091 12.9976 6.22654 13.1902 6.7334 13.5488C7.24026 13.9074 7.6234 14.4145 7.83 15H15C15.2652 15 15.5196 15.1054 15.7071 15.2929C15.8946 15.4804 16 15.7348 16 16C16 16.2652 15.8946 16.5196 15.7071 16.7071C15.5196 16.8947 15.2652 17 15 17H7.83C7.6234 17.5855 7.24026 18.0926 6.7334 18.4512C6.22654 18.8099 5.62091 19.0025 5 19.0025C4.37909 19.0025 3.77346 18.8099 3.2666 18.4512C2.75974 18.0926 2.3766 17.5855 2.17 17H1C0.734784 17 0.48043 16.8947 0.292893 16.7071C0.105357 16.5196 0 16.2652 0 16C0 15.7348 0.105357 15.4804 0.292893 15.2929C0.48043 15.1054 0.734784 15 1 15H2.17Z"
fill="#666666"
/>
</svg>
</div>
</div>
<Swiper
spaceBetween={20}
slidesPerView={1.6}
onSlideChange={() => console.log("slide change")}
onSwiper={(swiper) => console.log(swiper)}
>
<SwiperSlide>
<div className=" bg-white h-[180px] rounded-3xl overflow-hidden relative mt-5">
<div className="flex mx-2">
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
اهمیت بالا{" "}
</div>
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
شیفت صبح
</div>
</div>
<div className=" relative m-2 text-white">
<div className="text-right">
<h4 className="mb-0 text-primary-300 font-semibold text-sm">
کارگاه بدنسازی در خانه برای رستوران توگک
</h4>
</div>
<div className="flex">
<div className="flex rtl mt-2 w-full">
<div className="absolute right-[0px] bg-red-900 w-[40px] h-[40px] rounded-full border-2 z-[1]"></div>
<div className="absolute right-[13px] bg-green-900 w-[40px] h-[40px] rounded-full border-2 z-[2]"></div>
<div className="absolute right-[26px] bg-sky-900 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
</div>
<div className="relative w-full">
<p className="text-black text-sm mt-4">
+
<strong className="mx-1">
<PersianNumber number={3} />
</strong>
نفر دیگر
</p>
</div>
</div>
<div className="flex mt-6 relative">
<div>
<svg
width="20"
height="20"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.0833 2.33332H9.91667V1.74999C9.91667 1.59528 9.85522 1.44691 9.74582 1.33751C9.63642 1.22811 9.48805 1.16666 9.33334 1.16666C9.17863 1.16666 9.03026 1.22811 8.92086 1.33751C8.81146 1.44691 8.75001 1.59528 8.75001 1.74999V2.33332H5.25001V1.74999C5.25001 1.59528 5.18855 1.44691 5.07915 1.33751C4.96975 1.22811 4.82138 1.16666 4.66667 1.16666C4.51196 1.16666 4.36359 1.22811 4.25419 1.33751C4.1448 1.44691 4.08334 1.59528 4.08334 1.74999V2.33332H2.91667C2.45254 2.33332 2.00742 2.5177 1.67923 2.84589C1.35105 3.17408 1.16667 3.61919 1.16667 4.08332V11.0833C1.16667 11.5475 1.35105 11.9926 1.67923 12.3208C2.00742 12.6489 2.45254 12.8333 2.91667 12.8333H11.0833C11.5475 12.8333 11.9926 12.6489 12.3208 12.3208C12.649 11.9926 12.8333 11.5475 12.8333 11.0833V4.08332C12.8333 3.61919 12.649 3.17408 12.3208 2.84589C11.9926 2.5177 11.5475 2.33332 11.0833 2.33332ZM11.6667 11.0833C11.6667 11.238 11.6052 11.3864 11.4958 11.4958C11.3864 11.6052 11.238 11.6667 11.0833 11.6667H2.91667C2.76196 11.6667 2.61359 11.6052 2.50419 11.4958C2.3948 11.3864 2.33334 11.238 2.33334 11.0833V6.99999H11.6667V11.0833ZM11.6667 5.83332H2.33334V4.08332C2.33334 3.92861 2.3948 3.78024 2.50419 3.67084C2.61359 3.56145 2.76196 3.49999 2.91667 3.49999H4.08334V4.08332C4.08334 4.23803 4.1448 4.38641 4.25419 4.4958C4.36359 4.6052 4.51196 4.66666 4.66667 4.66666C4.82138 4.66666 4.96975 4.6052 5.07915 4.4958C5.18855 4.38641 5.25001 4.23803 5.25001 4.08332V3.49999H8.75001V4.08332C8.75001 4.23803 8.81146 4.38641 8.92086 4.4958C9.03026 4.6052 9.17863 4.66666 9.33334 4.66666C9.48805 4.66666 9.63642 4.6052 9.74582 4.4958C9.85522 4.38641 9.91667 4.23803 9.91667 4.08332V3.49999H11.0833C11.238 3.49999 11.3864 3.56145 11.4958 3.67084C11.6052 3.78024 11.6667 3.92861 11.6667 4.08332V5.83332Z"
fill="#888888"
/>
</svg>
</div>
<p className="mb-0 text-textMain-100 text-sm opacity-70 mr-1">
دوشنبه
<strong className="mx-1">
<PersianNumber number={19} />
</strong>
اردیبهشت
<strong className="mx-1">
<PersianNumber number={1401} />
</strong>
</p>
</div>
</div>
</div>
</SwiperSlide>
<SwiperSlide>
<div className=" bg-white h-[180px] rounded-3xl overflow-hidden relative mt-5">
<div className="flex mx-2">
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
اهمیت بالا{" "}
</div>
<div className="bg-secondaryLighter-100 w-fit relative px-2 text-[12px] my-2 mx-1 rounded-3xl text-secondary-200">
شیفت صبح
</div>
</div>
<div className=" relative m-2 text-white">
<div className="text-right">
<h4 className="mb-0 text-primary-300 font-semibold text-sm">
کارگاه بدنسازی در خانه برای رستوران توگک
</h4>
</div>
<div className="flex">
<div className="flex rtl mt-2 w-full">
<div className="absolute right-[0px] bg-red-900 w-[40px] h-[40px] rounded-full border-2 z-[1]"></div>
<div className="absolute right-[13px] bg-green-900 w-[40px] h-[40px] rounded-full border-2 z-[2]"></div>
<div className="absolute right-[26px] bg-sky-900 w-[40px] h-[40px] rounded-full border-2 z-[3]"></div>
</div>
<div className="relative w-full">
<p className="text-black text-sm mt-4">
+
<strong className="mx-1">
<PersianNumber number={3} />
</strong>
نفر دیگر
</p>
</div>
</div>
<div className="flex mt-6 relative">
<div>
<svg
width="20"
height="20"
viewBox="0 0 14 14"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.0833 2.33332H9.91667V1.74999C9.91667 1.59528 9.85522 1.44691 9.74582 1.33751C9.63642 1.22811 9.48805 1.16666 9.33334 1.16666C9.17863 1.16666 9.03026 1.22811 8.92086 1.33751C8.81146 1.44691 8.75001 1.59528 8.75001 1.74999V2.33332H5.25001V1.74999C5.25001 1.59528 5.18855 1.44691 5.07915 1.33751C4.96975 1.22811 4.82138 1.16666 4.66667 1.16666C4.51196 1.16666 4.36359 1.22811 4.25419 1.33751C4.1448 1.44691 4.08334 1.59528 4.08334 1.74999V2.33332H2.91667C2.45254 2.33332 2.00742 2.5177 1.67923 2.84589C1.35105 3.17408 1.16667 3.61919 1.16667 4.08332V11.0833C1.16667 11.5475 1.35105 11.9926 1.67923 12.3208C2.00742 12.6489 2.45254 12.8333 2.91667 12.8333H11.0833C11.5475 12.8333 11.9926 12.6489 12.3208 12.3208C12.649 11.9926 12.8333 11.5475 12.8333 11.0833V4.08332C12.8333 3.61919 12.649 3.17408 12.3208 2.84589C11.9926 2.5177 11.5475 2.33332 11.0833 2.33332ZM11.6667 11.0833C11.6667 11.238 11.6052 11.3864 11.4958 11.4958C11.3864 11.6052 11.238 11.6667 11.0833 11.6667H2.91667C2.76196 11.6667 2.61359 11.6052 2.50419 11.4958C2.3948 11.3864 2.33334 11.238 2.33334 11.0833V6.99999H11.6667V11.0833ZM11.6667 5.83332H2.33334V4.08332C2.33334 3.92861 2.3948 3.78024 2.50419 3.67084C2.61359 3.56145 2.76196 3.49999 2.91667 3.49999H4.08334V4.08332C4.08334 4.23803 4.1448 4.38641 4.25419 4.4958C4.36359 4.6052 4.51196 4.66666 4.66667 4.66666C4.82138 4.66666 4.96975 4.6052 5.07915 4.4958C5.18855 4.38641 5.25001 4.23803 5.25001 4.08332V3.49999H8.75001V4.08332C8.75001 4.23803 8.81146 4.38641 8.92086 4.4958C9.03026 4.6052 9.17863 4.66666 9.33334 4.66666C9.48805 4.66666 9.63642 4.6052 9.74582 4.4958C9.85522 4.38641 9.91667 4.23803 9.91667 4.08332V3.49999H11.0833C11.238 3.49999 11.3864 3.56145 11.4958 3.67084C11.6052 3.78024 11.6667 3.92861 11.6667 4.08332V5.83332Z"
fill="#888888"
/>
</svg>
</div>
<p className="mb-0 text-textMain-100 text-sm opacity-70 mr-1">
دوشنبه
<strong className="mx-1">
<PersianNumber number={19} />
</strong>
اردیبهشت
<strong className="mx-1">
<PersianNumber number={1401} />
</strong>
</p>
</div>
</div>
</div>
</SwiperSlide>
</Swiper>
<div className="flex justify-between mt-7">
<div>
<h4 className="text-base font-bold">تسک های امروز</h4>
<p className="mb-0 text-sm">
امروز
<strong className="mx-1 text-primary-300">
<PersianNumber number={24} />
</strong>
تسک فعال دارید
</p>
</div>
<div className="w-[40px] h-[40px] bg-white shadow-sm rounded-xl">
<svg
width="23"
height="27"
viewBox="0 0 16 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-[6px]"
>
<path
d="M5 3.00001C4.73478 3.00001 4.48043 3.10537 4.29289 3.2929C4.10536 3.48044 4 3.73479 4 4.00001C4 4.26523 4.10536 4.51958 4.29289 4.70712C4.48043 4.89465 4.73478 5.00001 5 5.00001C5.26522 5.00001 5.51957 4.89465 5.70711 4.70712C5.89464 4.51958 6 4.26523 6 4.00001C6 3.73479 5.89464 3.48044 5.70711 3.2929C5.51957 3.10537 5.26522 3.00001 5 3.00001ZM2.17 3.00001C2.3766 2.41448 2.75974 1.90744 3.2666 1.5488C3.77346 1.19015 4.37909 0.997559 5 0.997559C5.62091 0.997559 6.22654 1.19015 6.7334 1.5488C7.24026 1.90744 7.6234 2.41448 7.83 3.00001H15C15.2652 3.00001 15.5196 3.10537 15.7071 3.2929C15.8946 3.48044 16 3.73479 16 4.00001C16 4.26523 15.8946 4.51958 15.7071 4.70712C15.5196 4.89465 15.2652 5.00001 15 5.00001H7.83C7.6234 5.58554 7.24026 6.09258 6.7334 6.45122C6.22654 6.80986 5.62091 7.00246 5 7.00246C4.37909 7.00246 3.77346 6.80986 3.2666 6.45122C2.75974 6.09258 2.3766 5.58554 2.17 5.00001H1C0.734784 5.00001 0.48043 4.89465 0.292893 4.70712C0.105357 4.51958 0 4.26523 0 4.00001C0 3.73479 0.105357 3.48044 0.292893 3.2929C0.48043 3.10537 0.734784 3.00001 1 3.00001H2.17ZM11 9.00001C10.7348 9.00001 10.4804 9.10537 10.2929 9.2929C10.1054 9.48044 10 9.73479 10 10C10 10.2652 10.1054 10.5196 10.2929 10.7071C10.4804 10.8947 10.7348 11 11 11C11.2652 11 11.5196 10.8947 11.7071 10.7071C11.8946 10.5196 12 10.2652 12 10C12 9.73479 11.8946 9.48044 11.7071 9.2929C11.5196 9.10537 11.2652 9.00001 11 9.00001ZM8.17 9.00001C8.3766 8.41448 8.75974 7.90744 9.2666 7.5488C9.77346 7.19015 10.3791 6.99756 11 6.99756C11.6209 6.99756 12.2265 7.19015 12.7334 7.5488C13.2403 7.90744 13.6234 8.41448 13.83 9.00001H15C15.2652 9.00001 15.5196 9.10537 15.7071 9.2929C15.8946 9.48044 16 9.73479 16 10C16 10.2652 15.8946 10.5196 15.7071 10.7071C15.5196 10.8947 15.2652 11 15 11H13.83C13.6234 11.5855 13.2403 12.0926 12.7334 12.4512C12.2265 12.8099 11.6209 13.0025 11 13.0025C10.3791 13.0025 9.77346 12.8099 9.2666 12.4512C8.75974 12.0926 8.3766 11.5855 8.17 11H1C0.734784 11 0.48043 10.8947 0.292893 10.7071C0.105357 10.5196 0 10.2652 0 10C0 9.73479 0.105357 9.48044 0.292893 9.2929C0.48043 9.10537 0.734784 9.00001 1 9.00001H8.17ZM5 15C4.73478 15 4.48043 15.1054 4.29289 15.2929C4.10536 15.4804 4 15.7348 4 16C4 16.2652 4.10536 16.5196 4.29289 16.7071C4.48043 16.8947 4.73478 17 5 17C5.26522 17 5.51957 16.8947 5.70711 16.7071C5.89464 16.5196 6 16.2652 6 16C6 15.7348 5.89464 15.4804 5.70711 15.2929C5.51957 15.1054 5.26522 15 5 15ZM2.17 15C2.3766 14.4145 2.75974 13.9074 3.2666 13.5488C3.77346 13.1902 4.37909 12.9976 5 12.9976C5.62091 12.9976 6.22654 13.1902 6.7334 13.5488C7.24026 13.9074 7.6234 14.4145 7.83 15H15C15.2652 15 15.5196 15.1054 15.7071 15.2929C15.8946 15.4804 16 15.7348 16 16C16 16.2652 15.8946 16.5196 15.7071 16.7071C15.5196 16.8947 15.2652 17 15 17H7.83C7.6234 17.5855 7.24026 18.0926 6.7334 18.4512C6.22654 18.8099 5.62091 19.0025 5 19.0025C4.37909 19.0025 3.77346 18.8099 3.2666 18.4512C2.75974 18.0926 2.3766 17.5855 2.17 17H1C0.734784 17 0.48043 16.8947 0.292893 16.7071C0.105357 16.5196 0 16.2652 0 16C0 15.7348 0.105357 15.4804 0.292893 15.2929C0.48043 15.1054 0.734784 15 1 15H2.17Z"
fill="#666666"
/>
</svg>
</div>
</div>
<div className=" mt-3">
<TaskCard />
</div>
</div>
<BottomSheetCreateRoutine />
</div>
);
};
export default page;

2
src/app/shifts/complete-shift/page.jsx
View File

@ -1,5 +1,5 @@
import AppHeader from "@comp/AppHeader/page"; import AppHeader from "@comp/AppHeader/page";
import TaskCard from "@comp/TaskCard/page"; import TaskCard from "@comp/TaskPage/ActivityCard/page";
import PersianNumber from "plugins/PersianNumber"; import PersianNumber from "plugins/PersianNumber";
import React from "react"; import React from "react";

301
src/app/shifts/manage-shift/page.jsx
View File

@ -12,49 +12,71 @@ import Input from "plugins/Input/page";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import Avatar from "boring-avatars"; import Avatar from "boring-avatars";
import BottomManageShift from "plugins/BottomSheet/BottomManageShift"; import BottomManageShift from "plugins/BottomSheet/BottomManageShift";
import BottomSheetAddUserToPositionShiftPlan from "plugins/BottomSheet/BottomSheetAddUserToPositionShiftPlan";
import Buttonbriz from "plugins/Buttonbriz/page";
const Calendar = () => { const Calendar = () => {
const CTX = useContext(AppContext); const CTX = useContext(AppContext);
const shiftsData = CTX.state.shiftsData; const shiftsData = CTX.state.shiftsData;
const searchUserChoose = CTX.state.searchUserChoose; const searchUserChoose = CTX.state.searchUserChoose;
const usersData = CTX.state.usersData; const usersData = CTX.state.usersData;
const routinesData = CTX.state.routinesData;
const routineShiftPlan = CTX.state.routineShiftPlan;
const positionsData = CTX.state.positionsData;
console.log("usersData", usersData); const [daysUntilWeek, setDaysUntilWeek] = useState([]);
const [searchUserCurrntData, setSearchUserCurrntData] = useState([]);
const [daysUntilEnd, setDaysUntilEnd] = useState([]);
const [selectDay, setSelectDay] = useState(null); const [selectDay, setSelectDay] = useState(null);
const [selectShift, setselectShift] = useState(0); const [selectShift, setselectShift] = useState(-1);
const [selectRoutine, setSelectRoutine] = useState(-1);
const [shiftsPlan, setShiftsPlan] = useState([]);
const [manageShiftEmployeesData, setManageShiftEmployeesData] = useState([]); const [manageShiftEmployeesData, setManageShiftEmployeesData] = useState([]);
const today = moment().format("jYYYY/jM/jD"); // Get the current Jalali date const [shiftPlanSteps, setShiftPlanSteps] = useState(0);
const todayJustDay = moment().format("jD"); // Get the current Jalali date
// Find the end of the current month const [positionSelectNameBottomSheet, setPositionSelectNameBottomSheet] =
const endOfMonth = moment(today, "jYYYY/jM/jD").endOf("jMonth"); useState([]);
const [positionSelectIdBottomSheet, setPositionSelectIdBottomSheet] =
useState([]);
const [userAndPositionIds, setUserAndPositionIds] = useState([]);
const week = [
{ key: "شنبه", value: 6 },
{ key: "یکشنبه", value: 0 },
{ key: "دوشنبه", value: 1 },
{ key: "سه شنبه", value: 2 },
{ key: "چهار شنبه", value: 3 },
{ key: "پنج شنبه", value: 4 },
{ key: "جمعه", value: 5 },
];
const today = moment().format("jYYYY/jM/jD"); // Get the current Jalali date
const daysInCurrentMonth = moment(today, "jYYYY/jM/jD") const daysInCurrentMonth = moment(today, "jYYYY/jM/jD")
.endOf("jMonth") .endOf("jMonth")
.jDate(); .jDate();
const daysEndOfMonth = () => { const daysEndOfMonth = () => {
const days = []; const daysOfWeek = [];
for (let i = -1; i < daysInCurrentMonth - todayJustDay + 1; i++) { const startOfNextWeek = moment(today, "jYYYY/jM/jD")
const currentDate = moment(today, "jYYYY/jM/jD").add(i, "days"); .startOf("jWeek")
const isToday = currentDate.isSame(moment(), "day"); .add(7, "days");
days.push({ // Iterate from شنبه (Saturday) to جمعه (Friday) and add each day to the array
checkDay: currentDate.format("jYYYY/jM/jD"), for (let i = 0; i < 7; i++) {
date: currentDate.format("jD / jM"), const currentDay = startOfNextWeek.clone().add(i, "days");
dayOfWeek: currentDate.format("dddd"), const isToday = currentDay.isSame(today, "day");
today: isToday, // Set today: true if it's the current date const dayOfWeekName = week[i].key; // Get the day name from the week array
daysOfWeek.push({
checkDay: currentDay.format("jYYYY/jM/jD"),
date: currentDay.format("jD / jM"),
dayOfWeek: dayOfWeekName,
today: isToday,
value: week[i].value,
}); });
} }
return setDaysUntilEnd(days); return setDaysUntilWeek(daysOfWeek);
}; };
console.log("daysUntilEnd", daysUntilEnd[selectDay]);
const handleManageShiftEmployeesOpen = (e) => { const handleManageShiftEmployeesOpen = (e) => {
setManageShiftEmployeesData( setManageShiftEmployeesData(
usersData.map((item) => ({ usersData.map((item) => ({
@ -71,27 +93,49 @@ const Calendar = () => {
); );
}; };
const deleteSearchUser = (id) => { const body = {
CTX.setSearchUserChoose(searchUserChoose.filter((el) => el !== id)); planDate:
daysUntilWeek[selectDay]?.checkDay &&
moment.utc(daysUntilWeek[selectDay].checkDay, "jYYYY-jMM-jDDTHH").unix(),
shiftId: shiftsPlan && shiftsPlan[selectShift]?.id,
routineId: routinesData && routinesData[selectRoutine]?.id,
userAndPositionIds,
};
const handleRoutineShiftPlan = (index, id) => {
setSelectRoutine(index);
CTX.GetRoutineShiftPlan(id);
setShiftPlanSteps(1);
};
const handleCreateShiftPlan = (update) => {
if (update == "UPDATE") {
// CTX.UpdateShiftPlan(bodyUpdate);
} else {
CTX.CreateShifPlan(body);
}
}; };
useEffect(() => { useEffect(() => {
CTX.GetRoutines();
daysEndOfMonth(); daysEndOfMonth();
setSelectDay(1); setSelectDay(-1);
CTX.GetShifts(); CTX.GetShifts();
CTX.GetUsers(); CTX.GetPositions();
}, []); }, []);
useEffect(() => { useEffect(() => {
// if (!!CTX.GetUsers()) {
//
// }
handleManageShiftEmployeesOpen(); handleManageShiftEmployeesOpen();
}, [usersData]); }, [usersData]);
console.log("searchUserChooseqqqqqqqqqqqqqqqqqqqqqqqqq", searchUserChoose); useEffect(() => {
setShiftsPlan(
routineShiftPlan?.find((e) => e?.day == daysUntilWeek[selectDay]?.value)
?.shifts
);
console.log(daysUntilEnd); setselectShift(-1);
}, [selectDay]);
return ( return (
<div className="pb-20"> <div className="pb-20">
@ -109,13 +153,46 @@ const Calendar = () => {
/> />
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl"> <div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl">
<div
className="flex overflow-auto whitespace-nowrap mb-5"
id="swich-shifts"
>
{routinesData?.map((e, index) => (
<div
className={` shadow-sm relative block max-w-max mx-2 rounded-full mt-2 px-4 py-2 tr03 ${
selectRoutine == index
? "bg-secondary-100 text-white"
: "bg-white opacity-60"
}`}
onClick={() => {
if (shiftPlanSteps >= 1) {
toast.error("برای تغییر روتین باید رفرش کنید", {
position: "bottom-right",
autoClose: 2000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
});
} else {
handleRoutineShiftPlan(index, e.id);
}
}}
>
<p className="mb-0">{e.name}</p>
</div>
))}
</div>
{shiftPlanSteps >= 1 && (
<Swiper <Swiper
spaceBetween={10} spaceBetween={10}
slidesPerView={4.3} slidesPerView={4.3}
onSlideChange={() => console.log("slide change")} onSlideChange={() => console.log("slide change")}
onSwiper={(swiper) => console.log(swiper)} onSwiper={(swiper) => console.log(swiper)}
> >
{daysUntilEnd?.map((e, index) => ( {daysUntilWeek?.map((e, index) => (
<SwiperSlide> <SwiperSlide>
<div <div
className={`h-[70px] tr03 ${ className={`h-[70px] tr03 ${
@ -124,6 +201,7 @@ const Calendar = () => {
key={index} key={index}
onClick={() => { onClick={() => {
setSelectDay(index); setSelectDay(index);
setShiftPlanSteps(2);
console.log(index); console.log(index);
}} }}
> >
@ -134,7 +212,9 @@ const Calendar = () => {
style={`text-[20px] ${ style={`text-[20px] ${
selectDay == index selectDay == index
? "font-bold" ? "font-bold"
: !!holidays.y1402?.find((b) => b.date == e.checkDay) : !!holidays.y1402?.find(
(b) => b.date == e.checkDay
)
? "text-red-500" ? "text-red-500"
: "" : ""
} `} } `}
@ -153,55 +233,68 @@ const Calendar = () => {
> >
<p className="mb-0 text-center text-sm "> <p className="mb-0 text-center text-sm ">
{/* {PersianD.find((i) => i == e.dayOfWeek)} */} {/* {PersianD.find((i) => i == e.dayOfWeek)} */}
{PersianDay(e.dayOfWeek)} {e.dayOfWeek}
</p> </p>
</div> </div>
</div> </div>
</SwiperSlide> </SwiperSlide>
))} ))}
</Swiper> </Swiper>
)}
</div> </div>
{shiftPlanSteps >= 2 && (
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden rtl"> <div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden rtl">
{shiftsData.length > 0 ? ( <>
{!!routineShiftPlan?.find(
(e) => e?.day == daysUntilWeek[selectDay]?.value
) && shiftsData.length > 0 ? (
<div <div
className="flex overflow-auto whitespace-nowrap" className="flex overflow-auto whitespace-nowrap"
id="swich-shifts" id="swich-shifts"
> >
{shiftsData.map((e, index) => ( {shiftsPlan?.map((e, index) => (
<div <div
className={` shadow-sm relative block max-w-max mx-2 rounded-full mt-2 px-4 py-2 ${ className={` shadow-sm relative block max-w-fit mx-2 rounded-full mt-2 px-4 py-2 tr03 ${
selectShift == index selectShift == index
? "bg-secondary-100 text-white" ? "bg-secondary-100 text-white w-full"
: "bg-white opacity-60" : "bg-white opacity-60 "
}`} }`}
onClick={() => setselectShift(index)} onClick={() => {
setselectShift(index);
setShiftPlanSteps(3);
}}
> >
<p className="mb-0">{e?.title}</p> <p className="mb-0">{e?.title}</p>
</div> </div>
))} ))}
</div> </div>
) : ( ) : (
<div className="flex justify-center py-5"> <div className="flex justify-center ">
<div className="bg-white shadow mt-5 w-fit rounded-full p-4"> <div className="bg-gray-300 mt-5 w-fit rounded-full p-2 !px-4">
چیزی یافت نشد <p className="mb-0 text-gray-600 text-sm">
شما شیفتی دراین روز ندارید
</p>
</div> </div>
</div> </div>
)} )}
</>
</div> </div>
)}
<div className="bg-white relative top-[15px] rounded-t-3xl p-4 rtl pt-6 h-screen sm:h-auto "> {shiftPlanSteps >= 3 && (
<div className="bg-white relative top-[15px] rounded-t-3xl p-4 rtl pt-6 sm:h-auto pb-20">
<div className="mx-3 flex justify-center"> <div className="mx-3 flex justify-center">
<div className=" bg-gray-100 rounded-xl w-fit mr-0 p-3"> <div className=" bg-gray-100 rounded-xl w-fit mr-0 p-3">
<p className="mb-0 text-right text-sm rtl opacity-80"> <p className="mb-0 text-right text-sm rtl opacity-80">
ویرایش برای{" "} ویرایش برای{" "}
<small className=" text-sm font-bold"> <small className=" text-sm font-bold">
{shiftsData && shiftsData[selectShift]?.title} {shiftsPlan && shiftsPlan[selectShift]?.title}
</small>{" "} </small>{" "}
تاریخ{" "} تاریخ{" "}
<small className=" text-sm font-bold text-primary-300 bg-white px-2 rounded-full"> <small className=" text-sm font-bold text-primary-300 bg-white px-2 rounded-full">
<PersianNumber <PersianNumber
number={daysUntilEnd && daysUntilEnd[selectDay]?.checkDay} number={daysUntilWeek && daysUntilWeek[selectDay]?.checkDay}
/> />
</small>{" "} </small>{" "}
میباشد میباشد
@ -209,7 +302,28 @@ const Calendar = () => {
</div> </div>
</div> </div>
<div className=" m-1"> {positionsData.map((e) => (
<div>
<div className="flex justify-between mt-7 bg-gray-200 rounded-2xl">
<div className="flex p-2">
<div className="m-2">
<h4 className="text-base font-bold">{e.name} </h4>
</div>
</div>
<div
className=" bg-gray-600 shadow-sm rounded-xl m-[15px] h-fit relative "
onClick={() => {
setPositionSelectIdBottomSheet(e.id);
setPositionSelectNameBottomSheet(e.name);
CTX.setBottomSheetAddUserToPositionShiftPlanOpen(true);
}}
>
<p className="mb-0 text-sm text-white px-2 ">کاربران +</p>
</div>
</div>
{/* <div className=" m-1">
<Input <Input
lable="جستجوی افراد" lable="جستجوی افراد"
id="SearchUser-id" id="SearchUser-id"
@ -237,23 +351,28 @@ const Calendar = () => {
theme={1} theme={1}
defaultValue={"انتخاب کنید"} defaultValue={"انتخاب کنید"}
/> />
</div> </div> */}
<div <div
className={`flex j flex-wrap mt-3 rtl ${ className={`flex j flex-wrap mt-3 rtl ${
searchUserChoose.length > 0 ? "" : "justify-center" userAndPositionIds?.length > 0 ? "" : "justify-center"
}`} }`}
> >
{searchUserChoose.length > 0 ? ( {userAndPositionIds?.length > 0 ? (
searchUserChoose.map((e) => ( userAndPositionIds?.map((item) => (
<div className="flex bg-gray-100 p-1 rounded-full m-1 justify-start"> <>
{e.id == item.key && (
<div className="flex bg-gray-100 p-1 rounded-full m-1 justify-start mb-5">
<div <div
className="w-[30px] h-[30px] rounded-full bg-gray-400 " className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deleteSearchUser(e)} // onClick={() => deleteSearchUser(e)}
> >
<Avatar <Avatar
size={30} size={30}
name={usersData.find((b) => b.userId == e)?.firstName} name={
usersData.find((b) => b?.userId == item?.value)
?.firstName
}
variant="beam" variant="beam"
colors={["#9d9f88", "#83af96", "#b2de93"]} colors={["#9d9f88", "#83af96", "#b2de93"]}
/> />
@ -261,73 +380,45 @@ const Calendar = () => {
<div> <div>
<p className="mb-0 px-3 text-sm mt-1"> <p className="mb-0 px-3 text-sm mt-1">
{usersData.find((b) => b.userId == e)?.firstName} {
usersData.find((b) => b.userId == item?.value)
?.firstName
}
</p> </p>
</div> </div>
</div> </div>
)}
</>
)) ))
) : ( ) : (
<div className="flex justify-center py-5"> <div className="flex justify-center ">
<div className="bg-white shadow mt-5 w-fit rounded-full p-4"> <div className="bg-gray-100 w-fit rounded-full p-2 px-4">
چیزی یافت نشد چیزی یافت نشد
</div> </div>
</div> </div>
)} )}
</div> </div>
</div>
<div className="flex jc mt-10"> ))}
<button className="btn btn-primary inline-block w-full"> <div>
{" "} <Buttonbriz
ثبت نهایی شیفت title="ثبت فعالیت"
</button> color="PRIMARY"
<button icon="CHECK"
className="btn bg-transparent border-[2px] border-info-100 border-dashed text-info-100 text-[12px] mx-2 w-full" buttonEvent={() => handleCreateShiftPlan()}
onClick={() => CTX.setBottomManageShiftOpen(true)} />
>
تغییر حالت تسک ها{" "}
</button>
</div> </div>
</div> </div>
)}
<BottomManageShift /> <BottomManageShift />
<BottomSheetAddUserToPositionShiftPlan
positionName={positionSelectNameBottomSheet}
positionId={positionSelectIdBottomSheet}
userAndPositionIds={userAndPositionIds}
setUserAndPositionIds={setUserAndPositionIds}
/>
</div> </div>
); );
}; };
export default Calendar; export default Calendar;
{
/* {shiftsData.map((e, index) => (
<div
className={`bg-gray-200 p-5 rounded-3xl relative w-full pb-20 border-[4px] border-white !z-[${index}] `}
style={{ top: `${27 * (shiftsData.length - 1 - index)}px` }}
>
<div className="flex rtl">
<div className="w-[40px] h-[40px] bg-primary-300 rounded-full">
<svg
width="15"
height="15"
viewBox="0 0 150 88"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-[10px]"
>
<path
d="M137.5 75L75 12.5L12.5 75"
stroke="white"
stroke-width="25"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</div>
<div className="mx-3 ">
<p className="mb-0 font-bold text-xl text-right">{e?.title}</p>
<p className="mb-0 text-sm text-right">
{e?.title} {}
</p>
</div>
</div>
</div>
))} */
}

6
src/app/shifts/page.jsx
View File

@ -1,7 +1,6 @@
"use client"; "use client";
import AppHeader from "@comp/AppHeader/page"; import AppHeader from "@comp/AppHeader/page";
import ShiftCard from "@comp/ShiftComponent/ShiftCard/page";
import AppContext from "@ctx/AppContext"; import AppContext from "@ctx/AppContext";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
@ -69,11 +68,8 @@ const Shifts = (props) => {
</Link> </Link>
</div> </div>
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl mt-2"> <div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl mt-2"></div>
<ShiftCard />
</div> </div>
</div>
<BottomSheetCreateShifts />
</> </>
); );
}; };

704
src/app/tasks/add-task/page.jsx 100644
View File

@ -0,0 +1,704 @@
"use client";
import AppHeader from "@comp/AppHeader/page";
import AppContext from "@ctx/AppContext";
import Buttonbriz from "plugins/Buttonbriz/page";
import DatePickerIran from "plugins/DatePickerIran/page";
import Input from "plugins/Input/page";
import PersianNumber from "plugins/PersianNumber";
import React, { useContext, useEffect, useRef, useState } from "react";
import { toast } from "react-toastify";
import SimpleReactValidator from "simple-react-validator";
import moment from "jalali-moment";
import { useRouter, useSearchParams } from "next/navigation";
const AddTask = () => {
const CTX = useContext(AppContext);
const query = useSearchParams();
const [routinesSelectData, setRoutinesSelectData] = useState([]);
const [routineForTaskCurrent, setRoutineForTaskCurrent] = useState([]);
const [positionsSelectData, setPositionsSelectData] = useState([]);
const [positionsForTaskCurrent, setPositionsForTaskCurrent] = useState([]);
const [shiftsSelectData, setShiftsSelectData] = useState([]);
const [shiftsForTaskCurrent, setShiftsForTaskCurrent] = useState([]);
const [title, setTitle] = useState("");
const [description, setDescription] = useState("");
const [scheduleType, setScheduleType] = useState(1);
const [birthDateTimeStamp, setBirthDateTimeStamp] = useState(0);
const [shiftsDaysSelectData, setShiftsDaysSelectData] = useState(null);
const [shiftsDaysCurrent, setShiftsDaysCurrent] = useState(null);
const [, forceUpdate] = useState();
const routinesData = CTX.state.routinesData;
const positionsData = CTX.state.positionsData;
const shiftsData = CTX.state.shiftsData;
const routineForTaskChoose = CTX.state.routineForTaskChoose;
const positionsForTaskChoose = CTX.state.positionsForTaskChoose;
const shiftsForTaskChoose = CTX.state.shiftsForTaskChoose;
const shiftsDaysChoose = CTX.state.shiftsDaysChoose;
const goToEditTask = CTX.state.goToEditTask;
const taskData = CTX.state.taskData;
const idEditTask = CTX.state.idEditTask;
const aqueryNew = query.get("new");
const schedule = [
{ key: "هفتگی", value: 1 },
{ key: "روزانه", value: 0 },
{ key: "مخصوص یک روز ", value: 2 },
];
const week = [
{ key: "شنبه", value: 6 },
{ key: "یکشنبه", value: 0 },
{ key: "دوشنبه", value: 1 },
{ key: "سه شنبه", value: 2 },
{ key: "چهار شنبه", value: 3 },
{ key: "پنج شنبه", value: 4 },
{ key: "جمعه", value: 5 },
];
const validator = useRef(
new SimpleReactValidator({
messages: {
required: "پر کردن این فیلد الزامی میباشد",
},
element: (message) => (
<>
<div className="text-right px-1 ">
<small className="text-red-600 t-ig-small ">{message}</small>
</div>
</>
),
})
);
const body = {
title,
description,
routines: routineForTaskChoose,
positions: positionsForTaskChoose,
shifts: shiftsForTaskChoose,
scheduleType,
setFor:
birthDateTimeStamp &&
moment
.utc(
[
birthDateTimeStamp.year,
birthDateTimeStamp.month,
birthDateTimeStamp.day,
],
"jYYYY-jMM-jDDTHH"
)
.unix(),
days: shiftsDaysChoose,
};
const bodyUpdate = {
title,
description,
routines: routineForTaskChoose,
positions: positionsForTaskChoose,
shifts: shiftsForTaskChoose,
scheduleType,
setFor:
birthDateTimeStamp &&
moment
.utc(
[
birthDateTimeStamp.year,
birthDateTimeStamp.month,
birthDateTimeStamp.day,
],
"jYYYY-jMM-jDDTHH"
)
.unix(),
days: shiftsDaysChoose,
id: idEditTask,
};
const clear = () => {
setPositionsForTaskCurrent([]);
setPositionsSelectData([]);
setRoutineForTaskCurrent([]);
setRoutinesSelectData([]);
setBirthDateTimeStamp(0);
setScheduleType([]);
setDescription([]);
setTitle("");
setShiftsForTaskCurrent([]);
setShiftsSelectData([]);
setShiftsDaysCurrent([]);
setShiftsDaysSelectData([]);
CTX.setRoutineForTaskChoose([]);
CTX.setPositionsForTaskChoose([]);
CTX.setShiftsForTaskChoose([]);
CTX.setShiftsDaysChoose([]);
};
const handleCreateTask = (update) => {
if (scheduleType == 0) {
console.log("scheduleType == 0");
validator.current.message("shiftsDaysChoose", true, "required");
validator.current.message("birthDateTimeStamp", true, "required");
}
if (scheduleType == 1) {
console.log("scheduleType == 1");
validator.current.message("birthDateTimeStamp", true, "required");
}
if (scheduleType == 2) {
console.log("scheduleType == 2");
validator.current.message("shiftsDaysChoose", true, "required");
}
if (validator.current.allValid()) {
if (update == "UPDATE") {
CTX.UpdateTask(bodyUpdate);
} else {
CTX.CreateTask(body);
}
} else {
toast.error("پرکردن همه ی فیلد ها واجب است", {
position: "bottom-right",
autoClose: 2000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
});
validator.current.showMessages();
console.log(validator.current);
forceUpdate(1);
}
};
const deleteRoutineForTask = (value) => {
CTX.setRoutineForTaskChoose(
routineForTaskChoose.filter((el) => el !== value)
);
};
const deletePositionForTask = (value) => {
CTX.setPositionsForTaskChoose(
positionsForTaskChoose.filter((el) => el !== value)
);
};
const deleteShiftForTask = (value) => {
CTX.setShiftsForTaskChoose(
shiftsForTaskChoose.filter((el) => el !== value)
);
};
const deleteShiftsDaysForTask = (value) => {
CTX.setShiftsDaysChoose(shiftsDaysChoose.filter((el) => el !== value));
};
useEffect(() => {
if (aqueryNew) {
clear();
}
CTX.GetRoutines();
CTX.GetPositions();
CTX.GetShifts();
}, []);
useEffect(() => {
setRoutinesSelectData(
routinesData?.map((item) => ({
key: item?.name,
value: item?.id,
}))
);
}, [routinesData]);
useEffect(() => {
setPositionsSelectData(
positionsData?.map((item) => ({
key: item?.name,
value: item?.id,
}))
);
}, [positionsData]);
useEffect(() => {
setShiftsSelectData(
shiftsData?.map((item) => ({
key: item?.title,
value: item?.id,
}))
);
}, [shiftsData]);
useEffect(() => {
setShiftsDaysSelectData(
shiftsForTaskChoose?.length > 0 &&
shiftsData
?.find((e) => e?.id == shiftsForTaskChoose[0])
?.days?.map((item) => ({
key: week?.find((e) => e.value == item)?.key,
value: item,
}))
);
}, [shiftsForTaskChoose]);
useEffect(() => {
switch (scheduleType) {
case 0:
setBirthDateTimeStamp(0);
CTX.setShiftsDaysChoose([]);
break;
case 1:
setBirthDateTimeStamp(0);
break;
case 2:
CTX.setShiftsDaysChoose([]);
break;
default:
break;
}
}, [scheduleType]);
useEffect(() => {
// console.log("ssssssssssssssssssssssssss", taskData.routines);
if (goToEditTask) {
// const date = moment
// .unix(taskData.birthDateTimeStamp)
// .locale("fa")
// .format("YYYY/MM/DD")
// .split("/");
// setBirthDateTimeStamp({
// day: parseInt(date[2]),
// month: parseInt(date[1]),
// year: parseInt(date[0]),
// });
setScheduleType(taskData.scheduleType);
setDescription(taskData.description);
setTitle(taskData.title);
CTX.setRoutineForTaskChoose(
taskData.routines?.map((item) => item.routineId)
);
CTX.setPositionsForTaskChoose(
taskData.positions?.map((item) => item.positionId)
);
CTX.setShiftsDaysChoose(taskData.days?.map((item) => item.dayOfWeek));
CTX.setShiftsForTaskChoose(taskData.shifts?.map((item) => item.shiftId));
}
}, [taskData]);
console.log("body", body);
return (
<div className="pb-20">
<AppHeader
title=" افزودن فعالیت جدید"
sub=" قابلیت افزودن فعالیت جدید مختلف"
icon2={true}
iconName2="ARROW"
iconHref2="/home"
/>
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-4 rtl">
<div>
<div className="">
<Input
lable="عنوان فعالیت"
id="title-id"
name="title"
type={"text"}
value={title}
inputEvent={(e) => {
setTitle(e.target.value);
validator.current.showMessageFor("title");
}}
style="text-right"
validator={true}
validatorData={validator.current.message(
"title",
title,
"required"
)}
/>
</div>
<div className="">
<Input
lable=" توضیحات"
id="description-id"
name="description"
type={"text"}
value={description}
inputEvent={(e) => {
setDescription(e.target.value);
validator.current.showMessageFor("description");
}}
textarea={true}
style="text-right"
/>
</div>
{/* ===========routine=============== */}
<div className="">
<Input
lable="روتین فعالیت"
id="routines-id"
name="routines"
type={"text"}
inputEvent={(e) => {
setRoutineForTaskCurrent(e.target.value);
validator.current.showMessageFor("routines");
if (routineForTaskChoose.length >= 1) {
toast.error(
"فعلا معلوم نیست بیشتر از یکی بتونی باید با ممد اینا حرف بزنیم",
{
position: "bottom-right",
closeOnClick: true,
}
);
} else {
if (!!routineForTaskChoose.find((b) => b == e.target.value)) {
toast.error("روز تکراری است", {
position: "bottom-right",
closeOnClick: true,
});
} else {
CTX.setRoutineForTaskChoose((current) => [
...current,
e.target.value,
]);
}
}
}}
style="text-right"
validator={true}
validatorData={validator.current.message(
"routines",
routineForTaskChoose,
["required", { min: 1 }]
)}
select={true}
selectData={routinesSelectData}
defaultValue={"انتخاب کنید"}
/>
</div>
<div className="flex flex-wrap rtl">
{routineForTaskChoose &&
routineForTaskChoose.map((e, index) => (
<div
className="flex bg-gray-300 p-1 rounded-full m-1 justify-start mt-3"
key={index}
>
<div
className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deleteRoutineForTask(e)}
></div>
<div>
<p className="mb-0 px-3 text-sm mt-1">
{routinesData?.find((b) => b.id == e)?.name}
</p>
</div>
</div>
))}
</div>
{/* ===========position=============== */}
<div className="">
<Input
lable="پوزیشن فعالیت"
id="positions-id"
name="positions"
type={"text"}
inputEvent={(e) => {
setPositionsForTaskCurrent(e.target.value);
validator.current.showMessageFor("positions");
if (positionsForTaskChoose.length >= 1) {
toast.error(
"فعلا معلوم نیست بیشتر از یکی بتونی باید با ممد اینا حرف بزنیم",
{
position: "bottom-right",
closeOnClick: true,
}
);
} else {
if (
!!positionsForTaskChoose.find((b) => b == e.target.value)
) {
toast.error("روز تکراری است", {
position: "bottom-right",
closeOnClick: true,
});
} else {
CTX.setPositionsForTaskChoose((current) => [
...current,
e.target.value,
]);
}
}
}}
style="text-right"
validatorData={validator.current.message(
"positions",
positionsForTaskChoose,
["required", { min: 1 }]
)}
select={true}
selectData={positionsSelectData}
defaultValue={"انتخاب کنید"}
/>
</div>
<div className="flex flex-wrap rtl">
{positionsForTaskChoose &&
positionsForTaskChoose.map((e, index) => (
<div
className="flex bg-gray-300 p-1 rounded-full m-1 justify-start mt-3"
key={index}
>
<div
className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deletePositionForTask(e)}
></div>
<div>
<p className="mb-0 px-3 text-sm mt-1">
{positionsData?.find((b) => b.id == e)?.name}
</p>
</div>
</div>
))}
</div>
{/* ===========shifts=============== */}
<div className="">
<Input
lable="شیفت فعالیت"
id="shifts-id"
name="shifts"
type={"text"}
inputEvent={(e) => {
setShiftsForTaskCurrent(e.target.value);
validator.current.showMessageFor("shifts");
if (shiftsForTaskChoose.length >= 1) {
toast.error(
"فعلا معلوم نیست بیشتر از یکی بتونی باید با ممد اینا حرف بزنیم",
{
position: "bottom-right",
closeOnClick: true,
}
);
} else {
if (!!shiftsForTaskChoose.find((b) => b == e.target.value)) {
toast.error("روز تکراری است", {
position: "bottom-right",
closeOnClick: true,
});
} else {
CTX.setShiftsForTaskChoose((current) => [
...current,
e.target.value,
]);
}
}
}}
style="text-right"
validatorData={validator.current.message(
"shifts",
shiftsForTaskChoose,
["required", { min: 1 }]
)}
select={true}
selectData={shiftsSelectData}
defaultValue={"انتخاب کنید"}
/>
</div>
<div className="flex flex-wrap rtl">
{shiftsForTaskChoose &&
shiftsForTaskChoose.map((e, index) => (
<div
className="flex bg-gray-300 p-1 rounded-full m-1 justify-start mt-3"
key={index}
>
<div
className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deleteShiftForTask(e)}
></div>
<div>
<p className="mb-0 px-3 text-sm mt-1">
{shiftsData?.find((b) => b?.id == e)?.title}
</p>
</div>
</div>
))}
</div>
{/* ===========scheduleType=============== */}
<div className="">
<Input
lable="تکرار پذیری فعالیت"
id="scheduleType-id"
name="scheduleType"
type={"text"}
value={scheduleType}
inputEvent={(e) => {
setScheduleType(parseInt(e.target.value));
validator.current.showMessageFor("scheduleType");
}}
style="text-right"
validator={true}
validatorData={validator.current.message(
"scheduleType",
scheduleType,
["required"]
)}
select={true}
selectData={[
{ key: "هفتگی", value: 1 },
{ key: "روزانه", value: 0 },
{ key: "مخصوص یک روز ", value: 2 },
]}
defaultValue={"انتخاب کنید"}
/>
</div>
{/* <div className="flex flex-wrap mt-3 rtl">
<div className="flex bg-gray-300 p-1 rounded-full m-1 justify-start">
<div>
<p className="mb-0 px-3 text-sm mt-1">
{schedule?.find((b) => b.value == scheduleType)?.key}
</p>
</div>
</div>
</div> */}
{/* ===========scheduleType setFor=============== */}
{scheduleType == 2 && (
<DatePickerIran
title="تاریخ مورد نظر فعالیت"
name="birthDateTimeStamp"
datePickerEvent={(e) => {
setBirthDateTimeStamp(e);
validator.current.showMessageFor("birthDateTimeStamp");
}}
date={birthDateTimeStamp}
zindex="z-[101]"
validator={true}
validatorData={validator.current.message(
"birthDateTimeStamp",
birthDateTimeStamp,
["required"]
)}
/>
)}
</div>
{/* ===========shiftsDaysTask=============== */}
{scheduleType == 1 && (
<>
<div className="">
<Input
lable="انتخاب روزهای این قعالیت در هفته"
id="shiftsDaysChoose-id"
name="shiftsDaysChoose"
type={"text"}
value={shiftsDaysChoose}
inputEvent={(e) => {
setShiftsDaysCurrent(e.target.value);
validator.current.showMessageFor("shiftsDaysChoose");
if (!!shiftsDaysChoose.find((b) => b == e.target.value)) {
toast.error("روز تکراری است", {
position: "bottom-right",
closeOnClick: true,
});
} else {
CTX.setShiftsDaysChoose((current) => [
...current,
parseInt(e.target.value),
]);
}
}}
validator={true}
validatorData={validator.current.message(
"shiftsDaysChoose",
shiftsDaysChoose,
["required", { min: 1 }]
)}
style="text-right"
select={true}
selectData={shiftsDaysSelectData}
defaultValue={"انتخاب کنید"}
/>
</div>
<div className="flex flex-wrap mt-3 rtl">
{shiftsDaysChoose &&
shiftsDaysChoose.map((e, index) => (
<div
className="flex bg-gray-300 p-1 rounded-full m-1 justify-start"
key={index}
>
<div
className="w-[30px] h-[30px] rounded-full bg-gray-400 "
onClick={() => deleteShiftsDaysForTask(e)}
></div>
<div>
<p className="mb-0 px-3 text-sm mt-1">
{week?.find((b) => b.value == e).key}
</p>
</div>
</div>
))}
</div>
</>
)}
{goToEditTask ? (
<Buttonbriz
title="ویرایش فعالبت"
color="INFO"
icon="CHECK"
buttonEvent={() => handleCreateTask("UPDATE")}
subButton={true}
subButtonTitle="حذف فعالیت"
subButtonEvent={() => CTX.DeleteTask(idEditTask)}
/>
) : (
<Buttonbriz
title="ثبت فعالیت"
color="PRIMARY"
icon="CHECK"
buttonEvent={() => handleCreateTask()}
/>
)}{" "}
</div>
</div>
);
};
export default AddTask;

114
src/app/tasks/page.jsx 100644
View File

@ -0,0 +1,114 @@
"use client";
import AppHeader from "@comp/AppHeader/page";
import AppContext from "@ctx/AppContext";
import BottomSheetCreateRoutine from "plugins/BottomSheet/BottomSheetCreateRoutine";
import PersianNumber from "plugins/PersianNumber";
import React, { useContext, useEffect } from "react";
import Link from "next/link";
import { useRouter } from "next/navigation";
import ActivityCard from "@comp/TaskPage/ActivityCard/page";
import TasksCard from "@comp/TaskPage/TasksCard/page";
const page = () => {
const CTX = useContext(AppContext);
const router = useRouter();
const routinesData = CTX.state.routinesData;
useEffect(() => {
CTX.GetTasks();
}, []);
return (
<div className="pb-20">
<AppHeader
title=" تسک های مجموعه"
sub=" شما 12 تسک در مجموعه دارید"
icon1={true}
iconName1="PLUS"
iconHref1="/tasks/add-task?new=true"
iconEvent1={() => {
CTX.setTaskData([]);
CTX.setIdEditTask("");
CTX.setGoToEditTask(false);
}}
icon2={true}
iconName2="ARROW"
iconHref2="/home"
iconEvent2={() => {
return undefined;
}}
/>
<div className="bg-body-100 relative top-[-30px] rounded-t-3xl overflow-hidden p-5 rtl ">
<div className="flex justify-between ">
<div>
<h4 className="text-base font-bold ">تسک های هفتگی مجموعه</h4>
<p className="mb-0 text-sm">
امروز
<strong className="mx-1 text-primary-300">
<PersianNumber number={24} />
</strong>
تسک فعال دارید
</p>
</div>
<div className="w-[40px] h-[40px] bg-white shadow-sm rounded-xl">
<svg
width="23"
height="27"
viewBox="0 0 16 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-[6px]"
>
<path
d="M5 3.00001C4.73478 3.00001 4.48043 3.10537 4.29289 3.2929C4.10536 3.48044 4 3.73479 4 4.00001C4 4.26523 4.10536 4.51958 4.29289 4.70712C4.48043 4.89465 4.73478 5.00001 5 5.00001C5.26522 5.00001 5.51957 4.89465 5.70711 4.70712C5.89464 4.51958 6 4.26523 6 4.00001C6 3.73479 5.89464 3.48044 5.70711 3.2929C5.51957 3.10537 5.26522 3.00001 5 3.00001ZM2.17 3.00001C2.3766 2.41448 2.75974 1.90744 3.2666 1.5488C3.77346 1.19015 4.37909 0.997559 5 0.997559C5.62091 0.997559 6.22654 1.19015 6.7334 1.5488C7.24026 1.90744 7.6234 2.41448 7.83 3.00001H15C15.2652 3.00001 15.5196 3.10537 15.7071 3.2929C15.8946 3.48044 16 3.73479 16 4.00001C16 4.26523 15.8946 4.51958 15.7071 4.70712C15.5196 4.89465 15.2652 5.00001 15 5.00001H7.83C7.6234 5.58554 7.24026 6.09258 6.7334 6.45122C6.22654 6.80986 5.62091 7.00246 5 7.00246C4.37909 7.00246 3.77346 6.80986 3.2666 6.45122C2.75974 6.09258 2.3766 5.58554 2.17 5.00001H1C0.734784 5.00001 0.48043 4.89465 0.292893 4.70712C0.105357 4.51958 0 4.26523 0 4.00001C0 3.73479 0.105357 3.48044 0.292893 3.2929C0.48043 3.10537 0.734784 3.00001 1 3.00001H2.17ZM11 9.00001C10.7348 9.00001 10.4804 9.10537 10.2929 9.2929C10.1054 9.48044 10 9.73479 10 10C10 10.2652 10.1054 10.5196 10.2929 10.7071C10.4804 10.8947 10.7348 11 11 11C11.2652 11 11.5196 10.8947 11.7071 10.7071C11.8946 10.5196 12 10.2652 12 10C12 9.73479 11.8946 9.48044 11.7071 9.2929C11.5196 9.10537 11.2652 9.00001 11 9.00001ZM8.17 9.00001C8.3766 8.41448 8.75974 7.90744 9.2666 7.5488C9.77346 7.19015 10.3791 6.99756 11 6.99756C11.6209 6.99756 12.2265 7.19015 12.7334 7.5488C13.2403 7.90744 13.6234 8.41448 13.83 9.00001H15C15.2652 9.00001 15.5196 9.10537 15.7071 9.2929C15.8946 9.48044 16 9.73479 16 10C16 10.2652 15.8946 10.5196 15.7071 10.7071C15.5196 10.8947 15.2652 11 15 11H13.83C13.6234 11.5855 13.2403 12.0926 12.7334 12.4512C12.2265 12.8099 11.6209 13.0025 11 13.0025C10.3791 13.0025 9.77346 12.8099 9.2666 12.4512C8.75974 12.0926 8.3766 11.5855 8.17 11H1C0.734784 11 0.48043 10.8947 0.292893 10.7071C0.105357 10.5196 0 10.2652 0 10C0 9.73479 0.105357 9.48044 0.292893 9.2929C0.48043 9.10537 0.734784 9.00001 1 9.00001H8.17ZM5 15C4.73478 15 4.48043 15.1054 4.29289 15.2929C4.10536 15.4804 4 15.7348 4 16C4 16.2652 4.10536 16.5196 4.29289 16.7071C4.48043 16.8947 4.73478 17 5 17C5.26522 17 5.51957 16.8947 5.70711 16.7071C5.89464 16.5196 6 16.2652 6 16C6 15.7348 5.89464 15.4804 5.70711 15.2929C5.51957 15.1054 5.26522 15 5 15ZM2.17 15C2.3766 14.4145 2.75974 13.9074 3.2666 13.5488C3.77346 13.1902 4.37909 12.9976 5 12.9976C5.62091 12.9976 6.22654 13.1902 6.7334 13.5488C7.24026 13.9074 7.6234 14.4145 7.83 15H15C15.2652 15 15.5196 15.1054 15.7071 15.2929C15.8946 15.4804 16 15.7348 16 16C16 16.2652 15.8946 16.5196 15.7071 16.7071C15.5196 16.8947 15.2652 17 15 17H7.83C7.6234 17.5855 7.24026 18.0926 6.7334 18.4512C6.22654 18.8099 5.62091 19.0025 5 19.0025C4.37909 19.0025 3.77346 18.8099 3.2666 18.4512C2.75974 18.0926 2.3766 17.5855 2.17 17H1C0.734784 17 0.48043 16.8947 0.292893 16.7071C0.105357 16.5196 0 16.2652 0 16C0 15.7348 0.105357 15.4804 0.292893 15.2929C0.48043 15.1054 0.734784 15 1 15H2.17Z"
fill="#666666"
/>
</svg>
</div>
</div>
<TasksCard />
<div className="flex justify-between mt-7 sticky top-0">
<div>
<h4 className="text-base font-bold">تسک های امروز</h4>
<p className="mb-0 text-sm">
امروز
<strong className="mx-1 text-primary-300">
<PersianNumber number={24} />
</strong>
تسک فعال دارید
</p>
</div>
<div className="w-[40px] h-[40px] bg-white shadow-sm rounded-xl">
<svg
width="23"
height="27"
viewBox="0 0 16 20"
fill="none"
xmlns="http://www.w3.org/2000/svg"
className="mx-auto mt-[6px]"
>
<path
d="M5 3.00001C4.73478 3.00001 4.48043 3.10537 4.29289 3.2929C4.10536 3.48044 4 3.73479 4 4.00001C4 4.26523 4.10536 4.51958 4.29289 4.70712C4.48043 4.89465 4.73478 5.00001 5 5.00001C5.26522 5.00001 5.51957 4.89465 5.70711 4.70712C5.89464 4.51958 6 4.26523 6 4.00001C6 3.73479 5.89464 3.48044 5.70711 3.2929C5.51957 3.10537 5.26522 3.00001 5 3.00001ZM2.17 3.00001C2.3766 2.41448 2.75974 1.90744 3.2666 1.5488C3.77346 1.19015 4.37909 0.997559 5 0.997559C5.62091 0.997559 6.22654 1.19015 6.7334 1.5488C7.24026 1.90744 7.6234 2.41448 7.83 3.00001H15C15.2652 3.00001 15.5196 3.10537 15.7071 3.2929C15.8946 3.48044 16 3.73479 16 4.00001C16 4.26523 15.8946 4.51958 15.7071 4.70712C15.5196 4.89465 15.2652 5.00001 15 5.00001H7.83C7.6234 5.58554 7.24026 6.09258 6.7334 6.45122C6.22654 6.80986 5.62091 7.00246 5 7.00246C4.37909 7.00246 3.77346 6.80986 3.2666 6.45122C2.75974 6.09258 2.3766 5.58554 2.17 5.00001H1C0.734784 5.00001 0.48043 4.89465 0.292893 4.70712C0.105357 4.51958 0 4.26523 0 4.00001C0 3.73479 0.105357 3.48044 0.292893 3.2929C0.48043 3.10537 0.734784 3.00001 1 3.00001H2.17ZM11 9.00001C10.7348 9.00001 10.4804 9.10537 10.2929 9.2929C10.1054 9.48044 10 9.73479 10 10C10 10.2652 10.1054 10.5196 10.2929 10.7071C10.4804 10.8947 10.7348 11 11 11C11.2652 11 11.5196 10.8947 11.7071 10.7071C11.8946 10.5196 12 10.2652 12 10C12 9.73479 11.8946 9.48044 11.7071 9.2929C11.5196 9.10537 11.2652 9.00001 11 9.00001ZM8.17 9.00001C8.3766 8.41448 8.75974 7.90744 9.2666 7.5488C9.77346 7.19015 10.3791 6.99756 11 6.99756C11.6209 6.99756 12.2265 7.19015 12.7334 7.5488C13.2403 7.90744 13.6234 8.41448 13.83 9.00001H15C15.2652 9.00001 15.5196 9.10537 15.7071 9.2929C15.8946 9.48044 16 9.73479 16 10C16 10.2652 15.8946 10.5196 15.7071 10.7071C15.5196 10.8947 15.2652 11 15 11H13.83C13.6234 11.5855 13.2403 12.0926 12.7334 12.4512C12.2265 12.8099 11.6209 13.0025 11 13.0025C10.3791 13.0025 9.77346 12.8099 9.2666 12.4512C8.75974 12.0926 8.3766 11.5855 8.17 11H1C0.734784 11 0.48043 10.8947 0.292893 10.7071C0.105357 10.5196 0 10.2652 0 10C0 9.73479 0.105357 9.48044 0.292893 9.2929C0.48043 9.10537 0.734784 9.00001 1 9.00001H8.17ZM5 15C4.73478 15 4.48043 15.1054 4.29289 15.2929C4.10536 15.4804 4 15.7348 4 16C4 16.2652 4.10536 16.5196 4.29289 16.7071C4.48043 16.8947 4.73478 17 5 17C5.26522 17 5.51957 16.8947 5.70711 16.7071C5.89464 16.5196 6 16.2652 6 16C6 15.7348 5.89464 15.4804 5.70711 15.2929C5.51957 15.1054 5.26522 15 5 15ZM2.17 15C2.3766 14.4145 2.75974 13.9074 3.2666 13.5488C3.77346 13.1902 4.37909 12.9976 5 12.9976C5.62091 12.9976 6.22654 13.1902 6.7334 13.5488C7.24026 13.9074 7.6234 14.4145 7.83 15H15C15.2652 15 15.5196 15.1054 15.7071 15.2929C15.8946 15.4804 16 15.7348 16 16C16 16.2652 15.8946 16.5196 15.7071 16.7071C15.5196 16.8947 15.2652 17 15 17H7.83C7.6234 17.5855 7.24026 18.0926 6.7334 18.4512C6.22654 18.8099 5.62091 19.0025 5 19.0025C4.37909 19.0025 3.77346 18.8099 3.2666 18.4512C2.75974 18.0926 2.3766 17.5855 2.17 17H1C0.734784 17 0.48043 16.8947 0.292893 16.7071C0.105357 16.5196 0 16.2652 0 16C0 15.7348 0.105357 15.4804 0.292893 15.2929C0.48043 15.1054 0.734784 15 1 15H2.17Z"
fill="#666666"
/>
</svg>
</div>
</div>
<div className=" mt-3">
<ActivityCard />
</div>
</div>
<BottomSheetCreateRoutine />
</div>
);
};
export default page;

1
style/globals.css
View File

@ -66,6 +66,7 @@ body {
font-family: KalamehWeb !important; font-family: KalamehWeb !important;
background: #eeeeee; background: #eeeeee;
--toastify-font-family: KalamehWeb !important; --toastify-font-family: KalamehWeb !important;
--Chart-defaults-font-family: KalamehWeb !important;
} }
.rtl { .rtl {