Files
sistem-desa-mandiri/src/module/calender/ui/drawer_detail_event.tsx
2024-09-06 12:20:23 +08:00

70 lines
2.3 KiB
TypeScript

"use client"
import { WARNA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { AiOutlineFileSearch } from 'react-icons/ai';
import { IoAddCircle } from 'react-icons/io5';
import { MdDelete, MdEdit } from 'react-icons/md';
import { funDeleteCalenderById } from '../lib/api_calender';
export default function DrawerDetailEvent() {
const router = useRouter()
const [isModal, setModal] = useState(false)
const param = useParams<{ id: string, detail: string }>()
async function fetchDeleteCalender(val: boolean) {
try {
if (val) {
const response = await funDeleteCalenderById(
param.detail
)
if (response.success) {
toast.success(response.message)
setModal(false)
router.push(`/division/${param.id}/calender`)
} else {
toast.error(response.message)
}
}
setModal(false)
} catch (error) {
console.error(error);
setModal(false)
toast.error("Gagal hapus calender, coba lagi nanti");
}
}
return (
<Box>
<Stack pt={10}>
<SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }}
>
<Flex onClick={() => setModal(true)} justify={'center'} align={'center'} direction={'column'} >
<Box>
<MdDelete size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text ta={"center"} c={WARNA.biruTua}>Hapus</Text>
</Box>
</Flex>
<Flex onClick={() => router.push(`/division/${param.id}/calender/update/${param.detail}`)} justify={'center'} align={'center'} direction={'column'} >
<Box>
<MdEdit size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Edit</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
<LayoutModal opened={isModal} onClose={() => setModal(false)}
description="Apakah Anda yakin ingin menghapus data?"
onYes={(val) => { fetchDeleteCalender(val) }} />
</Box>
);
}