diff --git a/src/app/(application)/(detail-division)/calender/create/page.tsx b/src/app/(application)/(detail-division)/calender/create/page.tsx index b37380e..b6cb06e 100644 --- a/src/app/(application)/(detail-division)/calender/create/page.tsx +++ b/src/app/(application)/(detail-division)/calender/create/page.tsx @@ -1,9 +1,15 @@ -import { ViewCreateDivisionCalender } from '@/module/division_new'; +import { CreateUserDivisionCalender, UlangiEvent, ViewCreateDivisionCalender } from '@/module/division_new'; import React from 'react'; -function Page() { +function Page({ searchParams }: { searchParams: any }) { + if (searchParams.page == "ulangi-event") + return + if (searchParams.page == "user-calender") + return + + return ( - + ); } diff --git a/src/app/(application)/(detail-division)/calender/history/page.tsx b/src/app/(application)/(detail-division)/calender/history/page.tsx new file mode 100644 index 0000000..555fef3 --- /dev/null +++ b/src/app/(application)/(detail-division)/calender/history/page.tsx @@ -0,0 +1,10 @@ +import { ViewHistoryDivisionCalender } from '@/module/division_new'; +import React from 'react'; + +function Page() { + return ( + + ); +} + +export default Page; diff --git a/src/app/(application)/(detail-division)/calender/page.tsx b/src/app/(application)/(detail-division)/calender/page.tsx index ec16ade..11fdf6e 100644 --- a/src/app/(application)/(detail-division)/calender/page.tsx +++ b/src/app/(application)/(detail-division)/calender/page.tsx @@ -1,7 +1,9 @@ -import { ViewDivisionCalender } from '@/module/division_new'; +import { ViewDetailEventDivision, ViewDivisionCalender } from '@/module/division_new'; import React from 'react'; -function Page() { +function Page({ searchParams }: { searchParams: any }) { + if (searchParams.page == "detail-event") + return return ( ); diff --git a/src/app/(application)/(detail-division)/calender/update/page.tsx b/src/app/(application)/(detail-division)/calender/update/page.tsx new file mode 100644 index 0000000..bb7a12e --- /dev/null +++ b/src/app/(application)/(detail-division)/calender/update/page.tsx @@ -0,0 +1,14 @@ +import { UpdateUlangiEvent, UpdateUserDivisionCalender, ViewUpdateDivisionCalender } from '@/module/division_new'; +import React from 'react'; + +function Page({ searchParams }: { searchParams: any }) { + if (searchParams.page == "update-ulangi-event") + return + if (searchParams.page == "update-user-calender") + return + return ( + + ); +} + +export default Page; diff --git a/src/module/division_new/_division_fitur/calender/components/create_user_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/create_user_division_calender.tsx new file mode 100644 index 0000000..85c4d70 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/create_user_division_calender.tsx @@ -0,0 +1,11 @@ +import { Box } from '@mantine/core'; +import React from 'react'; +import NavbarCreateUserCalender from './navbar_create_user_calender'; + +export default function CreateUserDivisionCalender() { + return ( + + + + ); +} diff --git a/src/module/division_new/_division_fitur/calender/components/date_event_division.tsx b/src/module/division_new/_division_fitur/calender/components/date_event_division.tsx index 8faea28..3fad32d 100644 --- a/src/module/division_new/_division_fitur/calender/components/date_event_division.tsx +++ b/src/module/division_new/_division_fitur/calender/components/date_event_division.tsx @@ -1,6 +1,7 @@ import { WARNA } from '@/module/_global'; import { Box, Divider, Group, Indicator, Text } from '@mantine/core'; import { DatePicker, DatePickerProps } from '@mantine/dates'; +import { useRouter } from 'next/navigation'; import React from 'react'; const HariIni = [ @@ -37,6 +38,7 @@ const Besok = [ ] export default function DateEventDivision() { + const router = useRouter() const dayRenderer: DatePickerProps['renderDay'] = (date) => { const day = date.getDate(); return ( @@ -62,7 +64,7 @@ export default function DateEventDivision() { const colorDivider = ['#535FCA', '#A7A7A7'][index % 2] return ( - router.push("/calender?page=detail-event")} bg={bgColor} pl={15} p={10} style={{ borderRadius: 10 }} h={113}> @@ -83,7 +85,7 @@ export default function DateEventDivision() { const colorDivider = ['#535FCA', '#A7A7A7'][index % 2] return ( - router.push("/calender?page=detail-event")} bg={bgColor} pl={15} p={10} style={{ borderRadius: 10 }} h={113}> diff --git a/src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx index 32b80db..fa25d50 100644 --- a/src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx +++ b/src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx @@ -19,7 +19,7 @@ export default function DawerDivisionCalender() { Tambah Kalender - window.location.href = ""} justify={'center'} align={'center'} direction={'column'} > + window.location.href = "/calender/history"} justify={'center'} align={'center'} direction={'column'} > diff --git a/src/module/division_new/_division_fitur/calender/components/detail_event_division.tsx b/src/module/division_new/_division_fitur/calender/components/detail_event_division.tsx new file mode 100644 index 0000000..88f65b7 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/detail_event_division.tsx @@ -0,0 +1,146 @@ +'use client' +import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global'; +import { ActionIcon, Avatar, Box, CopyButton, Flex, Group, Stack, Text, Tooltip } from '@mantine/core'; +import React, { useState } from 'react'; +import { BsCalendar2Event, BsCalendarDate } from 'react-icons/bs'; +import { MdEventNote, MdOutlineFormatListBulleted } from "react-icons/md"; +import { LuClock, LuCopy, LuLink } from "react-icons/lu"; +import { FaCheck } from 'react-icons/fa6'; +import { TbCopy } from 'react-icons/tb'; +import { HiMenu } from 'react-icons/hi'; +import DrawerDetailEvent from './drawer_detail_event'; +const dataAnggota = [ + { + id: 1, + name: "Iqbal Ramadan", + image: "https://i.pravatar.cc/1000?img=5", + email: "iqbal.ramadan@gmail.com", + }, + { + id: 2, + name: "Doni Setiawan", + image: "https://i.pravatar.cc/1000?img=10", + email: "doni.setiawan@gmail.com", + }, + { + id: 3, + name: "Rangga Agung", + image: "https://i.pravatar.cc/1000?img=51", + email: "rangga.agung@gmail.com", + }, + { + id: 4, + name: "Ramadan Sananta", + image: "https://i.pravatar.cc/1000?img=15", + email: "ramadan@gmail.com", + }, + { + id: 5, + name: "Imam Baroni", + image: "https://i.pravatar.cc/1000?img=22", + email: "imam.baroni@gmail.com", + }, +]; + +export default function DetailEventDivision() { + const [openDrawer, setOpenDrawer] = useState(false) + return ( + + setOpenDrawer(true)} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> + + } /> + + + + + + Pembahasan mengenai Darmasaba + + + + Senin, 24 Juni 2024 + + + + 10:00 | 11:00 + + + + Acara 1 Kali + + + + + http://Linkmeet.com + + {({ copied, copy }) => ( + + + {copied ? ( + + ) : ( + + )} + + + )} + + + + + + Dimohon agar tepat waktu + + + + + + + {dataAnggota.map((v, i) => { + return ( + + + + + + {v.name} + + + {v.email} + + + + + Anggota + + + ); + })} + + + + + setOpenDrawer(false)}> + + + + ); +} + diff --git a/src/module/division_new/_division_fitur/calender/components/drawer_detail_event.tsx b/src/module/division_new/_division_fitur/calender/components/drawer_detail_event.tsx new file mode 100644 index 0000000..74ac1fe --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/drawer_detail_event.tsx @@ -0,0 +1,51 @@ +"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 { 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'; + +export default function DrawerDetailEvent() { + const router = useRouter() + const [isModal, setModal] = useState(false) + + function onTrue(val: boolean) { + if (val) { + toast.success("Sukses! Data dihapus"); + } + setModal(false) + } + return ( + + + + setModal(true)} justify={'center'} align={'center'} direction={'column'} > + + + + + Hapus + + + router.push('/calender/update')} justify={'center'} align={'center'} direction={'column'} > + + + + + Edit + + + + + setModal(false)} + description="Apakah Anda yakin ingin menghapus data?" + onYes={(val) => { onTrue(val) }} /> + + ); +} diff --git a/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx new file mode 100644 index 0000000..df95d08 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx @@ -0,0 +1,101 @@ +"use client" +import { LayoutNavbarNew, WARNA } from '@/module/_global'; +import { Box, Center, Flex, Grid, Group, Text, TextInput } from '@mantine/core'; +import { useRouter } from 'next/navigation'; +import React from 'react'; +import { HiMagnifyingGlass } from 'react-icons/hi2'; + +const history = [ + { + id: 1, + tangal: 1, + hari: "Sab", + data: [ + { + id: 1, + judul: "Pembahasan Mengenai Darmasaba", + waktu: "10.00 - 12.00", + status: "Selesai", + }, + { + id: 2, + judul: "Pembahasan Mengenai Darmasaba", + waktu: "13.00 - 14.00", + }, + ] + }, + { + id: 2, + tangal: 2, + hari: "Min", + data: [ + { + id: 1, + judul: "Pembahasan Mengenai Darmasaba", + waktu: "10.00 - 12.00", + }, + { + id: 1, + judul: "Pembahasan Mengenai Darmasaba", + waktu: "13.00 - 14.00", + }, + { + id: 1, + judul: "Pembahasan Mengenai Darmasaba", + waktu: "15.00 - 16.00", + }, + ] + }, +] + +export default function HistoryDivisionCalender() { + const router = useRouter() + return ( + + + + } + placeholder="Pencarian" + /> + + + {history.map((v, i) => { + return ( + + + + {v.tangal} + {v.hari} + + + + {v.data.map((value) => { + return ( + router.push('/calender?page=detail-event')}> + {value.judul} + {value.waktu} + + ) + })} + + + ) + })} + + + + + ); +} diff --git a/src/module/division_new/_division_fitur/calender/components/list_ulangi_event.tsx b/src/module/division_new/_division_fitur/calender/components/list_ulangi_event.tsx new file mode 100644 index 0000000..29cd4c3 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/list_ulangi_event.tsx @@ -0,0 +1,67 @@ +"use client" +import { WARNA } from '@/module/_global'; +import { Box, Button, Checkbox } from '@mantine/core'; +import { useRouter } from 'next/navigation'; +import React from 'react'; + +const dataUlangi = [ + { + id: 1, + name: 'Acara 1 Kali' + }, + { + id: 2, + name: 'Hari Kerja (Sen - Jum)' + }, + { + id: 3, + name: 'Mingguan' + }, + { + id: 4, + name: 'Bulanan' + }, + { + id: 5, + name: 'Tahunan' + }, +] + +export default function ListUlangiEvent() { + const router = useRouter() + return ( + + {dataUlangi.map((v, i) => { + return ( + + + + + + ) + })} + + + + + ); +} + diff --git a/src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx index 627ba85..82043db 100644 --- a/src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx +++ b/src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx @@ -1,28 +1,39 @@ "use client" import { LayoutNavbarNew, WARNA } from '@/module/_global'; -import { Box, Input, Stack } from '@mantine/core'; -import { DateInput } from '@mantine/dates'; +import { Box, Button, Group, Input, SimpleGrid, Stack, Text, Textarea, TextInput } from '@mantine/core'; +import { DateInput, TimeInput } from '@mantine/dates'; import React, { useState } from 'react'; -import { BsCalendarDate } from 'react-icons/bs'; -import { PiIdentificationCardLight } from "react-icons/pi"; +import { IoIosArrowDropright } from 'react-icons/io'; +import { useRouter } from 'next/navigation'; +import LayoutModal from '@/module/_global/layout/layout_modal'; +import toast from 'react-hot-toast'; export default function NavbarCreateDivisionCalender() { + const [isModal, setModal] = useState(false) + + function onTrue(val: boolean) { + if (val) { + toast.success("Sukses! Data tersimpan"); + } + setModal(false) + } const [value, setValue] = useState(null); + const router = useRouter() return ( - } + size="md" + placeholder="Event Nama" + label="Event Nama" /> } + placeholder="Input Tanggal" + label="Tanggal" /> + + + + + + router.push('/calender/create?page=ulangi-event')}> + + Ulangi Event + + + + router.push('/calender/create?page=user-calender')}> + + Tambah Anggota + + + +