274 lines
8.8 KiB
TypeScript
274 lines
8.8 KiB
TypeScript
import * as React from "react";
|
|
import { ColumnDef } from "@tanstack/react-table";
|
|
|
|
import { Eye, MoreVertical, SquarePen, Trash2, Upload } from "lucide-react";
|
|
import { cn, getCookiesDecrypt } from "@/lib/utils";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuTrigger,
|
|
DropdownMenuItem,
|
|
} from "@/components/ui/dropdown-menu";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { format } from "date-fns";
|
|
import { Link } from "@/components/navigation";
|
|
import withReactContent from "sweetalert2-react-content";
|
|
import Swal from "sweetalert2";
|
|
import { error } from "@/lib/swal";
|
|
import { deleteMedia } from "@/service/content/content";
|
|
import { deleteContest, publishContest } from "@/service/contest/contest";
|
|
import { useTranslations } from "next-intl";
|
|
|
|
const useTableColumns = () => {
|
|
const t = useTranslations("Table"); // Panggil di dalam hook
|
|
|
|
const columns: ColumnDef<any>[] = [
|
|
{
|
|
accessorKey: "no",
|
|
header: t("no", { defaultValue: "No" }),
|
|
cell: ({ row }) => (
|
|
<div className="flex items-center gap-5">
|
|
<div className="flex-1 text-start">
|
|
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
|
|
{row.getValue("no")}
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "hastagCode",
|
|
header: t("code", { defaultValue: "Code" }),
|
|
cell: ({ row }) => (
|
|
<div className="flex items-center gap-5">
|
|
<div className="flex-1 text-start">
|
|
<h4
|
|
className="text-sm font-bold
|
|
text-default-600 whitespace-nowrap mb-1"
|
|
>
|
|
{row.getValue("hastagCode")}
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "theme",
|
|
header: t("title", { defaultValue: "Title" }),
|
|
cell: ({ row }) => (
|
|
<div className="flex items-center gap-5">
|
|
<div className="flex-1 text-start">
|
|
<h4 className="text-sm font-medium text-default-600 whitespace-nowrap mb-1">
|
|
{row.getValue("theme")}
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "duration",
|
|
header: t("duration", { defaultValue: "Duration" }),
|
|
cell: ({ row }) => (
|
|
<span className="whitespace-nowrap">{row.getValue("duration")}</span>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "targetOutput",
|
|
header: t("target-output", { defaultValue: "Target Output" }),
|
|
cell: ({ row }) => (
|
|
<span className="whitespace-nowrap">
|
|
{row.getValue("targetOutput")}
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "targetParticipantTopLevel",
|
|
header: t("target-participant", { defaultValue: "Target Participant" }),
|
|
cell: ({ row }) => (
|
|
<span className="whitespace-nowrap">
|
|
{row.getValue("targetParticipantTopLevel")}
|
|
</span>
|
|
),
|
|
},
|
|
{
|
|
accessorKey: "isPublishForAll", // Bisa menggunakan ini untuk membaca default data
|
|
header: "Status",
|
|
cell: ({
|
|
row,
|
|
}: {
|
|
row: {
|
|
original: { isPublishForAll?: boolean; isPublishForMabes?: boolean };
|
|
};
|
|
}) => {
|
|
const userRoleId: number = Number(getCookiesDecrypt("urie"));
|
|
const userLevelNumber: number = Number(getCookiesDecrypt("ulne"));
|
|
|
|
const isPublishForAll: boolean = Boolean(row.original.isPublishForAll);
|
|
const isPublishForMabes: boolean = Boolean(
|
|
row.original.isPublishForMabes
|
|
);
|
|
|
|
const isPublish: boolean = isPublishForMabes === true;
|
|
const isPending: boolean =
|
|
(userRoleId === 3 && userLevelNumber === 1 && !isPublishForAll) ||
|
|
((userRoleId === 11 || userRoleId === 12) && !isPublishForMabes);
|
|
|
|
return (
|
|
<Badge
|
|
className={`whitespace-nowrap px-2 py-1 rounded-full ${
|
|
isPending
|
|
? "bg-orange-100 text-orange-600"
|
|
: isPublish
|
|
? "bg-green-100 text-green-600"
|
|
: "bg-blue-100 text-blue-600"
|
|
}`}
|
|
>
|
|
{isPending ? "Pending" : isPublish ? "Publish" : "Terkirim"}
|
|
</Badge>
|
|
);
|
|
},
|
|
},
|
|
|
|
{
|
|
id: "actions",
|
|
accessorKey: "action",
|
|
header: t("action", { defaultValue: "Action" }),
|
|
enableHiding: false,
|
|
cell: ({ row }) => {
|
|
const MySwal = withReactContent(Swal);
|
|
const userRoleId = Number(getCookiesDecrypt("urie"));
|
|
const userLevelId = Number(getCookiesDecrypt("ulie"));
|
|
const userLevelNumber = Number(getCookiesDecrypt("ulne"));
|
|
|
|
async function doPublish(id: any) {
|
|
// loading();
|
|
// const data = {
|
|
// id,
|
|
// };
|
|
|
|
const response = await publishContest(id);
|
|
|
|
if (response?.error) {
|
|
error(response.message);
|
|
return false;
|
|
}
|
|
success();
|
|
}
|
|
|
|
function success() {
|
|
MySwal.fire({
|
|
title: "Sukses",
|
|
icon: "success",
|
|
confirmButtonColor: "#3085d6",
|
|
confirmButtonText: "OK",
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
window.location.reload();
|
|
}
|
|
});
|
|
}
|
|
|
|
const handlePublishContest = (id: any) => {
|
|
MySwal.fire({
|
|
title: "Apakah anda ingin publish Lomba?",
|
|
showCancelButton: true,
|
|
cancelButtonColor: "#3085d6",
|
|
confirmButtonColor: "#d33",
|
|
confirmButtonText: "Ya",
|
|
cancelButtonText: "Tidak",
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
doPublish(id);
|
|
}
|
|
});
|
|
};
|
|
|
|
async function doDelete(id: any) {
|
|
// loading();
|
|
const data = {
|
|
id,
|
|
};
|
|
|
|
const response = await deleteContest(id);
|
|
|
|
if (response?.error) {
|
|
error(response.message);
|
|
return false;
|
|
}
|
|
success();
|
|
}
|
|
|
|
const handleDeleteContest = (id: any) => {
|
|
MySwal.fire({
|
|
title: "Hapus Data",
|
|
text: "",
|
|
icon: "warning",
|
|
showCancelButton: true,
|
|
cancelButtonColor: "#3085d6",
|
|
confirmButtonColor: "#d33",
|
|
confirmButtonText: "Hapus",
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
doDelete(id);
|
|
}
|
|
});
|
|
};
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button
|
|
size="icon"
|
|
className="bg-transparent ring-offset-transparent hover:bg-transparent hover:ring-0 hover:ring-transparent"
|
|
>
|
|
<span className="sr-only">Open menu</span>
|
|
<MoreVertical className="h-4 w-4 text-default-800" />
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent className="p-0" align="end">
|
|
{((userRoleId == 11 || userRoleId == 12) &&
|
|
row?.original?.isPublishForMabes != true) ||
|
|
(userRoleId == 3 &&
|
|
userLevelNumber == 1 &&
|
|
row?.original?.isPublishForAll != true) ? (
|
|
<DropdownMenuItem
|
|
className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none"
|
|
onClick={() => handlePublishContest(row.original.id)}
|
|
>
|
|
<Upload className="w-4 h-4 me-1.5" />
|
|
Publish
|
|
</DropdownMenuItem>
|
|
) : (
|
|
""
|
|
)}
|
|
<Link href={`/shared/contest/detail/${row.original.id}`}>
|
|
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
|
|
<Eye className="w-4 h-4 me-1.5" />
|
|
View
|
|
</DropdownMenuItem>
|
|
</Link>
|
|
<Link href={`/shared/contest/update/${row.original.id}`}>
|
|
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
|
|
<SquarePen className="w-4 h-4 me-1.5" />
|
|
Edit
|
|
</DropdownMenuItem>
|
|
</Link>
|
|
<DropdownMenuItem
|
|
onClick={() => handleDeleteContest(row.original.id)}
|
|
className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none"
|
|
>
|
|
<Trash2 className="w-4 h-4 me-1.5" />
|
|
Delete
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
},
|
|
},
|
|
];
|
|
|
|
return columns;
|
|
};
|
|
|
|
export default useTableColumns;
|