feat : update announcement

2024-08-13 13:35:59 +08:00
parent 334f94cb39
commit 7ffc642feb
6 changed files with 167 additions and 70 deletions
--- a/api.http
+++ b/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
+      }
+    ]
 }
--- a/src/app/api/announcement/route.ts
+++ b/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);
--- a/src/module/announcement/lib/api_announcement.ts
+++ b/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);
 }
--- a/src/module/announcement/lib/type_announcement.ts
+++ b/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
+}
--- a/src/module/announcement/ui/create_announcement.tsx
+++ b/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>

   )
--- a/src/module/announcement/ui/create_users_announcement.tsx
+++ b/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(() => {