upd: document

Deskripsi:
- share document

No Issues

src/module/document/ui/drawer_share_document.tsx

@@ -0,0 +1,127 @@
+import { WARNA } from "@/module/_global";
+import { funGetListDivisionByIdDivision, IDataDivison } from "@/module/division_new";
+import { IDataMemberTaskDivision } from "@/module/task/lib/type_task";
+import { Box, Select, Button, Avatar, Divider, Flex, Group, Stack, Text, ActionIcon } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { useParams } from "next/navigation";
+import { useState } from "react";
+import toast from "react-hot-toast";
+import { FaCheck, FaUsers } from "react-icons/fa6";
+import { IShareDivision } from "../lib/type_document";
+import { funShareDocument } from "../lib/api_document";
+import { useHookstate } from "@hookstate/core";
+import { globalRefreshDocument } from "../lib/val_document";
+
+export default function DrawerShareDocument({ data }: { data: IShareDivision[]}) {
+   const [selectedFiles, setSelectedFiles] = useState<any>([])
+   const [isData, setData] = useState<IDataDivison[]>([])
+   const param = useParams<{ id: string }>()
+   const refresh = useHookstate(globalRefreshDocument)
+   
+
+
+   async function onShare() {
+      try {
+         if (selectedFiles.length == 0) {
+            return toast.error('Pilih divisi terlebih dahulu')
+         }
+
+
+         const respon = await funShareDocument({ dataDivision: selectedFiles, dataItem: data })
+         if (respon.success) {
+            toast.success(respon.message)
+            refresh.set(true)
+         } else {
+            toast.error(respon.message)
+         }
+      } catch (error) {
+         console.log(error)
+         toast.error("Gagal membagikan item, coba lagi nanti");
+      }
+   }
+
+   async function getData() {
+      try {
+         const response = await funGetListDivisionByIdDivision('?division=' + param.id)
+         if (response.success) {
+            setData(response.data.filter((i: any) => i.id != param.id))
+         } else {
+            toast.error(response.message);
+         }
+
+      } catch (error) {
+         toast.error("Gagal mendapatkan divisi, coba lagi nanti");
+         console.error(error);
+      }
+   }
+
+
+   useShallowEffect(() => {
+      getData()
+   }, []);
+
+   const handleFileClick = (index: number) => {
+      if (selectedFiles.some((i: any) => i.id == isData[index].id)) {
+         setSelectedFiles(selectedFiles.filter((i: any) => i.id != isData[index].id))
+      } else {
+         setSelectedFiles([...selectedFiles, { id: isData[index].id, name: isData[index].name }])
+      }
+   };
+
+   return (
+      <Box pt={10}>
+         <Box mt={10}>
+            {isData.map((v, i) => {
+               const isSelected = selectedFiles.some((i: any) => i?.id == v.id);
+               return (
+                  <Box mb={15} key={i} onClick={() => handleFileClick(i)} >
+                     <Flex justify={"space-between"} align={"center"}>
+                        <Group>
+                           <ActionIcon variant="light" color="gray" radius="xl" size={42} p={10}>
+                              <FaUsers fontSize={40} />
+                           </ActionIcon>
+                           <Stack align="flex-start" justify="flex-start">
+                              <Text style={{
+                                 cursor: 'pointer',
+                                 display: 'flex',
+                                 alignItems: 'center',
+                              }}>
+                                 {v.name}
+                              </Text>
+                           </Stack>
+                        </Group>
+                        <Text
+                           style={{
+                              cursor: 'pointer',
+                              display: 'flex',
+                              alignItems: 'center',
+                              paddingLeft: 20,
+                           }}
+                        >
+                           {isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
+                        </Text>
+                     </Flex>
+                     <Divider my={"md"} />
+                  </Box>
+               );
+            })}
+         </Box>
+         <Box h={90} pos={"fixed"} bottom={0} w={{ base: "92%", md: "94%" }} style={{
+            zIndex: 999
+         }}>
+            <Box>
+               <Button
+                  c={"white"}
+                  bg={WARNA.biruTua}
+                  size="lg"
+                  radius={30}
+                  fullWidth
+                  onClick={() => onShare()}
+               >
+                  Simpan
+               </Button>
+            </Box>
+         </Box>
+      </Box>
+   )
+}

src/module/document/ui/navbar_document_division.tsx

@@ -22,6 +22,7 @@ import { useHookstate } from '@hookstate/core';
 import { globalRefreshDocument } from '../lib/val_document';
 import { RiListCheck } from 'react-icons/ri';
 import { GoChevronRight } from 'react-icons/go';
+import DrawerShareDocument from './drawer_share_document';
 
 export default function NavbarDocumentDivision() {
   const router = useRouter()
@@ -172,6 +173,7 @@ export default function NavbarDocumentDivision() {
     refresh.set(false)
     setOpen(false)
     setMore(false)
+    setShare(false)
     handleBatal()
   }
 
@@ -266,11 +268,11 @@ export default function NavbarDocumentDivision() {
       <Box>
         <Box p={20} pb={60}>
           <Box>
-            <Breadcrumbs separator={<GoChevronRight />} separatorMargin="md" mt="xs">
+            <Breadcrumbs separator={<GoChevronRight />} separatorMargin="md" mt="xs" style={{ cursor: 'pointer' }}>
               {
                 dataJalur.map((v, i) => {
                   return (
-                    <Text onClick={() => router.push('?path=' + v.id)} key={i} style={{ cursor: 'pointer' }}>
+                    <Text onClick={() => router.push('?path=' + v.id)} key={i}>
                       {v.name}
                     </Text>
                   )
@@ -386,36 +388,7 @@ export default function NavbarDocumentDivision() {
 
 
       <LayoutDrawer opened={share} title={'Bagikan'} onClose={() => setShare(false)} size='lg'>
-        <Box pt={10}>
-          <Select
-            styles={{
-              input: {
-                color: WARNA.biruTua,
-                borderRadius: WARNA.biruTua,
-                borderColor: WARNA.biruTua,
-              },
-            }}
-            size="lg"
-            radius={10}
-            placeholder="Pilih Divisi"
-          />
-          <Box h={90} pos={"fixed"} bottom={0} w={{ base: "92%", md: "94%" }} style={{
-            zIndex: 999
-          }}>
-            <Box>
-              <Button
-                c={"white"}
-                bg={WARNA.biruTua}
-                size="lg"
-                radius={30}
-                fullWidth
-                onClick={() => ''}
-              >
-                Simpan
-              </Button>
-            </Box>
-          </Box>
-        </Box>
+        <DrawerShareDocument data={selectedFiles} />
       </LayoutDrawer>