109 lines
3.2 KiB
JavaScript
109 lines
3.2 KiB
JavaScript
"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";
|
|
import { useLocale, useTranslations } from "next-intl";
|
|
|
|
const BottomSheetAddUserToPositionShiftPlan = ({
|
|
setUserAndPositionIds,
|
|
userAndPositionIds,
|
|
positionId,
|
|
positionName,
|
|
usersData,
|
|
}) => {
|
|
const CTX = useContext(AppContext);
|
|
|
|
const [, forceUpdate] = useState();
|
|
|
|
const t = useTranslations("BottomSheet");
|
|
const locale = useLocale();
|
|
const isRTL = locale === "fa";
|
|
|
|
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>
|
|
</>
|
|
),
|
|
})
|
|
);
|
|
|
|
return (
|
|
<BottomSheet
|
|
open={CTX.state.BottomSheetAddUserToPositionShiftPlanOpen}
|
|
onDismiss={() => CTX.setBottomSheetAddUserToPositionShiftPlanOpen(false)}
|
|
blocking={true}
|
|
>
|
|
<div className="text-center py-2 bg-secondary-950 ">
|
|
<p className="mb-0 text-primary-300 relative top-[-5px]">
|
|
{isRTL ? (
|
|
<> افزودن یوزر به پوزیشن {positionName}</>
|
|
) : (
|
|
<>
|
|
{" "}
|
|
{t("BottomSheetAddUserToPositionShiftPlanTitle")} {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 (!userAndPositionIds || userExistsIndex === -1) {
|
|
setUserAndPositionIds((current) => [
|
|
...(current || []),
|
|
{
|
|
key: positionId,
|
|
value: e.userId,
|
|
},
|
|
]);
|
|
} else {
|
|
setUserAndPositionIds((current) => [
|
|
...(current ? current.slice(0, userExistsIndex) : []),
|
|
...(current ? current.slice(userExistsIndex + 1) : []),
|
|
]);
|
|
}
|
|
CTX.setBottomSheetAddUserToPositionShiftPlanOpen(false);
|
|
}}
|
|
>
|
|
<div className="flex rtl justify-between p-1">
|
|
<p className="mb-0 m-1 text-sm">
|
|
{e?.firstName} {e?.lastName}
|
|
</p>
|
|
|
|
<p className="mb-0 text-secondary-700 pl-4 rounded-full text-sm">
|
|
{e?.roleNames[0]}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</BottomSheet>
|
|
);
|
|
};
|
|
|
|
export default BottomSheetAddUserToPositionShiftPlan;
|