diff --git a/src/app/(application)/(detail-division)/calender/create/page.tsx b/src/app/(application)/(detail-division)/calender/create/page.tsx new file mode 100644 index 0000000..b37380e --- /dev/null +++ b/src/app/(application)/(detail-division)/calender/create/page.tsx @@ -0,0 +1,10 @@ +import { ViewCreateDivisionCalender } 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 69da2f2..ec16ade 100644 --- a/src/app/(application)/(detail-division)/calender/page.tsx +++ b/src/app/(application)/(detail-division)/calender/page.tsx @@ -1,10 +1,9 @@ +import { ViewDivisionCalender } from '@/module/division_new'; import React from 'react'; function Page() { return ( -
- Page -
+ ); } diff --git a/src/module/_global/layout/layout_navbar_new.tsx b/src/module/_global/layout/layout_navbar_new.tsx index 977a840..9a87534 100644 --- a/src/module/_global/layout/layout_navbar_new.tsx +++ b/src/module/_global/layout/layout_navbar_new.tsx @@ -11,7 +11,7 @@ export const LayoutNavbarNew = ({ back, title, menu }: { back: string, title: st style={{ borderBottomLeftRadius: 20, borderBottomRightRadius: 20, - zIndex: 100, + zIndex: 900, boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)" }} > @@ -20,7 +20,6 @@ export const LayoutNavbarNew = ({ back, title, menu }: { back: string, title: st - {/* GROUP */} {_.startCase(title)} diff --git a/src/module/division_new/_division_fitur/calender/components/create_calender_division_caleder.tsx b/src/module/division_new/_division_fitur/calender/components/create_calender_division_caleder.tsx new file mode 100644 index 0000000..2cfc315 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/create_calender_division_caleder.tsx @@ -0,0 +1,11 @@ +import { Box } from '@mantine/core'; +import React from 'react'; +import NavbarCreateDivisionCalender from './navbar_create_division_calender'; + +export default function CreateCalenderDivisionCaleder() { + 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 new file mode 100644 index 0000000..8faea28 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/date_event_division.tsx @@ -0,0 +1,104 @@ +import { WARNA } from '@/module/_global'; +import { Box, Divider, Group, Indicator, Text } from '@mantine/core'; +import { DatePicker, DatePickerProps } from '@mantine/dates'; +import React from 'react'; + +const HariIni = [ + { + id: 1, + title: 'Pembahasan Mengenai Darmasaba', + jamAwal: "10.00", + jamAkhir: "11.00", + dibuat: "Jhon" + }, + { + id: 2, + title: 'Pembahasan Mengenai Darmasaba', + jamAwal: "11.00", + jamAkhir: "12.00", + dibuat: "Jhon" + }, +] +const Besok = [ + { + id: 1, + title: 'Pembahasan Mengenai Darmasaba', + jamAwal: "10.00", + jamAkhir: "11.00", + dibuat: "Jhon" + }, + { + id: 2, + title: 'Pembahasan Mengenai Darmasaba', + jamAwal: "11.00", + jamAkhir: "12.00", + dibuat: "Jhon" + }, +] + +export default function DateEventDivision() { + const dayRenderer: DatePickerProps['renderDay'] = (date) => { + const day = date.getDate(); + return ( + +
{day}
+ + ); + }; + return ( + + + + + + Hari Ini + {HariIni.map((event, index) => { + const bgColor = ['#D8D8F1', '#FED6C5'][index % 2] + const colorDivider = ['#535FCA', '#A7A7A7'][index % 2] + return ( + + + + + + {event.jamAwal} - {event.jamAkhir} + {event.title} + Dibuat oleh : {event.dibuat} + + + + + ) + })} + 16 Juli 2024 + {Besok.map((event, index) => { + const bgColor = ['#D8D8F1', '#FED6C5'][index % 2] + const colorDivider = ['#535FCA', '#A7A7A7'][index % 2] + return ( + + + + + + {event.jamAwal} - {event.jamAkhir} + {event.title} + Dibuat oleh : {event.dibuat} + + + + + ) + })} + + + ); +} 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 new file mode 100644 index 0000000..32b80db --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx @@ -0,0 +1,35 @@ +import { WARNA } from '@/module/_global'; +import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core'; +import React from 'react'; +import { AiOutlineFileSearch } from 'react-icons/ai'; +import { IoAddCircle } from 'react-icons/io5'; + +export default function DawerDivisionCalender() { + return ( + + + + window.location.href = "/calender/create"} justify={'center'} align={'center'} direction={'column'} > + + + + + Tambah Kalender + + + window.location.href = ""} justify={'center'} align={'center'} direction={'column'} > + + + + + Riwayat + + + + + + ); +} + 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 new file mode 100644 index 0000000..627ba85 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx @@ -0,0 +1,44 @@ +"use client" +import { LayoutNavbarNew, WARNA } from '@/module/_global'; +import { Box, Input, Stack } from '@mantine/core'; +import { DateInput } from '@mantine/dates'; +import React, { useState } from 'react'; +import { BsCalendarDate } from 'react-icons/bs'; +import { PiIdentificationCardLight } from "react-icons/pi"; + +export default function NavbarCreateDivisionCalender() { + const [value, setValue] = useState(null); + return ( + + + + + } + /> + } + /> + + + + ); +} diff --git a/src/module/division_new/_division_fitur/calender/components/navbar_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/navbar_division_calender.tsx new file mode 100644 index 0000000..9962b38 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/components/navbar_division_calender.tsx @@ -0,0 +1,29 @@ +'use client' +import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global'; +import { ActionIcon, Box } from '@mantine/core'; +import React, { useState } from 'react'; +import { HiMenu } from 'react-icons/hi'; +import DawerDivisionCalender from './dawer_division_calender'; +import DateEventDivision from './date_event_division'; + +export default function NavbarDivisionCalender() { + const [openDrawer, setOpenDrawer] = useState(false) + return ( +
+ setOpenDrawer(true)} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings"> + + + } + /> + + + + setOpenDrawer(false)}> + + +
+ ); +} + diff --git a/src/module/division_new/_division_fitur/calender/view/view_create_division_calender.tsx b/src/module/division_new/_division_fitur/calender/view/view_create_division_calender.tsx new file mode 100644 index 0000000..55b6898 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/view/view_create_division_calender.tsx @@ -0,0 +1,9 @@ +import React from 'react'; +import CreateCalenderDivisionCaleder from '../components/create_calender_division_caleder'; + +export default function ViewCreateDivisionCalender() { + return ( + + ); +} + diff --git a/src/module/division_new/_division_fitur/calender/view/view_division_calender.tsx b/src/module/division_new/_division_fitur/calender/view/view_division_calender.tsx new file mode 100644 index 0000000..9cc1113 --- /dev/null +++ b/src/module/division_new/_division_fitur/calender/view/view_division_calender.tsx @@ -0,0 +1,12 @@ +import React from 'react'; +import NavbarDivisionCalender from '../components/navbar_division_calender'; +import { Box } from '@mantine/core'; + +export default function ViewDivisionCalender() { + return ( + + + + ); +} + diff --git a/src/module/division_new/index.ts b/src/module/division_new/index.ts index 2affeb4..b97d315 100644 --- a/src/module/division_new/index.ts +++ b/src/module/division_new/index.ts @@ -1,3 +1,5 @@ +import ViewCreateDivisionCalender from "./_division_fitur/calender/view/view_create_division_calender"; +import ViewDivisionCalender from "./_division_fitur/calender/view/view_division_calender"; import ViewDetailDivisionTask from "./_division_fitur/task/view/view_detail_division_task"; import ViewDivisionTask from "./_division_fitur/task/view/view_division_task"; import ViewUpdateProgressDivisionTask from "./_division_fitur/task/view/view_update_progress_division_task"; @@ -16,4 +18,6 @@ export { ViewCreateReport } export { ViewDetailDivision } export { ViewDivisionTask } export { ViewDetailDivisionTask } -export { ViewUpdateProgressDivisionTask } \ No newline at end of file +export { ViewUpdateProgressDivisionTask } +export { ViewDivisionCalender } +export { ViewCreateDivisionCalender } \ No newline at end of file