fix: form create task-ta
This commit is contained in:
parent
ec2d7eb203
commit
7c721dcc96
|
|
@ -43,7 +43,7 @@ import { getCsrfToken } from "@/service/auth";
|
|||
import { loading } from "@/lib/swal";
|
||||
import { useTranslations } from "next-intl";
|
||||
import dynamic from "next/dynamic";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn, getCookiesDecrypt } from "@/lib/utils";
|
||||
import {
|
||||
Popover,
|
||||
PopoverContent,
|
||||
|
|
@ -181,6 +181,32 @@ export default function FormTaskTa() {
|
|||
mode: "all",
|
||||
});
|
||||
|
||||
const [profile, setProfile] = useState<any>(null);
|
||||
const userLevelId = Number(getCookiesDecrypt("ulie"));
|
||||
const roleId = Number(getCookiesDecrypt("urie"));
|
||||
const userId = Number(getCookiesDecrypt("uie"));
|
||||
|
||||
const MABES_LEVEL_ID = 216;
|
||||
const APPROVER_ROLE_ID = 3;
|
||||
const isMabes = userLevelId === MABES_LEVEL_ID;
|
||||
const isApprover = roleId === APPROVER_ROLE_ID;
|
||||
|
||||
const isMabesApprover =
|
||||
userLevelId === MABES_LEVEL_ID && roleId === APPROVER_ROLE_ID;
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchUserLevel() {
|
||||
try {
|
||||
const res = await getUserLevelForAssignments();
|
||||
setProfile(res?.data?.data);
|
||||
} catch (e) {
|
||||
console.error("Failed fetch user level", e);
|
||||
}
|
||||
}
|
||||
fetchUserLevel();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
getDataAdditional();
|
||||
}, []);
|
||||
|
|
@ -360,12 +386,20 @@ export default function FormTaskTa() {
|
|||
const requestData = {
|
||||
...data,
|
||||
assignedToUsers: handleExpertChange(),
|
||||
// assignedToUsers: isMabesApprover ? "464" : handleExpertChange(),
|
||||
assignmentType: taskType,
|
||||
assignmentTypeId: type,
|
||||
expertCompetencies: Array.from(selectedCompetencies).join(","),
|
||||
attachmentUrl: cleanedLinks,
|
||||
};
|
||||
|
||||
console.log("FINAL ASSIGNED TO:", {
|
||||
isMabesApprover,
|
||||
assignedToUsers: isMabesApprover
|
||||
? String(roleId)
|
||||
: handleExpertChange(),
|
||||
});
|
||||
|
||||
const response = await createTaskTa(requestData);
|
||||
const id = String(response?.data?.data.id);
|
||||
|
||||
|
|
@ -718,101 +752,109 @@ export default function FormTaskTa() {
|
|||
</PopoverContent>
|
||||
</Popover>
|
||||
</div>
|
||||
<div className="mt-5 space-y-2">
|
||||
<Label>
|
||||
{t("areas-expertise", { defaultValue: "Areas Expertise" })}
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-4">
|
||||
{userCompetencies?.map((item: any) => (
|
||||
<div className="flex items-center gap-2" key={item.id}>
|
||||
<Checkbox
|
||||
id={`comp-${item.id}`}
|
||||
checked={selectedCompetencies.has(item.id)}
|
||||
onCheckedChange={() => handleCompetencyChange(item.id)}
|
||||
/>
|
||||
<Label htmlFor={`comp-${item.id}`}>{item.name}</Label>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div className="mt-5 space-y-2">
|
||||
<Label>
|
||||
{t("choose-expert", { defaultValue: "Choose Expert" })}
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-4">
|
||||
<Dialog>
|
||||
<DialogTrigger asChild>
|
||||
<Button variant="soft" size="sm" color="primary">
|
||||
[{"Pilih Tenaga Ahli"}]
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="sm:max-w-[425px] md:max-w-[500px] lg:max-w-[1500px]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Daftar Tenaga Ahli</DialogTitle>
|
||||
</DialogHeader>
|
||||
<div className="grid grid-cols-2 gap-2 max-h-[400px] overflow-y-auto">
|
||||
{listExpert?.map((expert: any) => (
|
||||
<div key={expert.id} className="border p-2">
|
||||
<Label className="flex items-center">
|
||||
<Checkbox
|
||||
checked={checkedLevels.has(expert.id)}
|
||||
onCheckedChange={() =>
|
||||
handleCheckboxChange(expert.id)
|
||||
}
|
||||
className="mr-3"
|
||||
/>
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="font-bold">{expert.fullname}</div>
|
||||
<div className="italic">({expert.username})</div>
|
||||
</div>
|
||||
</Label>
|
||||
</div>
|
||||
))}
|
||||
{!isMabesApprover && (
|
||||
<div className="mt-5 space-y-2">
|
||||
<Label>
|
||||
{t("areas-expertise", { defaultValue: "Areas Expertise" })}
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-4">
|
||||
{userCompetencies?.map((item: any) => (
|
||||
<div className="flex items-center gap-2" key={item.id}>
|
||||
<Checkbox
|
||||
id={`comp-${item.id}`}
|
||||
checked={selectedCompetencies.has(item.id)}
|
||||
onCheckedChange={() => handleCompetencyChange(item.id)}
|
||||
/>
|
||||
<Label htmlFor={`comp-${item.id}`}>{item.name}</Label>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</div>
|
||||
{checkedLevels.size > 0 && (
|
||||
<div className="mt-3">
|
||||
<Label className="text-sm text-gray-600 mb-2 block">
|
||||
Tenaga Ahli Terpilih ({checkedLevels.size})
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{Array.from(checkedLevels).map((expertId) => {
|
||||
const expert = listExpert?.find(
|
||||
(exp: any) => exp.id === expertId
|
||||
);
|
||||
return expert ? (
|
||||
<div
|
||||
key={expert.id}
|
||||
className="inline-flex items-center gap-2 bg-blue-100 text-blue-800 text-sm font-medium px-3 py-1.5 rounded-full border border-blue-200"
|
||||
>
|
||||
<span>{expert.fullname}</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleCheckboxChange(expert.id)}
|
||||
className="ml-1 text-blue-600 hover:text-blue-800 hover:bg-blue-200 rounded-full p-0.5 transition-colors"
|
||||
title="Remove expert"
|
||||
>
|
||||
<svg
|
||||
className="w-3 h-3"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
) : null;
|
||||
})}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{!isMabesApprover && (
|
||||
<div className="mt-5 space-y-2">
|
||||
<Label>
|
||||
{t("choose-expert", { defaultValue: "Choose Expert" })}
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-4">
|
||||
<Dialog>
|
||||
<DialogTrigger asChild>
|
||||
<Button variant="soft" size="sm" color="primary">
|
||||
[{"Pilih Tenaga Ahli"}]
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="sm:max-w-[425px] md:max-w-[500px] lg:max-w-[1500px]">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Daftar Tenaga Ahli</DialogTitle>
|
||||
</DialogHeader>
|
||||
<div className="grid grid-cols-2 gap-2 max-h-[400px] overflow-y-auto">
|
||||
{listExpert?.map((expert: any) => (
|
||||
<div key={expert.id} className="border p-2">
|
||||
<Label className="flex items-center">
|
||||
<Checkbox
|
||||
checked={checkedLevels.has(expert.id)}
|
||||
onCheckedChange={() =>
|
||||
handleCheckboxChange(expert.id)
|
||||
}
|
||||
className="mr-3"
|
||||
/>
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="font-bold">
|
||||
{expert.fullname}
|
||||
</div>
|
||||
<div className="italic">
|
||||
({expert.username})
|
||||
</div>
|
||||
</div>
|
||||
</Label>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</div>
|
||||
{checkedLevels.size > 0 && (
|
||||
<div className="mt-3">
|
||||
<Label className="text-sm text-gray-600 mb-2 block">
|
||||
Tenaga Ahli Terpilih ({checkedLevels.size})
|
||||
</Label>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{Array.from(checkedLevels).map((expertId) => {
|
||||
const expert = listExpert?.find(
|
||||
(exp: any) => exp.id === expertId
|
||||
);
|
||||
return expert ? (
|
||||
<div
|
||||
key={expert.id}
|
||||
className="inline-flex items-center gap-2 bg-blue-100 text-blue-800 text-sm font-medium px-3 py-1.5 rounded-full border border-blue-200"
|
||||
>
|
||||
<span>{expert.fullname}</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleCheckboxChange(expert.id)}
|
||||
className="ml-1 text-blue-600 hover:text-blue-800 hover:bg-blue-200 rounded-full p-0.5 transition-colors"
|
||||
title="Remove expert"
|
||||
>
|
||||
<svg
|
||||
className="w-3 h-3"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
) : null;
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-5 space-y-2">
|
||||
<Label>{t("description", { defaultValue: "Description" })}</Label>
|
||||
<Controller
|
||||
|
|
|
|||
|
|
@ -168,6 +168,13 @@ export function getMenuList(pathname: string, t: any): Group[] {
|
|||
icon: "heroicons:shopping-cart",
|
||||
children: [],
|
||||
},
|
||||
{
|
||||
href: "/contributor/task-ta",
|
||||
label: "penugasan TA",
|
||||
active: pathname.includes("/contributor/task-ta"),
|
||||
icon: "heroicons:shopping-cart",
|
||||
children: [],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
|
|
|
|||
Loading…
Reference in New Issue