diff --git a/app/[locale]/(protected)/admin/add-experts/component/column.tsx b/app/[locale]/(protected)/admin/add-experts/component/column.tsx index 309e8f46..c2281486 100644 --- a/app/[locale]/(protected)/admin/add-experts/component/column.tsx +++ b/app/[locale]/(protected)/admin/add-experts/component/column.tsx @@ -10,27 +10,7 @@ import { DropdownMenuItem, } from "@/components/ui/dropdown-menu"; import { Button } from "@/components/ui/button"; -import { Badge } from "@/components/ui/badge"; -import { - formatDateToIndonesian, - getOnlyDate, - htmlToString, -} from "@/utils/globals"; -import { Link, useRouter } from "@/i18n/routing"; -import { - Accordion, - AccordionContent, - AccordionItem, - AccordionTrigger, -} from "@/components/ui/accordion"; -import { - Dialog, - DialogContent, - DialogHeader, - DialogTitle, - DialogTrigger, -} from "@/components/ui/dialog"; -import { Collapsible, CollapsibleContent } from "@/components/ui/collapsible"; +import { Link } from "@/components/navigation"; const columns: ColumnDef[] = [ { @@ -47,24 +27,50 @@ const columns: ColumnDef[] = [ { accessorKey: "address", header: "Wilayah", - cell: ({ row }) => {row.getValue("address")}, + cell: ({ row }) => MABES, + }, + { + accessorKey: "userRolePlacements", + header: "Posisi", + cell: ({ row }) => { + const placements = row.original.userRolePlacements || []; + const placement = placements.find( + (p: any) => p.roleId === 11 || p.roleId === 12 + ); + + let posisi = "-"; + if (placement) { + posisi = placement.roleId === 11 ? "Koorkurator" : "Kurator"; + } + + return {posisi}; + }, }, { accessorKey: "role.name", header: "Bidang Keahlian", - cell: ({ row }) => {row.original.role?.name ?? "-"}, + cell: ({ row }) => ( + + {row.original.userProfilesAdditional?.userCompetency?.name ?? "-"} + + ), }, { - accessorKey: "experience", + accessorKey: "userExperienceId", header: "Pengalaman", - cell: ({ row }) => {row.getValue("experience")}, - }, + cell: ({ row }) => { + const experienceId = + row.original.userProfilesAdditional?.userExperienceId; - { - accessorKey: "experience", - header: "Posisi", - cell: ({ row }) => {row.getValue("experience")}, + const experienceMap: Record = { + 1: "Akademisi", + 2: "Praktisi", + 3: "Akademisi + Praktisi", + }; + + return {experienceMap[experienceId] ?? "-"}; + }, }, { @@ -84,8 +90,25 @@ const columns: ColumnDef[] = [ - - Detail + + + + 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 diff --git a/app/[locale]/(protected)/admin/add-experts/create/page.tsx b/app/[locale]/(protected)/admin/add-experts/create/page.tsx index 994cd5eb..ca70af09 100644 --- a/app/[locale]/(protected)/admin/add-experts/create/page.tsx +++ b/app/[locale]/(protected)/admin/add-experts/create/page.tsx @@ -130,6 +130,7 @@ export default function AddExpertForm() { userCompetencyId: data.skills, userExperienceId: data.experiences, companyName: data.company, + isAdmin: true, }; loading(); @@ -272,8 +273,9 @@ export default function AddExpertForm() { Username @@ -290,7 +292,7 @@ export default function AddExpertForm() { @@ -306,7 +308,7 @@ export default function AddExpertForm() { @@ -470,14 +472,14 @@ export default function AddExpertForm() { )} ))} - + */}
diff --git a/app/[locale]/(protected)/admin/add-experts/detail/[id]/page.tsx b/app/[locale]/(protected)/admin/add-experts/detail/[id]/page.tsx new file mode 100644 index 00000000..3a5aae33 --- /dev/null +++ b/app/[locale]/(protected)/admin/add-experts/detail/[id]/page.tsx @@ -0,0 +1,15 @@ +import SiteBreadcrumb from "@/components/site-breadcrumb"; +import FormDetailExperts from "@/components/form/experts/experts-detail"; + +const ExpertsDetailPage = async () => { + return ( +
+ +
+ +
+
+ ); +}; + +export default ExpertsDetailPage; diff --git a/app/[locale]/(protected)/admin/add-experts/update/[id]/page.tsx b/app/[locale]/(protected)/admin/add-experts/update/[id]/page.tsx new file mode 100644 index 00000000..3af56ee2 --- /dev/null +++ b/app/[locale]/(protected)/admin/add-experts/update/[id]/page.tsx @@ -0,0 +1,597 @@ +"use client"; +import SiteBreadcrumb from "@/components/site-breadcrumb"; +import { Button } from "@/components/ui/button"; +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, +} from "@/components/ui/form"; +import { Input } from "@/components/ui/input"; +import { z } from "zod"; +import { useForm } from "react-hook-form"; +import { zodResolver } from "@hookform/resolvers/zod"; +import withReactContent from "sweetalert2-react-content"; +import Swal from "sweetalert2"; +import { useRouter } from "@/i18n/routing"; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "@/components/ui/select"; +import { useEffect, useState } from "react"; +import { + AdministrationLevelList, + getListCompetencies, + getListExperiences, + getUserById, + saveUserInternal, + saveUserRolePlacements, +} from "@/service/management-user/management-user"; +import { loading } from "@/config/swal"; +import { Eye, EyeOff } from "lucide-react"; +import { useParams } from "next/navigation"; + +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", + }), + skills: z.string({ + required_error: "Required", + }), + experiences: z.string({ + required_error: "Required", + }), + company: z.string({ + required_error: "Required", + }), +}); + +export type Placements = { + index: number; + roleId?: string; + userLevelId?: number; +}; + +interface Detail { + id: string; + fullname: string; + username: string; + phoneNumber: string; + email: string; + birthPlace: string; + birthDate: string; + education: string; + career: string; + expertise: string; + experience: string; + position: string; + region: string; + cvUrl: string; + photoUrl: string; + isActive: boolean; + userProfilesAdditional?: { + companyName: string; + userExperienceId: any; + userCompetency?: { + id: number; + name: string; + isActive: boolean; + createdAt: string; + }; + }; +} + +export default function UpdateExpertForm() { + const MySwal = withReactContent(Swal); + const router = useRouter(); + const params = useParams(); + const id = params?.id; + const [detail, setDetail] = useState(null); + 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 [passwordType, setPasswordType] = useState("password"); + const [showPassword, setShowPassword] = useState(false); + + useEffect(() => { + getDataAdditional(); + }, []); + + useEffect(() => { + async function initState() { + if (id) { + const response = await getUserById(String(id)); + const details = response?.data?.data; + setDetail(details); + } + if (detail?.userProfilesAdditional?.companyName) { + form.setValue("company", detail.userProfilesAdditional.companyName); + } + + if (detail?.userProfilesAdditional?.userCompetency?.id) { + form.setValue( + "skills", + String(detail.userProfilesAdditional.userCompetency.id) + ); + } + + if (detail?.userProfilesAdditional?.userExperienceId) { + form.setValue( + "experiences", + String(detail.userProfilesAdditional.userExperienceId) + ); + } + } + initState(); + }, [id]); + + if (!detail) return
Loading...
; + + const togglePasswordType = () => { + setPasswordType((prevType) => + prevType === "password" ? "text" : "password" + ); + }; + + const roleSelection = [ + { + id: "11", + name: "Koor Kurator", + }, + { + id: "12", + name: "Kurator", + }, + ]; + + const onSubmit = async (data: z.infer) => { + MySwal.fire({ + title: "Simpan Data", + text: "Apakah Anda yakin ingin menyimpan data ini?", + icon: "warning", + showCancelButton: true, + cancelButtonColor: "#d33", + confirmButtonColor: "#3085d6", + confirmButtonText: "Simpan", + }).then((result) => { + if (result.isConfirmed) { + save(data); + } + }); + }; + + const save = async (data: z.infer) => { + console.log("data", data); + + const dataReq = { + id: detail?.id, + firstName: data.name, + username: data.username, + email: data.email, + password: data.password, + address: "", + 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); + } + }); + } + + async function getDataAdditional() { + const resCompetencies = await getListCompetencies(); + setUserCompetencies(resCompetencies?.data?.data); + + const resExperiences = await getListExperiences(); + setUserExperiences(resExperiences?.data?.data); + console.log("experience", 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", + icon: "success", + confirmButtonColor: "#3085d6", + confirmButtonText: "OK", + }).then((result) => { + if (result.isConfirmed) { + router.push("/admin/add-experts"); + } + }); + } + + 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 = () => { + if (placementRows.length < 2) { + setPlacementRows((prevRows) => [ + ...prevRows, + { index: incrementId, roleId: "", userLevelId: 0 }, + ]); + setIncrementId((prevId) => prevId + 1); + } + }; + + return ( +
+ + +
+ {detail !== undefined ? ( + +

Campaign

+ ( + + Nama Lengkap + + + + + )} + /> + ( + + Username + + + + + )} + /> + ( + + No. HP + + + + )} + /> + ( + + Email + + + + )} + /> + ( + + Password +
+ + +
+ +
+ )} + /> + ( + + Bidang Keahlian + + + )} + /> + + ( + + Pengalaman + + + )} + /> + + ( + + Nama Institusi/Perusahaan + + + + )} + /> + +
+ Posisi + {placementRows?.map((row: any) => ( +
+ + {/* */} + + {placementRows.length > 1 && ( + + )} +
+ ))} + +
+ +
+ + +
+ + ) : ( + "" + )} + +
+ ); +} diff --git a/app/[locale]/(protected)/admin/settings/setting-tracking/component/column.tsx b/app/[locale]/(protected)/admin/settings/setting-tracking/component/column.tsx index 09ef5cd2..9fd2e03b 100644 --- a/app/[locale]/(protected)/admin/settings/setting-tracking/component/column.tsx +++ b/app/[locale]/(protected)/admin/settings/setting-tracking/component/column.tsx @@ -122,10 +122,22 @@ const useTableColumns = () => { - - - - + + + + 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" diff --git a/app/[locale]/(protected)/admin/settings/setting-tracking/component/create.tsx b/app/[locale]/(protected)/admin/settings/setting-tracking/component/create.tsx index a378f474..90544ee2 100644 --- a/app/[locale]/(protected)/admin/settings/setting-tracking/component/create.tsx +++ b/app/[locale]/(protected)/admin/settings/setting-tracking/component/create.tsx @@ -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 ( - - - - +// return ( +// +// +// +// - - - Add Setting Tracking Berita Harian - +// +// +// Add Setting Tracking Berita Harian +// -
- - {/* Wilayah */} - ( - - Wilayah -
- {wilayahList.map((item) => ( -
- { - const updated = checked - ? [...field.value, item.id] - : field.value.filter((val) => val !== item.id); - field.onChange(updated); - }} - /> - -
- ))} -
-
- )} - /> +// +// +// {/* Wilayah */} +// ( +// +// Wilayah +//
+// {wilayahList.map((item) => ( +//
+// { +// const updated = checked +// ? [...field.value, item.id] +// : field.value.filter((val) => val !== item.id); +// field.onChange(updated); +// }} +// /> +// +//
+// ))} +//
+//
+// )} +// /> - ( - - Jumlah Tracking Berita Harian -
- {jumlahList.map((num) => ( -
- { - const updated = checked - ? [...field.value, num] - : field.value.filter((val) => val !== num); - field.onChange(updated); - }} - /> - -
- ))} -
-
- )} - /> +// ( +// +// Jumlah Tracking Berita Harian +//
+// {jumlahList.map((num) => ( +//
+// { +// const updated = checked +// ? [...field.value, num] +// : field.value.filter((val) => val !== num); +// field.onChange(updated); +// }} +// /> +// +//
+// ))} +//
+//
+// )} +// /> - - - - - -
-
- ); -} +// +// +// +// +// +// +//
+// ); +// } diff --git a/app/[locale]/(protected)/admin/settings/setting-tracking/component/table.tsx b/app/[locale]/(protected)/admin/settings/setting-tracking/component/table.tsx index 82e8f34f..b6978627 100644 --- a/app/[locale]/(protected)/admin/settings/setting-tracking/component/table.tsx +++ b/app/[locale]/(protected)/admin/settings/setting-tracking/component/table.tsx @@ -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 (
- + {/* */} +
+ + + +
- {roleId !== 12 && roleId !== 19 && ( + {roleId !== 12 && (
{/* Left */} -
-
-

- - Filter -

-
-
-
- - setSearchTitle(e.target.value)} - onKeyUp={handleKeyUp} - onKeyDown={handleKeyDown} - type="text" - id="search" - placeholder={t("searchTitle")} - className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" - /> -
- -
- - setMonthYearFilter(date)} - dateFormat="MM | yyyy" - placeholderText={t("selectYear")} - showMonthYearPicker - /> -
- -
- -
- { - setDateRange(update); - }} - placeholderText={t("selectDate")} - onCalendarClose={() => setCalenderState(!calenderState)} +
+
+ +
+ {isFilterOpen && ( +
+

+ + Filter +

+
+
+
+ + setSearchTitle(e.target.value)} + onKeyUp={handleKeyUp} + onKeyDown={handleKeyDown} + type="text" + id="search" + placeholder={t("searchTitle")} + className="mt-1 w-full border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" /> -
{handleClose ? : ""}
-
-
-

{t("categories")}

-
    - {categories.map((category: any) => ( -
  • -
  • + +
  • +
  • + +
  • +
+
+
+
-
+ )} {/* Konten Kanan */}

{t("sortBy")}

- handleSorting(e)} + className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + > @@ -478,21 +623,36 @@ const FilterPage = () => { {imageData?.length > 0 ? (
{imageData?.map((image: any) => ( - + - +
- {formatDateToIndonesian(new Date(image?.createdAt))} {image?.timezone ? image?.timezone : "WIB"}| + {formatDateToIndonesian(new Date(image?.createdAt))}{" "} + {image?.timezone ? image?.timezone : "WIB"}|{" "} + {image?.clickCount}{" "} - + {" "}
-
{image?.title}
+
+ {image?.title} +
@@ -500,11 +660,19 @@ const FilterPage = () => {
) : (

- empty + empty

)} - +
diff --git a/app/[locale]/(public)/audio/filter/page.tsx b/app/[locale]/(public)/audio/filter/page.tsx index eb5b1b81..6dc82194 100644 --- a/app/[locale]/(public)/audio/filter/page.tsx +++ b/app/[locale]/(public)/audio/filter/page.tsx @@ -2,10 +2,31 @@ import React, { useEffect, useState } from "react"; import { Checkbox } from "@/components/ui/checkbox"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { formatDateToIndonesian, getOnlyDate, getOnlyMonthAndYear, secondToTimes } from "@/utils/globals"; +import { + formatDateToIndonesian, + getOnlyDate, + getOnlyMonthAndYear, + secondToTimes, +} from "@/utils/globals"; import { useParams, usePathname, useSearchParams } from "next/navigation"; -import { getUserLevelListByParent, listCategory, listData, listDataRegional } from "@/service/landing/landing"; -import { ColumnDef, ColumnFiltersState, PaginationState, SortingState, VisibilityState, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table"; +import { + getUserLevelListByParent, + listCategory, + listData, + listDataRegional, +} from "@/service/landing/landing"; +import { + ColumnDef, + ColumnFiltersState, + PaginationState, + SortingState, + VisibilityState, + getCoreRowModel, + getFilteredRowModel, + getPaginationRowModel, + getSortedRowModel, + useReactTable, +} from "@tanstack/react-table"; import LandingPagination from "@/components/landing-page/pagination"; import { Link, useRouter } from "@/i18n/routing"; import { Input } from "@/components/ui/input"; @@ -34,8 +55,11 @@ const FilterPage = () => { const [totalData, setTotalData] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); const [sorting, setSorting] = React.useState([]); - const [columnFilters, setColumnFilters] = React.useState([]); - const [columnVisibility, setColumnVisibility] = React.useState({}); + const [columnFilters, setColumnFilters] = React.useState( + [] + ); + const [columnVisibility, setColumnVisibility] = + React.useState({}); const [rowSelection, setRowSelection] = React.useState({}); const [pagination, setPagination] = React.useState({ pageIndex: 0, @@ -56,7 +80,9 @@ const FilterPage = () => { const [categoryFilter, setCategoryFilter] = useState([]); const [monthYearFilter, setMonthYearFilter] = useState(); const [searchTitle, setSearchTitle] = useState(""); - const [sortByOpt, setSortByOpt] = useState(sortBy === "popular" ? "clickCount" : "createdAt"); + const [sortByOpt, setSortByOpt] = useState( + sortBy === "popular" ? "clickCount" : "createdAt" + ); const isRegional = asPath?.includes("regional"); const isSatker = asPath?.includes("satker"); const [formatFilter, setFormatFilter] = useState([]); @@ -102,8 +128,14 @@ const FilterPage = () => { useEffect(() => { if (categorie) { - setCategoryFilter(categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); - console.log("Kategori", categorie, categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); + setCategoryFilter( + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + console.log( + "Kategori", + categorie, + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); } }, [categorie]); @@ -121,7 +153,19 @@ const FilterPage = () => { } console.log(monthYearFilter, "monthFilter"); initState(); - }, [change, asPath, monthYearFilter, page, sortBy, sortByOpt, title, startDateString, endDateString, categorie, formatFilter]); + }, [ + change, + asPath, + monthYearFilter, + page, + sortBy, + sortByOpt, + title, + startDateString, + endDateString, + categorie, + formatFilter, + ]); async function getCategories() { const category = await listCategory("4"); @@ -144,7 +188,10 @@ const FilterPage = () => { async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -162,8 +209,14 @@ const FilterPage = () => { filterGroup, startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -178,7 +231,10 @@ const FilterPage = () => { setTotalContent(response?.data?.data?.totalElements); } } else { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -195,8 +251,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -247,7 +307,10 @@ const FilterPage = () => { }; async function getDataRegional() { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -260,8 +323,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", 12, pages, sortByOpt @@ -379,7 +446,7 @@ const FilterPage = () => { {/* Left */}
-
+

Filter @@ -387,7 +454,10 @@ const FilterPage = () => {
-
- + {
- +
{ placeholderText={t("searchDate")} onCalendarClose={() => setCalenderState(!calenderState)} /> -
{handleClose ? : ""}
+
+ {handleClose ? ( + + ) : ( + "" + )} +
-

{t("categories")}

+

+ {t("categories")} +

    {categories?.map((category: any) => (
  • -
  • ))} @@ -449,25 +549,48 @@ const FilterPage = () => {
    {/* Garis */}
    -

    Format

    +

    + Format +

    @@ -479,7 +602,11 @@ const FilterPage = () => {

    {t("sortBy")}

    - handleSorting(e)} + className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + > @@ -502,11 +629,20 @@ const FilterPage = () => {
    {audioData?.map((audio: any) => (
    - +
    - + {
    - {formatDateToIndonesian(new Date(audio?.createdAt))} {audio?.timezone ? audio?.timezone : "WIB"} + {formatDateToIndonesian( + new Date(audio?.createdAt) + )}{" "} + {audio?.timezone ? audio?.timezone : "WIB"}
    |  - +  {audio?.clickCount}{" "}
    -
    {audio?.title}
    +
    + {audio?.title} +
    - wave - + wave + -

    {audio?.duration ? secondToTimes(Number(audio?.duration)) : "00:00:00"}

    - +

    + {" "} + {audio?.duration + ? secondToTimes(Number(audio?.duration)) + : "00:00:00"} +

    +
    @@ -547,13 +711,21 @@ const FilterPage = () => {
    ) : (

    - empty + empty

    )} )} - +
    diff --git a/app/[locale]/(public)/content-management/download/page.tsx b/app/[locale]/(public)/content-management/download/page.tsx index a99cf83d..978b9d73 100644 --- a/app/[locale]/(public)/content-management/download/page.tsx +++ b/app/[locale]/(public)/content-management/download/page.tsx @@ -435,7 +435,7 @@ const Galery = (props: any) => { className="flex cursor-pointer" asChild > - + { - {/* - -

    Content Rewrite

    - */} +
    + handleSaveWishlist( + video?.mediaUpload?.id + ) + } + className="cursor-pointer flex flex-row gap-2 hover:text-red-800" + > + +

    + {t("save")}{" "} +

    +
    + + +

    + Content Rewrite +

    +
    @@ -457,14 +481,14 @@ const Galery = (props: any) => { fontSize={20} />

    - {t("share")} + {t("share")}{" "}

    - {t("shareTo")} + {t("shareTo")}{" "}

    @@ -479,9 +503,7 @@ const Galery = (props: any) => { } onKeyPress={handleEmailList} type="email" - placeholder={t( - "pressEnter" - )} + placeholder={t("shareTo")} />

    -
    - handleDelete(video?.id) - } - className="cursor-pointer flex flex-row gap-2 hover:text-red-800" - > - -

    - {t("delete")} -

    -

    @@ -702,7 +710,7 @@ const Galery = (props: any) => { className="flex cursor-pointer" asChild > - + { - {/* - -

    Content Rewrite

    - */} +
    + handleSaveWishlist( + image?.mediaUpload?.id + ) + } + className="cursor-pointer flex flex-row gap-2 hover:text-red-800" + > + +

    + {t("save")}{" "} +

    +
    + + +

    + Content Rewrite +

    +
    @@ -724,14 +756,14 @@ const Galery = (props: any) => { fontSize={20} />

    - {t("share")} + {t("share")}{" "}

    - {t("shareTo")} + {t("shareTo")}{" "}

    @@ -746,9 +778,7 @@ const Galery = (props: any) => { } onKeyPress={handleEmailList} type="email" - placeholder={t( - "pressEnter" - )} + placeholder={t("shareTo")} />

    -
    - handleDelete(image?.id) - } - className="cursor-pointer flex flex-row gap-2 hover:text-red-800" - > - -

    - {t("delete")} -

    -

    diff --git a/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx b/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx index c74aa695..20576035 100644 --- a/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx +++ b/app/[locale]/(public)/content-management/rewrite/create/[id]/page.tsx @@ -77,11 +77,12 @@ const page = (props: any) => { const [selectedArticleId, setSelectedArticleId] = useState(null); const [articleBody, setArticleBody] = useState(""); const [selectedAdvConfig, setSelectedAdvConfig] = useState(""); - const [selectedWritingStyle, setSelectedWritingStyle] = useState(""); - const [selectedContextType, setSelectedContextType] = useState(""); - const [selectedLanguage, setSelectedLanguage] = useState(""); + const [selectedWritingStyle, setSelectedWritingStyle] = + useState("profesional"); + const [selectedContextType, setSelectedContextType] = useState("article"); + const [selectedLanguage, setSelectedLanguage] = useState("id"); const [selectedTitle, setSelectedTitle] = useState(""); - const [selectedSize, setSelectedSize] = useState(""); + const [selectedSize, setSelectedSize] = useState("news"); const [detailArticle, setDetailArticle] = useState(null); const [isLoadingData, setIsLoadingData] = useState(false); const [detailData, setDetailData] = useState(null); @@ -262,11 +263,11 @@ const page = (props: any) => { setIsGeneratedArticle(true); setArticleIds((prevIds: any) => { - if (prevIds.length < 5) { + if (prevIds.length < 3) { return [...prevIds, newArticleId]; } else { const updatedIds = [...prevIds]; - updatedIds[4] = newArticleId; + updatedIds[2] = newArticleId; return updatedIds; } }); @@ -488,11 +489,11 @@ const page = (props: any) => { Generate Artikel {isGeneratedArticle && ( -
    +
    {articleIds.map((id: any, index: any) => (

    {

    -
    +
    diff --git a/app/[locale]/(public)/document/filter/page.tsx b/app/[locale]/(public)/document/filter/page.tsx index 24df27dd..77a9bd0e 100644 --- a/app/[locale]/(public)/document/filter/page.tsx +++ b/app/[locale]/(public)/document/filter/page.tsx @@ -3,10 +3,31 @@ import React, { useEffect, useState } from "react"; import { Card, CardContent } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { formatDateToIndonesian, getOnlyDate, getOnlyMonthAndYear } from "@/utils/globals"; +import { + formatDateToIndonesian, + getOnlyDate, + getOnlyMonthAndYear, +} from "@/utils/globals"; import { useParams, usePathname, useSearchParams } from "next/navigation"; -import { getListContent, getUserLevelListByParent, listCategory, listData, listDataRegional } from "@/service/landing/landing"; -import { ColumnDef, ColumnFiltersState, PaginationState, SortingState, VisibilityState, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table"; +import { + getListContent, + getUserLevelListByParent, + listCategory, + listData, + listDataRegional, +} from "@/service/landing/landing"; +import { + ColumnDef, + ColumnFiltersState, + PaginationState, + SortingState, + VisibilityState, + getCoreRowModel, + getFilteredRowModel, + getPaginationRowModel, + getSortedRowModel, + useReactTable, +} from "@tanstack/react-table"; import LandingPagination from "@/components/landing-page/pagination"; import { Reveal } from "@/components/landing-page/Reveal"; import { Link, useRouter } from "@/i18n/routing"; @@ -35,8 +56,11 @@ const FilterPage = () => { const [totalData, setTotalData] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); const [sorting, setSorting] = React.useState([]); - const [columnFilters, setColumnFilters] = React.useState([]); - const [columnVisibility, setColumnVisibility] = React.useState({}); + const [columnFilters, setColumnFilters] = React.useState( + [] + ); + const [columnVisibility, setColumnVisibility] = + React.useState({}); const [rowSelection, setRowSelection] = React.useState({}); const [pagination, setPagination] = React.useState({ pageIndex: 0, @@ -57,7 +81,9 @@ const FilterPage = () => { const [categoryFilter, setCategoryFilter] = useState([]); const [monthYearFilter, setMonthYearFilter] = useState(); const [searchTitle, setSearchTitle] = useState(""); - const [sortByOpt, setSortByOpt] = useState(sortBy === "popular" ? "clickCount" : "createdAt"); + const [sortByOpt, setSortByOpt] = useState( + sortBy === "popular" ? "clickCount" : "createdAt" + ); const isRegional = asPath?.includes("regional"); const isSatker = asPath?.includes("satker"); const [formatFilter, setFormatFilter] = useState([]); @@ -102,8 +128,14 @@ const FilterPage = () => { useEffect(() => { if (categorie) { - setCategoryFilter(categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); - console.log("Kategori", categorie, categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); + setCategoryFilter( + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + console.log( + "Kategori", + categorie, + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); } }, [categorie]); @@ -121,7 +153,19 @@ const FilterPage = () => { } console.log(monthYearFilter, "monthFilter"); initState(); - }, [change, asPath, monthYearFilter, page, sortBy, sortByOpt, title, startDateString, endDateString, categorie, formatFilter]); + }, [ + change, + asPath, + monthYearFilter, + page, + sortBy, + sortByOpt, + title, + startDateString, + endDateString, + categorie, + formatFilter, + ]); async function getCategories() { const category = await listCategory("3"); @@ -144,7 +188,10 @@ const FilterPage = () => { async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -162,8 +209,14 @@ const FilterPage = () => { filterGroup, startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -178,7 +231,10 @@ const FilterPage = () => { setTotalContent(response?.data?.data?.totalElements); } } else { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -195,8 +251,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -247,7 +307,10 @@ const FilterPage = () => { }; async function getDataRegional() { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -260,8 +323,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", 12, pages, sortByOpt @@ -394,7 +461,7 @@ const FilterPage = () => { {/* Left */}
    -
    +

    Filter @@ -402,7 +469,10 @@ const FilterPage = () => {
    -
    - + {
    - +
    { placeholderText={t("selectDate")} onCalendarClose={() => setCalenderState(!calenderState)} /> -
    {handleClose ? : ""}
    +
    + {handleClose ? ( + + ) : ( + "" + )} +
    -

    {t("categories")}

    +

    + {t("categories")} +

      {categories.map((category: any) => (
    • -
    • ))} @@ -464,43 +564,93 @@ const FilterPage = () => {
      {/* Garis */}
      -

      Format

      +

      + Format +

      @@ -513,7 +663,11 @@ const FilterPage = () => {

      {t("sortBy")}

      - handleSorting(e)} + className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + > @@ -539,9 +693,19 @@ const FilterPage = () => { {documentData?.length > 0 ? (
      {documentData?.map((document: any) => ( - +
      - + {
      - {formatDateToIndonesian(new Date(document?.createdAt))} {document?.timezone ? document?.timezone : "WIB"} | {document?.clickCount} + {formatDateToIndonesian( + new Date(document?.createdAt) + )}{" "} + {document?.timezone ? document?.timezone : "WIB"}{" "} + |{" "} + {" "} + {document?.clickCount} +
      +
      + {document?.title}
      -
      {document?.title}
      - - + + Download Dokumen
      @@ -565,13 +745,21 @@ const FilterPage = () => {
      ) : (

      - empty + empty

      )} )} - +
      diff --git a/app/[locale]/(public)/image/filter/page.tsx b/app/[locale]/(public)/image/filter/page.tsx index 9d1b3667..c43d8601 100644 --- a/app/[locale]/(public)/image/filter/page.tsx +++ b/app/[locale]/(public)/image/filter/page.tsx @@ -3,10 +3,30 @@ import React, { useEffect, useState } from "react"; import { Card, CardContent } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { formatDateToIndonesian, getOnlyDate, getOnlyMonthAndYear } from "@/utils/globals"; +import { + formatDateToIndonesian, + getOnlyDate, + getOnlyMonthAndYear, +} from "@/utils/globals"; import { useParams, usePathname, useSearchParams } from "next/navigation"; -import { getUserLevelListByParent, listCategory, listData, listDataRegional } from "@/service/landing/landing"; -import { ColumnDef, ColumnFiltersState, PaginationState, SortingState, VisibilityState, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table"; +import { + getUserLevelListByParent, + listCategory, + listData, + listDataRegional, +} from "@/service/landing/landing"; +import { + ColumnDef, + ColumnFiltersState, + PaginationState, + SortingState, + VisibilityState, + getCoreRowModel, + getFilteredRowModel, + getPaginationRowModel, + getSortedRowModel, + useReactTable, +} from "@tanstack/react-table"; import LandingPagination from "@/components/landing-page/pagination"; import { Reveal } from "@/components/landing-page/Reveal"; import { Link, useRouter } from "@/i18n/routing"; @@ -38,8 +58,11 @@ const FilterPage = () => { const [totalData, setTotalData] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); const [sorting, setSorting] = React.useState([]); - const [columnFilters, setColumnFilters] = React.useState([]); - const [columnVisibility, setColumnVisibility] = React.useState({}); + const [columnFilters, setColumnFilters] = React.useState( + [] + ); + const [columnVisibility, setColumnVisibility] = + React.useState({}); const [rowSelection, setRowSelection] = React.useState({}); const [pagination, setPagination] = React.useState({ pageIndex: 0, @@ -60,7 +83,9 @@ const FilterPage = () => { const [categoryFilter, setCategoryFilter] = useState([]); const [monthYearFilter, setMonthYearFilter] = useState(); const [searchTitle, setSearchTitle] = useState(""); - const [sortByOpt, setSortByOpt] = useState(sortBy === "popular" ? "clickCount" : "createdAt"); + const [sortByOpt, setSortByOpt] = useState( + sortBy === "popular" ? "clickCount" : "createdAt" + ); const isRegional = asPath?.includes("regional"); const isSatker = asPath?.includes("satker"); const [formatFilter, setFormatFilter] = useState([]); @@ -106,8 +131,14 @@ const FilterPage = () => { useEffect(() => { if (categorie) { - setCategoryFilter(categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); - console.log("Kategori", categorie, categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); + setCategoryFilter( + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + console.log( + "Kategori", + categorie, + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); } }, [categorie]); @@ -125,7 +156,19 @@ const FilterPage = () => { } console.log(monthYearFilter, "monthFilter"); initState(); - }, [change, asPath, monthYearFilter, page, sortBy, sortByOpt, title, startDateString, endDateString, categorie, formatFilter]); + }, [ + change, + asPath, + monthYearFilter, + page, + sortBy, + sortByOpt, + title, + startDateString, + endDateString, + categorie, + formatFilter, + ]); async function getCategories() { const category = await listCategory("1"); @@ -148,7 +191,10 @@ const FilterPage = () => { async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -166,8 +212,14 @@ const FilterPage = () => { filterGroup, startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -182,7 +234,10 @@ const FilterPage = () => { setTotalContent(response?.data?.data?.totalElements); } } else { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -199,8 +254,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -251,7 +310,10 @@ const FilterPage = () => { }; async function getDataRegional() { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -264,8 +326,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", 12, pages, sortByOpt @@ -382,7 +448,10 @@ const FilterPage = () => { `; - const toBase64 = (str: string) => (typeof window === "undefined" ? Buffer.from(str).toString("base64") : window.btoa(str)); + const toBase64 = (str: string) => + typeof window === "undefined" + ? Buffer.from(str).toString("base64") + : window.btoa(str); return (
      @@ -401,13 +470,16 @@ const FilterPage = () => { {/* Left */}
      -
      {isFilterOpen && ( -
      +

      Filter @@ -415,7 +487,10 @@ const FilterPage = () => {
      -
      - + {
      - +
      { placeholderText={t("selectDate")} onCalendarClose={() => setCalenderState(!calenderState)} /> -
      {handleClose ? : ""}
      +
      + {handleClose ? ( + + ) : ( + "" + )} +
      -

      {t("categories")}

      +

      + {t("categories")} +

        {categories.map((category: any) => (
      • -
      • ))} @@ -477,31 +582,63 @@ const FilterPage = () => {
        {/* Garis */}
        -

        Format

        +

        + Format +

        @@ -515,7 +652,11 @@ const FilterPage = () => {

        {t("sortBy")}

        - handleSorting(e)} + className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + > @@ -539,13 +680,19 @@ const FilterPage = () => { {imageData?.length > 0 ? (
        {imageData?.map((image: any) => ( - + {/* */}
        { />
        - {formatDateToIndonesian(new Date(image?.createdAt))} {image?.timezone ? image?.timezone : "WIB"} + {formatDateToIndonesian( + new Date(image?.createdAt) + )}{" "} + {image?.timezone ? image?.timezone : "WIB"}   | - + {image?.clickCount}{" "}
        -
        {image?.title}
        +
        + {image?.title} +
        @@ -568,12 +724,24 @@ const FilterPage = () => {
        ) : (

        - empty + empty

        )} )} - {totalData > 1 && } + {totalData > 1 && ( + + )}
        diff --git a/app/[locale]/(public)/video/filter/page.tsx b/app/[locale]/(public)/video/filter/page.tsx index 7828ab0c..bd0ea4bd 100644 --- a/app/[locale]/(public)/video/filter/page.tsx +++ b/app/[locale]/(public)/video/filter/page.tsx @@ -3,10 +3,31 @@ import React, { useEffect, useState } from "react"; import { Card, CardContent } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; import { Icon } from "@iconify/react/dist/iconify.js"; -import { formatDateToIndonesian, getOnlyDate, getOnlyMonthAndYear } from "@/utils/globals"; +import { + formatDateToIndonesian, + getOnlyDate, + getOnlyMonthAndYear, +} from "@/utils/globals"; import { useParams, usePathname, useSearchParams } from "next/navigation"; -import { getListContent, getUserLevelListByParent, listCategory, listData, listDataRegional } from "@/service/landing/landing"; -import { ColumnDef, ColumnFiltersState, PaginationState, SortingState, VisibilityState, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table"; +import { + getListContent, + getUserLevelListByParent, + listCategory, + listData, + listDataRegional, +} from "@/service/landing/landing"; +import { + ColumnDef, + ColumnFiltersState, + PaginationState, + SortingState, + VisibilityState, + getCoreRowModel, + getFilteredRowModel, + getPaginationRowModel, + getSortedRowModel, + useReactTable, +} from "@tanstack/react-table"; import LandingPagination from "@/components/landing-page/pagination"; import { Reveal } from "@/components/landing-page/Reveal"; import { Link, useRouter } from "@/i18n/routing"; @@ -37,8 +58,11 @@ const FilterPage = () => { const [totalData, setTotalData] = React.useState(1); const [totalPage, setTotalPage] = React.useState(1); const [sorting, setSorting] = React.useState([]); - const [columnFilters, setColumnFilters] = React.useState([]); - const [columnVisibility, setColumnVisibility] = React.useState({}); + const [columnFilters, setColumnFilters] = React.useState( + [] + ); + const [columnVisibility, setColumnVisibility] = + React.useState({}); const [rowSelection, setRowSelection] = React.useState({}); const [pagination, setPagination] = React.useState({ pageIndex: 0, @@ -56,7 +80,9 @@ const FilterPage = () => { const [categoryFilter, setCategoryFilter] = useState([]); const [monthYearFilter, setMonthYearFilter] = useState(); const [searchTitle, setSearchTitle] = useState(""); - const [sortByOpt, setSortByOpt] = useState(sortBy === "popular" ? "clickCount" : "createdAt"); + const [sortByOpt, setSortByOpt] = useState( + sortBy === "popular" ? "clickCount" : "createdAt" + ); const isRegional = asPath?.includes("regional"); const isSatker = asPath?.includes("satker"); const [formatFilter, setFormatFilter] = useState([]); @@ -102,8 +128,14 @@ const FilterPage = () => { useEffect(() => { if (categorie) { - setCategoryFilter(categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); - console.log("Kategori", categorie, categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie]); + setCategoryFilter( + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); + console.log( + "Kategori", + categorie, + categorie?.split("&")?.length > 1 ? categorie?.split("&") : [categorie] + ); } }, [categorie]); @@ -116,7 +148,19 @@ const FilterPage = () => { } } initState(); - }, [change, asPath, monthYearFilter, page, sortBy, sortByOpt, title, startDateString, endDateString, categorie, formatFilter]); + }, [ + change, + asPath, + monthYearFilter, + page, + sortBy, + sortByOpt, + title, + startDateString, + endDateString, + categorie, + formatFilter, + ]); async function getCategories() { const category = await listCategory("2"); @@ -139,7 +183,10 @@ const FilterPage = () => { async function getDataAll() { if (asPath?.includes("/polda/") == true) { if (asPath?.split("/")[2] !== "[polda_name]") { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -157,8 +204,14 @@ const FilterPage = () => { filterGroup, startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter) + ?.split("/")[0] + ?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -173,7 +226,10 @@ const FilterPage = () => { setTotalContent(response?.data?.data?.totalElements); } } else { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); loading(); @@ -189,8 +245,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", locale == "en" ? true : false ); close(); @@ -241,7 +301,10 @@ const FilterPage = () => { }; async function getDataRegional() { - const filter = categoryFilter?.length > 0 ? categoryFilter?.sort().join(",") : categorie || ""; + const filter = + categoryFilter?.length > 0 + ? categoryFilter?.sort().join(",") + : categorie || ""; const name = title == undefined ? "" : title; const format = formatFilter == undefined ? "" : formatFilter?.join(","); @@ -254,8 +317,12 @@ const FilterPage = () => { "", startDateString, endDateString, - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") : "", - monthYearFilter ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[0]?.replace("", "") + : "", + monthYearFilter + ? getOnlyMonthAndYear(monthYearFilter)?.split("/")[1] + : "", 12, pages, sortByOpt @@ -396,7 +463,7 @@ const FilterPage = () => { {/* Left */}
        -
        +

        Filter @@ -404,7 +471,10 @@ const FilterPage = () => {
        -
        - + {
        - +
        { placeholderText={t("selectDate")} onCalendarClose={() => setCalenderState(!calenderState)} /> -
        {handleClose ? : ""}
        +
        + {handleClose ? ( + + ) : ( + "" + )} +
        -

        {t("categories")}

        +

        + {t("categories")} +

          {categories.map((category: any) => (
        • -
        • ))} @@ -466,43 +566,93 @@ const FilterPage = () => {
          {/* Garis */}
          -

          Format

          +

          + Format +

          @@ -515,7 +665,11 @@ const FilterPage = () => {

          {t("sortBy")}

          - handleSorting(e)} + className="border rounded-md py-2 px-3 focus:ring-red-500 focus:border-red-500" + > @@ -539,18 +693,39 @@ const FilterPage = () => { {videoData?.length > 0 ? (
          {videoData?.map((video: any) => ( - + {/* */}
          - +
          - {formatDateToIndonesian(new Date(video?.createdAt))} {video?.timezone ? video?.timezone : "WIB"} | + {formatDateToIndonesian( + new Date(video?.createdAt) + )}{" "} + {video?.timezone ? video?.timezone : "WIB"} |{" "} + {video?.clickCount}{" "}
          -
          {video?.title}
          +
          + {video?.title} +
          @@ -558,13 +733,23 @@ const FilterPage = () => {
          ) : (

          - empty + empty

          )} )} - +
          diff --git a/components/form/communication/escalation-detail-form.tsx b/components/form/communication/escalation-detail-form.tsx index 4e579615..db62b637 100644 --- a/components/form/communication/escalation-detail-form.tsx +++ b/components/form/communication/escalation-detail-form.tsx @@ -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 (
          @@ -179,6 +186,29 @@ export default function FormDetailEscalation() {

          {detail.message}

          +
          + {detail?.typeId === 6 && detail?.emergencyIssue ? ( +
          +
          + +
          +
          + ) : null} + + {detail?.emergencyIssue && ( + setOpenEmergencyModal(false)} + data={detail.emergencyIssue} + /> + )} +
        )}
        diff --git a/components/form/communication/escalation-detail-new-form.tsx b/components/form/communication/escalation-detail-new-form.tsx index 3b94a704..bc4b001b 100644 --- a/components/form/communication/escalation-detail-new-form.tsx +++ b/components/form/communication/escalation-detail-new-form.tsx @@ -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" }), diff --git a/components/form/communication/questions-reply-form.tsx b/components/form/communication/questions-reply-form.tsx index 64d96c87..b684de96 100644 --- a/components/form/communication/questions-reply-form.tsx +++ b/components/form/communication/questions-reply-form.tsx @@ -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() { ( +

        +
        +
        + + ); +} diff --git a/components/form/media-tracking/setting-tracking-detail-form.tsx b/components/form/media-tracking/setting-tracking-detail-form.tsx new file mode 100644 index 00000000..fb115b11 --- /dev/null +++ b/components/form/media-tracking/setting-tracking-detail-form.tsx @@ -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 ( + <> + +
        + + {/* Wilayah */} + ( + + Wilayah +
        + {wilayahList.map((item) => ( +
        + { + const updated = checked + ? [...field.value, item.id] + : field.value.filter((val) => val !== item.id); + field.onChange(updated); + }} + /> + +
        + ))} +
        +
        + )} + /> + + ( + + Jumlah Tracking Berita Harian +
        + +
        +
        + )} + /> +
        + +
        + + +
        + + ); +} diff --git a/components/form/media-tracking/setting-tracking-form.tsx b/components/form/media-tracking/setting-tracking-form.tsx new file mode 100644 index 00000000..5ec57285 --- /dev/null +++ b/components/form/media-tracking/setting-tracking-form.tsx @@ -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 ( + <> + +
        + + {/* Wilayah */} + ( + + Wilayah +
        + {wilayahList.map((item) => ( +
        + { + const updated = checked + ? [...field.value, item.id] + : field.value.filter((val) => val !== item.id); + field.onChange(updated); + }} + /> + +
        + ))} +
        +
        + )} + /> + + ( + + Jumlah Tracking Berita Harian +
        + +
        +
        + )} + /> +
        + +
        + + +
        + + ); +} diff --git a/components/form/media-tracking/setting-tracking-update-form.tsx b/components/form/media-tracking/setting-tracking-update-form.tsx new file mode 100644 index 00000000..621bf378 --- /dev/null +++ b/components/form/media-tracking/setting-tracking-update-form.tsx @@ -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 ( + <> + +
        + + {/* Wilayah */} + ( + + Wilayah +
        + {wilayahList.map((item) => ( +
        + { + const updated = checked + ? [...field.value, item.id] + : field.value.filter((val) => val !== item.id); + field.onChange(updated); + }} + /> + +
        + ))} +
        +
        + )} + /> + + ( + + Jumlah Tracking Berita Harian +
        + +
        +
        + )} + /> +
        + +
        + + +
        + + ); +} diff --git a/components/form/ticketing/info-lainnya-types.ts b/components/form/ticketing/info-lainnya-types.ts index 51ff1472..108d6d6c 100644 --- a/components/form/ticketing/info-lainnya-types.ts +++ b/components/form/ticketing/info-lainnya-types.ts @@ -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; }; }; diff --git a/components/form/ticketing/info-lainnya.tsx b/components/form/ticketing/info-lainnya.tsx index 9fcf5e79..0af6a1f8 100644 --- a/components/form/ticketing/info-lainnya.tsx +++ b/components/form/ticketing/info-lainnya.tsx @@ -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 ( @@ -41,11 +69,11 @@ export default function InfoLainnyaModal({
        :{data?.recommendationName}
        Link Pendukung
        -
        + - {data?.uploadFiles && ( + {files.length > 0 && ( <> -
        Lampiran
        -
        - Lampiran +
        Lampiran
        +
        + {isImage(currentFile?.fileUrl || "") ? ( + {`Lampiran + ) : ( +