mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:ui agenda,curated content,filter spit

This commit is contained in:
Anang Yusman 2025-02-25 20:50:47 +08:00
parent e7ca5def8c
commit 72c699a42a
7 changed files with 286 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/[locale]/(protected)/contributor/agenda-setting/calender-view.tsx
View File

@ -119,6 +119,9 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
); );
const [selectedEventDate, setSelectedEventDate] = useState<Date | null>(null); const [selectedEventDate, setSelectedEventDate] = useState<Date | null>(null);
const roleId = Number(getCookiesDecrypt("urie")) || 0; const roleId = Number(getCookiesDecrypt("urie")) || 0;
const userLevelId = Number(getCookiesDecrypt("ulie")) || 0;
console.log("roleId", roleId);
console.log("userlevel", userLevelId);
const [apiEvents, setApiEvents] = useState<CalendarEvent[]>([]); const [apiEvents, setApiEvents] = useState<CalendarEvent[]>([]);
const [Isloading, setLoading] = useState<boolean>(false); const [Isloading, setLoading] = useState<boolean>(false);
const [draggableInitialized, setDraggableInitialized] = const [draggableInitialized, setDraggableInitialized] =
@ -574,11 +577,11 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
<div className="grid grid-cols-12 gap-6 divide-x divide-border"> <div className="grid grid-cols-12 gap-6 divide-x divide-border">
<Card className="col-span-12 lg:col-span-4 2xl:col-span-3 pb-5"> <Card className="col-span-12 lg:col-span-4 2xl:col-span-3 pb-5">
<CardContent className="p-0"> <CardContent className="p-0">
<CardHeader className="border-none mb-2 pt-5"> <CardHeader className="border-none mb-2 pt-5 ">
{roleId == 3 || roleId == 11 || roleId == 2 || roleId == 12 ? ( {roleId == 3 || roleId == 11 || roleId == 2 || roleId == 12 ? (
<Button <Button
onClick={handleDateClick} onClick={handleDateClick}
className="dark:bg-background dark:text-foreground" className="dark:bg-background dark:text-foreground w-[250px]"
> >
<Plus className="w-4 h-4 me-1" /> <Plus className="w-4 h-4 me-1" />
{t("addEvent")} {t("addEvent")}
@ -589,8 +592,8 @@ const CalendarView = ({ categories }: CalendarViewProps) => {
<div> <div>
<Dialog open={open} onOpenChange={setOpen}> <Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild> <DialogTrigger asChild>
{roleId == 2 ? ( {roleId === 3 && userLevelId === 216 ? (
<Button className="dark:bg-background dark:text-foreground "> <Button className="dark:bg-background dark:text-foreground w-[250px]">
<Book className="w-4 h-4" /> <Book className="w-4 h-4" />
{t("bag-pa-monitoring-results")} {t("bag-pa-monitoring-results")}
</Button> </Button>

48
app/[locale]/(protected)/contributor/content/image/components/columns.tsx
View File

@ -110,53 +110,29 @@ const columns: ColumnDef<any>[] = [
); );
}, },
}, },
//
{ {
accessorKey: "statusId", accessorKey: "statusName",
header: "Status", header: "Status",
cell: ({ row }) => { cell: ({ row }) => {
const userLevelId = 2; // Gantilah sesuai dengan konteks aplikasi const statusColors: Record<string, string> = {
const statusId = Number(row.getValue("statusId")); diterima: "bg-green-100 text-green-600",
const reviewedAtLevel = row.original.reviewedAtLevel as string | null; "menunggu review": "bg-orange-100 text-orange-600",
const needApprovalFromLevel = Number(row.original.needApprovalFromLevel); };
let statusName = row.getValue("statusName") as string; const status = row.getValue("statusName") as string;
let icon = "fa:times-circle"; const statusName = status?.toLocaleLowerCase();
let statusClass = "bg-gray-100 text-gray-600"; const statusStyles =
statusColors[statusName] || "bg-red-200 text-red-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 ( return (
<Badge <Badge
className={cn( className={cn(
"rounded-full px-5 w-full whitespace-nowrap", "rounded-full px-5 w-full whitespace-nowrap",
statusClass statusStyles
)} )}
> >
{statusName} {status} {/* Tetap tampilkan nilai asli */}
</Badge> </Badge>
); );
}, },

28
app/[locale]/(protected)/contributor/content/spit/table-spit/table-spit.tsx
View File

@ -47,6 +47,8 @@ import {
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"; } from "@/components/ui/dropdown-menu";
import { Label } from "@/components/ui/label"; import { Label } from "@/components/ui/label";
import { useTranslations } from "next-intl";
import { format } from "date-fns";
// export type CompanyData = { // export type CompanyData = {
// no: number; // no: number;
@ -77,7 +79,8 @@ const TableSPIT = () => {
const [search, setSearch] = React.useState(""); const [search, setSearch] = React.useState("");
const userId = getCookiesDecrypt("uie"); const userId = getCookiesDecrypt("uie");
const userLevelId = getCookiesDecrypt("ulie"); const userLevelId = getCookiesDecrypt("ulie");
const t = useTranslations("AnalyticsDashboard");
const [dateFilter, setDateFilter] = React.useState("");
const [totalData, setTotalData] = React.useState<number>(1); const [totalData, setTotalData] = React.useState<number>(1);
const [sorting, setSorting] = React.useState<SortingState>([]); const [sorting, setSorting] = React.useState<SortingState>([]);
const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>( const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(
@ -117,7 +120,7 @@ const TableSPIT = () => {
React.useEffect(() => { React.useEffect(() => {
fetchData(); fetchData();
}, [page, limit, search, statusFilter]); }, [page, limit, search, statusFilter, dateFilter]);
async function fetchData() { async function fetchData() {
let isPublish; let isPublish;
@ -129,8 +132,18 @@ const TableSPIT = () => {
isPublish = statusFilter.includes(1) ? false : true; isPublish = statusFilter.includes(1) ? false : true;
} }
const formattedStartDate = dateFilter
? format(new Date(dateFilter), "yyyy-MM-dd")
: "";
try { 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 data = res?.data?.data;
const contentData = data?.content || []; const contentData = data?.content || [];
@ -192,6 +205,15 @@ const TableSPIT = () => {
<div className="flex flex-row justify-between my-1 mx-1"> <div className="flex flex-row justify-between my-1 mx-1">
<p>Filter</p> <p>Filter</p>
</div> </div>
<div className="mx-2 my-1">
<Label>{t("date")}</Label>
<Input
type="date"
value={dateFilter}
onChange={(e) => setDateFilter(e.target.value)}
className="max-w-sm"
/>
</div>
<Label className="ml-2 mt-2">Status</Label> <Label className="ml-2 mt-2">Status</Label>
<div className="flex items-center px-4 py-1"> <div className="flex items-center px-4 py-1">
<input <input

6
app/[locale]/(protected)/shared/contest/components/columns.tsx
View File

@ -98,16 +98,14 @@ const columns: ColumnDef<any>[] = [
const userRoleId: number = Number(getCookiesDecrypt("urie")); const userRoleId: number = Number(getCookiesDecrypt("urie"));
const userLevelNumber: number = Number(getCookiesDecrypt("ulne")); const userLevelNumber: number = Number(getCookiesDecrypt("ulne"));
// Mengambil data dari row.original agar lebih aman
const isPublishForAll: boolean = Boolean(row.original.isPublishForAll); const isPublishForAll: boolean = Boolean(row.original.isPublishForAll);
const isPublishForMabes: boolean = Boolean( const isPublishForMabes: boolean = Boolean(
row.original.isPublishForMabes row.original.isPublishForMabes
); );
// Logika status berdasarkan role dan data dari API
const isPending: boolean = const isPending: boolean =
(userRoleId === 3 && userLevelNumber === 1 && !isPublishForAll) || // Role 3 dengan level 1 hanya publish jika isPublishForAll true (userRoleId === 3 && userLevelNumber === 1 && !isPublishForAll) ||
((userRoleId === 11 || userRoleId === 12) && !isPublishForMabes); // Role 11 dan 12 hanya publish jika isPublishForMabes true ((userRoleId === 11 || userRoleId === 12) && !isPublishForMabes);
const isTerkirim: boolean = isPublishForMabes && !isPublishForAll; const isTerkirim: boolean = isPublishForMabes && !isPublishForAll;

13
app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx
View File

@ -543,16 +543,25 @@ export default function DetailImage() {
{/* Polda Checkbox */} {/* Polda Checkbox */}
<label className=" cursor-pointer flex items-center gap-2"> <label className=" cursor-pointer flex items-center gap-2">
<Checkbox <Checkbox
checked={data.placements === "polda"} // Automatically checks if placement matches checked={data.placements === "polda"}
disabled disabled
/> />
<span>Wilayah</span> <span>Wilayah</span>
</label> </label>
{/* Satker Checkbox */}
<label className=" cursor-pointer flex items-center gap-2">
<Checkbox
checked={data.placements === "satker"}
disabled
/>
<span>Satker</span>
</label>
{/* International Checkbox */} {/* International Checkbox */}
<label className=" cursor-pointer flex items-center gap-2"> <label className=" cursor-pointer flex items-center gap-2">
<Checkbox <Checkbox
checked={data.placements === "international"} // Automatically checks if placement matches checked={data.placements === "international"}
disabled disabled
/> />
<span>International</span> <span>International</span>

256
lib/menus.ts
View File

@ -260,6 +260,70 @@ export function getMenuList(pathname: string, t: any): Group[] {
}, },
], ],
}, },
{
groupLabel: "",
id: "settings",
menus: [
{
id: "settings",
href: "/admin/settings",
label: t("settings"),
active: pathname.includes("/settinng"),
icon: "material-symbols:settings",
submenus: [
{
href: "/admin/settings/category",
label: t("category"),
active: pathname === "/admin/settings/category",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/tag",
label: "Tag",
active: pathname === "/admin/settings/tag",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/banner",
label: "Banner",
active: pathname === "/admin/settings/banner",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/feedback",
label: "Feedback",
active: pathname === "/admin/settings/feedback",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/faq",
label: "FAQ",
active: pathname === "/admin/settings/faq",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "https://nat-mediahub.polri.go.id/",
label: "Mediahub 2022",
active: pathname === "/admin/settings/mediahub-2022",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/privacy",
label: t("privacy"),
active: pathname === "/admin/settings/privacy",
icon: "heroicons:arrow-trending-up",
children: [],
},
],
},
],
},
// ===== MENU TEMPLATE DASHCODE ===== // ===== MENU TEMPLATE DASHCODE =====
// { // {
// groupLabel: t("apps"), // groupLabel: t("apps"),
@ -1790,6 +1854,70 @@ export function getMenuList(pathname: string, t: any): Group[] {
}, },
], ],
}, },
{
groupLabel: "",
id: "settings",
menus: [
{
id: "settings",
href: "/admin/settings",
label: t("settings"),
active: pathname.includes("/settinng"),
icon: "material-symbols:settings",
submenus: [
{
href: "/admin/settings/category",
label: t("category"),
active: pathname === "/admin/settings/category",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/tag",
label: "Tag",
active: pathname === "/admin/settings/tag",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/banner",
label: "Banner",
active: pathname === "/admin/settings/banner",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/feedback",
label: "Feedback",
active: pathname === "/admin/settings/feedback",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/faq",
label: "FAQ",
active: pathname === "/admin/settings/faq",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "https://nat-mediahub.polri.go.id/",
label: "Mediahub 2022",
active: pathname === "/admin/settings/mediahub-2022",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/privacy",
label: t("privacy"),
active: pathname === "/admin/settings/privacy",
icon: "heroicons:arrow-trending-up",
children: [],
},
],
},
],
},
]; ];
} else if (Number(userLevelId) == 761) { } else if (Number(userLevelId) == 761) {
menusSelected = [ menusSelected = [
@ -3159,35 +3287,70 @@ export function getMenuList(pathname: string, t: any): Group[] {
}, },
], ],
}, },
// { {
// groupLabel: "", groupLabel: "",
// id: "settings", id: "settings",
// menus: [ menus: [
// { {
// id: "settings", id: "settings",
// href: "/admin/settings", href: "/admin/settings",
// label: t("settings"), label: t("settings"),
// active: pathname.includes("/settinng"), active: pathname.includes("/settinng"),
// icon: "material-symbols:settings", icon: "material-symbols:settings",
// submenus: [ submenus: [
// { {
// href: "/admin/settings/category", href: "/admin/settings/category",
// label: t("category"), label: t("category"),
// active: pathname === "/admin/settings/category", active: pathname === "/admin/settings/category",
// icon: "heroicons:arrow-trending-up", icon: "heroicons:arrow-trending-up",
// children: [], children: [],
// }, },
// { {
// href: "/admin/settings/tag", href: "/admin/settings/tag",
// label: "Tag", label: "Tag",
// active: pathname === "/admin/settings/tag", active: pathname === "/admin/settings/tag",
// icon: "heroicons:arrow-trending-up", icon: "heroicons:arrow-trending-up",
// children: [], children: [],
// }, },
// ], {
// }, href: "/admin/settings/banner",
// ], label: "Banner",
// }, active: pathname === "/admin/settings/banner",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/feedback",
label: "Feedback",
active: pathname === "/admin/settings/feedback",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/faq",
label: "FAQ",
active: pathname === "/admin/settings/faq",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "https://nat-mediahub.polri.go.id/",
label: "Mediahub 2022",
active: pathname === "/admin/settings/mediahub-2022",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/privacy",
label: t("privacy"),
active: pathname === "/admin/settings/privacy",
icon: "heroicons:arrow-trending-up",
children: [],
},
],
},
],
},
]; ];
} else { } else {
menusSelected = [ menusSelected = [
@ -3273,6 +3436,41 @@ export function getMenuList(pathname: string, t: any): Group[] {
icon: "heroicons:arrow-trending-up", icon: "heroicons:arrow-trending-up",
children: [], children: [],
}, },
{
href: "/admin/settings/banner",
label: "Banner",
active: pathname === "/admin/settings/banner",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/feedback",
label: "Feedback",
active: pathname === "/admin/settings/feedback",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/faq",
label: "FAQ",
active: pathname === "/admin/settings/faq",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "https://nat-mediahub.polri.go.id/",
label: "Mediahub 2022",
active: pathname === "/admin/settings/mediahub-2022",
icon: "heroicons:arrow-trending-up",
children: [],
},
{
href: "/admin/settings/privacy",
label: t("privacy"),
active: pathname === "/admin/settings/privacy",
icon: "heroicons:arrow-trending-up",
children: [],
},
], ],
}, },
], ],

3
service/content/content.ts
View File

@ -129,10 +129,11 @@ export async function listSPIT(
page: any, page: any,
limit: any, limit: any,
title = "", title = "",
contentCreatedDate = "",
isPublish: any isPublish: any
) { ) {
return await httpGetInterceptor( return await httpGetInterceptor(
`media/spit/pagination?enablePage=1&page=${page}&size=${limit}&sort=desc&sortBy=contentTitleId&title=${title}&isPublish=${isPublish}` `media/spit/pagination?enablePage=1&page=${page}&size=${limit}&sort=desc&sortBy=contentTitleId&title=${title}& contentCreatedDate=${contentCreatedDate}&isPublish=${isPublish}`
); );
} }