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

pull main

This commit is contained in:
Sabda Yagra 2025-06-11 10:51:46 +07:00
parent 6e353b1fce 13f25f94a7
commit a96912cbcf
42 changed files with 1151 additions and 445 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/[locale]/(protected)/admin/media-tracking/results/component/column.tsx
View File

@ -49,11 +49,11 @@ const columns: ColumnDef<any>[] = [
header: "Jumlah Amplifikasi",
cell: ({ row }) => <span>{row.getValue("link")}</span>,
},
{
accessorKey: "status",
header: "Status",
cell: ({ row }) => <span>{row.getValue("status")}</span>,
},
// {
// accessorKey: "status",
// header: "Status",
// cell: ({ row }) => <span>{row.getValue("status")}</span>,
// },
{
accessorKey: "date",
header: "Tanggal Penarikan",
@ -77,10 +77,17 @@ const columns: ColumnDef<any>[] = [
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="p-0" align="end">
<Link href={`/contributor/content/audio/detail/${row.original.id}`}>
<Link
href={`/contributor/content/${
row.original.mediaUpload.fileType.secondaryName &&
row.original.mediaUpload.fileType.secondaryName.toLowerCase()
}/detail/${row.original.mediaUpload.id}`}
>
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
<Eye className="w-4 h-4 me-1.5" />
View
View{" "}
{row.original.mediaUpload.fileType.secondaryName &&
row.original.mediaUpload.fileType.secondaryName.toLowerCase()}
</DropdownMenuItem>
</Link>
</DropdownMenuContent>

107
app/[locale]/(protected)/admin/media-tracking/tracking-berita/component/table.tsx
View File

@ -9,7 +9,7 @@ import {
listDataTracking,
mediaTrackingSave,
} from "@/service/media-tracking/media-tracking";
import { error, loading } from "@/lib/swal";
import { error } from "@/lib/swal";
import { toast } from "sonner";
import {
DropdownMenu,
@ -20,31 +20,32 @@ import {
} from "@/components/ui/dropdown-menu";
import { PaginationState } from "@tanstack/react-table";
import page from "../page";
import CustomPagination from "@/components/table/custom-pagination";
import { close, loading } from "@/config/swal";
export default function TrackingBeritaCard() {
const [search, setSearch] = useState("");
const [content, setContent] = useState<any[]>([]);
const [selectedItems, setSelectedItems] = useState<number[]>([]);
const [currentPage, setCurrentPage] = useState(1);
const [page, setPage] = React.useState(1);
const [showData, setShowData] = React.useState("10");
const [pagination, setPagination] = React.useState<PaginationState>({
pageIndex: 0,
pageSize: Number(showData),
});
const [page, setPage] = useState(1);
const [totalPage, setTotalPage] = useState(1);
const [showData, setShowData] = useState("6");
useEffect(() => {
initFecth();
}, [showData]);
}, [showData, page]);
const initFecth = async () => {
loading();
const response = await listDataTracking(showData, page - 1);
const data = response?.data?.data;
const newData = data?.content;
setTotalPage(data?.totalPages || 1);
newData.forEach((item: any, index: number) => {
item.no = (page - 1) * Number(showData) + index + 1;
});
setContent(response?.data?.data?.content || []);
close();
};
const fecthAll = async (keyword: string) => {
@ -117,17 +118,17 @@ export default function TrackingBeritaCard() {
value={showData}
onValueChange={setShowData}
>
<DropdownMenuRadioItem value="10">
1 - 10 Data
<DropdownMenuRadioItem value="12">
1 - 6 Data
</DropdownMenuRadioItem>
<DropdownMenuRadioItem value="50">
1 - 50 Data
<DropdownMenuRadioItem value="12">
1 - 12 Data
</DropdownMenuRadioItem>
<DropdownMenuRadioItem value="100">
1 - 100 Data
<DropdownMenuRadioItem value="60">
1 - 60 Data
</DropdownMenuRadioItem>
<DropdownMenuRadioItem value="250">
1 - 250 Data
<DropdownMenuRadioItem value="120">
1 - 120 Data
</DropdownMenuRadioItem>
</DropdownMenuRadioGroup>
</DropdownMenuContent>
@ -150,48 +151,40 @@ export default function TrackingBeritaCard() {
)}
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
{content.map((item: any) => (
<Card
key={item.id}
className="relative overflow-hidden shadow-sm border rounded-lg cursor-pointer"
onClick={() => handleSelect(item.id)}
>
<img
src={item.thumbnailLink}
alt={item.title}
className="w-full h-[300px] object-cover"
/>
<div className="absolute top-2 left-2">
<div className="w-5 h-5 border-2 border-white bg-white rounded-sm flex items-center justify-center">
{selectedItems.includes(item.id) && (
<div className="w-3 h-3 bg-blue-600 rounded-sm" />
)}
{content?.length > 1 &&
content.map((item: any) => (
<Card
key={item.id}
className="relative overflow-hidden shadow-sm border rounded-lg cursor-pointer"
onClick={() => handleSelect(item.id)}
>
<img
src={item.thumbnailLink}
alt={item.title}
className="w-full h-[300px] object-cover"
/>
<div className="absolute top-2 left-2">
<div className="w-5 h-5 border-2 border-white bg-white rounded-sm flex items-center justify-center">
{selectedItems.includes(item.id) && (
<div className="w-3 h-3 bg-blue-600 rounded-sm" />
)}
</div>
</div>
</div>
<p className="p-2 text-sm font-medium text-gray-800 truncate">
{item.title}
</p>
</Card>
))}
<p className="p-2 text-sm font-medium text-gray-800 truncate">
{item.title}
</p>
</Card>
))}
</div>
<div className="flex justify-center items-center gap-2 mt-4">
<Button
size="icon"
variant="ghost"
disabled={currentPage === 1}
onClick={() => setCurrentPage((p) => p - 1)}
>
<ChevronLeft className="w-4 h-4" />
</Button>
<div className="px-3 py-1 rounded-full border">{currentPage}</div>
<Button
size="icon"
variant="ghost"
onClick={() => setCurrentPage((p) => p + 1)}
>
<ChevronRight className="w-4 h-4" />
</Button>
<div className="mt-3">
{content && content?.length > 0 ? (
<CustomPagination
totalPage={totalPage}
onPageChange={(data) => setPage(data)}
/>
) : (
<p>No Data</p>
)}
</div>
</div>
</Card>

22
app/[locale]/(protected)/admin/settings/banner/component/table.tsx
View File

@ -69,6 +69,7 @@ import { data } from "jquery";
import { useToast } from "@/components/ui/use-toast";
import { setBanner } from "@/service/settings/settings";
import { id } from "date-fns/locale";
import CustomPagination from "@/components/table/custom-pagination";
const ContentListBanner = () => {
const router = useRouter();
@ -120,10 +121,10 @@ const ContentListBanner = () => {
React.useEffect(() => {
fetchData();
setPagination({
pageIndex: 0,
pageSize: Number(showData),
});
// setPagination({
// pageIndex: 0,
// pageSize: Number(showData),
// });
}, [page, showData]);
async function fetchData() {
@ -398,10 +399,15 @@ const ContentListBanner = () => {
</div>
))}
</div>
<div className="flex justify-center mt-6">
<div className="border rounded px-3 py-1 text-sm text-gray-600">
1
</div>
<div className="mt-3">
{data && data?.length > 0 ? (
<CustomPagination
totalPage={totalPage}
onPageChange={(data) => setPage(data)}
/>
) : (
<p>No Data</p>
)}
</div>
</div>
</>

20
app/[locale]/(protected)/admin/settings/setting-tracking/component/column.tsx
View File

@ -122,10 +122,22 @@ const useTableColumns = () => {
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="p-0" align="end">
<DetailSettingTracking id={row.original.id} isDetail={true} />
<UpdateSettingTracking id={row.original.id} isUpdate={true} />
<Link
href={`/admin/settings/setting-tracking/detail/${row.original.id}`}
>
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
<Eye className="w-4 h-4 me-1.5" />
View
</DropdownMenuItem>
</Link>
<Link
href={`/admin/settings/setting-tracking/update/${row.original.id}`}
>
<DropdownMenuItem className="p-2 border-b text-default-700 group focus:bg-default focus:text-primary-foreground rounded-none">
<SquarePen className="w-4 h-4 me-1.5" />
Edit
</DropdownMenuItem>
</Link>
<DropdownMenuItem
onClick={() => handleDeleteMedia(row.original.id)}
className="p-2 border-b text-destructive bg-destructive/30 focus:bg-destructive focus:text-destructive-foreground rounded-none"

260
app/[locale]/(protected)/admin/settings/setting-tracking/component/create.tsx
View File

@ -1,141 +1,141 @@
"use client";
// "use client";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { z } from "zod";
import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { useRouter } from "@/i18n/routing";
import { Input } from "@/components/ui/input";
import { Checkbox } from "@/components/ui/checkbox";
import { getUserRoles, postCategory } from "@/service/settings/settings";
import { Fragment, useEffect, useState } from "react";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import { Icon } from "@iconify/react/dist/iconify.js";
import { Textarea } from "@/components/ui/textarea";
import { close, error, loading } from "@/config/swal";
import { useToast } from "@/components/ui/use-toast";
import { stringify } from "querystring";
import { useDropzone } from "react-dropzone";
import { CloudUpload } from "lucide-react";
import Image from "next/image";
import { Upload } from "tus-js-client";
import { getCookiesDecrypt } from "@/lib/utils";
import Cookies from "js-cookie";
import { useTranslations } from "next-intl";
// import { Button } from "@/components/ui/button";
// import {
// Dialog,
// DialogContent,
// DialogFooter,
// DialogHeader,
// DialogTitle,
// DialogTrigger,
// } from "@/components/ui/dialog";
// import { z } from "zod";
// import { useForm } from "react-hook-form";
// import { zodResolver } from "@hookform/resolvers/zod";
// import {
// Form,
// FormControl,
// FormDescription,
// FormField,
// FormItem,
// FormLabel,
// FormMessage,
// } from "@/components/ui/form";
// import { useRouter } from "@/i18n/routing";
// import { Input } from "@/components/ui/input";
// import { Checkbox } from "@/components/ui/checkbox";
// import { getUserRoles, postCategory } from "@/service/settings/settings";
// import { Fragment, useEffect, useState } from "react";
// import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
// import { Icon } from "@iconify/react/dist/iconify.js";
// import { Textarea } from "@/components/ui/textarea";
// import { close, error, loading } from "@/config/swal";
// import { useToast } from "@/components/ui/use-toast";
// import { stringify } from "querystring";
// import { useDropzone } from "react-dropzone";
// import { CloudUpload } from "lucide-react";
// import Image from "next/image";
// import { Upload } from "tus-js-client";
// import { getCookiesDecrypt } from "@/lib/utils";
// import Cookies from "js-cookie";
// import { useTranslations } from "next-intl";
const wilayahList = [
{ id: "mabes", label: "Mabes" },
{ id: "polda", label: "Polda" },
{ id: "satker", label: "Satker" },
];
// const wilayahList = [
// { id: "mabes", label: "Mabes" },
// { id: "polda", label: "Polda" },
// { id: "satker", label: "Satker" },
// ];
const jumlahList = [5, 10, 15, 20, 25, 30];
// const jumlahList = [5, 10, 15, 20, 25, 30];
export default function CreateSettingTracking() {
const t = useTranslations("Menu");
const [isOpen, setIsOpen] = useState(false);
// export default function CreateSettingTracking() {
// const t = useTranslations("Menu");
// const [isOpen, setIsOpen] = useState(false);
const form = useForm({
defaultValues: {
wilayah: [] as string[],
jumlah: [] as number[],
},
});
// const form = useForm({
// defaultValues: {
// wilayah: [] as string[],
// jumlah: [] as number[],
// },
// });
const onSubmit = (values: any) => {
console.log("Submitted values:", values);
setIsOpen(false);
};
// const onSubmit = (values: any) => {
// console.log("Submitted values:", values);
// setIsOpen(false);
// };
return (
<Dialog open={isOpen} onOpenChange={setIsOpen}>
<DialogTrigger asChild>
<Button onClick={() => setIsOpen(true)}>Tambah Setting Tracking</Button>
</DialogTrigger>
// return (
// <Dialog open={isOpen} onOpenChange={setIsOpen}>
// <DialogTrigger asChild>
// <Button onClick={() => setIsOpen(true)}>Tambah Setting Tracking</Button>
// </DialogTrigger>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>Add Setting Tracking Berita Harian</DialogTitle>
</DialogHeader>
// <DialogContent className="sm:max-w-md">
// <DialogHeader>
// <DialogTitle>Add Setting Tracking Berita Harian</DialogTitle>
// </DialogHeader>
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
{/* Wilayah */}
<FormField
control={form.control}
name="wilayah"
render={({ field }) => (
<FormItem>
<FormLabel>Wilayah</FormLabel>
<div className="flex gap-4">
{wilayahList.map((item) => (
<div key={item.id} className="flex items-center gap-2">
<Checkbox
checked={field.value.includes(item.id)}
onCheckedChange={(checked) => {
const updated = checked
? [...field.value, item.id]
: field.value.filter((val) => val !== item.id);
field.onChange(updated);
}}
/>
<label className="text-sm">{item.label}</label>
</div>
))}
</div>
</FormItem>
)}
/>
// <Form {...form}>
// <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
// {/* Wilayah */}
// <FormField
// control={form.control}
// name="wilayah"
// render={({ field }) => (
// <FormItem>
// <FormLabel>Wilayah</FormLabel>
// <div className="flex gap-4">
// {wilayahList.map((item) => (
// <div key={item.id} className="flex items-center gap-2">
// <Checkbox
// checked={field.value.includes(item.id)}
// onCheckedChange={(checked) => {
// const updated = checked
// ? [...field.value, item.id]
// : field.value.filter((val) => val !== item.id);
// field.onChange(updated);
// }}
// />
// <label className="text-sm">{item.label}</label>
// </div>
// ))}
// </div>
// </FormItem>
// )}
// />
<FormField
control={form.control}
name="jumlah"
render={({ field }) => (
<FormItem>
<FormLabel>Jumlah Tracking Berita Harian</FormLabel>
<div className="flex gap-4 flex-wrap">
{jumlahList.map((num) => (
<div key={num} className="flex items-center gap-2">
<Checkbox
checked={field.value.includes(num)}
onCheckedChange={(checked) => {
const updated = checked
? [...field.value, num]
: field.value.filter((val) => val !== num);
field.onChange(updated);
}}
/>
<label className="text-sm">{num}</label>
</div>
))}
</div>
</FormItem>
)}
/>
// <FormField
// control={form.control}
// name="jumlah"
// render={({ field }) => (
// <FormItem>
// <FormLabel>Jumlah Tracking Berita Harian</FormLabel>
// <div className="flex gap-4 flex-wrap">
// {jumlahList.map((num) => (
// <div key={num} className="flex items-center gap-2">
// <Checkbox
// checked={field.value.includes(num)}
// onCheckedChange={(checked) => {
// const updated = checked
// ? [...field.value, num]
// : field.value.filter((val) => val !== num);
// field.onChange(updated);
// }}
// />
// <label className="text-sm">{num}</label>
// </div>
// ))}
// </div>
// </FormItem>
// )}
// />
<DialogFooter>
<Button type="submit">Tambah Setting</Button>
</DialogFooter>
</form>
</Form>
</DialogContent>
</Dialog>
);
}
// <DialogFooter>
// <Button type="submit">Tambah Setting</Button>
// </DialogFooter>
// </form>
// </Form>
// </DialogContent>
// </Dialog>
// );
// }

12
app/[locale]/(protected)/admin/settings/setting-tracking/component/table.tsx
View File

@ -49,8 +49,8 @@ import {
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover";
import CreateSettingTracking from "./create";
import useTableColumns from "./column";
import { UploadIcon } from "lucide-react";
const AdminSettingTrackingTable = () => {
const router = useRouter();
@ -190,7 +190,15 @@ const AdminSettingTrackingTable = () => {
return (
<div className="w-full overflow-x-auto bg-white p-4 rounded-sm space-y-3">
<div className="flex items-end justify-between">
<CreateSettingTracking />
{/* <CreateSettingTracking /> */}
<div className="flex-none">
<Link href={"/admin/settings/setting-tracking/create"}>
<Button color="primary" className="text-white" size="md">
<UploadIcon size={18} className="mr-2" />
Tambah Setting Tracking
</Button>
</Link>
</div>
<Popover>
<PopoverTrigger asChild>
<Button size="md" variant="outline">

15
app/[locale]/(protected)/admin/settings/setting-tracking/create/page.tsx Normal file
View File

@ -0,0 +1,15 @@
import CreateSettingTracking from "@/components/form/media-tracking/setting-tracking-form";
import SiteBreadcrumb from "@/components/site-breadcrumb";
const SettingTrackingCreatePage = () => {
return (
<div>
<SiteBreadcrumb />
<div className="space-y-4">
<CreateSettingTracking />
</div>
</div>
);
};
export default SettingTrackingCreatePage;

15
app/[locale]/(protected)/admin/settings/setting-tracking/detail/[id]/page.tsx Normal file
View File

@ -0,0 +1,15 @@
import DetailSettingTracking from "@/components/form/media-tracking/setting-tracking-detail-form";
import SiteBreadcrumb from "@/components/site-breadcrumb";
const SettingTrackingDetailPage = () => {
return (
<div>
<SiteBreadcrumb />
<div className="space-y-4">
<DetailSettingTracking />
</div>
</div>
);
};
export default SettingTrackingDetailPage;

15
app/[locale]/(protected)/admin/settings/setting-tracking/update/[id]/page.tsx Normal file
View File

@ -0,0 +1,15 @@
import UpdateSettingTracking from "@/components/form/media-tracking/setting-tracking-update-form";
import SiteBreadcrumb from "@/components/site-breadcrumb";
const SettingTrackingUpdatePage = () => {
return (
<div>
<SiteBreadcrumb />
<div className="space-y-4">
<UpdateSettingTracking />
</div>
</div>
);
};
export default SettingTrackingUpdatePage;

8
app/[locale]/(protected)/contributor/content/image/components/table-image.tsx
View File

@ -52,7 +52,7 @@ import { InputGroup, InputGroupText } from "@/components/ui/input-group";
import { paginationBlog } from "@/service/blog/blog";
import { ticketingPagination } from "@/service/ticketing/ticketing";
import { Badge } from "@/components/ui/badge";
import { useRouter, useSearchParams } from "next/navigation";
import { useParams, useRouter, useSearchParams } from "next/navigation";
import TablePagination from "@/components/table/table-pagination";
import {
@ -73,6 +73,9 @@ import useTableColumns from "./columns";
const TableImage = () => {
const router = useRouter();
const searchParams = useSearchParams();
const params = useParams();
const locale = params?.locale;
const MySwal = withReactContent(Swal);
const [dataTable, setDataTable] = React.useState<any[]>([]);
const [totalData, setTotalData] = React.useState<number>(1);
@ -199,7 +202,8 @@ const TableImage = () => {
formattedStartDate, // Pastikan format sesuai
formattedEndDate, // Pastikan format sesuai
search,
filterByCreatorGroup
filterByCreatorGroup,
locale == "en"
);
const data = res?.data?.data;

8
app/[locale]/(protected)/supervisor/communications/questions/[title]/page.tsx
View File

@ -66,7 +66,7 @@ export default function Questions() {
<Icon icon="ic:baseline-email" width={22} color="#2563eb" />
Email
</Link>
<Link
{/* <Link
href="/supervisor/communications/questions/facebook"
className="flex items-center gap-3"
>
@ -89,7 +89,7 @@ export default function Questions() {
color="#2563eb"
/>
Instagram
</Link>
</Link> */}
<Link
href="/supervisor/communications/questions/whatsapp"
className="flex items-center gap-3"
@ -97,13 +97,13 @@ export default function Questions() {
<Icon icon="ri:whatsapp-fill" width={24} color="#2563eb" />
Whatsapp
</Link>
<Link
{/* <Link
href="/supervisor/communications/questions/youtube"
className="flex items-center gap-3"
>
<Icon icon="mdi:youtube" width={24} color="#2563eb" />
Youtube
</Link>
</Link> */}
<Link
href="/supervisor/communications/questions/inbox"
className="flex items-center gap-3"

3
app/[locale]/(public)/(polda)/tbnews/[polda_name]/components/national-news.tsx
View File

@ -2,8 +2,7 @@
import { Reveal } from "@/components/landing-page/Reveal";
import { Skeleton } from "@/components/ui/skeleton";
import { getHeroData, listData } from "@/service/landing/landing";
import { formatDateToIndonesian } from "@/utils/globals";
import { listData } from "@/service/landing/landing";
import Image from "next/image";
import { useParams } from "next/navigation";
import React, { useEffect, useState } from "react";

2
app/[locale]/(public)/(polda)/tbnews/[polda_name]/components/news-tickers-kaltara.tsx
View File

@ -1,6 +1,6 @@
"use client";
import { Link } from "@/i18n/routing";
import { getHeroData, listCarousel, listData } from "@/service/landing/landing";
import { listData } from "@/service/landing/landing";
import { formatDateToIndonesian, textEllipsis } from "@/utils/globals";
import { useEffect, useState } from "react";
import { useTranslations } from "next-intl";

2
app/[locale]/(public)/(polda)/tbnews/[polda_name]/components/popular-news.tsx
View File

@ -44,7 +44,7 @@ const PopularNews = () => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
setHeroData(response?.data?.data?.content);
};

3
app/[locale]/(public)/(polda)/tbnews/[polda_name]/components/regional-news.tsx
View File

@ -2,8 +2,7 @@
import { Reveal } from "@/components/landing-page/Reveal";
import { Skeleton } from "@/components/ui/skeleton";
import { getHeroData, listData } from "@/service/landing/landing";
import { formatDateToIndonesian } from "@/utils/globals";
import { listData } from "@/service/landing/landing";
import Image from "next/image";
import { useParams } from "next/navigation";
import React, { useEffect, useState } from "react";

30
components/form/communication/escalation-detail-form.tsx
View File

@ -31,6 +31,8 @@ import { Icon } from "@iconify/react/dist/iconify.js";
import { Link } from "@/i18n/routing";
import { loading } from "@/lib/swal";
import { id } from "date-fns/locale";
import { htmlToString } from "@/utils/globals";
import InfoLainnyaModal from "../ticketing/info-lainnya";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@ -63,6 +65,7 @@ export default function FormDetailEscalation() {
const [listDiscussion, setListDiscussion] = useState();
const [message, setMessage] = useState("");
const [selectedPriority, setSelectedPriority] = useState("");
const [openEmergencyModal, setOpenEmergencyModal] = useState(false);
const [replyMessage, setReplyMessage] = useState("");
const [replies, setReplies] = useState([
{
@ -136,6 +139,10 @@ export default function FormDetailEscalation() {
setReplyMessage("");
};
const openEmergencyIssueDetail = () => {
setOpenEmergencyModal(true);
};
return (
<div>
<div className="flex">
@ -179,6 +186,29 @@ export default function FormDetailEscalation() {
</div>
</div>
<p className="p-5 bg-white">{detail.message}</p>
<div className="px-4 py-1 bg-white text-sm">
{detail?.typeId === 6 && detail?.emergencyIssue ? (
<div className="row mx-0 mb-3 emergency-attachments">
<div className=" mr-4">
<Button
color="primary"
size="md"
onClick={openEmergencyIssueDetail}
>
Info Lainnya
</Button>
</div>
</div>
) : null}
{detail?.emergencyIssue && (
<InfoLainnyaModal
open={openEmergencyModal}
onClose={() => setOpenEmergencyModal(false)}
data={detail.emergencyIssue}
/>
)}
</div>
</div>
)}
</div>

2
components/form/communication/escalation-detail-new-form.tsx
View File

@ -45,6 +45,8 @@ import {
import { ChevronDownIcon } from "lucide-react";
import { getOperatorUser } from "@/service/management-user/management-user";
import { getCookiesDecrypt } from "@/lib/utils";
import { htmlToString } from "@/utils/globals";
import InfoLainnyaModal from "../ticketing/info-lainnya";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),

8
components/form/communication/questions-reply-form.tsx
View File

@ -51,10 +51,8 @@ import { ChevronDownIcon } from "lucide-react";
import { getOperatorUser } from "@/service/management-user/management-user";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
description: z.string().min(2, {
message: "Narasi Penugasan harus lebih dari 2 karakter.",
}),
message: z.string().optional(),
description: z.string().optional(),
});
export type taskDetail = {
@ -509,7 +507,7 @@ export default function FormQuestionsReply() {
<Label>Judul</Label>
<Controller
control={control}
name="title"
name="message"
render={({ field }) => (
<Input
size="md"

321
components/form/content/image-detail-form.tsx
View File

@ -66,6 +66,7 @@ import { UnitMapping } from "@/app/[locale]/(protected)/contributor/agenda-setti
import SuggestionModal from "@/components/modal/suggestions-modal";
import { formatDateToIndonesian } from "@/utils/globals";
import ApprovalHistoryModal from "@/components/modal/approval-history-modal";
import Image from "next/image";
const imageSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@ -437,6 +438,22 @@ export default function FormImageDetail() {
successCallback();
};
const [portraitMap, setPortraitMap] = useState<any>({});
const handleImageLoad = (e: any, index: number) => {
const { naturalWidth, naturalHeight } = e.target;
const isPortrait = naturalHeight > naturalWidth;
setPortraitMap((prev: any) => ({
...prev,
[index]: isPortrait,
}));
};
useEffect(() => {
console.log("portrai", portraitMap);
}, [portraitMap]);
return (
<form>
{detail !== undefined ? (
@ -513,19 +530,19 @@ export default function FormImageDetail() {
thumbs={{ swiper: thumbsSwiper }}
modules={[FreeMode, Navigation, Thumbs]}
navigation={false}
className="w-full"
className="h-[480px] object-cover w-full"
>
{detailThumb?.map((data: any) => (
<SwiperSlide key={data.id}>
<img
className="object-fill h-full w-full rounded-md"
className="h-[480px] max-w-[600px] rounded-md object-cover mx-auto border-2"
src={data}
alt={` ${data.id}`}
/>
</SwiperSlide>
))}
</Swiper>
<div className=" mt-2 ">
<div className="mt-2 mx-auto min-w-fit max-w-[600px]">
<Swiper
onSwiper={setThumbsSwiper}
slidesPerView={6}
@ -539,7 +556,7 @@ export default function FormImageDetail() {
{detailThumb?.map((data: any) => (
<SwiperSlide key={data.id}>
<img
className="object-cover h-[60px] w-[80px]"
className="object-cover h-[60px] w-[80px] border-2 border-slate-100"
src={data}
alt={` ${data.id}`}
/>
@ -579,11 +596,11 @@ export default function FormImageDetail() {
</div>
<div className="mt-3 px-3 space-y-2">
<Label>{t("preview")}</Label>
<Card className="mt-2">
<Card className="mt-2 w-fit">
<img
src={detail.thumbnailLink}
alt="Thumbnail Gambar Utama"
className="w-full h-auto rounded"
className="h-[200px] rounded"
/>
</Card>
</div>
@ -666,7 +683,7 @@ export default function FormImageDetail() {
""
)} */}
{detail?.isPublish == false && detail.isPublishOnPolda == true ? (
{(detail?.isPublish == false && detail.isPublishOnPolda == true) || (detail?.isPublish == false && detail?.isInternationalMedia == true && Number(detail?.statusId) == 2) ? (
<div className="flex flex-col gap-2 p-3">
<Button
onClick={() => publishToMabes()}
@ -699,119 +716,139 @@ export default function FormImageDetail() {
)} */}
<Dialog open={modalOpen} onOpenChange={setModalOpen}>
<DialogContent className="min-w-max h-[600px] overflow-y-auto">
<DialogContent size="md" className="max-h-[600px]">
<DialogHeader>
<DialogTitle>{t("leave-comment")}</DialogTitle>
</DialogHeader>
{status == "2"
? files?.map((file, index) => (
<div
key={file.id}
className="flex flex-row gap-2 items-center"
>
<img src={file.url} className="w-[200px]" />
<div className="flex flex-col gap-2 w-full">
<div className="flex justify-between text-sm">
{file.fileName}
<a
onClick={() =>
handleDeleteFileApproval(file.id)
}
>
<Icon icon="humbleicons:times" color="red" />
</a>
<div className="flex flex-col gap-2 max-h-[208px] md:max-h-[312px] overflow-y-auto">
{status == "2"
? files?.map((file, index) => (
<div
key={file.id}
className="flex flex-row gap-5 items-center w-full"
>
<div className="w-[200px] h-[100px] flex justify-center items-center">
<img
key={index}
alt={`files-${index + 1}`}
src={file.url}
onLoad={(e) => handleImageLoad(e, index)}
className={`h-[100px] object-cover ${
portraitMap[index] ? "w-auto" : "!w-[200px]"
}`}
/>
</div>
{isUserMabesApprover && (
<div className="flex flex-row gap-2">
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
value="all"
checked={filePlacements[index]?.includes(
"all"
)}
onCheckedChange={(e) =>
setupPlacement(index, "all", Boolean(e))
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
{t("all")}
</label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"mabes"
)}
onCheckedChange={(e) =>
setupPlacement(index, "mabes", Boolean(e))
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Nasional
</label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"polda"
)}
onCheckedChange={(e) =>
setupPlacement(index, "polda", Boolean(e))
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Wilayah
</label>
{wilayahPublish.polda && (
<UnitMapping
unit="Polda"
isDetail={false}
sendDataToParent={(data: any) =>
setSelectedPolda(data)
<div className="flex flex-col gap-2 w-full">
<div className="flex justify-between text-sm">
{file.fileName}
<a
onClick={() =>
handleDeleteFileApproval(file.id)
}
>
<Icon icon="humbleicons:times" color="red" />
</a>
</div>
{isUserMabesApprover && (
<div className="flex flex-row gap-2">
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
value="all"
checked={filePlacements[index]?.includes(
"all"
)}
onCheckedChange={(e) =>
setupPlacement(index, "all", Boolean(e))
}
/>
)}
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"international"
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
{t("all")}
</label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"mabes"
)}
onCheckedChange={(e) =>
setupPlacement(
index,
"mabes",
Boolean(e)
)
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Nasional
</label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"polda"
)}
onCheckedChange={(e) =>
setupPlacement(
index,
"polda",
Boolean(e)
)
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Wilayah
</label>
{wilayahPublish.polda && (
<UnitMapping
unit="Polda"
isDetail={false}
sendDataToParent={(data: any) =>
setSelectedPolda(data)
}
/>
)}
onCheckedChange={(e) =>
setupPlacement(
index,
"international",
Boolean(e)
)
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Internasional
</label>
</div>
<div className="flex items-center space-x-2">
<Checkbox
id="terms"
checked={filePlacements[index]?.includes(
"international"
)}
onCheckedChange={(e) =>
setupPlacement(
index,
"international",
Boolean(e)
)
}
/>
<label
htmlFor="terms"
className="text-xs font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
>
Internasional
</label>
</div>
</div>
</div>
)}
)}
</div>
</div>
</div>
))
: ""}
))
: ""}
</div>
<div className="flex flex-col gap-4">
<Textarea
placeholder="Type your message here."
@ -821,7 +858,8 @@ export default function FormImageDetail() {
</div>
{status == "3" || status == "4" ? (
<div className="flex flex-row gap-2">
<Badge
<Button
size="sm"
color={
description === "Kualitas media kurang baik"
? "primary"
@ -833,9 +871,10 @@ export default function FormImageDetail() {
}
>
Kualitas media kurang baik
</Badge>
</Button>
<Badge
<Button
size="sm"
color={
description === "Deskripsi kurang lengkap"
? "primary"
@ -847,8 +886,9 @@ export default function FormImageDetail() {
}
>
Deskripsi kurang lengkap
</Badge>
<Badge
</Button>
<Button
size="sm"
color={
description === "Judul kurang tepat"
? "primary"
@ -858,11 +898,12 @@ export default function FormImageDetail() {
onClick={() => setDescription("Judul kurang tepat")}
>
Judul kurang tepat
</Badge>
</Button>
</div>
) : (
<div className="flex flex-row gap-2">
<Badge
<Button
size="sm"
color={
description === "Konten sangat bagus"
? "primary"
@ -872,8 +913,9 @@ export default function FormImageDetail() {
onClick={() => setDescription("Konten sangat bagus")}
>
Konten sangat bagus
</Badge>
<Badge
</Button>
<Button
size="sm"
color={
description === "Konten menarik"
? "primary"
@ -883,31 +925,34 @@ export default function FormImageDetail() {
onClick={() => setDescription("Konten menarik")}
>
Konten menarik
</Badge>
</Button>
</div>
)}
<DialogFooter>
<Button
type="button"
color="primary"
onClick={() => submit()}
>
{t("submit")}
</Button>
<Button
type="button"
color="destructive"
onClick={() => {
setModalOpen(false);
}}
>
{t("cancel")}
</Button>
<div className="flex flex-row gap-2 justify-end">
{" "}
<Button
type="button"
color="primary"
onClick={() => submit()}
>
{t("submit")}
</Button>
<Button
type="button"
color="destructive"
onClick={() => {
setModalOpen(false);
}}
>
{t("cancel")}
</Button>
</div>
</DialogFooter>
</DialogContent>
</Dialog>
</Card>
{Number(detail?.needApprovalFromLevel) == Number(userLevelId) ? (
{(Number(detail?.needApprovalFromLevel) == Number(userLevelId)) || (detail?.isInternationalMedia == true && detail?.isForwardFromNational == true && Number(detail?.statusId) == 1) ? (
Number(detail?.uploadedById) == Number(userId) ? (
""
) : (

110
components/form/media-tracking/setting-tracking-detail-form.tsx Normal file
View File

@ -0,0 +1,110 @@
"use client";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { z } from "zod";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { Checkbox } from "@/components/ui/checkbox";
import { Fragment, useEffect, useState } from "react";
import { useTranslations } from "next-intl";
import { Card } from "@/components/ui/card";
const wilayahList = [
{ id: "mabes", label: "Mabes" },
{ id: "polda", label: "Polda" },
{ id: "satker", label: "Satker" },
];
const jumlahList = [5, 10, 15, 20, 25, 30];
export default function DetailSettingTracking() {
const t = useTranslations("Menu");
const [isOpen, setIsOpen] = useState(false);
const form = useForm({
defaultValues: {
wilayah: [] as string[],
jumlah: [] as number[],
},
});
const onSubmit = (values: any) => {
console.log("Submitted values:", values);
setIsOpen(false);
};
return (
<>
<Card className="px-3 py-3">
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
{/* Wilayah */}
<FormField
control={form.control}
name="wilayah"
render={({ field }) => (
<FormItem>
<FormLabel>Wilayah</FormLabel>
<div className="flex gap-4">
{wilayahList.map((item) => (
<div key={item.id} className="flex items-center gap-2">
<Checkbox
checked={field.value.includes(item.id)}
onCheckedChange={(checked) => {
const updated = checked
? [...field.value, item.id]
: field.value.filter((val) => val !== item.id);
field.onChange(updated);
}}
/>
<label className="text-sm">{item.label}</label>
</div>
))}
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="jumlah"
render={({ field }) => (
<FormItem>
<FormLabel>Jumlah Tracking Berita Harian</FormLabel>
<div className="flex gap-4 flex-wrap">
<Input
size={"md"}
type="number"
placeholder="Masukan Nama Iklan"
/>
</div>
</FormItem>
)}
/>
<div className="flex items-end justify-end">
<Button type="submit">Tambah Setting</Button>
</div>
</form>
</Form>
</Card>
</>
);
}

110
components/form/media-tracking/setting-tracking-form.tsx Normal file
View File

@ -0,0 +1,110 @@
"use client";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { z } from "zod";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { Checkbox } from "@/components/ui/checkbox";
import { Fragment, useEffect, useState } from "react";
import { useTranslations } from "next-intl";
import { Card } from "@/components/ui/card";
const wilayahList = [
{ id: "mabes", label: "Mabes" },
{ id: "polda", label: "Polda" },
{ id: "satker", label: "Satker" },
];
const jumlahList = [5, 10, 15, 20, 25, 30];
export default function CreateSettingTracking() {
const t = useTranslations("Menu");
const [isOpen, setIsOpen] = useState(false);
const form = useForm({
defaultValues: {
wilayah: [] as string[],
jumlah: [] as number[],
},
});
const onSubmit = (values: any) => {
console.log("Submitted values:", values);
setIsOpen(false);
};
return (
<>
<Card className="px-3 py-3">
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
{/* Wilayah */}
<FormField
control={form.control}
name="wilayah"
render={({ field }) => (
<FormItem>
<FormLabel>Wilayah</FormLabel>
<div className="flex gap-4">
{wilayahList.map((item) => (
<div key={item.id} className="flex items-center gap-2">
<Checkbox
checked={field.value.includes(item.id)}
onCheckedChange={(checked) => {
const updated = checked
? [...field.value, item.id]
: field.value.filter((val) => val !== item.id);
field.onChange(updated);
}}
/>
<label className="text-sm">{item.label}</label>
</div>
))}
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="jumlah"
render={({ field }) => (
<FormItem>
<FormLabel>Jumlah Tracking Berita Harian</FormLabel>
<div className="flex gap-4 flex-wrap">
<Input
size={"md"}
type="number"
placeholder="Masukan Nama Iklan"
/>
</div>
</FormItem>
)}
/>
<div className="flex items-end justify-end">
<Button type="submit">Tambah Setting</Button>
</div>
</form>
</Form>
</Card>
</>
);
}

110
components/form/media-tracking/setting-tracking-update-form.tsx Normal file
View File

@ -0,0 +1,110 @@
"use client";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import { z } from "zod";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {
Form,
FormControl,
FormDescription,
FormField,
FormItem,
FormLabel,
FormMessage,
} from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { Checkbox } from "@/components/ui/checkbox";
import { Fragment, useEffect, useState } from "react";
import { useTranslations } from "next-intl";
import { Card } from "@/components/ui/card";
const wilayahList = [
{ id: "mabes", label: "Mabes" },
{ id: "polda", label: "Polda" },
{ id: "satker", label: "Satker" },
];
const jumlahList = [5, 10, 15, 20, 25, 30];
export default function UpdateSettingTracking() {
const t = useTranslations("Menu");
const [isOpen, setIsOpen] = useState(false);
const form = useForm({
defaultValues: {
wilayah: [] as string[],
jumlah: [] as number[],
},
});
const onSubmit = (values: any) => {
console.log("Submitted values:", values);
setIsOpen(false);
};
return (
<>
<Card className="px-3 py-3">
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
{/* Wilayah */}
<FormField
control={form.control}
name="wilayah"
render={({ field }) => (
<FormItem>
<FormLabel>Wilayah</FormLabel>
<div className="flex gap-4">
{wilayahList.map((item) => (
<div key={item.id} className="flex items-center gap-2">
<Checkbox
checked={field.value.includes(item.id)}
onCheckedChange={(checked) => {
const updated = checked
? [...field.value, item.id]
: field.value.filter((val) => val !== item.id);
field.onChange(updated);
}}
/>
<label className="text-sm">{item.label}</label>
</div>
))}
</div>
</FormItem>
)}
/>
<FormField
control={form.control}
name="jumlah"
render={({ field }) => (
<FormItem>
<FormLabel>Jumlah Tracking Berita Harian</FormLabel>
<div className="flex gap-4 flex-wrap">
<Input
size={"md"}
type="number"
placeholder="Masukan Nama Iklan"
/>
</div>
</FormItem>
)}
/>
<div className="flex items-end justify-end">
<Button type="submit">Tambah Setting</Button>
</div>
</form>
</Form>
</Card>
</>
);
}

8
components/form/task/task-detail-form.tsx
View File

@ -1361,20 +1361,22 @@ export default function FormTaskDetail() {
<div className="mt-4">
<Label>Link Url</Label>
{urlInputs.map((url: any, index: any) => (
<div
<Link
key={url.id}
href={url}
target="_blank"
className="flex items-center gap-2 mt-2"
>
<input
type="url"
className="border rounded p-2 w-full"
className="border rounded p-2 w-full cursor-pointer"
value={url}
// onChange={(e) =>
// handleLinkChange(index, e.target.value)
// }
placeholder={`Masukkan link berita ${index + 1}`}
/>
</div>
</Link>
))}
</div>
</div>

46
components/form/task/task-form.tsx
View File

@ -36,7 +36,7 @@ import { ChevronDown, ChevronUp, Trash2 } from "lucide-react";
import { AudioRecorder } from "react-audio-voice-recorder";
import FileUploader from "@/components/form/shared/file-uploader";
import { Upload } from "tus-js-client";
import { error } from "@/config/swal";
import { close, error } from "@/config/swal";
import { getCsrfToken } from "@/service/auth";
import { loading } from "@/lib/swal";
import { useTranslations } from "next-intl";
@ -320,37 +320,42 @@ export default function FormTask() {
loading();
if (imageFiles?.length == 0) {
setIsImageUploadFinish(true);
} else {
imageFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "1", "0");
});
}
imageFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "1", "0");
});
if (videoFiles?.length == 0) {
setIsVideoUploadFinish(true);
} else {
videoFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "2", "0");
});
}
videoFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "2", "0");
});
if (textFiles?.length == 0) {
setIsTextUploadFinish(true);
} else {
textFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "3", "0");
});
}
textFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "3", "0");
});
if (audioFiles?.length == 0) {
setIsAudioUploadFinish(true);
} else {
audioFiles.map(async (item: FileWithPreview, index: number) => {
await uploadResumableFile(
index,
String(id),
item, // Use .file to access the actual File object
"4",
"0" // Optional: Replace with actual duration if available
);
});
}
audioFiles.map(async (item: FileWithPreview, index: number) => {
await uploadResumableFile(
index,
String(id),
item, // Use .file to access the actual File object
"4",
"0" // Optional: Replace with actual duration if available
);
});
close();
};
const onSubmit = (data: TaskSchema) => {
@ -479,7 +484,8 @@ export default function FormTask() {
successTodo();
if (fileTypeId == "1") {
setIsImageUploadFinish(true);
} else if (fileTypeId == "2") {
}
if (fileTypeId == "2") {
setIsVideoUploadFinish(true);
}
if (fileTypeId == "3") {

7
components/form/ticketing/info-lainnya-types.ts
View File

@ -1,4 +1,6 @@
export type DetailTicket = {
title: string;
description: string;
commentFromUserId: string;
assignedTeams: string;
message: string;
@ -19,7 +21,10 @@ export type DetailTicket = {
feedUrl: string;
recommendationName: string;
link: string;
uploadFiles?: string;
uploadFiles?: {
fileUrl: string;
fileName: string;
}[];
description: string;
};
};

78
components/form/ticketing/info-lainnya.tsx
View File

@ -1,4 +1,3 @@
// InfoLainnyaModal.tsx
import {
Dialog,
DialogContent,
@ -6,6 +5,7 @@ import {
DialogTitle,
} from "@/components/ui/dialog";
import { DetailTicket } from "./info-lainnya-types";
import { useState } from "react";
interface InfoLainnyaModalProps {
open: boolean;
@ -18,6 +18,34 @@ export default function InfoLainnyaModal({
onClose,
data,
}: InfoLainnyaModalProps) {
const files = data?.uploadFiles || [];
const [currentIndex, setCurrentIndex] = useState(0);
const handlePrev = () => {
setCurrentIndex((prev) => (prev > 0 ? prev - 1 : prev));
};
const handleNext = () => {
setCurrentIndex((prev) => (prev < files.length - 1 ? prev + 1 : prev));
};
const currentFile = files[currentIndex];
const isImage = (fileUrl: string) =>
/\.(jpeg|jpg|png|gif|bmp|webp)$/i.test(fileUrl.toLowerCase());
const getIframeUrl = (fileUrl: string): string => {
const lower = fileUrl.toLowerCase();
// Dokumen ditampilkan melalui Google Docs Viewer
if (/\.(pdf|doc|docx|xls|xlsx|ppt|pptx)$/i.test(lower)) {
return `https://docs.google.com/viewer?url=${encodeURIComponent(
fileUrl
)}&embedded=true`;
}
return fileUrl;
};
return (
<Dialog open={open} onOpenChange={onClose}>
<DialogContent size="md">
@ -41,11 +69,11 @@ export default function InfoLainnyaModal({
<div>:{data?.recommendationName}</div>
<div className="font-medium">Link Pendukung</div>
<div>
<div className="flex">
:
<a
href={data?.link}
className="text-blue-600"
className="text-blue-600 flex w-[100px]"
target="_blank"
rel="noopener noreferrer"
>
@ -53,15 +81,43 @@ export default function InfoLainnyaModal({
</a>
</div>
{data?.uploadFiles && (
{files.length > 0 && (
<>
<div className="font-medium">Lampiran</div>
<div>
<img
src={data?.uploadFiles}
alt="Lampiran"
className="max-w-xs"
/>
<div className="font-medium col-span-2">Lampiran</div>
<div className="col-span-2 flex flex-col items-center space-y-2 w-full">
{isImage(currentFile?.fileUrl || "") ? (
<img
src={currentFile?.fileUrl}
alt={`Lampiran ${currentIndex + 1}`}
className="max-h-[300px] w-auto object-contain border rounded"
/>
) : (
<iframe
src={getIframeUrl(currentFile?.fileUrl || "")}
title={`Lampiran ${currentIndex + 1}`}
className="w-full max-w-2xl h-[300px] border rounded"
onError={(e) => {
(e.target as HTMLIFrameElement).style.display = "none";
}}
/>
)}
<div className="flex gap-2">
<button
onClick={handlePrev}
disabled={currentIndex === 0}
className="px-2 py-1 border rounded disabled:opacity-50"
>
&lt;
</button>
<button
onClick={handleNext}
disabled={currentIndex === files.length - 1}
className="px-2 py-1 border rounded disabled:opacity-50"
>
&gt;
</button>
</div>
</div>
</>
)}

1
components/form/ticketing/ticketing-detail-form.tsx
View File

@ -588,6 +588,7 @@ export default function FormDetailTicketing() {
<input
type="checkbox"
checked={selectedOperator.includes(op.value)}
disabled
onChange={(e) => {
if (e.target.checked) {
setSelectedOperator((prev) => [

3
components/landing-page/header-banner-satker.tsx
View File

@ -22,6 +22,7 @@ import Image from "next/image";
const HeaderBannerSatker = () => {
const router = useRouter();
const params = useParams();
const locale = params?.locale;
const satkerName: any = params?.satker_name;
const asPath: any = usePathname();
const [content, setContent] = useState([]);
@ -50,7 +51,7 @@ const HeaderBannerSatker = () => {
);
var data = res?.data?.data?.content;
if (data) {
const resStatic = await listStaticBanner(satkerName, false);
const resStatic = await listStaticBanner(satkerName, locale == "en");
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;
media.fileTypeId = media.fileType?.id;

3
components/landing-page/header-banner.tsx
View File

@ -12,6 +12,7 @@ import { useRouter } from "@/i18n/routing";
const HeaderBanner = () => {
const router = useRouter();
const params = useParams();
const locale = params?.locale;
const poldaName: any = params?.polda_name;
const [content, setContent] = useState([]);
const [isBannerLoading, setIsBannerLoading] = useState(true);
@ -31,7 +32,7 @@ const HeaderBanner = () => {
const res = await listData("1", "", "", 5, 0, "createdAt", "", "", poldaName);
var data = res?.data?.data?.content;
if (data) {
const resStatic = await listStaticBanner(poldaName, false);
const resStatic = await listStaticBanner(poldaName, locale == "en");
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;
media.fileTypeId = media.fileType?.id;

6
components/landing-page/hero-new-polda.tsx
View File

@ -69,7 +69,7 @@ const HeroModal = ({ onClose, group, poldaName, satkerName }: HeroModalProps) =>
const initFetch = async () => {
if (group === "polda" && poldaName && String(poldaName).length > 1) {
const response = await listStaticBanner(poldaName);
const response = await listStaticBanner(poldaName, locale == "en");
const banners =
response?.data?.data?.map((item: any) => {
@ -245,13 +245,13 @@ const HeroNewPolda = (props: { group?: string }) => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
setHeroData(data);
if (data && props.group === "polda" && poldaName && String(poldaName)?.length > 1) {
const resStatic = await listStaticBanner(poldaName);
const resStatic = await listStaticBanner(poldaName, locale == "en");
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;

6
components/landing-page/hero-new-satker.tsx
View File

@ -69,7 +69,7 @@ const HeroModal = ({ onClose, group, poldaName, satkerName }: HeroModalProps) =>
const initFetch = async () => {
if (group === "satker" && satkerName && String(satkerName).length > 1) {
const response = await listStaticBanner(satkerName);
const response = await listStaticBanner(satkerName, locale == "en");
const banners =
response?.data?.data?.map((item: any) => {
@ -245,13 +245,13 @@ const HeroNewSatker = (props: { group?: string }) => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
setHeroData(data);
if (data && props.group === "satker" && satkerName && String(satkerName)?.length > 1) {
const resStatic = await listStaticBanner(satkerName);
const resStatic = await listStaticBanner(satkerName, locale == "en");
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;

8
components/landing-page/hero-new.tsx
View File

@ -100,7 +100,8 @@ const HeroModal = ({
? poldaName
: group === "satker" && satkerName && String(satkerName)?.length > 1
? "satker-" + satkerName
: ""
: "",
locale == "en"
);
const banners =
@ -295,7 +296,7 @@ const HeroNew = (props: { group?: string }) => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
setHeroData(response?.data?.data?.content);
@ -309,7 +310,8 @@ const HeroNew = (props: { group?: string }) => {
satkerName &&
String(satkerName)?.length > 1
? "satker-" + satkerName
: ""
: "",
locale == "en"
);
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;

9
components/landing-page/hero.tsx
View File

@ -79,11 +79,11 @@ const HeroModal = ({ onClose }: { onClose: () => void }) => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
if (data) {
const resStatic = await listStaticBanner();
const resStatic = await listStaticBanner("", locale == "en");
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;
media.fileTypeId = media.fileType?.id;
@ -287,7 +287,7 @@ const Hero = (props: { group?: string }) => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
setHeroData(response?.data?.data?.content);
@ -301,7 +301,8 @@ const Hero = (props: { group?: string }) => {
satkerName &&
String(satkerName)?.length > 1
? "satker-" + satkerName
: ""
: "",
locale == "en"
);
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;

7
components/landing-page/news-tickers.tsx
View File

@ -5,14 +5,19 @@ import { formatDateToIndonesian, textEllipsis } from "@/utils/globals";
import { useEffect, useState } from "react";
import { Icon } from "../ui/icon";
import { useTranslations } from "next-intl";
import { useParams } from "next/navigation";
export default function NewsTicker() {
const [article, setArticle] = useState<any>([]);
const [currentNewsIndex, setCurrentNewsIndex] = useState<any>(0);
const [animate, setAnimate] = useState(false);
const params = useParams();
const locale = params?.locale;
const t = useTranslations("LandingPage");
useEffect(() => {
async function getArticle() {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
setArticle(response?.data?.data?.content);
}
getArticle();

2
components/landing-page/scrollable-content-polda.tsx
View File

@ -43,7 +43,7 @@ const ScrollableContentPolda = () => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;

2
components/landing-page/scrollable-content-satker.tsx
View File

@ -50,7 +50,7 @@ const ScrollableContentSatker = () => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;

4
components/landing-page/search-section-new.tsx
View File

@ -22,6 +22,7 @@ const ScrollableContent = () => {
const locale = params?.locale;
const t = useTranslations("LandingPage");
const [content, setContent] = useState<any>();
useEffect(() => {
async function fetchCategories() {
const url = "https://netidhub.com/api/csrf";
@ -45,12 +46,13 @@ const ScrollableContent = () => {
}, []);
const initFetch = async () => {
const response = await getHeroData();
const response = await getHeroData(locale == "en");
console.log(response);
let data = response?.data?.data?.content;
setContent(data);
};
return (
<>
<div className="">

22
components/partials/auth/login-form.tsx
View File

@ -149,7 +149,6 @@ const LoginForm = () => {
console.log("PROFILE : ", profile?.data?.data);
if (
profile?.data?.data?.isInternational == true ||
profile?.data?.data?.isActive == false ||
profile?.data?.data?.isDelete == true
) {
@ -225,6 +224,8 @@ const LoginForm = () => {
Number(profile?.data?.data?.roleId) == 10 ||
Number(profile?.data?.data?.roleId) == 11 ||
Number(profile?.data?.data?.roleId) == 12 ||
Number(profile?.data?.data?.roleId) == 14 ||
Number(profile?.data?.data?.roleId) == 15 ||
Number(profile?.data?.data?.roleId) == 18 ||
Number(profile?.data?.data?.roleId) == 19
) {
@ -281,16 +282,17 @@ const LoginForm = () => {
return false;
}
const msg = response?.data?.message;
onSubmit(data);
if (msg == "Continue to setup email") {
setStep(2);
} else if (msg == "Email is valid and OTP has been sent") {
setStep(3);
} else if (msg == "Username & password valid") {
onSubmit(data);
} else {
error("Username / password incorrect");
}
// if (msg == "Continue to setup email") {
// setStep(2);
// } else if (msg == "Email is valid and OTP has been sent") {
// setStep(3);
// } else if (msg == "Username & password valid") {
// onSubmit(data);
// } else {
// error("Username / password incorrect");
// }
// else {
// setStep(1);
// }

143
components/table/custom-pagination.tsx Normal file
View File

@ -0,0 +1,143 @@
"use client";
import {
Pagination,
PaginationContent,
PaginationEllipsis,
PaginationItem,
PaginationLink,
PaginationNext,
PaginationPrevious,
} from "@/components/ui/pagination";
import { useEffect, useState } from "react";
export default function CustomPagination(props: {
totalPage: number;
onPageChange: (data: number) => void;
}) {
const { totalPage, onPageChange } = props;
const [page, setPage] = useState(1);
useEffect(() => {
onPageChange(page);
}, [page]);
const renderPageNumbers = () => {
const pageNumbers = [];
const halfWindow = Math.floor(5 / 2);
let startPage = Math.max(2, page - halfWindow);
let endPage = Math.min(totalPage - 1, page + halfWindow);
if (endPage - startPage + 1 < 5) {
if (page <= halfWindow) {
endPage = Math.min(
totalPage,
endPage + (5 - (endPage - startPage + 1))
);
} else if (page + halfWindow >= totalPage) {
startPage = Math.max(1, startPage - (5 - (endPage - startPage + 1)));
}
}
if (startPage === endPage) {
return "";
}
for (let i = startPage; i <= endPage; i++) {
pageNumbers.push(
<PaginationItem key={i} onClick={() => setPage(i)}>
<PaginationLink isActive={page === i}>{i}</PaginationLink>
</PaginationItem>
);
}
return pageNumbers;
};
return (
<Pagination>
<PaginationContent>
{page - 10 >= 1 && (
<PaginationItem>
<PaginationLink
onClick={() => (page > 10 ? setPage(page - 10) : setPage(1))}
>
{/* <DoubleArrowLeftIcon /> */}
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M18.41 7.41L17 6l-6 6l6 6l1.41-1.41L13.83 12zm-6 0L11 6l-6 6l6 6l1.41-1.41L7.83 12z"
/>
</svg>
</PaginationLink>
</PaginationItem>
)}
<PaginationItem className="hidden md:block">
<PaginationPrevious
onClick={() => (page > 1 ? setPage(page - 1) : "")}
/>
</PaginationItem>
<PaginationItem>
<PaginationLink onClick={() => setPage(1)} isActive={page === 1}>
{1}
</PaginationLink>
</PaginationItem>
{page > 4 && (
<PaginationItem>
<PaginationEllipsis onClick={() => setPage(page - 1)} />
</PaginationItem>
)}
{renderPageNumbers()}
{page < totalPage - 3 && (
<PaginationItem>
<PaginationEllipsis onClick={() => setPage(page + 1)} />
</PaginationItem>
)}
{totalPage > 1 && (
<PaginationItem>
<PaginationLink
onClick={() => setPage(totalPage)}
isActive={page === totalPage}
>
{totalPage}
</PaginationLink>
</PaginationItem>
)}
<PaginationItem className="hidden md:block">
<PaginationNext
onClick={() => (page < totalPage ? setPage(page + 1) : "")}
/>
</PaginationItem>
{page + 10 <= totalPage && totalPage > 9 && (
<PaginationItem>
<PaginationLink
onClick={() =>
page < totalPage - 10 ? setPage(page + 10) : setPage(totalPage)
}
>
{/* <DoubleArrowRightIcon /> */}
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
>
<path
fill="currentColor"
d="M5.59 7.41L7 6l6 6l-6 6l-1.41-1.41L10.17 12zm6 0L13 6l6 6l-6 6l-1.41-1.41L16.17 12z"
/>
</svg>
</PaginationLink>
</PaginationItem>
)}
</PaginationContent>
</Pagination>
);
}

6
lib/menus.ts
View File

@ -38,7 +38,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
let menusSelected = <any>[];
if (Number(roleId) == 3 && Number(levelNumber) == 1) {
if ((Number(roleId) == 3 || Number(roleId) == 14) && Number(levelNumber) == 1) {
menusSelected = [
{
groupLabel: t("apps"),
@ -1700,7 +1700,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
},
];
} else if (
(Number(roleId) == 3 || Number(roleId) == 4) &&
(Number(roleId) == 3 || Number(roleId) == 4 || Number(roleId) == 14 || Number(roleId) == 15) &&
Number(levelNumber) == 2
) {
if (Number(userLevelId) != 761) {
@ -2158,7 +2158,7 @@ export function getMenuList(pathname: string, t: any): Group[] {
];
}
} else if (
(Number(roleId) == 3 || Number(roleId) == 4) &&
(Number(roleId) == 3 || Number(roleId) == 4 || Number(roleId) == 14 || Number(roleId) == 15) &&
Number(levelNumber) == 3
) {
if (Number(userParentLevelId) != 761) {

27
service/content/content.ts
View File

@ -47,22 +47,23 @@ export async function listDataAll(
}
export async function listDataImage(
size: any,
page: any,
isForSelf: any,
isApproval: any,
categoryFilter: any,
statusFilter: any,
needApprovalFromLevel: any,
creator: any,
source: any,
startDate: any,
endDate: any,
size: any = "",
page: any = "",
isForSelf: any = "",
isApproval: any = "",
categoryFilter: any = "",
statusFilter: any = "",
needApprovalFromLevel: any = "",
creator: any = "",
source: any = "",
startDate: any = "",
endDate: any = "",
title: string = "",
creatorGroup: string = ""
creatorGroup: string = "",
isInt: boolean = false
) {
return await httpGetInterceptor(
`media/list?enablePage=1&size=${size}&sortBy=createdAt&sort=desc&page=${page}&typeId=1&isForSelf=${isForSelf}&isApproval=${isApproval}&categoryId=${categoryFilter}&statusId=${statusFilter}&needApprovalFromLevel=${needApprovalFromLevel}&creatorUserLevelName=${source}&creatorName=${creator}&startDate=${startDate}&endDate=${endDate}&title=${title}&creatorGroupLevelName=${creatorGroup}`
`media/list?enablePage=1&size=${size}&sortBy=createdAt&sort=desc&page=${page}&typeId=1&isForSelf=${isForSelf}&isApproval=${isApproval}&categoryId=${categoryFilter}&statusId=${statusFilter}&creatorUserLevelName=${source}&creatorName=${creator}&startDate=${startDate}&endDate=${endDate}&title=${title}&creatorGroupLevelName=${creatorGroup}&needApprovalFromLevel=${needApprovalFromLevel}&isInt=${isInt}`
);
}

4
service/landing/landing.ts
View File

@ -31,9 +31,9 @@ export async function getCsrfToken() {
// }
}
export async function getHeroData() {
export async function getHeroData(isInt: Boolean = false) {
return await httpGetInterceptor(
`media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=5&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=`
`media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=5&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=&isInt=${isInt}`
);
}