diff --git a/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx b/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx index 187d669c..10116e1e 100644 --- a/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx +++ b/app/[locale]/(protected)/contributor/schedule/calendar-polri/component/calendar-polri-table.tsx @@ -158,7 +158,7 @@ const CalendarPolriTable = () => {
- {t("press-conference")} {t("schedule")} + {t("calendar-polri")} {t("schedule")}
diff --git a/app/[locale]/(protected)/contributor/schedule/live-report/component/live-report-table.tsx b/app/[locale]/(protected)/contributor/schedule/live-report/component/live-report-table.tsx index 1b8e767c..cbe89c77 100644 --- a/app/[locale]/(protected)/contributor/schedule/live-report/component/live-report-table.tsx +++ b/app/[locale]/(protected)/contributor/schedule/live-report/component/live-report-table.tsx @@ -57,6 +57,15 @@ import { DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { Label } from "@/components/ui/label"; +import { + Select, + SelectContent, + SelectGroup, + SelectItem, + SelectLabel, + SelectTrigger, + SelectValue, +} from "@/components/ui/select"; const LiveReportTable = () => { const router = useRouter(); @@ -81,6 +90,7 @@ const LiveReportTable = () => { const [limit, setLimit] = React.useState(10); const [search, setSearch] = React.useState(""); const [statusFilter, setStatusFilter] = React.useState([]); + const [selectedType, setSelectedType] = React.useState("1"); const columns = useTableColumns(); const table = useReactTable({ data: dataTable, @@ -112,14 +122,14 @@ const LiveReportTable = () => { React.useEffect(() => { fetchData(); - }, [page, showData, search, statusFilter]); + }, [page, showData, search, statusFilter, selectedType]); async function fetchData() { try { const res = await paginationSchedule( showData, page - 1, - 1, + selectedType, search, statusFilter ); @@ -161,7 +171,7 @@ const LiveReportTable = () => { {t("live-report")} {t("schedule")}
- +
+
+ +
diff --git a/app/[locale]/(protected)/contributor/schedule/live-report/create/page.tsx b/app/[locale]/(protected)/contributor/schedule/live-report/create/page.tsx index 2fdfb6fa..1e7adc20 100644 --- a/app/[locale]/(protected)/contributor/schedule/live-report/create/page.tsx +++ b/app/[locale]/(protected)/contributor/schedule/live-report/create/page.tsx @@ -2,13 +2,14 @@ import { Card, CardContent } from "@/components/ui/card"; import SiteBreadcrumb from "@/components/site-breadcrumb"; import FormTask from "@/components/form/task/task-form"; import FormPressConference from "@/components/form/schedule/press-conference-form"; +import FormLiveReport from "@/components/form/schedule/live-report-form"; const LiveReportCreatePage = () => { return (
- +
); diff --git a/app/[locale]/(protected)/contributor/schedule/live-report/detail/[id]/page.tsx b/app/[locale]/(protected)/contributor/schedule/live-report/detail/[id]/page.tsx index 422ea884..273f3b55 100644 --- a/app/[locale]/(protected)/contributor/schedule/live-report/detail/[id]/page.tsx +++ b/app/[locale]/(protected)/contributor/schedule/live-report/detail/[id]/page.tsx @@ -6,13 +6,14 @@ import FormPressConference from "@/components/form/schedule/press-conference-for import FormDetailPressConference from "@/components/form/schedule/press-conference-detail-form"; import { useParams } from "next/navigation"; import { id } from "date-fns/locale"; +import FormDetailLiveReport from "@/components/form/schedule/live-report-detail-form"; const LiveReportDetailPage = () => { return (
- +
); diff --git a/app/[locale]/(protected)/contributor/schedule/live-report/update/[id]/page.tsx b/app/[locale]/(protected)/contributor/schedule/live-report/update/[id]/page.tsx index 025ada2a..109a315f 100644 --- a/app/[locale]/(protected)/contributor/schedule/live-report/update/[id]/page.tsx +++ b/app/[locale]/(protected)/contributor/schedule/live-report/update/[id]/page.tsx @@ -7,13 +7,14 @@ import FormDetailPressConference from "@/components/form/schedule/press-conferen import { useParams } from "next/navigation"; import { id } from "date-fns/locale"; import FormUpdatePressConference from "@/components/form/schedule/press-conference-update-form"; +import FormUpdateLiveReport from "@/components/form/schedule/live-report-update-form"; const LiveReportUpdatePage = () => { return (
- +
); diff --git a/components/form/schedule/live-report-detail-form.tsx b/components/form/schedule/live-report-detail-form.tsx new file mode 100644 index 00000000..2bd4d714 --- /dev/null +++ b/components/form/schedule/live-report-detail-form.tsx @@ -0,0 +1,407 @@ +"use client"; +import React, { useEffect, useRef, useState } from "react"; +import { useForm, Controller } from "react-hook-form"; +import { Input } from "@/components/ui/input"; +import { Button } from "@/components/ui/button"; +import { Label } from "@/components/ui/label"; +import { Card } from "@/components/ui/card"; +import { zodResolver } from "@hookform/resolvers/zod"; +import * as z from "zod"; +import Swal from "sweetalert2"; +import withReactContent from "sweetalert2-react-content"; +import { useParams, useRouter } from "next/navigation"; +import { Switch } from "@/components/ui/switch"; +import { + Popover, + PopoverContent, + PopoverTrigger, +} from "@/components/ui/popover"; +import { cn } from "@/lib/utils"; +import { CalendarIcon, Clock1, Locate, MapPin, User2 } from "lucide-react"; +import { Calendar } from "@/components/ui/calendar"; +import { addDays, format, parseISO, setDate } from "date-fns"; +import { DateRange } from "react-day-picker"; +import TimePicker from "react-time-picker"; +import "react-time-picker/dist/TimePicker.css"; +import "react-clock/dist/Clock.css"; +import MapHome from "@/components/maps/MapHome"; +import { Textarea } from "@/components/ui/textarea"; +import { error, loading } from "@/lib/swal"; +import Cookies from "js-cookie"; +import { + detailSchedule, + listScheduleNext, + listScheduleToday, + postSchedule, +} from "@/service/schedule/schedule"; +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "@/components/ui/accordion"; +import { formatDateToIndonesian } from "@/utils/globals"; +import { formatDate } from "@fullcalendar/core/index.js"; + +const taskSchema = z.object({ + title: z.string().min(1, { message: "Judul diperlukan" }), + level: z.string().min(1, { message: "Judul diperlukan" }), + name: z.string().min(1, { message: "Judul diperlukan" }), + location: z.string().min(1, { message: "Judul diperlukan" }), +}); + +interface Detail { + id: number; + title: string; + address: string; + speakerTitle: string; + speakerName: string; + addressLat: number; + addressLong: number; +} + +export default function FormDetailLiveReport() { + const { id } = useParams() as { id: string }; + console.log(id); + const router = useRouter(); + const [isLiveStreamingEnabled, setIsLiveStreamingEnabled] = useState(false); + type TaskSchema = z.infer; + const [startTime, setStartTime] = useState("08:00"); + const [endTime, setEndTime] = useState("09:00"); + const [date, setDate] = useState(); + const [todayList, setTodayList] = useState([]); + const [nextDayList, setNextDayList] = useState([]); + + const [detail, setDetail] = useState(); + const [refresh, setRefresh] = useState(false); + + const { + control, + handleSubmit, + setValue, + formState: { errors }, + } = useForm({ + resolver: zodResolver(taskSchema), + defaultValues: { + location: "", + }, + }); + + async function getDataByDate() { + const resToday = await listScheduleToday(); + const today = resToday?.data?.data; + setTodayList(today); + const resNext = await listScheduleNext(); + const next = resNext?.data?.data; + + setNextDayList(next); + } + + useEffect(() => { + async function initState() { + if (id) { + const response = await detailSchedule(id); + const details = response?.data?.data; + + setDetail(details); + if (details) { + setDate({ + from: parseISO(details.startDate), + to: parseISO(details.endDate), + }); + } + if (details) { + setStartTime(details.startTime); + setEndTime(details.endTime); + } + getDataByDate(); + } + } + initState(); + }, [refresh, setValue]); + + const handleStartTime = (e: React.ChangeEvent) => { + setStartTime(e.target.value); + }; + + const handleEndTime = (e: React.ChangeEvent) => { + setEndTime(e.target.value); + }; + + return ( +
+ +
+

Form Konferensi Pers

+ {detail !== undefined ? ( +
+ {/* Input Title */} +
+ + ( + + )} + /> + {errors.title?.message && ( +

{errors.title.message}

+ )} +
+
+
+ +
+

Aktifkan fitur live streaming

+ + setIsLiveStreamingEnabled(checked) + } + /> +
+
+
+ + {isLiveStreamingEnabled && ( +
+ ( + + )} + /> + {errors.title?.message && ( +

+ {errors.title.message} +

+ )} +
+ )} + +
+
+ + + + + + + + + +
+
+ +
+
+
+ +
+
+ +
+
+
+
+
+
+ {/* Kirim setValue ke MapHome */} + setValue("location", location)} + /> +
+
+ ( +