diff --git a/app/[locale]/(protected)/admin/add-experts/component/column.tsx b/app/[locale]/(protected)/admin/add-experts/component/column.tsx index 528d9436..37b97cab 100644 --- a/app/[locale]/(protected)/admin/add-experts/component/column.tsx +++ b/app/[locale]/(protected)/admin/add-experts/component/column.tsx @@ -40,19 +40,19 @@ const columns: ColumnDef[] = [ }, { - accessorKey: "name", + accessorKey: "fullname", header: "Nama", - cell: ({ row }) => {row.getValue("name")}, + cell: ({ row }) => {row.getValue("fullname")}, }, { - accessorKey: "region", + accessorKey: "address", header: "Wilayah", - cell: ({ row }) => {row.getValue("region")}, + cell: ({ row }) => {row.getValue("address")}, }, { - accessorKey: "skills", + accessorKey: "role.name", header: "Bidang Keahlian", - cell: ({ row }) => {row.getValue("skills")}, + cell: ({ row }) => {row.original.role?.name ?? "-"}, }, { diff --git a/app/[locale]/(protected)/admin/add-experts/component/table.tsx b/app/[locale]/(protected)/admin/add-experts/component/table.tsx index 90f87f87..d3f08916 100644 --- a/app/[locale]/(protected)/admin/add-experts/component/table.tsx +++ b/app/[locale]/(protected)/admin/add-experts/component/table.tsx @@ -53,6 +53,7 @@ import { listEnableCategory } from "@/service/content/content"; import { Checkbox } from "@/components/ui/checkbox"; import { close, loading } from "@/config/swal"; import { Link } from "@/i18n/routing"; +import { listDataExperts } from "@/service/experts/experts"; const dummyData = [ { @@ -93,6 +94,7 @@ const AddExpertTable = () => { const [statusFilter, setStatusFilter] = React.useState([]); const [page, setPage] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); + const [limit, setLimit] = React.useState(10); const table = useReactTable({ data: dataTable, columns, @@ -145,19 +147,44 @@ const AddExpertTable = () => { }); }, [page, showData]); - async function fetchData() { - try { - loading(); + // async function fetchData() { + // try { + // loading(); - const contentData = dummyData; + // const contentData = dummyData; + // contentData.forEach((item: any, index: number) => { + // item.no = (page - 1) * Number(showData) + index + 1; + // }); + + // setDataTable(contentData); + // setTotalData(contentData?.length); + // setTotalPage(1); + // close(); + // } catch (error) { + // console.error("Error fetching tasks:", error); + // } + // } + + async function fetchData() { + // const formattedStartDate = startDate + // ? format(new Date(startDate), "yyyy-MM-dd") + // : ""; + // const formattedEndDate = endDate + // ? format(new Date(endDate), "yyyy-MM-dd") + // : ""; + try { + // const isForSelf = Number(roleId) === 4; + const res = await listDataExperts(limit, page - 1); + + const data = res?.data?.data; + const contentData = data?.content; contentData.forEach((item: any, index: number) => { - item.no = (page - 1) * Number(showData) + index + 1; + item.no = (page - 1) * limit + index + 1; }); setDataTable(contentData); - setTotalData(contentData?.length); - setTotalPage(1); - close(); + setTotalData(data?.totalElements); + setTotalPage(data?.totalPages); } catch (error) { console.error("Error fetching tasks:", error); } diff --git a/app/[locale]/(protected)/admin/add-experts/create/page.tsx b/app/[locale]/(protected)/admin/add-experts/create/page.tsx index 783be176..3612d814 100644 --- a/app/[locale]/(protected)/admin/add-experts/create/page.tsx +++ b/app/[locale]/(protected)/admin/add-experts/create/page.tsx @@ -23,27 +23,30 @@ import { SelectTrigger, SelectValue, } from "@/components/ui/select"; +import { useEffect, useState } from "react"; +import { AdministrationLevelList, getListCompetencies, getListExperiences, saveUserInternal, saveUserRolePlacements } from "@/service/management-user/management-user"; +import { loading } from "@/config/swal"; const FormSchema = z.object({ name: z.string({ required_error: "Required", }), + username: z.string({ + required_error: "Required", + }), + password: z.string({ + required_error: "Required", + }), phoneNumber: z.string({ required_error: "Required", }), email: z.string({ required_error: "Required", }), - position: z.string({ - required_error: "Required", - }), - region: z.string({ - required_error: "Required", - }), skills: z.string({ required_error: "Required", }), - experience: z.string({ + experiences: z.string({ required_error: "Required", }), company: z.string({ @@ -51,12 +54,34 @@ const FormSchema = z.object({ }), }); +export type Placements = { + index: number; + roleId?: string; + userLevelId?: number; +} + export default function AddExpertForm() { const MySwal = withReactContent(Swal); const router = useRouter(); const form = useForm>({ resolver: zodResolver(FormSchema), }); + const [incrementId, setIncrementId] = useState(1); + const [placementRows, setPlacementRows] = useState([{ index: 0, roleId: "", userLevelId: 0 }]); + const [userCompetencies, setUserCompetencies] = useState(); + const [userExperiences, setUserExperiences] = useState(); + const [userLevels, setUserLevels] = useState(); + + const roleSelection = [ + { + id: "11", + name: "Koor Kurator", + }, + { + id: "12", + name: "Kurator", + } + ]; const onSubmit = async (data: z.infer) => { MySwal.fire({ @@ -77,9 +102,85 @@ export default function AddExpertForm() { const save = async (data: z.infer) => { console.log("data", data); - // successSubmit(); + const dataReq = { + firstName: data.name, + username: data.username, + email: data.email, + password: data.password, + adress: "", + roleId: "EXP-ID", + phoneNumber: data.phoneNumber, + userCompetencyId: data.skills, + userExperienceId: data.experiences, + companyName: data.company, + } + + loading(); + const res = await saveUserInternal(dataReq); + const resData = res?.data?.data; + const userProfileId = resData.id; + + var placementArr: any[] = []; + placementRows.forEach((row: any) => { + placementArr.push({ + roleId: Number(row.roleId), + userLevelId: Number(row.userLevelId), + userProfileId: userProfileId, + }); + }); + + const dataReq2 = { + userId: userProfileId, + placements: placementArr + } + const res2 = await saveUserRolePlacements(dataReq2); + const resData2 = res2?.data?.data; + + success("/admin/add-experts"); }; + + function success(redirect: string): void { + MySwal.fire({ + title: '

Sukses

', + icon: "success", + confirmButtonColor: "#3085d6", + confirmButtonText: 'OK', + allowOutsideClick: false, + }).then((result) => { + if (result.isConfirmed) { + router.push(redirect); + } + }); + } + + useEffect(() => { + getDataAdditional(); + }, []); + + async function getDataAdditional() { + const resCompetencies = await getListCompetencies(); + setUserCompetencies(resCompetencies?.data?.data); + + const resExperiences = await getListExperiences(); + setUserExperiences(resExperiences?.data?.data); + + const resUserLevels = await AdministrationLevelList(); + const data = resUserLevels?.data?.data; + var levelsArr: any[] = []; + data.forEach((levels: any) => { + levelsArr.push({ + id: levels.id, + label: levels.name, + name: levels.name, + value: String(levels.id), + levelNumber: levels.levelNumber, + }); + }); + setUserLevels(levelsArr); + } + + function successSubmit() { MySwal.fire({ title: "Sukses", @@ -92,6 +193,29 @@ export default function AddExpertForm() { } }); } + + const handleSelectionChange = (index: number, type: "roleId" | "userLevelId", value: string) => { + setPlacementRows((prevRows) => + prevRows.map((row) => + row.index === index ? { ...row, [type]: value } : row + ) + ); + }; + + + const handleRemoveRow = (index: number) => { + console.log(index); + console.log(placementRows); + const newPlacements = placementRows.filter((row) => row.index != index); + console.log(newPlacements); + setPlacementRows(newPlacements); + }; + + const handleAddRow = () => { + setPlacementRows((prevRows: any) => [...prevRows, { index: incrementId, roleId: "", userLevelId: 0 }]); + setIncrementId((prevId) => prevId + 1); + }; + return (
@@ -118,6 +242,22 @@ export default function AddExpertForm() { )} /> + ( + + Username + + + + + )} + /> ( - Posisi - - - - - )} - /> - ( - - Wilayah - - + Password + )} @@ -208,19 +319,20 @@ export default function AddExpertForm() { - Komunikasi - Hukum - Bahasa + {userCompetencies?.map((item: any) => ( + + {item.name} + + ))} - - )} /> + ( Pengalaman @@ -231,15 +343,13 @@ export default function AddExpertForm() { - Akademisi - Praktisi - - Akademisi + Praktisi - + {userExperiences?.map((item: any) => ( + + {item.name} + + ))} - - )} /> @@ -261,6 +371,59 @@ export default function AddExpertForm() { )} /> +
+ Penempatan + {placementRows?.map((row: any) => ( +
+ + + {placementRows.length > 1 && ( + + )} +
+ ))} + +
+
); diff --git a/app/[locale]/(protected)/admin/performance-satker/page.tsx b/app/[locale]/(protected)/admin/performance-satker/page.tsx new file mode 100644 index 00000000..1296113c --- /dev/null +++ b/app/[locale]/(protected)/admin/performance-satker/page.tsx @@ -0,0 +1,13 @@ +import SiteBreadcrumb from "@/components/site-breadcrumb"; +import PerformancePolresViz from "@/components/visualization/performance-polres"; +import PerformanceSatkerViz from "@/components/visualization/performance-satker"; + +export default function PerformanceSatker() { + return ( +
+ +

PERFORMANCE KUMULATIF PER SATKER

+ +
+ ); +} diff --git a/app/[locale]/(protected)/admin/settings/banner/page.tsx b/app/[locale]/(protected)/admin/settings/banner/page.tsx index 9fc14206..c3fcbe33 100644 --- a/app/[locale]/(protected)/admin/settings/banner/page.tsx +++ b/app/[locale]/(protected)/admin/settings/banner/page.tsx @@ -14,9 +14,7 @@ export default function AdminBanner() {
- {selectedTab === "content" - ? "Daftar List Media" - : "Table List Banner"} + {selectedTab === "content" ? "List Media" : " List Banner"}
- Tambah Kategori + {t("add-category")}
{ const router = useRouter(); const searchParams = useSearchParams(); + const t = useTranslations("Menu"); const dataChange = searchParams?.get("dataChange"); const [openModal, setOpenModal] = React.useState(false); const [dataTable, setDataTable] = React.useState([]); @@ -127,7 +129,7 @@ const AdminCategoryTable = () => { return (
-

Kategori

+

{t("category")}

diff --git a/app/[locale]/(protected)/admin/settings/faq/component/create.tsx b/app/[locale]/(protected)/admin/settings/faq/component/create.tsx index 0254c600..0e5da32e 100644 --- a/app/[locale]/(protected)/admin/settings/faq/component/create.tsx +++ b/app/[locale]/(protected)/admin/settings/faq/component/create.tsx @@ -40,6 +40,7 @@ import { useDropzone } from "react-dropzone"; import { CloudUpload } from "lucide-react"; import Image from "next/image"; import { Upload } from "tus-js-client"; +import { useTranslations } from "next-intl"; const FormSchema = z.object({ answer: z.string({ @@ -79,7 +80,7 @@ const publishToList = [ export default function CreateFAQModal() { const router = useRouter(); const { toast } = useToast(); - + const t = useTranslations("Menu"); const [isOpen, setIsOpen] = useState(false); const [satkerData, setSatkerData] = useState([]); const [unitData, setUnitData] = useState([]); @@ -120,12 +121,12 @@ export default function CreateFAQModal() { - Tambah FAQ + {t("add")} FAQ >({ @@ -110,12 +111,12 @@ export default function CreateFAQModal() { - Tambah Feedback + {t("add")} Feedback { const router = useRouter(); const searchParams = useSearchParams(); const dataChange = searchParams?.get("dataChange"); + const [openModal, setOpenModal] = React.useState(false); const [dataTable, setDataTable] = React.useState([]); const [totalData, setTotalData] = React.useState(1); diff --git a/app/[locale]/(protected)/admin/settings/tag/component/create.tsx b/app/[locale]/(protected)/admin/settings/tag/component/create.tsx index 216188aa..9955faf9 100644 --- a/app/[locale]/(protected)/admin/settings/tag/component/create.tsx +++ b/app/[locale]/(protected)/admin/settings/tag/component/create.tsx @@ -42,6 +42,7 @@ import { CommandList, } from "@/components/ui/command"; import { cn } from "@/lib/utils"; +import { useTranslations } from "next-intl"; const FormSchema = z.object({ name: z.string({ @@ -55,6 +56,7 @@ const FormSchema = z.object({ export default function CreateTagModal() { const router = useRouter(); const { toast } = useToast(); + const t = useTranslations("Menu"); const [categoryList, setCategoryList] = useState< { id: number; label: string; value: string }[] >([]); @@ -107,12 +109,12 @@ export default function CreateTagModal() { - Tambah Tag + {t("add-tags")} { const router = useRouter(); const searchParams = useSearchParams(); + const t = useTranslations("Menu"); const dataChange = searchParams?.get("dataChange"); const [openModal, setOpenModal] = React.useState(false); const [dataTable, setDataTable] = React.useState([]); @@ -124,7 +126,7 @@ const AdminTagTable = () => { return (
-

Tag

+

{t("tags")}

diff --git a/app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx b/app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx index c72dfaef..7068813f 100644 --- a/app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx +++ b/app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx @@ -119,6 +119,9 @@ const CalendarView = ({ categories }: CalendarViewProps) => { ); const [selectedEventDate, setSelectedEventDate] = useState(null); const roleId = Number(getCookiesDecrypt("urie")) || 0; + const userLevelId = Number(getCookiesDecrypt("ulie")) || 0; + console.log("roleId", roleId); + console.log("userlevel", userLevelId); const [apiEvents, setApiEvents] = useState([]); const [Isloading, setLoading] = useState(false); const [draggableInitialized, setDraggableInitialized] = @@ -574,11 +577,11 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
- + {roleId == 3 || roleId == 11 || roleId == 2 || roleId == 12 ? ( diff --git a/app/[locale]/(protected)/contributor/blog/components/blog-table.tsx b/app/[locale]/(protected)/contributor/blog/components/blog-table.tsx index 4ccda3e8..60104d67 100644 --- a/app/[locale]/(protected)/contributor/blog/components/blog-table.tsx +++ b/app/[locale]/(protected)/contributor/blog/components/blog-table.tsx @@ -45,6 +45,7 @@ import { listEnableCategory } from "@/service/content/content"; import { useTranslations } from "next-intl"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { Link } from "@/i18n/routing"; +import useTableColumns from "./columns"; const BlogTable = () => { const router = useRouter(); @@ -73,7 +74,7 @@ const BlogTable = () => { ); const [categoryFilter, setCategoryFilter] = React.useState(""); const [statusFilter, setStatusFilter] = React.useState([]); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/blog/components/columns.tsx b/app/[locale]/(protected)/contributor/blog/components/columns.tsx index c111ef2e..87b5d362 100644 --- a/app/[locale]/(protected)/contributor/blog/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/blog/components/columns.tsx @@ -17,155 +17,162 @@ import Swal from "sweetalert2"; import withReactContent from "sweetalert2-react-content"; import { deleteBlog } from "@/service/blog/blog"; import { error, loading } from "@/lib/swal"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => {row.getValue("no")}, - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }) => ( - {row.getValue("title")} - ), - }, - { - accessorKey: "categoryName", - header: "Category", - cell: ({ row }) => {row.getValue("categoryName")}, - }, - { - accessorKey: "createdAt", - header: "Upload Date", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; +const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => {row.getValue("no")}, }, - }, - { - accessorKey: "tags", - header: "Tag", - cell: ({ row }) => {row.getValue("tags")}, - }, - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); + { + accessorKey: "title", + header: t("title"), + cell: ({ row }) => ( + {row.getValue("title")} + ), }, - }, + { + accessorKey: "categoryName", + header: t("category"), + cell: ({ row }) => {row.getValue("categoryName")}, + }, + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const router = useRouter(); - const MySwal = withReactContent(Swal); + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, + }, + { + accessorKey: "tags", + header: t("tag"), + cell: ({ row }) => {row.getValue("tags")}, + }, + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", + }; - async function deleteProcess(id: any) { - loading(); - const resDelete = await deleteBlog(id); + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - if (resDelete?.error) { - error(resDelete.message); - return false; + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; + + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, + }, + + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const router = useRouter(); + const MySwal = withReactContent(Swal); + + async function deleteProcess(id: any) { + loading(); + const resDelete = await deleteBlog(id); + + if (resDelete?.error) { + error(resDelete.message); + return false; + } + success(); } - success(); - } - function success() { - MySwal.fire({ - title: "Sukses", - icon: "success", - confirmButtonColor: "#3085d6", - confirmButtonText: "OK", - }).then((result) => { - if (result.isConfirmed) { - window.location.reload(); - } - }); - } + function success() { + MySwal.fire({ + title: "Sukses", + icon: "success", + confirmButtonColor: "#3085d6", + confirmButtonText: "OK", + }).then((result) => { + if (result.isConfirmed) { + window.location.reload(); + } + }); + } - const handleDeleteBlog = (id: any) => { - MySwal.fire({ - title: "Hapus Data", - text: "", - icon: "warning", - showCancelButton: true, - cancelButtonColor: "#3085d6", - confirmButtonColor: "#d33", - confirmButtonText: "Hapus", - }).then((result) => { - if (result.isConfirmed) { - deleteProcess(id); - } - }); - }; - return ( - - - - - - - - - View + const handleDeleteBlog = (id: any) => { + MySwal.fire({ + title: "Hapus Data", + text: "", + icon: "warning", + showCancelButton: true, + cancelButtonColor: "#3085d6", + confirmButtonColor: "#d33", + confirmButtonText: "Hapus", + }).then((result) => { + if (result.isConfirmed) { + deleteProcess(id); + } + }); + }; + return ( + + + + + + + + + View + + + + + + Edit + + + handleDeleteBlog(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete - - - - - Edit - - - handleDeleteBlog(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/audio/components/columns.tsx b/app/[locale]/(protected)/contributor/content/audio/components/columns.tsx index f6410a19..58f69d01 100644 --- a/app/[locale]/(protected)/contributor/content/audio/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/content/audio/components/columns.tsx @@ -17,211 +17,224 @@ import withReactContent from "sweetalert2-react-content"; import { deleteMedia } from "@/service/content/content"; import { error } from "@/lib/swal"; import Swal from "sweetalert2"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const MySwal = withReactContent(Swal); + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "categoryName", + header: t("category-name"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("categoryName")} - ); + ), }, - }, - { - accessorKey: "categoryName", - header: "Category Name", - cell: ({ row }) => ( - {row.getValue("categoryName")} - ), - }, - { - accessorKey: "createdAt", - header: "Upload Date", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "creatorName", - header: "Creator Group", - cell: ({ row }) => ( - {row.getValue("creatorName")} - ), - }, - { - accessorKey: "creatorGroupLevelName", - header: "Sumber", - cell: ({ row }) => ( - - {row.getValue("creatorGroupLevelName")} - - ), - }, - { - accessorKey: "publishedOn", - header: "Published", - cell: ({ row }) => { - const isPublish = row.original.isPublish; - const isPublishOnPolda = row.original.isPublishOnPolda; - - let displayText = "-"; - if (isPublish && !isPublishOnPolda) { - displayText = "Mabes"; - } else if (isPublish && isPublishOnPolda) { - displayText = "Mabes & Polda"; - } else if (!isPublish && isPublishOnPolda) { - displayText = "Polda"; - } - - return ( -
- {displayText} -
- ); + { + accessorKey: "creatorName", + header: t("creator-group"), + cell: ({ row }) => ( + {row.getValue("creatorName")} + ), }, - }, - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); + { + accessorKey: "creatorGroupLevelName", + header: t("source"), + cell: ({ row }) => ( + + {row.getValue("creatorGroupLevelName")} + + ), }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const MySwal = withReactContent(Swal); + { + accessorKey: "publishedOn", + header: t("published"), + cell: ({ row }) => { + const isPublish = row.original.isPublish; + const isPublishOnPolda = row.original.isPublishOnPolda; - async function doDelete(id: any) { - // loading(); - const data = { - id, + let displayText = "-"; + if (isPublish && !isPublishOnPolda) { + displayText = "Mabes"; + } else if (isPublish && isPublishOnPolda) { + displayText = "Mabes & Polda"; + } else if (!isPublish && isPublishOnPolda) { + displayText = "Polda"; + } + + return ( +
+ {displayText} +
+ ); + }, + }, + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", }; - const response = await deleteMedia(data); + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - if (response?.error) { - error(response.message); - return false; - } - success(); - } + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; - function success() { - MySwal.fire({ - title: "Sukses", - icon: "success", - confirmButtonColor: "#3085d6", - confirmButtonText: "OK", - }).then((result) => { - if (result.isConfirmed) { - window.location.reload(); - } - }); - } - - const handleDeleteMedia = (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 ( - - - - - - - - - View - - - - - - Edit - - - handleDeleteMedia(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, }, - }, -]; + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const MySwal = withReactContent(Swal); -export default columns; + async function doDelete(id: any) { + // loading(); + const data = { + id, + }; + + const response = await deleteMedia(data); + + 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 handleDeleteMedia = (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 ( + + + + + + + + + View + + + + + + Edit + + + handleDeleteMedia(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete + + + + ); + }, + }, + ]; + + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/audio/components/table-audio.tsx b/app/[locale]/(protected)/contributor/content/audio/components/table-audio.tsx index 05e29ee8..7a2b9196 100644 --- a/app/[locale]/(protected)/contributor/content/audio/components/table-audio.tsx +++ b/app/[locale]/(protected)/contributor/content/audio/components/table-audio.tsx @@ -61,6 +61,7 @@ import { } from "@/service/content/content"; import { Label } from "@/components/ui/label"; import { format } from "date-fns"; +import useTableColumns from "./columns"; const TableAudio = () => { const router = useRouter(); @@ -99,7 +100,7 @@ const TableAudio = () => { const [filterByCreatorGroup, setFilterByCreatorGroup] = React.useState(""); const roleId = getCookiesDecrypt("urie"); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/content/image/components/columns.tsx b/app/[locale]/(protected)/contributor/content/image/components/columns.tsx index 48819b15..28e03f43 100644 --- a/app/[locale]/(protected)/contributor/content/image/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/content/image/components/columns.tsx @@ -1,3 +1,4 @@ +"use client"; import * as React from "react"; import { ColumnDef } from "@tanstack/react-table"; @@ -19,237 +20,224 @@ import { deleteMedia } from "@/service/content/content"; import { error, loading } from "@/lib/swal"; import Swal from "sweetalert2"; import withReactContent from "sweetalert2-react-content"; +import { useTranslations } from "next-intl"; -const MySwal = withReactContent(Swal); - -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const MySwal = withReactContent(Swal); + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "categoryName", + header: t("category-name"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("categoryName")} - ); + ), }, - }, - { - accessorKey: "categoryName", - header: "Category Name", - cell: ({ row }) => ( - {row.getValue("categoryName")} - ), - }, - { - accessorKey: "createdAt", - header: "Upload Date", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "creatorName", - header: "Creator Group", - cell: ({ row }) => ( - {row.getValue("creatorName")} - ), - }, - { - accessorKey: "creatorGroupLevelName", - header: "Sumber", - cell: ({ row }) => ( - - {row.getValue("creatorGroupLevelName")} - - ), - }, - { - accessorKey: "publishedOn", - header: "Published", - cell: ({ row }) => { - const isPublish = row.original.isPublish; - const isPublishOnPolda = row.original.isPublishOnPolda; - - let displayText = "-"; - if (isPublish && !isPublishOnPolda) { - displayText = "Mabes"; - } else if (isPublish && isPublishOnPolda) { - displayText = "Mabes & Polda"; - } else if (!isPublish && isPublishOnPolda) { - displayText = "Polda"; - } - - return ( -
- {displayText} -
- ); + { + accessorKey: "creatorName", + header: t("creator-group"), + cell: ({ row }) => ( + {row.getValue("creatorName")} + ), }, - }, - { - accessorKey: "statusId", - header: "Status", - cell: ({ row }) => { - const userLevelId = 2; // Gantilah sesuai dengan konteks aplikasi - const statusId = Number(row.getValue("statusId")); - const reviewedAtLevel = row.original.reviewedAtLevel as string | null; - const needApprovalFromLevel = Number(row.original.needApprovalFromLevel); - - let statusName = row.getValue("statusName") as string; - let icon = "fa:times-circle"; - let statusClass = "bg-gray-100 text-gray-600"; - - if ( - (statusId === 2 && - reviewedAtLevel !== null && - !reviewedAtLevel.includes(`:${userLevelId}:`)) || - (statusId === 1 && needApprovalFromLevel === userLevelId) - ) { - statusName = "Menunggu Review"; - icon = "fa:hourglass-end"; - statusClass = "bg-orange-100 text-orange-600"; - } else if ( - statusId === 2 && - reviewedAtLevel?.includes(`:${userLevelId}:`) - ) { - icon = "fa:check-circle"; - statusClass = "bg-green-100 text-green-600"; - } else if (statusId === 2) { - icon = "fa:check-circle"; - statusClass = "bg-green-100 text-green-600"; - } else if (statusId === 3) { - icon = "fa:comment"; - statusClass = "bg-blue-100 text-blue-600"; - } else if (statusId === 1) { - icon = "fa:hourglass-end"; - statusClass = "bg-orange-100 text-orange-600"; - } - - return ( - - {statusName} - - ); + { + accessorKey: "creatorGroupLevelName", + header: t("source"), + cell: ({ row }) => ( + + {row.getValue("creatorGroupLevelName")} + + ), }, - }, + { + accessorKey: "publishedOn", + header: t("published"), + cell: ({ row }) => { + const isPublish = row.original.isPublish; + const isPublishOnPolda = row.original.isPublishOnPolda; - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const router = useRouter(); - const MySwal = withReactContent(Swal); + let displayText = "-"; + if (isPublish && !isPublishOnPolda) { + displayText = "Mabes"; + } else if (isPublish && isPublishOnPolda) { + displayText = "Mabes & Polda"; + } else if (!isPublish && isPublishOnPolda) { + displayText = "Polda"; + } - async function doDelete(id: any) { - // loading(); - const data = { - id, + return ( +
+ {displayText} +
+ ); + }, + }, + // + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", }; - const response = await deleteMedia(data); + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); + const statusStyles = + statusColors[statusName] || "bg-red-200 text-red-600"; - 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 handleDeleteMedia = (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 ( - - - - - - - - - View - - - - - - Edit - - - handleDeleteMedia(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, }, - }, -]; -export default columns; + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const router = useRouter(); + const MySwal = withReactContent(Swal); + + async function doDelete(id: any) { + // loading(); + const data = { + id, + }; + + const response = await deleteMedia(data); + + 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 handleDeleteMedia = (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 ( + + + + + + + + + View + + + + + + Edit + + + handleDeleteMedia(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete + + + + ); + }, + }, + ]; + + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/image/components/table-image.tsx b/app/[locale]/(protected)/contributor/content/image/components/table-image.tsx index 3f15c2d8..16f6f398 100644 --- a/app/[locale]/(protected)/contributor/content/image/components/table-image.tsx +++ b/app/[locale]/(protected)/contributor/content/image/components/table-image.tsx @@ -52,7 +52,7 @@ import { ticketingPagination } from "@/service/ticketing/ticketing"; import { Badge } from "@/components/ui/badge"; import { useRouter, useSearchParams } from "next/navigation"; import TablePagination from "@/components/table/table-pagination"; -import columns from "./columns"; + import { deleteMedia, listDataImage, @@ -66,6 +66,7 @@ import withReactContent from "sweetalert2-react-content"; import { error } from "@/lib/swal"; import { Label } from "@/components/ui/label"; import { format } from "date-fns"; +import useTableColumns from "./columns"; const TableImage = () => { const router = useRouter(); @@ -104,7 +105,7 @@ const TableImage = () => { const [filterByCreatorGroup, setFilterByCreatorGroup] = React.useState(""); const roleId = getCookiesDecrypt("urie"); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/content/spit/table-spit/columns.tsx b/app/[locale]/(protected)/contributor/content/spit/table-spit/columns.tsx index 1eaa46ef..d39ca88c 100644 --- a/app/[locale]/(protected)/contributor/content/spit/table-spit/columns.tsx +++ b/app/[locale]/(protected)/contributor/content/spit/table-spit/columns.tsx @@ -16,137 +16,146 @@ import { } from "@/components/ui/dropdown-menu"; import { format } from "date-fns"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; +import withReactContent from "sweetalert2-react-content"; +import Swal from "sweetalert2"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const MySwal = withReactContent(Swal); + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "contentTitle", - header: "Judul", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("contentTitle"); - return ( + ), + }, + { + accessorKey: "contentTitle", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("contentTitle"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "contentTag", + header: t("tag"), + cell: ({ row }) => ( + {row.getValue("contentTag")} + ), + }, + + { + accessorKey: "contentType", + header: t("type-content"), + cell: ({ row }) => ( + {row.getValue("contentType")} + ), + }, + { + accessorKey: "contentCreatedGroupBy", + header: t("source"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("contentCreatedGroupBy")} - ); + ), }, - }, - { - accessorKey: "contentTag", - header: "Tag", - cell: ({ row }) => ( - {row.getValue("contentTag")} - ), - }, - { - accessorKey: "contentType", - header: "Tipe Konten ", - cell: ({ row }) => ( - {row.getValue("contentType")} - ), - }, - { - accessorKey: "contentCreatedGroupBy", - header: "Sumber ", - cell: ({ row }) => ( - - {row.getValue("contentCreatedGroupBy")} - - ), - }, - - { - accessorKey: "isPublish", - header: "Status", - cell: ({ row }) => { - const isPublish = row.getValue("isPublish"); - return ( -
- -
- ); - }, - }, - - { - accessorKey: "contentCreatedDate", - header: "Tanggal Unggah", - cell: ({ row }) => { - const createdAt = row.getValue("contentCreatedDate") as - | string - | number - | undefined; - - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; - }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const isDisabled = row.original.isPublish; // Check the isPublish value - - return ( - - + { + accessorKey: "isPublish", + header: "Status", + cell: ({ row }) => { + const isPublish = row.getValue("isPublish"); + return ( +
- - - - + ); + }, + }, + + { + accessorKey: "contentCreatedDate", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("contentCreatedDate") as + | string + | number + | undefined; + + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, + }, + { + id: "actions", + accessorKey: "action", + header: "Actions", + enableHiding: false, + cell: ({ row }) => { + const isDisabled = row.original.isPublish; // Check the isPublish value + + return ( + + + + + + + + + Pindah Ke Mediahub + + + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx b/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx index 01ed5e95..791ea4f9 100644 --- a/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx +++ b/app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx @@ -47,6 +47,9 @@ import { DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Label } from "@/components/ui/label"; +import { useTranslations } from "next-intl"; +import { format } from "date-fns"; +import useTableColumns from "./columns"; // export type CompanyData = { // no: number; @@ -77,7 +80,8 @@ const TableSPIT = () => { const [search, setSearch] = React.useState(""); const userId = getCookiesDecrypt("uie"); const userLevelId = getCookiesDecrypt("ulie"); - + const t = useTranslations("AnalyticsDashboard"); + const [dateFilter, setDateFilter] = React.useState(""); const [totalData, setTotalData] = React.useState(1); const [sorting, setSorting] = React.useState([]); const [columnFilters, setColumnFilters] = React.useState( @@ -86,7 +90,7 @@ const TableSPIT = () => { const [statusFilter, setStatusFilter] = React.useState([]); const roleId = getCookiesDecrypt("urie"); - + const columns = useTableColumns(); const table = useReactTable({ data: spitTable, columns, @@ -117,7 +121,7 @@ const TableSPIT = () => { React.useEffect(() => { fetchData(); - }, [page, limit, search, statusFilter]); + }, [page, limit, search, statusFilter, dateFilter]); async function fetchData() { let isPublish; @@ -129,8 +133,18 @@ const TableSPIT = () => { isPublish = statusFilter.includes(1) ? false : true; } + const formattedStartDate = dateFilter + ? format(new Date(dateFilter), "yyyy-MM-dd") + : ""; + try { - const res = await listSPIT(page - 1, limit, search, isPublish); + const res = await listSPIT( + page - 1, + limit, + search, + formattedStartDate, + isPublish + ); const data = res?.data?.data; const contentData = data?.content || []; @@ -192,6 +206,15 @@ const TableSPIT = () => {

Filter

+
+ + setDateFilter(e.target.value)} + className="max-w-sm" + /> +
[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const MySwal = withReactContent(Swal); + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "categoryName", + header: t("category-name"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("categoryName")} - ); + ), }, - }, - { - accessorKey: "categoryName", - header: "Category Name", - cell: ({ row }) => ( - {row.getValue("categoryName")} - ), - }, - { - accessorKey: "createdAt", - header: "Upload Date", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "creatorName", - header: "Creator Group", - cell: ({ row }) => ( - {row.getValue("creatorName")} - ), - }, - { - accessorKey: "creatorGroupLevelName", - header: "Sumber", - cell: ({ row }) => ( - - {row.getValue("creatorGroupLevelName")} - - ), - }, - { - accessorKey: "publishedOn", - header: "Published", - cell: ({ row }) => { - const isPublish = row.original.isPublish; - const isPublishOnPolda = row.original.isPublishOnPolda; - - let displayText = "-"; - if (isPublish && !isPublishOnPolda) { - displayText = "Mabes"; - } else if (isPublish && isPublishOnPolda) { - displayText = "Mabes & Polda"; - } else if (!isPublish && isPublishOnPolda) { - displayText = "Polda"; - } - - return ( -
- {displayText} -
- ); + { + accessorKey: "creatorName", + header: t("creator-group"), + cell: ({ row }) => ( + {row.getValue("creatorName")} + ), }, - }, - - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); + { + accessorKey: "creatorGroupLevelName", + header: t("source"), + cell: ({ row }) => ( + + {row.getValue("creatorGroupLevelName")} + + ), }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const MySwal = withReactContent(Swal); + { + accessorKey: "publishedOn", + header: t("published"), + cell: ({ row }) => { + const isPublish = row.original.isPublish; + const isPublishOnPolda = row.original.isPublishOnPolda; - async function doDelete(id: any) { - // loading(); - const data = { - id, + let displayText = "-"; + if (isPublish && !isPublishOnPolda) { + displayText = "Mabes"; + } else if (isPublish && isPublishOnPolda) { + displayText = "Mabes & Polda"; + } else if (!isPublish && isPublishOnPolda) { + displayText = "Polda"; + } + + return ( +
+ {displayText} +
+ ); + }, + }, + + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", }; - const response = await deleteMedia(data); + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - if (response?.error) { - error(response.message); - return false; - } - success(); - } + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; - function success() { - MySwal.fire({ - title: "Sukses", - icon: "success", - confirmButtonColor: "#3085d6", - confirmButtonText: "OK", - }).then((result) => { - if (result.isConfirmed) { - window.location.reload(); - } - }); - } - - const handleDeleteMedia = (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 ( - - - - - - - - - View - - - - - - Edit - - - handleDeleteMedia(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, }, - }, -]; + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const MySwal = withReactContent(Swal); -export default columns; + async function doDelete(id: any) { + // loading(); + const data = { + id, + }; + + const response = await deleteMedia(data); + + 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 handleDeleteMedia = (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 ( + + + + + + + + + View + + + + + + Edit + + + handleDeleteMedia(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete + + + + ); + }, + }, + ]; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/teks/components/table-teks.tsx b/app/[locale]/(protected)/contributor/content/teks/components/table-teks.tsx index dd1924c5..6b2f9492 100644 --- a/app/[locale]/(protected)/contributor/content/teks/components/table-teks.tsx +++ b/app/[locale]/(protected)/contributor/content/teks/components/table-teks.tsx @@ -60,6 +60,7 @@ import { } from "@/service/content/content"; import { Label } from "@/components/ui/label"; import { format } from "date-fns"; +import useTableColumns from "./columns"; const TableTeks = () => { const router = useRouter(); @@ -98,7 +99,7 @@ const TableTeks = () => { const [filterByCreatorGroup, setFilterByCreatorGroup] = React.useState(""); const roleId = getCookiesDecrypt("urie"); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/content/video/components/columns.tsx b/app/[locale]/(protected)/contributor/content/video/components/columns.tsx index 409fe156..0fbf71f6 100644 --- a/app/[locale]/(protected)/contributor/content/video/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/content/video/components/columns.tsx @@ -17,209 +17,223 @@ import { deleteMedia } from "@/service/content/content"; import Swal from "sweetalert2"; import withReactContent from "sweetalert2-react-content"; import { error } from "@/lib/swal"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const MySwal = withReactContent(Swal); + + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "categoryName", + header: t("category-name"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("categoryName")} - ); + ), }, - }, - { - accessorKey: "categoryName", - header: "Category Name", - cell: ({ row }) => ( - {row.getValue("categoryName")} - ), - }, - { - accessorKey: "createdAt", - header: "Upload Date", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "creatorName", - header: "Creator Group", - cell: ({ row }) => ( - {row.getValue("creatorName")} - ), - }, - { - accessorKey: "creatorGroupLevelName", - header: "Sumber", - cell: ({ row }) => ( - - {row.getValue("creatorGroupLevelName")} - - ), - }, - { - accessorKey: "publishedOn", - header: "Published", - cell: ({ row }) => { - const isPublish = row.original.isPublish; - const isPublishOnPolda = row.original.isPublishOnPolda; - - let displayText = "-"; - if (isPublish && !isPublishOnPolda) { - displayText = "Mabes"; - } else if (isPublish && isPublishOnPolda) { - displayText = "Mabes & Polda"; - } else if (!isPublish && isPublishOnPolda) { - displayText = "Polda"; - } - - return ( -
- {displayText} -
- ); + { + accessorKey: "creatorName", + header: t("creator-group"), + cell: ({ row }) => ( + {row.getValue("creatorName")} + ), }, - }, - - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); - const statusStyles = - statusColors[statusName] || "bg-red-200 text-red-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); + { + accessorKey: "creatorGroupLevelName", + header: t("source"), + cell: ({ row }) => ( + + {row.getValue("creatorGroupLevelName")} + + ), }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const MySwal = withReactContent(Swal); + { + accessorKey: "publishedOn", + header: t("published"), + cell: ({ row }) => { + const isPublish = row.original.isPublish; + const isPublishOnPolda = row.original.isPublishOnPolda; - async function doDelete(id: any) { - // loading(); - const data = { - id, + let displayText = "-"; + if (isPublish && !isPublishOnPolda) { + displayText = "Mabes"; + } else if (isPublish && isPublishOnPolda) { + displayText = "Mabes & Polda"; + } else if (!isPublish && isPublishOnPolda) { + displayText = "Polda"; + } + + return ( +
+ {displayText} +
+ ); + }, + }, + + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", }; - const response = await deleteMedia(data); + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); + const statusStyles = + statusColors[statusName] || "bg-red-200 text-red-600"; - 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 handleDeleteMedia = (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 ( - - - - - - - - - View - - - - - - Edit - - - handleDeleteMedia(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, }, - }, -]; + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const MySwal = withReactContent(Swal); -export default columns; + async function doDelete(id: any) { + // loading(); + const data = { + id, + }; + + const response = await deleteMedia(data); + + 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 handleDeleteMedia = (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 ( + + + + + + + + + View + + + + + + Edit + + + handleDeleteMedia(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete + + + + ); + }, + }, + ]; + + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/content/video/components/table-video.tsx b/app/[locale]/(protected)/contributor/content/video/components/table-video.tsx index 210257a4..3885eb53 100644 --- a/app/[locale]/(protected)/contributor/content/video/components/table-video.tsx +++ b/app/[locale]/(protected)/contributor/content/video/components/table-video.tsx @@ -60,6 +60,7 @@ import { } from "@/service/content/content"; import { Label } from "@/components/ui/label"; import { format } from "date-fns"; +import useTableColumns from "./columns"; const TableVideo = () => { const router = useRouter(); @@ -98,7 +99,7 @@ const TableVideo = () => { const [filterByCreatorGroup, setFilterByCreatorGroup] = React.useState(""); const roleId = getCookiesDecrypt("urie"); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/planning/mediahub/components/columns.tsx b/app/[locale]/(protected)/contributor/planning/mediahub/components/columns.tsx index 666d3856..f073d942 100644 --- a/app/[locale]/(protected)/contributor/planning/mediahub/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/planning/mediahub/components/columns.tsx @@ -13,105 +13,111 @@ import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { format } from "date-fns"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Judul", - cell: ({ row }) => ( -
-
-

- {row.getValue("title")} -

+ ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("title")} +

+
-
- ), - }, - { - accessorKey: "createdAt", - header: "Tanggal Unggah ", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + ), + }, + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "isActive", - header: "Status", - cell: ({ row }) => { - const isActive = row.getValue("isActive"); - console.log("isActive value:", isActive); // TypeScript type is inferred correctly - return ( -
- {isActive ? ( - Terkirim - ) : ( - Belum Terkirim - )} -
- ); + { + accessorKey: "isActive", + header: "Status", + cell: ({ row }) => { + const isActive = row.getValue("isActive"); + console.log("isActive value:", isActive); // TypeScript type is inferred correctly + return ( +
+ {isActive ? ( + Terkirim + ) : ( + Belum Terkirim + )} +
+ ); + }, }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - return ( - - - - - - - - - Publish + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + return ( + + + + + + + + + Publish + + + deletePlan(row.id)} + > + + Delete - - deletePlan(row.id)} - > - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/planning/mediahub/components/mediahub-table.tsx b/app/[locale]/(protected)/contributor/planning/mediahub/components/mediahub-table.tsx index a05d796f..9d3d6fc5 100644 --- a/app/[locale]/(protected)/contributor/planning/mediahub/components/mediahub-table.tsx +++ b/app/[locale]/(protected)/contributor/planning/mediahub/components/mediahub-table.tsx @@ -55,6 +55,7 @@ import { getPlanningSentPagination } from "@/service/planning/planning"; import search from "@/app/[locale]/(protected)/app/chat/components/search"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { useTranslations } from "next-intl"; +import useTableColumns from "./columns"; const MediahubTable = () => { const t = useTranslations("Planning"); @@ -78,7 +79,7 @@ const MediahubTable = () => { const [totalPage, setTotalPage] = React.useState(1); const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/columns.tsx b/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/columns.tsx index 5adee17a..efa2629c 100644 --- a/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/columns.tsx @@ -13,103 +13,109 @@ import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { format } from "date-fns"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, - { - accessorKey: "title", - header: "Judul", - cell: ({ row }) => ( -
-
-

- {row.getValue("title")} -

+ ), + }, + { + accessorKey: "title", + header: t("title"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("title")} +

+
-
- ), - }, - { - accessorKey: "createdAt", - header: "Tanggal Unggah ", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; + ), + }, + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, }, - }, - { - accessorKey: "isActive", - header: "Status", - cell: ({ row }) => { - const isActive = row.getValue("isActive"); - console.log("isActive value:", isActive); // TypeScript type is inferred correctly - return ( -
- {isActive ? ( - Terkirim - ) : ( - Belum Terkirim - )} -
- ); + { + accessorKey: "isActive", + header: "Status", + cell: ({ row }) => { + const isActive = row.getValue("isActive"); + console.log("isActive value:", isActive); // TypeScript type is inferred correctly + return ( +
+ {isActive ? ( + Terkirim + ) : ( + Belum Terkirim + )} +
+ ); + }, }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - return ( - - - - - - - - - Publish + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + return ( + + + + + + + + + Publish + + + + + + Delete - - - - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/medsos-table.tsx b/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/medsos-table.tsx index 0451632c..b909ffeb 100644 --- a/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/medsos-table.tsx +++ b/app/[locale]/(protected)/contributor/planning/medsos-mediahub/components/medsos-table.tsx @@ -54,6 +54,7 @@ import columns from "./columns"; import { getPlanningSentPagination } from "@/service/planning/planning"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { useTranslations } from "next-intl"; +import useTableColumns from "./columns"; const MedsosTable = () => { const t = useTranslations("Planning"); @@ -77,7 +78,7 @@ const MedsosTable = () => { const [totalPage, setTotalPage] = React.useState(1); const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/schedule/event/components/columns.tsx b/app/[locale]/(protected)/contributor/schedule/event/components/columns.tsx index 85734969..52afd9b5 100644 --- a/app/[locale]/(protected)/contributor/schedule/event/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/schedule/event/components/columns.tsx @@ -12,163 +12,171 @@ import { import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, + ), + }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "startDate", + header: t("start-date"), + cell: ({ row }) => ( + {row.getValue("startDate")} + ), + }, + { + accessorKey: "endDate", + header: t("end-date"), + cell: ({ row }) => ( + {row.getValue("endDate")} + ), + }, + { + accessorKey: "time", + header: t("time"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { startTime, endTime } = row.original; + return ( + + {startTime || "N/A"} - {endTime || "N/A"} + + ); + }, + }, + { + accessorKey: "address", + header: t("address"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const address: string = row.getValue("address"); + return ( + + {address.length > 50 ? `${address.slice(0, 40)}...` : address} + + ); + }, + }, + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", + }; + + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil + + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; + + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, + }, + { + accessorKey: "speaker", + header: t("speaker"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { speakerTitle, speakerName } = row.original; + return ( + + {speakerTitle || ""} {speakerName || ""} + + ); + }, + }, + { + accessorKey: "uploaderName", + header: t("source"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("uploaderName")} - ); + ), }, - }, - { - accessorKey: "startDate", - header: "Start Date ", - cell: ({ row }) => ( - {row.getValue("startDate")} - ), - }, - { - accessorKey: "endDate", - header: "End Date", - cell: ({ row }) => ( - {row.getValue("endDate")} - ), - }, - { - accessorKey: "time", - header: "Time", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { startTime, endTime } = row.original; - return ( - - {startTime || "N/A"} - {endTime || "N/A"} - - ); - }, - }, - { - accessorKey: "address", - header: "Address", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const address: string = row.getValue("address"); - return ( - - {address.length > 50 ? `${address.slice(0, 40)}...` : address} - - ); - }, - }, - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); - }, - }, - { - accessorKey: "speaker", - header: "Disampaikan oleh", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { speakerTitle, speakerName } = row.original; - return ( - - {speakerTitle || ""} {speakerName || ""} - - ); - }, - }, - { - accessorKey: "uploaderName", - header: "Sumber ", - cell: ({ row }) => ( - {row.getValue("uploaderName")} - ), - }, - - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - return ( - - - - - - - - - View + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + return ( + + + + + + + + + View + + + + + + Edit + + + + + Delete - - - - - Edit - - - - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; + return columns; +}; -export default columns; +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/schedule/event/components/event-table.tsx b/app/[locale]/(protected)/contributor/schedule/event/components/event-table.tsx index 701dcc8e..30e4ca99 100644 --- a/app/[locale]/(protected)/contributor/schedule/event/components/event-table.tsx +++ b/app/[locale]/(protected)/contributor/schedule/event/components/event-table.tsx @@ -33,6 +33,7 @@ import { useTranslations } from "next-intl"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { Link } from "@/i18n/routing"; import { Button } from "@/components/ui/button"; +import useTableColumns from "./columns"; const EventTable = () => { const router = useRouter(); @@ -55,7 +56,7 @@ const EventTable = () => { const [totalPage, setTotalPage] = React.useState(1); const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/schedule/press-conference/components/columns.tsx b/app/[locale]/(protected)/contributor/schedule/press-conference/components/columns.tsx index 7e9737aa..1a3a3ae3 100644 --- a/app/[locale]/(protected)/contributor/schedule/press-conference/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/schedule/press-conference/components/columns.tsx @@ -12,163 +12,172 @@ import { import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, + ), + }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "startDate", + header: t("start-date"), + cell: ({ row }) => ( + {row.getValue("startDate")} + ), + }, + { + accessorKey: "endDate", + header: t("end-date"), + cell: ({ row }) => ( + {row.getValue("endDate")} + ), + }, + { + accessorKey: "time", + header: t("time"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { startTime, endTime } = row.original; + return ( + + {startTime || "N/A"} - {endTime || "N/A"} + + ); + }, + }, + { + accessorKey: "address", + header: t("address"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const address: string = row.getValue("address"); + return ( + + {address.length > 50 ? `${address.slice(0, 40)}...` : address} + + ); + }, + }, + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", + }; + + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil + + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; + + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, + }, + { + accessorKey: "speaker", + header: t("speaker"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { speakerTitle, speakerName } = row.original; + return ( + + {speakerTitle || ""} {speakerName || ""} + + ); + }, + }, + { + accessorKey: "uploaderName", + header: t("source"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("uploaderName")} - ); + ), }, - }, - { - accessorKey: "startDate", - header: "Start Date ", - cell: ({ row }) => ( - {row.getValue("startDate")} - ), - }, - { - accessorKey: "endDate", - header: "End Date", - cell: ({ row }) => ( - {row.getValue("endDate")} - ), - }, - { - accessorKey: "time", - header: "Time", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { startTime, endTime } = row.original; - return ( - - {startTime || "N/A"} - {endTime || "N/A"} - - ); - }, - }, - { - accessorKey: "address", - header: "Address", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const address: string = row.getValue("address"); - return ( - - {address.length > 50 ? `${address.slice(0, 40)}...` : address} - - ); - }, - }, - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); - }, - }, - { - accessorKey: "speaker", - header: "Disampaikan oleh", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { speakerTitle, speakerName } = row.original; - return ( - - {speakerTitle || ""} {speakerName || ""} - - ); - }, - }, - { - accessorKey: "uploaderName", - header: "Sumber ", - cell: ({ row }) => ( - {row.getValue("uploaderName")} - ), - }, - - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - return ( - - - - - - - - - Detail + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + return ( + + + + + + + + + Detail + + + + + + Edit + + + + + Delete - - - - - Edit - - - - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/schedule/press-conference/components/presscon-table.tsx b/app/[locale]/(protected)/contributor/schedule/press-conference/components/presscon-table.tsx index ee8f34e3..8922a214 100644 --- a/app/[locale]/(protected)/contributor/schedule/press-conference/components/presscon-table.tsx +++ b/app/[locale]/(protected)/contributor/schedule/press-conference/components/presscon-table.tsx @@ -46,6 +46,7 @@ import { paginationSchedule } from "@/service/schedule/schedule"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { Link } from "@/i18n/routing"; import { useTranslations } from "next-intl"; +import useTableColumns from "./columns"; const PressConferenceTable = () => { const router = useRouter(); @@ -68,7 +69,7 @@ const PressConferenceTable = () => { const [totalPage, setTotalPage] = React.useState(1); const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/schedule/press-release/components/columns.tsx b/app/[locale]/(protected)/contributor/schedule/press-release/components/columns.tsx index 0bfb7dfa..98f71883 100644 --- a/app/[locale]/(protected)/contributor/schedule/press-release/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/schedule/press-release/components/columns.tsx @@ -12,163 +12,172 @@ import { import { Button } from "@/components/ui/button"; import { Badge } from "@/components/ui/badge"; import { Link } from "@/components/navigation"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => ( -
-
-

- {row.getValue("no")} -

+const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => ( +
+
+

+ {row.getValue("no")} +

+
-
- ), - }, + ), + }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const title: string = row.getValue("title"); - return ( + { + accessorKey: "title", + header: t("title"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const title: string = row.getValue("title"); + return ( + + {title.length > 50 ? `${title.slice(0, 30)}...` : title} + + ); + }, + }, + { + accessorKey: "startDate", + header: t("start-date"), + cell: ({ row }) => ( + {row.getValue("startDate")} + ), + }, + { + accessorKey: "endDate", + header: t("end-date"), + cell: ({ row }) => ( + {row.getValue("endDate")} + ), + }, + { + accessorKey: "time", + header: t("time"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { startTime, endTime } = row.original; + return ( + + {startTime || "N/A"} - {endTime || "N/A"} + + ); + }, + }, + { + accessorKey: "address", + header: t("address"), + cell: ({ row }: { row: { getValue: (key: string) => string } }) => { + const address: string = row.getValue("address"); + return ( + + {address.length > 50 ? `${address.slice(0, 40)}...` : address} + + ); + }, + }, + { + accessorKey: "statusName", + header: "Status", + cell: ({ row }) => { + const statusColors: Record = { + diterima: "bg-green-100 text-green-600", + "menunggu review": "bg-orange-100 text-orange-600", + }; + + // Mengambil `statusName` dari data API + const status = row.getValue("statusName") as string; + const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil + + // Gunakan `statusName` untuk pencocokan + const statusStyles = + statusColors[statusName] || "bg-gray-100 text-gray-600"; + + return ( + + {status} {/* Tetap tampilkan nilai asli */} + + ); + }, + }, + { + accessorKey: "speaker", + header: t("speaker"), + cell: ({ row }: { row: { original: any } }) => { + console.log("Row Original Data:", row.original); + const { speakerTitle, speakerName } = row.original; + return ( + + {speakerTitle || ""} {speakerName || ""} + + ); + }, + }, + { + accessorKey: "uploaderName", + header: t("source"), + cell: ({ row }) => ( - {title.length > 50 ? `${title.slice(0, 30)}...` : title} + {row.getValue("uploaderName")} - ); + ), }, - }, - { - accessorKey: "startDate", - header: "Start Date ", - cell: ({ row }) => ( - {row.getValue("startDate")} - ), - }, - { - accessorKey: "endDate", - header: "End Date", - cell: ({ row }) => ( - {row.getValue("endDate")} - ), - }, - { - accessorKey: "time", - header: "Time", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { startTime, endTime } = row.original; - return ( - - {startTime || "N/A"} - {endTime || "N/A"} - - ); - }, - }, - { - accessorKey: "address", - header: "Address", - cell: ({ row }: { row: { getValue: (key: string) => string } }) => { - const address: string = row.getValue("address"); - return ( - - {address.length > 50 ? `${address.slice(0, 40)}...` : address} - - ); - }, - }, - { - accessorKey: "statusName", - header: "Status", - cell: ({ row }) => { - const statusColors: Record = { - diterima: "bg-green-100 text-green-600", - "menunggu review": "bg-orange-100 text-orange-600", - }; - // Mengambil `statusName` dari data API - const status = row.getValue("statusName") as string; - const statusName = status?.toLocaleLowerCase(); // Ubah ke huruf kecil - - // Gunakan `statusName` untuk pencocokan - const statusStyles = - statusColors[statusName] || "bg-gray-100 text-gray-600"; - - return ( - - {status} {/* Tetap tampilkan nilai asli */} - - ); - }, - }, - { - accessorKey: "speaker", - header: "Disampaikan oleh", - cell: ({ row }: { row: { original: any } }) => { - console.log("Row Original Data:", row.original); - const { speakerTitle, speakerName } = row.original; - return ( - - {speakerTitle || ""} {speakerName || ""} - - ); - }, - }, - { - accessorKey: "uploaderName", - header: "Sumber ", - cell: ({ row }) => ( - {row.getValue("uploaderName")} - ), - }, - - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - return ( - - - - - - - - - View + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + return ( + + + + + + + + + View + + + + + + Edit + + + + + Delete - - - - - Edit - - - - - Delete - - - - ); + + + ); + }, }, - }, -]; + ]; -export default columns; + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/schedule/press-release/components/pressrilis-table.tsx b/app/[locale]/(protected)/contributor/schedule/press-release/components/pressrilis-table.tsx index cb5938c4..1aefa609 100644 --- a/app/[locale]/(protected)/contributor/schedule/press-release/components/pressrilis-table.tsx +++ b/app/[locale]/(protected)/contributor/schedule/press-release/components/pressrilis-table.tsx @@ -47,6 +47,7 @@ import { paginationSchedule } from "@/service/schedule/schedule"; import { useTranslations } from "next-intl"; import { CardHeader, CardTitle } from "@/components/ui/card"; import { Link } from "@/i18n/routing"; +import useTableColumns from "./columns"; const PressReleaseTable = () => { const router = useRouter(); @@ -69,7 +70,7 @@ const PressReleaseTable = () => { const [totalPage, setTotalPage] = React.useState(1); const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/contributor/task/components/columns.tsx b/app/[locale]/(protected)/contributor/task/components/columns.tsx index 89c8cd8a..fb44c3b9 100644 --- a/app/[locale]/(protected)/contributor/task/components/columns.tsx +++ b/app/[locale]/(protected)/contributor/task/components/columns.tsx @@ -20,187 +20,193 @@ import { deleteTask } from "@/service/task"; import { error, loading } from "@/lib/swal"; import withReactContent from "sweetalert2-react-content"; import Swal from "sweetalert2"; +import { useTranslations } from "next-intl"; -const columns: ColumnDef[] = [ - { - accessorKey: "no", - header: "No", - cell: ({ row }) => {row.getValue("no")}, - }, - { - accessorKey: "title", - header: "Title", - cell: ({ row }) => ( -
- {row.getValue("title")} - {row.original.isForward && ( - - )} -
- ), - }, - - { - accessorKey: "uniqueCode", - header: "Code", - cell: ({ row }) => {row.getValue("uniqueCode")}, - }, - - { - accessorKey: "assignmentMainType", - header: "Type Task", - cell: ({ row }) => { - const type = row.getValue("assignmentMainType") as { name: string }; - return {type?.name}; +const useTableColumns = () => { + const t = useTranslations("Table"); // Panggil di dalam hook + const columns: ColumnDef[] = [ + { + accessorKey: "no", + header: t("no"), + cell: ({ row }) => {row.getValue("no")}, }, - }, - { - accessorKey: "assignmentType", - header: "Category Task", - cell: ({ row }) => { - const type = row.getValue("assignmentType") as { name: string }; - return {type?.name}; - }, - }, - { - accessorKey: "createdAt", - header: "Upload Date ", - cell: ({ row }) => { - const createdAt = row.getValue("createdAt") as - | string - | number - | undefined; - - const formattedDate = - createdAt && !isNaN(new Date(createdAt).getTime()) - ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") - : "-"; - return {formattedDate}; - }, - }, - { - accessorKey: "status", - header: "Status", - cell: ({ row }) => { - const isActive = row.original.isActive; - const isDone = row.original.isDone; - - let statusText = ""; - if (isDone) { - statusText = "Selesai"; - } else if (isActive) { - statusText = "Aktif"; - } else { - statusText = "Nonaktif"; - } - - const statusColors: Record = { - Aktif: "bg-primary/20 text-primary", - Selesai: "bg-success/20 text-success", - Nonaktif: "bg-gray-200 text-gray-500", - }; - - const statusStyles = statusColors[statusText] || "default"; - - return ( - - {statusText} - - ); - }, - }, - { - id: "actions", - accessorKey: "action", - header: "Actions", - enableHiding: false, - cell: ({ row }) => { - const router = useRouter(); - const MySwal = withReactContent(Swal); - - async function deleteProcess(id: any) { - loading(); - const resDelete = await deleteTask(id); - - if (resDelete?.error) { - error(resDelete.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 TaskDelete = (id: any) => { - MySwal.fire({ - title: "Hapus Data", - text: "", - icon: "warning", - showCancelButton: true, - cancelButtonColor: "#3085d6", - confirmButtonColor: "#d33", - confirmButtonText: "Hapus", - }).then((result) => { - if (result.isConfirmed) { - deleteProcess(id); - } - }); - }; - - return ( - - + { + accessorKey: "title", + header: t("title"), + cell: ({ row }) => ( +
+ {row.getValue("title")} + {row.original.isForward && ( - - - - - - View - - - - - - Edit - - - TaskDelete(row.original.id)} - className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" - > - - Delete - - - - ); + )} +
+ ), }, - }, -]; -export default columns; + { + accessorKey: "uniqueCode", + header: t("code"), + cell: ({ row }) => {row.getValue("uniqueCode")}, + }, + + { + accessorKey: "assignmentMainType", + header: t("type-task"), + cell: ({ row }) => { + const type = row.getValue("assignmentMainType") as { name: string }; + return {type?.name}; + }, + }, + { + accessorKey: "assignmentType", + header: t("category-task"), + cell: ({ row }) => { + const type = row.getValue("assignmentType") as { name: string }; + return {type?.name}; + }, + }, + { + accessorKey: "createdAt", + header: t("upload-date"), + cell: ({ row }) => { + const createdAt = row.getValue("createdAt") as + | string + | number + | undefined; + + const formattedDate = + createdAt && !isNaN(new Date(createdAt).getTime()) + ? format(new Date(createdAt), "dd-MM-yyyy HH:mm:ss") + : "-"; + return {formattedDate}; + }, + }, + { + accessorKey: "status", + header: "Status", + cell: ({ row }) => { + const isActive = row.original.isActive; + const isDone = row.original.isDone; + + let statusText = ""; + if (isDone) { + statusText = "Selesai"; + } else if (isActive) { + statusText = "Aktif"; + } else { + statusText = "Nonaktif"; + } + + const statusColors: Record = { + Aktif: "bg-primary/20 text-primary", + Selesai: "bg-success/20 text-success", + Nonaktif: "bg-gray-200 text-gray-500", + }; + + const statusStyles = statusColors[statusText] || "default"; + + return ( + + {statusText} + + ); + }, + }, + { + id: "actions", + accessorKey: "action", + header: t("action"), + enableHiding: false, + cell: ({ row }) => { + const router = useRouter(); + const MySwal = withReactContent(Swal); + + async function deleteProcess(id: any) { + loading(); + const resDelete = await deleteTask(id); + + if (resDelete?.error) { + error(resDelete.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 TaskDelete = (id: any) => { + MySwal.fire({ + title: "Hapus Data", + text: "", + icon: "warning", + showCancelButton: true, + cancelButtonColor: "#3085d6", + confirmButtonColor: "#d33", + confirmButtonText: "Hapus", + }).then((result) => { + if (result.isConfirmed) { + deleteProcess(id); + } + }); + }; + + return ( + + + + + + + + + View + + + + + + Edit + + + TaskDelete(row.original.id)} + className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none" + > + + Delete + + + + ); + }, + }, + ]; + + return columns; +}; + +export default useTableColumns; diff --git a/app/[locale]/(protected)/contributor/task/components/task-table.tsx b/app/[locale]/(protected)/contributor/task/components/task-table.tsx index 5dca9c2b..dde139dc 100644 --- a/app/[locale]/(protected)/contributor/task/components/task-table.tsx +++ b/app/[locale]/(protected)/contributor/task/components/task-table.tsx @@ -56,6 +56,7 @@ import { listTask } from "@/service/task"; import { Label } from "@/components/ui/label"; import { format } from "date-fns"; import { useTranslations } from "next-intl"; +import useTableColumns from "./columns"; const TaskTable = () => { const router = useRouter(); @@ -83,7 +84,7 @@ const TaskTable = () => { const [limit, setLimit] = React.useState(10); const [isSpecificAttention, setIsSpecificAttention] = React.useState(true); const [search, setSearch] = React.useState(""); - + const columns = useTableColumns(); const table = useReactTable({ data: dataTable, columns, diff --git a/app/[locale]/(protected)/dashboard/executive/page.tsx b/app/[locale]/(protected)/dashboard/executive/page.tsx index 1f5edf77..5a34c8eb 100644 --- a/app/[locale]/(protected)/dashboard/executive/page.tsx +++ b/app/[locale]/(protected)/dashboard/executive/page.tsx @@ -181,16 +181,16 @@ export default function ExecutiveDashboard() { const view2 = levelName == "MABES POLRI" ? isInternational[1] - ? "views/2023_04_MediaHUB-Viz_INTL_Rev202/db-konten-publisher?" - : "views/2023_04_MediaHUB-Viz-POLDA_Rev201/db-konten-publisher?" - : `views/2023_04_MediaHUB-Viz-POLDA_Rev201/db-konten-publisher-polda?provinsi-polda=${poldaState}&`; + ? "views/2023_04_MediaHUB-Viz_INTL_Rev202/db-published-produksi?" + : "views/2023_04_MediaHUB-Viz-POLDA_Rev202/db-published-produksi-executive?" + : `views/2023_04_MediaHUB-Viz-POLDA_Rev202/db-konten-publisher-polda-executive?provinsi-polda=${poldaState}&`; const view3 = levelName == "MABES POLRI" ? isInternational[2] ? "views/2023_04_MediaHUB-Viz_INTL_Rev202/db-waktu-akses-pengguna?" - : "views/2023_04_MediaHUB-Viz-POLDA_Rev201/db-waktu-akses-pengguna?" - : `views/2023_04_MediaHUB-Viz-POLDA_Rev201/db-waktu-akses-pengguna-polda?provinsi-polda=${poldaState}&`; + : "views/2023_04_MediaHUB-Viz-POLDA_Rev202/db-waktu-akses-pengguna-executive?" + : `views/2023_04_MediaHUB-Viz-POLDA_Rev202/db-waktu-akses-pengguna-polda-executive?provinsi-polda=${poldaState}&`; const view4 = levelName == "MABES POLRI" @@ -212,6 +212,21 @@ export default function ExecutiveDashboard() { async function initState() { const response1 = await generateTicket(); setTicket1(response1?.data?.data); + + const response2 = await generateTicket(); + setTicket2(response2?.data?.data); + + const response3 = await generateTicket(); + setTicket3(response3?.data?.data); + + const response4 = await generateTicket(); + setTicket4(response4?.data?.data); + + const response5 = await generateTicket(); + setTicket5(response5?.data?.data); + + const response6 = await generateTicket(); + setTicket6(response6?.data?.data); } initState(); @@ -235,35 +250,6 @@ export default function ExecutiveDashboard() { return (
- - - - - - - Download Report - -
-
- - setDateFilter(e.target.value)} - className="w-full" - /> -
-
- - - -
-
@@ -298,7 +284,7 @@ export default function ExecutiveDashboard() {
- {ticket1 == "" ? ( + {ticket2 == "" ? (