Merge pull request #62 from bipproduction/amalia/18-jul-24

Amalia/18 jul 24

src/module/announcement/component/list_announcement.tsx

@@ -1,6 +1,6 @@
 'use client'
 import { WARNA } from '@/module/_global';
-import { ActionIcon, Box, Group, Text, TextInput } from '@mantine/core';
+import { ActionIcon, Box, Center, Divider, Grid, Group, Text, TextInput } from '@mantine/core';
 import React from 'react';
 import { TfiAnnouncement } from "react-icons/tfi";
 import { HiMagnifyingGlass } from 'react-icons/hi2';
@@ -10,42 +10,58 @@ const dataPengumuman = [
    {
       id: 1,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Dinas',
+      tgl: '7 Juli 2024'
    },
    {
       id: 2,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Dinas',
+      tgl: '7 Juli 2024'
    },
    {
       id: 3,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Adat',
+      tgl: '7 Juli 2024'
    },
    {
       id: 4,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Dinas',
+      tgl: '7 Juli 2024'
    },
    {
       id: 5,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'PKK',
+      tgl: '7 Juli 2024'
    },
    {
       id: 6,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Karang Taruna',
+      tgl: '7 Juli 2024'
    },
    {
       id: 7,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara terima kasih yang sangat banyak',
+      grup: 'Dinas',
+      tgl: '7 Juli 2024'
    },
    {
       id: 8,
       name: 'Lembaga Pengkreditan Desa',
-      desc: 'Diharapkan semua untuk melakukan upacara ben...'
+      desc: 'Diharapkan semua untuk melakukan upacara ben...',
+      grup: 'Dinas',
+      tgl: '7 Juli 2024'
    },
 ]
 
@@ -68,22 +84,29 @@ export default function ListAnnouncement() {
          />
          {dataPengumuman.map((v, i) => {
             return (
-               <Box pt={20} key={i} onClick={() => {
-                  router.push(`/announcement/${v.id}`)
-               }}>
-                  <Group align='center' style={{
-                     borderBottom: `1px solid #D9D9D9`,
-                     padding: 10,
-                  }} >
-                     <Box>
-                        <ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
-                           <TfiAnnouncement color={WARNA.biruTua} size={25} />
-                        </ActionIcon>
-                     </Box>
-                     <Box>
-                        <Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
-                     </Box>
-                  </Group>
+               <Box  key={i} mt={15}>
+                  <Box onClick={() => {
+                     router.push(`/announcement/${v.id}`)
+                  }}>
+                     <Grid>
+                        <Grid.Col span={2}>
+                           <Center>
+                              <ActionIcon variant="light" bg={'#FCAA4B'} size={50} radius={100} aria-label="icon">
+                                 <TfiAnnouncement color={WARNA.biruTua} size={25} />
+                              </ActionIcon>
+                           </Center>
+                        </Grid.Col>
+                        <Grid.Col span={10}>
+                           <Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text>
+                           <Text  c={WARNA.biruTua} truncate={'end'}>{v.desc}</Text>
+                           <Group justify='space-between' mt={5}>
+                              <Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.grup}</Text>
+                              <Text fw={'lighter'} c={WARNA.biruTua} fz={13}>{v.tgl}</Text>
+                           </Group>
+                        </Grid.Col>
+                     </Grid>
+                  </Box>
+                  <Divider my={15}/>
                </Box>
             )
          })}

src/module/project/components/create_project.tsx

@@ -1,28 +1,52 @@
 "use client";
 import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
-import { Box, Button, Center, Flex, Group, Input, Stack, Text } from "@mantine/core";
+import { Box, Button, Center, Flex, Group, Select, Stack, Text, TextInput } from "@mantine/core";
 import { useRouter } from "next/navigation";
 import React, { useState } from "react";
 import { IoIosArrowDropright } from "react-icons/io";
 import { BsFiletypeCsv } from "react-icons/bs";
 import ResultsDateAndTask from "./results_date-and_task";
 import ResultsFile from "./results_file";
+import LayoutModal from "@/module/_global/layout/layout_modal";
+import toast from "react-hot-toast";
 
 export default function CreateProject({ searchParams }: { searchParams: any }) {
   const router = useRouter();
   const [openDrawer, setOpenDrawer] = useState(false);
+  const [isModal, setModal] = useState(false)
+
+  function onTrue(val: boolean) {
+    if (val) {
+      toast.success("Sukses! Data tersimpan");
+      router.push('/project')
+    }
+    setModal(false)
+  }
+
   return (
     <Box>
       <LayoutNavbarNew back="/project" title="tambah proyek" menu />
       <Box p={20}>
         <Stack>
-          <Input
+          <Select
+            placeholder="Pilih Grup" label="Grup" w={"100%"} size="md" required withAsterisk radius={30}
             styles={{
               input: {
                 border: `1px solid ${"#D6D8F6"}`,
                 borderRadius: 10,
               },
             }}
+            data={['Dinas', 'Adat', 'LPD', 'PKK']}
+          />
+          <TextInput
+            label="Proyek"
+            styles={{
+              input: {
+                border: `1px solid ${"#D6D8F6"}`,
+                borderRadius: 10,
+              },
+            }}
+            required withAsterisk
             placeholder="Nama Proyek"
             size="md"
           />
@@ -69,14 +93,12 @@ export default function CreateProject({ searchParams }: { searchParams: any }) {
           (searchParams.button == 'yes') &&
           <>
             <Box mt="xl">
-              <Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => router.push('/project')}>
+              <Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => setModal(true)}>
                 Simpan
               </Button>
             </Box>
           </>
         }
-
-
       </Box>
 
 
@@ -125,6 +147,10 @@ export default function CreateProject({ searchParams }: { searchParams: any }) {
           </Box>
         </Flex>
       </LayoutDrawer>
+
+      <LayoutModal opened={isModal} onClose={() => setModal(false)}
+        description="Apakah Anda yakin ingin mengubah data?"
+        onYes={(val) => { onTrue(val) }} />
     </Box >
   );
 }