diff --git a/app/[locale]/(protected)/shared/curated-content/giat-routine/document/detail/[id]/page.tsx b/app/[locale]/(protected)/shared/curated-content/giat-routine/document/detail/[id]/page.tsx
index afa89b2b..79479fab 100644
--- a/app/[locale]/(protected)/shared/curated-content/giat-routine/document/detail/[id]/page.tsx
+++ b/app/[locale]/(protected)/shared/curated-content/giat-routine/document/detail/[id]/page.tsx
@@ -34,6 +34,7 @@ import "swiper/css/navigation";
import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
import { Avatar, AvatarImage } from "@/components/ui/avatar";
import JoditEditor from "jodit-react";
+import { Badge } from "@/components/ui/badge";
const detailSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -286,12 +287,19 @@ export default function DetailDocument() {
-
+
Tag
-
- {detail?.tags}
-
+
+ {detail?.tags?.split(",").map((tag, index) => (
+
+ {tag.trim()}
+
+ ))}
+
diff --git a/app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx b/app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx
index 05ad3fff..0fcd0ff1 100644
--- a/app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx
+++ b/app/[locale]/(protected)/shared/curated-content/giat-routine/image/detail/[id]/page.tsx
@@ -33,6 +33,7 @@ import "swiper/css";
import "swiper/css/navigation";
import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
import { Avatar, AvatarImage } from "@/components/ui/avatar";
+import { Badge } from "@/components/ui/badge";
const detailSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -285,12 +286,19 @@ export default function DetailImage() {
-
+
Tag
-
- {detail?.tags}
-
+
+ {detail?.tags?.split(",").map((tag, index) => (
+
+ {tag.trim()}
+
+ ))}
+
diff --git a/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx b/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx
index ce86d7b7..39cf0ac5 100644
--- a/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx
+++ b/app/[locale]/(protected)/shared/curated-content/giat-routine/video/detail/[id]/page.tsx
@@ -33,6 +33,7 @@ import "swiper/css";
import "swiper/css/navigation";
import { FreeMode, Navigation, Pagination, Thumbs } from "swiper/modules";
import { Avatar, AvatarImage } from "@/components/ui/avatar";
+import { Badge } from "@/components/ui/badge";
const detailSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -292,12 +293,19 @@ export default function DetailImage() {
-
+
Tag
-
- {detail?.tags}
-
+
+ {detail?.tags?.split(",").map((tag, index) => (
+
+ {tag.trim()}
+
+ ))}
+
diff --git a/components/form/blog/blog--detail-form.tsx b/components/form/blog/blog--detail-form.tsx
index 6ed692d2..c11a1360 100644
--- a/components/form/blog/blog--detail-form.tsx
+++ b/components/form/blog/blog--detail-form.tsx
@@ -336,7 +336,7 @@ export default function FormBlogDetail() {
/>
-
+
-
+
Pelaksana Tugas
{Object.keys(unitSelection).map((key) => (
@@ -352,8 +349,7 @@ export default function FormContestDetail() {
))}
-
-
+
Narasi Penugasan
- {/* Submit Button */}
-
*/}
) : (
""
diff --git a/components/form/planning/mediahub-publish.tsx b/components/form/planning/mediahub-publish.tsx
index 49060fa6..edb5beac 100644
--- a/components/form/planning/mediahub-publish.tsx
+++ b/components/form/planning/mediahub-publish.tsx
@@ -20,16 +20,27 @@ import {
import { Checkbox } from "@/components/ui/checkbox";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import JoditEditor from "jodit-react";
-import { createTask } from "@/service/task";
+import { createTask, getUserLevelForAssignments } from "@/service/task";
import { cn } from "@/lib/utils";
import { format } from "date-fns";
-import { CalendarIcon } from "lucide-react";
+import { CalendarIcon, ChevronDown, ChevronUp } from "lucide-react";
import { id } from "date-fns/locale";
-import { getPlanningById } from "@/service/planning/planning";
+import { getPlanningById, publishPlanning } from "@/service/planning/planning";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog";
+import { AlertDialogHeader } from "@/components/ui/alert-dialog";
+import { Description } from "@radix-ui/react-toast";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
- naration: z.string().min(2, {
+ description: z.string().min(2, {
message: "Narasi Penugasan harus lebih dari 2 karakter.",
}),
});
@@ -37,8 +48,10 @@ const taskSchema = z.object({
export type mediahubDetail = {
id: number;
title: string;
+ name: string;
fileTypeOutput: string;
assignedToTopLevel: string;
+ assignedToLevel: string;
assignmentType: {
id: number;
name: string;
@@ -70,6 +83,10 @@ export default function PublishMediahub() {
const [startDate, setStartDate] = useState
(new Date());
const [detail, setDetail] = useState();
const [refresh] = useState(false);
+ const [listDest, setListDest] = useState([]); // Data Polda dan Polres
+ const [checkedLevels, setCheckedLevels] = useState(new Set());
+ const [expandedPolda, setExpandedPolda] = useState([{}]);
+ const [isLoading, setIsLoading] = useState(false);
const [platformTypeVisible, setPlatformTypeVisible] = useState(false);
const [unitSelection, setUnitSelection] = useState({
@@ -93,6 +110,29 @@ export default function PublishMediahub() {
setPlatformTypeVisible(selectedValue === 2);
};
+ useEffect(() => {
+ async function fetchPoldaPolres() {
+ setIsLoading(true);
+ try {
+ const response = await getUserLevelForAssignments();
+ setListDest(response.data.data.list);
+ const initialExpandedState = response.data.data.list.reduce(
+ (acc: any, polda: any) => {
+ acc[polda.id] = false;
+ return acc;
+ },
+ {}
+ );
+ setExpandedPolda(initialExpandedState);
+ console.log("polres", initialExpandedState);
+ } catch (error) {
+ console.error("Error fetching Polda/Polres data:", error);
+ } finally {
+ setIsLoading(false);
+ }
+ }
+ fetchPoldaPolres();
+ }, []);
useEffect(() => {
async function initState() {
@@ -102,7 +142,14 @@ export default function PublishMediahub() {
setDetail(details);
if (details?.date) {
- setStartDate(new Date(details.date)); // Konversi string tanggal ke objek Date
+ setStartDate(new Date(details.date));
+ }
+
+ if (details?.assignedToLevel) {
+ const levels = new Set(
+ details.assignedToLevel.split(",").map(Number)
+ );
+ setCheckedLevels(levels);
}
}
}
@@ -111,7 +158,7 @@ export default function PublishMediahub() {
useEffect(() => {
if (detail?.fileTypeOutput) {
- const outputSet = new Set(detail.fileTypeOutput.split(",").map(Number)); // Membagi string ke dalam array dan mengonversi ke nomor
+ const outputSet = new Set(detail.fileTypeOutput.split(",").map(Number));
setTaskOutput({
all: outputSet.has(0),
video: outputSet.has(2),
@@ -126,7 +173,7 @@ export default function PublishMediahub() {
if (detail?.assignedToTopLevel) {
const outputSet = new Set(
detail.assignedToTopLevel.split(",").map(Number)
- ); // Membagi string ke dalam array dan mengonversi ke nomor
+ );
setUnitSelection({
allUnit: outputSet.has(0),
mabes: outputSet.has(1),
@@ -146,30 +193,49 @@ export default function PublishMediahub() {
};
const selectedOutputs = Object.keys(taskOutput)
- .filter((key) => taskOutput[key as keyof typeof taskOutput]) // Ambil hanya yang `true`
- .map((key) => fileTypeMapping[key as keyof typeof fileTypeMapping]) // Konversi ke nilai string
+ .filter((key) => taskOutput[key as keyof typeof taskOutput])
+ .map((key) => fileTypeMapping[key as keyof typeof fileTypeMapping])
.join(",");
- const requestData = {
+ const requestData: {
+ id?: number;
+ title: string;
+ target: string;
+ taskType: string;
+ assignedToLevel: any;
+ assignmentPurpose: any;
+ assignmentTypeId: string;
+ fileTypeOutput: string;
+ description: string;
+ platformType: string | null;
+ date: any;
+ assignmentMainTypeId: number;
+ planningTypeId: number;
+ } = {
...data,
// assignmentType,
// assignmentCategory,
target: selectedTarget,
- unitSelection,
- assignedToRole: "3",
taskType: taskType,
- broadcastType: broadcastType,
- assignmentMainTypeId: mainType,
- assignmentPurpose: "1",
+ assignedToLevel: checkedLevels,
+ assignmentPurpose: unitSelection,
assignmentTypeId: type,
fileTypeOutput: selectedOutputs,
- id: null,
- narration: data.naration,
+ description: data.description,
platformType: "",
title: data.title,
+ date: startDate,
+ planningTypeId: 1,
+ assignmentMainTypeId: 1,
};
- const response = await createTask(requestData);
+ if (id) {
+ requestData.id = parseInt(id, 10); // Ensure id is a number
+ }
+
+ console.log("Form Data Submitted:", requestData);
+
+ const response = await publishPlanning(requestData);
console.log("Form Data Submitted:", requestData);
console.log("response", response);
@@ -181,7 +247,7 @@ export default function PublishMediahub() {
confirmButtonColor: "#3085d6",
confirmButtonText: "OK",
}).then(() => {
- router.push("/en/contributor/task");
+ router.push("/en/contributor/planning/mediahub");
});
};
@@ -201,6 +267,25 @@ export default function PublishMediahub() {
});
};
+ const handleCheckboxChange = (levelId: any) => {
+ setCheckedLevels((prev: any) => {
+ const updatedLevels = new Set(prev);
+ if (updatedLevels.has(levelId)) {
+ updatedLevels.delete(levelId);
+ } else {
+ updatedLevels.add(levelId);
+ }
+ return updatedLevels;
+ });
+ };
+
+ const toggleExpand = (poldaId: any) => {
+ setExpandedPolda((prev: any) => ({
+ ...prev,
+ [poldaId]: !prev[poldaId],
+ }));
+ };
+
return (
@@ -218,7 +303,7 @@ export default function PublishMediahub() {
@@ -228,7 +313,7 @@ export default function PublishMediahub() {
{errors.title.message}
)}
-
+
Output Tugas
{Object.keys(taskOutput).map((key) => (
@@ -247,10 +332,12 @@ export default function PublishMediahub() {
))}
-
-
-
Pelaksana Tugas
-
+
+ Pelaksana Tugas
+
+
+
+
{Object.keys(unitSelection).map((key) => (
+
+
+
+ [Kustom]
+
+
+
+
+ Daftar Wilayah Polda dan Polres
+
+
+ {listDest.map((polda: any) => (
+
+
+
+ handleCheckboxChange(polda.id)
+ }
+ className="mr-3"
+ />
+ {polda.name}
+ toggleExpand(polda.id)}
+ className="ml-2 focus:outline-none"
+ >
+ {expandedPolda[polda.id] ? (
+
+ ) : (
+
+ )}
+
+
+ {expandedPolda[polda.id] && (
+
+
+
+ checkedLevels.has(polres.id)
+ )}
+ onCheckedChange={(isChecked) => {
+ const updatedLevels = new Set(
+ checkedLevels
+ );
+ polda?.subDestination?.forEach(
+ (polres: any) => {
+ if (isChecked) {
+ updatedLevels.add(polres.id);
+ } else {
+ updatedLevels.delete(polres.id);
+ }
+ }
+ );
+ setCheckedLevels(updatedLevels);
+ }}
+ className="mr-2"
+ />
+ Pilih Semua Polres
+
+ {polda?.subDestination?.map((polres: any) => (
+
+
+ handleCheckboxChange(polres.id)
+ }
+ className="mr-2"
+ />
+ {polres.name}
+
+ ))}
+
+ )}
+
+ ))}
+
+
+
-
+
Jenis Penugasan
setType(value)} // Mengubah nilai state ketika pilihan berubah
+ value={detail?.assignmentType?.id.toString()}
+ onValueChange={(value) => setType(value)}
className="flex flex-wrap gap-3"
>
@@ -291,12 +457,12 @@ export default function PublishMediahub() {
-
+
-
+
Narasi Penugasan
(
)}
/>
- {errors.naration?.message && (
+ {errors.description?.message && (
- {errors.naration.message}
+ {errors.description.message}
)}
diff --git a/components/form/planning/medsos-publish.tsx b/components/form/planning/medsos-publish.tsx
index 5124f4a4..601a3b01 100644
--- a/components/form/planning/medsos-publish.tsx
+++ b/components/form/planning/medsos-publish.tsx
@@ -20,16 +20,23 @@ import {
import { Checkbox } from "@/components/ui/checkbox";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import JoditEditor from "jodit-react";
-import { createTask } from "@/service/task";
+import { createTask, getUserLevelForAssignments } from "@/service/task";
import { cn } from "@/lib/utils";
import { format } from "date-fns";
-import { CalendarIcon } from "lucide-react";
+import { CalendarIcon, ChevronDown, ChevronUp } from "lucide-react";
import { id } from "date-fns/locale";
-import { getPlanningById } from "@/service/planning/planning";
+import { getPlanningById, publishPlanning } from "@/service/planning/planning";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
- naration: z.string().min(2, {
+ description: z.string().min(2, {
message: "Narasi Penugasan harus lebih dari 2 karakter.",
}),
});
@@ -70,6 +77,10 @@ export default function PublishMedsos() {
const [startDate, setStartDate] = useState
(new Date());
const [detail, setDetail] = useState();
const [refresh] = useState(false);
+ const [listDest, setListDest] = useState([]); // Data Polda dan Polres
+ const [checkedLevels, setCheckedLevels] = useState(new Set());
+ const [expandedPolda, setExpandedPolda] = useState([{}]);
+ const [isLoading, setIsLoading] = useState(false);
const [platformTypeVisible, setPlatformTypeVisible] = useState(false);
const [unitSelection, setUnitSelection] = useState({
@@ -94,6 +105,30 @@ export default function PublishMedsos() {
setPlatformTypeVisible(selectedValue === 2);
};
+ useEffect(() => {
+ async function fetchPoldaPolres() {
+ setIsLoading(true);
+ try {
+ const response = await getUserLevelForAssignments();
+ setListDest(response.data.data.list);
+ const initialExpandedState = response.data.data.list.reduce(
+ (acc: any, polda: any) => {
+ acc[polda.id] = false;
+ return acc;
+ },
+ {}
+ );
+ setExpandedPolda(initialExpandedState);
+ console.log("polres", initialExpandedState);
+ } catch (error) {
+ console.error("Error fetching Polda/Polres data:", error);
+ } finally {
+ setIsLoading(false);
+ }
+ }
+ fetchPoldaPolres();
+ }, []);
+
useEffect(() => {
async function initState() {
if (id) {
@@ -104,6 +139,13 @@ export default function PublishMedsos() {
if (details?.date) {
setStartDate(new Date(details.date)); // Konversi string tanggal ke objek Date
}
+
+ if (details?.assignedToLevel) {
+ const levels = new Set(
+ details.assignedToLevel.split(",").map(Number)
+ );
+ setCheckedLevels(levels);
+ }
}
}
initState();
@@ -146,30 +188,49 @@ export default function PublishMedsos() {
};
const selectedOutputs = Object.keys(taskOutput)
- .filter((key) => taskOutput[key as keyof typeof taskOutput]) // Ambil hanya yang `true`
- .map((key) => fileTypeMapping[key as keyof typeof fileTypeMapping]) // Konversi ke nilai string
+ .filter((key) => taskOutput[key as keyof typeof taskOutput])
+ .map((key) => fileTypeMapping[key as keyof typeof fileTypeMapping])
.join(",");
- const requestData = {
+ const requestData: {
+ id?: number;
+ title: string;
+ target: string;
+ taskType: string;
+ assignedToLevel: any;
+ assignmentPurpose: any;
+ assignmentTypeId: string;
+ fileTypeOutput: string;
+ description: string;
+ platformType: string | null;
+ date: any;
+ assignmentMainTypeId: number;
+ planningTypeId: number;
+ } = {
...data,
// assignmentType,
// assignmentCategory,
target: selectedTarget,
- unitSelection,
- assignedToRole: "3",
taskType: taskType,
- broadcastType: broadcastType,
- assignmentMainTypeId: mainType,
- assignmentPurpose: "1",
+ assignedToLevel: checkedLevels,
+ assignmentPurpose: unitSelection,
assignmentTypeId: type,
fileTypeOutput: selectedOutputs,
- id: null,
- narration: data.naration,
+ description: data.description,
platformType: "",
title: data.title,
+ date: startDate,
+ planningTypeId: 2,
+ assignmentMainTypeId: 1,
};
- const response = await createTask(requestData);
+ if (id) {
+ requestData.id = parseInt(id, 10); // Ensure id is a number
+ }
+
+ console.log("Form Data Submitted:", requestData);
+
+ const response = await publishPlanning(requestData);
console.log("Form Data Submitted:", requestData);
console.log("response", response);
@@ -181,7 +242,7 @@ export default function PublishMedsos() {
confirmButtonColor: "#3085d6",
confirmButtonText: "OK",
}).then(() => {
- router.push("/en/contributor/task");
+ router.push("/en/contributor/planning/medsos-mediahub");
});
};
@@ -201,6 +262,25 @@ export default function PublishMedsos() {
});
};
+ const handleCheckboxChange = (levelId: any) => {
+ setCheckedLevels((prev: any) => {
+ const updatedLevels = new Set(prev);
+ if (updatedLevels.has(levelId)) {
+ updatedLevels.delete(levelId);
+ } else {
+ updatedLevels.add(levelId);
+ }
+ return updatedLevels;
+ });
+ };
+
+ const toggleExpand = (poldaId: any) => {
+ setExpandedPolda((prev: any) => ({
+ ...prev,
+ [poldaId]: !prev[poldaId],
+ }));
+ };
+
return (
@@ -228,7 +308,7 @@ export default function PublishMedsos() {
{errors.title.message}
)}
-
+
Output Tugas
{Object.keys(taskOutput).map((key) => (
@@ -247,10 +327,12 @@ export default function PublishMedsos() {
))}
-
-
-
Pelaksana Tugas
-
+
+ Pelaksana Tugas
+
+
+
+
{Object.keys(unitSelection).map((key) => (
+
+
+
+ [Kustom]
+
+
+
+
+ Daftar Wilayah Polda dan Polres
+
+
+ {listDest.map((polda: any) => (
+
+
+
+ handleCheckboxChange(polda.id)
+ }
+ className="mr-3"
+ />
+ {polda.name}
+ toggleExpand(polda.id)}
+ className="ml-2 focus:outline-none"
+ >
+ {expandedPolda[polda.id] ? (
+
+ ) : (
+
+ )}
+
+
+ {expandedPolda[polda.id] && (
+
+
+
+ checkedLevels.has(polres.id)
+ )}
+ onCheckedChange={(isChecked) => {
+ const updatedLevels = new Set(
+ checkedLevels
+ );
+ polda?.subDestination?.forEach(
+ (polres: any) => {
+ if (isChecked) {
+ updatedLevels.add(polres.id);
+ } else {
+ updatedLevels.delete(polres.id);
+ }
+ }
+ );
+ setCheckedLevels(updatedLevels);
+ }}
+ className="mr-2"
+ />
+ Pilih Semua Polres
+
+ {polda?.subDestination?.map((polres: any) => (
+
+
+ handleCheckboxChange(polres.id)
+ }
+ className="mr-2"
+ />
+ {polres.name}
+
+ ))}
+
+ )}
+
+ ))}
+
+
+
-
+
Jenis Penugasan
-
+
Date
@@ -314,11 +475,11 @@ export default function PublishMedsos() {
-
+
Narasi Penugasan
(
)}
/>
- {errors.naration?.message && (
+ {errors.description?.message && (
- {errors.naration.message}
+ {errors.description.message}
)}
diff --git a/components/form/schedule/event-detail-form.tsx b/components/form/schedule/event-detail-form.tsx
index 57d9c072..22bec2c8 100644
--- a/components/form/schedule/event-detail-form.tsx
+++ b/components/form/schedule/event-detail-form.tsx
@@ -128,7 +128,7 @@ export default function FormEventDetail() {
)}
-
+
Live Streaming
Aktifkan fitur live streaming
@@ -167,7 +167,7 @@ export default function FormEventDetail() {
)}
-
+
Tanggal
@@ -229,7 +229,7 @@ export default function FormEventDetail() {
-
+
{/* Kirim setValue ke MapHome */}
-
DI SAMPAIKAN OLEH
+
+ DI SAMPAIKAN OLEH
+
Nama Pangkat
diff --git a/components/form/schedule/pers-release--detail-form.tsx b/components/form/schedule/pers-release--detail-form.tsx
index ce13efe8..440bb27c 100644
--- a/components/form/schedule/pers-release--detail-form.tsx
+++ b/components/form/schedule/pers-release--detail-form.tsx
@@ -136,7 +136,7 @@ export default function FormDetailPressRillis() {
)}
-
+
Live Streaming
Aktifkan fitur live streaming
@@ -175,7 +175,7 @@ export default function FormDetailPressRillis() {
)}
-
+
Tanggal
@@ -237,7 +237,7 @@ export default function FormDetailPressRillis() {
-
+
{/* Kirim setValue ke MapHome */}
-
+
Invitation
@@ -278,7 +278,9 @@ export default function FormDetailPressRillis() {
-
DI SAMPAIKAN OLEH
+
+ DI SAMPAIKAN OLEH
+
Nama Pangkat
diff --git a/components/form/schedule/press-conference-detail-form.tsx b/components/form/schedule/press-conference-detail-form.tsx
index b1e08ba5..a86d35ed 100644
--- a/components/form/schedule/press-conference-detail-form.tsx
+++ b/components/form/schedule/press-conference-detail-form.tsx
@@ -128,7 +128,7 @@ export default function FormDetailPressConference() {
)}
-
+
Live Streaming
Aktifkan fitur live streaming
@@ -167,7 +167,7 @@ export default function FormDetailPressConference() {
)}
-
+
Tanggal
@@ -229,7 +229,7 @@ export default function FormDetailPressConference() {
-
+
{/* Kirim setValue ke MapHome */}
-
DI SAMPAIKAN OLEH
+
+ DI SAMPAIKAN OLEH
+
Nama Pangkat
diff --git a/components/form/task/task-detail-form.tsx b/components/form/task/task-detail-form.tsx
index 58e644e0..52bc897a 100644
--- a/components/form/task/task-detail-form.tsx
+++ b/components/form/task/task-detail-form.tsx
@@ -20,7 +20,19 @@ import {
import { Checkbox } from "@/components/ui/checkbox";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import JoditEditor from "jodit-react";
-import { createTask, getTask } from "@/service/task";
+import {
+ createTask,
+ getTask,
+ getUserLevelForAssignments,
+} from "@/service/task";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog";
+import { ChevronDown, ChevronUp } from "lucide-react";
const taskSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }),
@@ -74,6 +86,10 @@ export default function FormTaskDetail() {
const [selectedTarget, setSelectedTarget] = useState("all");
const [detail, setDetail] = useState
();
const [refresh] = useState(false);
+ const [listDest, setListDest] = useState([]); // Data Polda dan Polres
+ const [checkedLevels, setCheckedLevels] = useState(new Set());
+ const [expandedPolda, setExpandedPolda] = useState([{}]);
+ const [isLoading, setIsLoading] = useState(false);
const [platformTypeVisible, setPlatformTypeVisible] = useState(false);
const [unitSelection, setUnitSelection] = useState({
@@ -98,6 +114,30 @@ export default function FormTaskDetail() {
// setPlatformTypeVisible(selectedValue === 2);
// };
+ useEffect(() => {
+ async function fetchPoldaPolres() {
+ setIsLoading(true);
+ try {
+ const response = await getUserLevelForAssignments();
+ setListDest(response.data.data.list);
+ const initialExpandedState = response.data.data.list.reduce(
+ (acc: any, polda: any) => {
+ acc[polda.id] = false;
+ return acc;
+ },
+ {}
+ );
+ setExpandedPolda(initialExpandedState);
+ console.log("polres", initialExpandedState);
+ } catch (error) {
+ console.error("Error fetching Polda/Polres data:", error);
+ } finally {
+ setIsLoading(false);
+ }
+ }
+ fetchPoldaPolres();
+ }, []);
+
useEffect(() => {
async function initState() {
if (id) {
@@ -105,6 +145,13 @@ export default function FormTaskDetail() {
const details = response.data?.data;
setDetail(details);
+
+ if (details?.assignedToLevel) {
+ const levels = new Set(
+ details.assignedToLevel.split(",").map(Number)
+ );
+ setCheckedLevels(levels);
+ }
}
}
initState();
@@ -208,6 +255,25 @@ export default function FormTaskDetail() {
});
};
+ const handleCheckboxChange = (levelId: any) => {
+ setCheckedLevels((prev: any) => {
+ const updatedLevels = new Set(prev);
+ if (updatedLevels.has(levelId)) {
+ updatedLevels.delete(levelId);
+ } else {
+ updatedLevels.add(levelId);
+ }
+ return updatedLevels;
+ });
+ };
+
+ const toggleExpand = (poldaId: any) => {
+ setExpandedPolda((prev: any) => ({
+ ...prev,
+ [poldaId]: !prev[poldaId],
+ }));
+ };
+
return (
@@ -236,7 +302,7 @@ export default function FormTaskDetail() {
)}
-
+
Tujuan Pemilihan Tugas
@@ -249,7 +315,7 @@ export default function FormTaskDetail() {
-
+
{Object.keys(unitSelection).map((key) => (
))}
+
+
+
+
+ [Kustom]
+
+
+
+
+
+ Daftar Wilayah Polda dan Polres
+
+
+
+ {listDest.map((polda: any) => (
+
+
+
+ handleCheckboxChange(polda.id)
+ }
+ className="mr-3"
+ />
+ {polda.name}
+ toggleExpand(polda.id)}
+ className="ml-2 focus:outline-none"
+ >
+ {expandedPolda[polda.id] ? (
+
+ ) : (
+
+ )}
+
+
+ {expandedPolda[polda.id] && (
+
+
+
+ checkedLevels.has(polres.id)
+ )}
+ onCheckedChange={(isChecked) => {
+ const updatedLevels = new Set(
+ checkedLevels
+ );
+ polda?.subDestination?.forEach(
+ (polres: any) => {
+ if (isChecked) {
+ updatedLevels.add(polres.id);
+ } else {
+ updatedLevels.delete(polres.id);
+ }
+ }
+ );
+ setCheckedLevels(updatedLevels);
+ }}
+ className="mr-2"
+ />
+ Pilih Semua Polres
+
+ {polda?.subDestination?.map((polres: any) => (
+
+
+ handleCheckboxChange(polres.id)
+ }
+ className="mr-2"
+ />
+ {polres.name}
+
+ ))}
+
+ )}
+
+ ))}
+
+
+
+
-
+
Tipe Penugasan
Medsos Mediahub
-
+
Jenis Tugas
{/* RadioGroup Assignment Category */}
-
+
Jenis Penugasan
-
+
Output Tugas
{Object.keys(taskOutput).map((key) => (
@@ -337,7 +486,7 @@ export default function FormTaskDetail() {
))}
-