Merge pull request #110 from bipproduction/lukman/13-agustus-2024

Lukman/13 agustus 2024

api.http

@@ -232,18 +232,21 @@ POST http://localhost:3000/api/announcement HTTP/1.1
 Content-Type: application/json
 
 {
-    "title": "cobaannouncement1 dsdsd",
-    "desc": "coba announcement sdsdsd",
-    "groups": [
-        {
-        "id": "group1",
-        "name": "Dinas",
-            "Division": [
-                {
-                    "id": "1",
-                    "name": "sasasasa"
-                }
-            ]
-        }
-  ]
+    "title": "test",
+    "desc": "test",
+    "groups": 
+   [
+      {
+        "idAnnouncement": "1",
+        "idGroup": "group1",
+        "idDivision": "1",
+        "isActive": true
+      },
+      {
+         "idAnnouncement": "1",
+         "idGroup": "group1",
+         "idDivision": "clzknx2xy0001bt0wygcwjfph",
+         "isActive": true
+      }
+    ]
 }

src/app/(application)/announcement/create-user/page.tsx

@@ -3,7 +3,8 @@ import React from 'react';
 
 function Page() {
   return (
-    <CreateUsersAnnouncement />
+    // <CreateUsersAnnouncement />
+   <></>
   );
 }
 

src/app/api/announcement/route.ts

@@ -49,14 +49,14 @@ export async function GET(request: Request) {
 
 export async function POST(request: Request) {
     try {
-        // const user = await funGetUserByCookies();
-        // if (user.id == undefined) {
-        //     return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
-        // }
+        const user = await funGetUserByCookies();
+        if (user.id == undefined) {
+            return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
+        }
 
         const { title, desc, createBy, groups } = (await request.json());
-        const villaId = "desa1"
-        const roleId = "superAdminLukman"
+        const villaId = user.idVillage
+        const roleId = user.idUserRole
 
         const data = await prisma.announcement.create({
             data: {
@@ -74,21 +74,17 @@ export async function POST(request: Request) {
         });
 
         const dataMember = groups.map((group: any) => ({
-            idAnnoucement: data.id,
-            idGroup: group.id,
-            idDivision: group.Division.map((division: any) => ({
-                id: division.id,
-                name: division.name,
-            })),
+            idAnnouncement: data.id,
+            idGroup: group.idGroup,
+            idDivision: group.idDivision,
             isActive: true,
         }));
-        
-        console.log("test data", dataMember)
-        // await prisma.announcementMember.createMany({
-        //     data: dataMember
-        // })
 
-        return NextResponse.json({ success: true, message: "Berhasil mendapatkan pengumuman"}, { status: 200 });
+        const announcementMember = await prisma.announcementMember.createMany({
+            data: dataMember,
+        });
+
+        return NextResponse.json({data, groups: announcementMember, success: true, message: "Berhasil mendapatkan pengumuman"}, { status: 200 });
 
     } catch (error) {
         console.error(error);

src/module/announcement/lib/api_announcement.ts

@@ -1,3 +1,5 @@
+import { ICreateData } from "./type_announcement";
+
 export const funGetAllAnnouncement = async (path?: string) => {
     const response = await fetch(`/api/announcement${(path) ? path : ''}`, { next: { tags: ['announcement'] } });
     return await response.json().catch(() => null);
@@ -6,4 +8,15 @@ export const funGetAllAnnouncement = async (path?: string) => {
 export const funGetAnnouncementById = async (path: string) => {
     const response = await fetch(`/api/announcement/${path}`);
     return await response.json().catch(() => null);
+}
+
+export const funCreateAnnouncement = async (data: ICreateData) => {
+    const response = await fetch("/api/announcement", {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json",
+        },
+        body: JSON.stringify(data),
+    });
+    return await response.json().catch(() => null);
 }

src/module/announcement/lib/type_announcement.ts

@@ -1,33 +1,46 @@
 export interface IListDataAnnouncement {
-    id: string,
-    title: string,
-    desc: string,
-    createdAt: string
+   id: string,
+   title: string,
+   desc: string,
+   createdAt: string
 }
 
 export interface IRootAllAnnouncement {
-    announcement: IAnnouncement
-    allAnnouncementMember: IAllAnnouncementMember[]
- }
- 
- export interface IAnnouncement {
-    id: string
-    title: string
-    desc: string
- }
- 
- export interface IAllAnnouncementMember {
-    idAnnouncement: string
-    idGroup: string
-    idDivision: string
-    group: string
- }
+   announcement: IAnnouncement
+   allAnnouncementMember: IAllAnnouncementMember[]
+}
 
- export interface GroupData {
+export interface IAnnouncement {
+   id: string
+   title: string
+   desc: string
+}
+
+export interface IAllAnnouncementMember {
+   idAnnouncement: string
+   idGroup: string
+   idDivision: string
+   group: string
+}
+
+export interface GroupData {
    id: string;
    name: string;
    Division: {
-     id: string;
-     name: string;
+      id: string;
+      name: string;
    }[];
- }
+}
+
+export interface ICreateData {
+   title: string
+   desc: string
+
+}
+
+export interface IGroupData {
+   idAnnouncement: string
+   idGroup: string
+   idDivision: string
+   isActive: boolean
+}

src/module/announcement/ui/create_announcement.tsx

@@ -3,20 +3,47 @@ import { LayoutNavbarNew, WARNA } from "@/module/_global";
 import LayoutModal from "@/module/_global/layout/layout_modal";
 import { globalMemberDivision } from "@/module/division_new/lib/val_division";
 import { useHookstate } from "@hookstate/core";
-import { Box, Button, Group, Stack, Text, Textarea, TextInput } from "@mantine/core";
+import { Avatar, Box, Button, Flex, Group, Stack, Text, Textarea, TextInput } from "@mantine/core";
 import { useShallowEffect } from "@mantine/hooks";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 import toast from "react-hot-toast";
 import { HiOutlineChevronRight } from "react-icons/hi2";
 import { IoIosArrowForward } from "react-icons/io";
+import CreateUsersAnnouncement from "./create_users_announcement";
+import { globalMemberAnnouncement } from "../lib/val_announcement";
+import { funCreateAnnouncement } from "../lib/api_announcement";
+import { group } from "console";
+import { GroupData, ICreateData, IGroupData } from "../lib/type_announcement";
+
+export type DataMember = DataGroup[]
+
+export interface DataGroup {
+  id: string
+  name: string
+  Division: Division[]
+}
+
+export interface Division {
+  id: string
+  name: string
+}
+
 
 export default function CreateAnnouncement() {
    const [isOpen, setOpen] = useState(false)
-   const member = useHookstate(globalMemberDivision)
-   const router = useRouter()
+   const memberGroup = useHookstate(globalMemberAnnouncement)
+   const memberValue = memberGroup.get() as GroupData[]
    const [selectedFiles, setSelectedFiles] = useState<any>([]);
 
+   const [isChooseMember, setIsChooseMember] = useState(false)
+   const [isData, setisData] = useState({
+      title: "",
+      desc: "",
+   })
+
+
+
    function onTrue(val: boolean) {
       if (val) {
          toast.success("Sukses! Data tersimpan");
@@ -24,20 +51,38 @@ export default function CreateAnnouncement() {
       setOpen(false)
    }
 
+   async function onSubmit(val: boolean) {
+      // const response = await funCreateAnnouncement(
+      //    {
+      //       title: isData.title,
+      //       desc: isData.desc,
+      //       groups: memberValue
+      //    },
+         
+      // )
+      setOpen(false)
+      console.log(isData)
+      console.log(memberValue)
+
+   }
+
    async function loadData() {
-      setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
+      setSelectedFiles(JSON.parse(JSON.stringify(memberGroup.get())))
    }
 
    useShallowEffect(() => {
       loadData()
-   },[])
+   }, [])
+
+   function onToChooseMember() {
+      setIsChooseMember(true)
+   }
+
+   if (isChooseMember) return <CreateUsersAnnouncement  onClose={() => { setIsChooseMember(false) }} />
 
    return (
       <Box>
-         <pre>
-            {JSON.stringify(selectedFiles)}
-         </pre>
-          <LayoutNavbarNew back="" title="Tambah Pengumuman" menu={<></>} />
+         <LayoutNavbarNew back="" title="Tambah Pengumuman" menu={<></>} />
          <Stack
             p={20}
          >
@@ -50,6 +95,7 @@ export default function CreateAnnouncement() {
                      borderColor: WARNA.biruTua,
                   },
                }}
+               onChange={(e) => { setisData({ ...isData, title: e.target.value }) }}
             />
             <Textarea
                size="md"
@@ -65,6 +111,7 @@ export default function CreateAnnouncement() {
                      borderColor: WARNA.biruTua,
                   },
                }}
+               onChange={(e) => { setisData({ ...isData, desc: e.target.value }) }}
             />
             <Box pt={10}>
                <Group justify="space-between" style={{
@@ -72,7 +119,7 @@ export default function CreateAnnouncement() {
                   padding: 10,
                   borderRadius: 10
                }}
-                  onClick={() => router.push("/announcement/create-user")}
+                  onClick={() => { onToChooseMember() }}
                >
                   <Text size="sm">
                      Tambah Anggota
@@ -80,6 +127,25 @@ export default function CreateAnnouncement() {
                   <IoIosArrowForward />
                </Group>
             </Box>
+            <Box pt={20}>
+            <Text c={WARNA.biruTua} mb={10}>Anggota Terpilih</Text>
+            {(memberGroup.length === 0) ? (
+               <Text c="dimmed" ta={"center"} fs={"italic"}>Belum ada anggota</Text>
+            ) : memberGroup.get().map((v: any, i: any) => {
+               return (
+                  <Box key={i} mt={10}>
+                     <Text fw={"bold"}>{v.name}</Text>
+                     <Box pl={20}>
+                        <Flex direction={"column"} gap={"md"}>
+                           {v.Division.map((division: any) => (
+                              <li key={division.id}>{division.name}</li>
+                           ))}
+                        </Flex>
+                     </Box>
+                  </Box>
+               );
+            })}
+            </Box>
          </Stack>
          <Box mt={30} mx={20}>
             <Button
@@ -95,7 +161,7 @@ export default function CreateAnnouncement() {
          </Box>
          <LayoutModal opened={isOpen} onClose={() => setOpen(false)}
             description="Apakah Anda yakin ingin menambahkan data?"
-            onYes={(val) => { onTrue(val) }} />
+            onYes={(val) => { onSubmit(val) }} />
       </Box>
 
    )

src/module/announcement/ui/create_users_announcement.tsx

@@ -15,7 +15,7 @@ interface CheckedState {
   [key: string]: string[];
 }
 
-export default function CreateUsersAnnouncement() {
+export default function CreateUsersAnnouncement({ onClose}: { onClose: (val: any) => void }) {
   const [checked, setChecked] = useState<CheckedState>({});
   const [selectAll, setSelectAll] = useState(false);
   const [isData, setIsData] = useState<GroupData[]>([])
@@ -69,11 +69,17 @@ export default function CreateUsersAnnouncement() {
   const handleSubmit = () => {
     const selectedGroups: GroupData[] = [];
     Object.keys(checked).forEach((groupId) => {
-      if (checked[groupId]) {
-        selectedGroups.push();
+      const group = isData.find((item) => item.id === groupId);
+      if (group) {
+        selectedGroups.push({
+          id: group.id,
+          name: group.name,
+          Division: group.Division.filter((division) => checked[groupId].includes(division.id)),
+        });
       }
     });
     memberGroup.set(selectedGroups);
+    onClose(true);
   };
 
   useShallowEffect(() => {