wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #47 from bipproduction/lukman/15-juli-2024

Browse Source 
Lukman/15 juli 2024
This commit is contained in:
Amalia
2024-07-15 12:34:25 +08:00
committed by GitHub
parent 4629fb778c abe2f2916b
commit 0426c26a8d
17 changed files with 451 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/(application)/(detail-division)/calender/create/page.tsx Normal file
View File

@@ -0,0 +1,10 @@
import { ViewCreateDivisionCalender } from '@/module/division_new';
import React from 'react';
function Page() {
return (
<ViewCreateDivisionCalender/>
);
}
export default Page;

5
src/app/(application)/(detail-division)/calender/page.tsx
View File

@@ -1,10 +1,9 @@
import { ViewDivisionCalender } from '@/module/division_new';
import React from 'react';
function Page() {
return (
<div>
Page
</div>
<ViewDivisionCalender />
);
}

3
src/module/_global/layout/layout_navbar_new.tsx
View File

@@ -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
<LayoutIconBack back={back} />
</Grid.Col>
<Grid.Col span={8}>
{/* <Text ta={'center'} fw={'bold'} c={'white'}>GROUP</Text> */}
<Title c={WARNA.bgWhite} ta={'center'} order={3}>{_.startCase(title)}</Title>
</Grid.Col>
<Grid.Col span="auto">

11
src/module/division_new/_division_fitur/calender/components/create_calender_division_caleder.tsx Normal file
View File

@@ -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 (
<Box>
<NavbarCreateDivisionCalender />
</Box>
);
}

104
src/module/division_new/_division_fitur/calender/components/date_event_division.tsx Normal file
View File

@@ -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 (
<Indicator size={6} color="red" offset={-5} disabled={day !== 16}>
<div>{day}</div>
</Indicator>
);
};
return (
<Box>
<Group
justify="center"
bg={"white"}
py={20}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<DatePicker size='md' defaultValue={new Date()} renderDay={dayRenderer} />
</Group>
<Box>
<Text mb={10} mt={20} fw={"bold"}>Hari Ini</Text>
{HariIni.map((event, index) => {
const bgColor = ['#D8D8F1', '#FED6C5'][index % 2]
const colorDivider = ['#535FCA', '#A7A7A7'][index % 2]
return (
<Box key={event.id} mt={10}>
<Box bg={bgColor} pl={15} p={10} style={{
borderRadius: 10
}} h={113}>
<Group>
<Divider h={92} size="lg" orientation="vertical" color={colorDivider} />
<Box>
<Text>{event.jamAwal} - {event.jamAkhir}</Text>
<Text fw={"bold"}>{event.title}</Text>
<Text>Dibuat oleh : {event.dibuat}</Text>
</Box>
</Group>
</Box>
</Box>
)
})}
<Text mb={10} mt={20} fw={"bold"}>16 Juli 2024</Text>
{Besok.map((event, index) => {
const bgColor = ['#D8D8F1', '#FED6C5'][index % 2]
const colorDivider = ['#535FCA', '#A7A7A7'][index % 2]
return (
<Box key={event.id} mt={10}>
<Box bg={bgColor} pl={15} p={10} style={{
borderRadius: 10
}} h={113}>
<Group>
<Divider h={92} size="lg" orientation="vertical" color={colorDivider} />
<Box>
<Text>{event.jamAwal} - {event.jamAkhir}</Text>
<Text fw={"bold"}>{event.title}</Text>
<Text>Dibuat oleh : {event.dibuat}</Text>
</Box>
</Group>
</Box>
</Box>
)
})}
</Box>
</Box>
);
}

35
src/module/division_new/_division_fitur/calender/components/dawer_division_calender.tsx Normal file
View File

@@ -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 (
<Box>
<Stack pt={10}>
<SimpleGrid
cols={{ base: 2, sm: 3, lg: 3 }}
>
<Flex onClick={() => window.location.href = "/calender/create"} justify={'center'} align={'center'} direction={'column'} >
<Box>
<IoAddCircle size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text ta={"center"} c={WARNA.biruTua}>Tambah Kalender</Text>
</Box>
</Flex>
<Flex onClick={() => window.location.href = ""} justify={'center'} align={'center'} direction={'column'} >
<Box>
<AiOutlineFileSearch size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Riwayat</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
</Box>
);
}

44
src/module/division_new/_division_fitur/calender/components/navbar_create_division_calender.tsx Normal file
View File

@@ -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<Date | null>(null);
return (
<Box>
<LayoutNavbarNew back="/calender" title="tambah kalender" menu />
<Box p={20}>
<Stack>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Event Name"
size="lg"
leftSection={<PiIdentificationCardLight size={30} color={WARNA.biruTua} />}
/>
<DateInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
value={value}
onChange={setValue}
placeholder="Date input"
size="lg"
leftSection={<BsCalendarDate size={25} color={WARNA.biruTua} />}
/>
</Stack>
</Box>
</Box>
);
}

29
src/module/division_new/_division_fitur/calender/components/navbar_division_calender.tsx Normal file
View File

@@ -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 (
<div>
<LayoutNavbarNew back="" title="Divisi - kalender"
menu={
<ActionIcon variant="light" onClick={() => setOpenDrawer(true)} bg={WARNA.bgIcon} size="lg" radius="lg" aria-label="Settings">
<HiMenu size={20} color='white' />
</ActionIcon>
}
/>
<Box p={20}>
<DateEventDivision/>
</Box>
<LayoutDrawer opened={openDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}>
<DawerDivisionCalender/>
</LayoutDrawer>
</div>
);
}

9
src/module/division_new/_division_fitur/calender/view/view_create_division_calender.tsx Normal file
View File

@@ -0,0 +1,9 @@
import React from 'react';
import CreateCalenderDivisionCaleder from '../components/create_calender_division_caleder';
export default function ViewCreateDivisionCalender() {
return (
<CreateCalenderDivisionCaleder />
);
}

12
src/module/division_new/_division_fitur/calender/view/view_division_calender.tsx Normal file
View File

@@ -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 (
<Box>
<NavbarDivisionCalender/>
</Box>
);
}

69
src/module/division_new/components/create_report.tsx
View File

@@ -1,10 +1,12 @@
"use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { Box, Select, Stack } from '@mantine/core';
import { DateInput } from '@mantine/dates';
import React, { useState } from 'react';
import EchartPaiReport from './echart_pai_report';
import EchartBarReport from './echart_bar_report';
"use client";
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import { Box, Select, Stack, Text } from "@mantine/core";
import { DateInput } from "@mantine/dates";
import React, { useState } from "react";
import EchartPaiReport from "./echart_pai_report";
import EchartBarReport from "./echart_bar_report";
import EventReport from "./event_report";
import DiscussionReport from "./discussion_report";
export default function CreateReport() {
const [value, setValue] = useState<Date | null>(null);
@@ -30,28 +32,55 @@ export default function CreateReport() {
placeholder="Date input"
/>
<Box pt={10}>
<Box bg={'white'} style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10
}}>
<Box
bg={"white"}
style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10,
}}
>
<EchartPaiReport />
</Box>
</Box>
<Box pt={10}>
<Box bg={'white'} style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10
}}>
<Box
bg={"white"}
style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10,
}}
>
<EchartBarReport />
</Box>
</Box>
<Box pt={10}>
<Box
bg={"white"}
style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10,
}}
>
<EventReport />
</Box>
</Box>
<Box pt={10}>
<Box
bg={"white"}
style={{
border: `1px solid ${WARNA.borderBiruMuda}`,
borderRadius: 10,
padding: 10,
}}
>
<DiscussionReport />
</Box>
</Box>
</Stack>
</Box>
</Box>
);
}

67
src/module/division_new/components/discussion_report.tsx Normal file
View File

@@ -0,0 +1,67 @@
import { WARNA } from "@/module/_global";
import { Box, Group, Text } from "@mantine/core";
import { GoDiscussionClosed } from "react-icons/go";
import { CiClock2, CiUser } from "react-icons/ci";
const dataDiskusi = [
{
id: 1,
judul: 'Mengatasi Limbah Makanan ',
user: 'Fibra Marcell',
date: '21 Juni 2024'
},
{
id: 2,
judul: 'Pentingnya Menjaga Kelestarian Hutan ',
user: 'Bayu Tegar',
date: '15 Juni 2024'
},
{
id: 3,
judul: 'Mengatasi Limbah Industri ',
user: 'Nian Putri',
date: '11 Mei 2024'
},
{
id: 4,
judul: 'Manfaat Sampah Plastik',
user: 'Budi Prasetyo',
date: '10 Mei 2024'
},
]
export default function DiscussionReport() {
return (
<Box pt={10}>
<Text ta={"center"} mb={20} fw={'bold'}>DISKUSI</Text>
{dataDiskusi.map((v, i) => {
return (
<Box key={i} m={10}>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 15
}} mb={10}>
<Group align="center">
<GoDiscussionClosed size={25} />
<Box w={{ base: 230, md: 400 }}>
<Text truncate="end" fw={'bold'}>{v.judul}</Text>
</Box>
</Group>
<Group justify="space-between" align="center" mt={20} c={'#8C8C8C'}>
<Group gap={5} align="center">
<CiUser size={18} />
<Text fz={13}>{v.user}</Text>
</Group>
<Group gap={5} align="center">
<CiClock2 size={18} />
<Text fz={13}>{v.date}</Text>
</Group>
</Group>
</Box>
</Box>
)
})
}
</Box>
)
}

6
src/module/division_new/components/echart_bar_report.tsx
View File

@@ -16,9 +16,11 @@ export default function EchartBarReport() {
const loadData = () => {
const option: EChartsOption = {
title: {
text: "SENTIMENT ANALYSIS",
text: "DOKUMEN",
top: '2%',
left: 'center',
textStyle: {
color: "white"
color: WARNA.biruTua
}
},
tooltip: {

2
src/module/division_new/components/echart_pai_report.tsx
View File

@@ -30,7 +30,7 @@ export default function EchartPaiReport() {
{
name: 'Progres Tugas',
type: 'pie',
radius: '80%',
radius: '70%',
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 2,

62
src/module/division_new/components/event_report.tsx Normal file
View File

@@ -0,0 +1,62 @@
import { Box, Divider, Group, ScrollArea, Stack, Text } from '@mantine/core';
import React from 'react';
const dataEvent = [
{
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"
},
{
id: 3,
title: 'Pembahasan Mengenai Darmasaba',
jamAwal: "13.00",
jamAkhir: "14.00",
dibuat: "Jhon"
},
{
id: 4,
title: 'Pembahasan Mengenai Darmasaba',
jamAwal: "15.00",
jamAkhir: "16.00",
dibuat: "Jhon"
},
]
export default function EventReport() {
return (
<Box>
<Text mb={20} mt={10} ta={'center'} fw={"bold"}>EVENT SELESAI DILAKSANAKAN</Text>
{dataEvent.map((event, index) => {
const bgColor = ['#D8D8F1', '#FED6C5'][index % 2]
const colorDivider = ['#535FCA', '#A7A7A7'][index % 2]
return (
<Box key={event.id} m={10}>
<Box bg={bgColor} pl={15} p={10} style={{
borderRadius: 10
}} h={113}>
<Group>
<Divider h={92} size="lg" orientation="vertical" color={colorDivider} />
<Box>
<Text>{event.jamAwal} - {event.jamAkhir}</Text>
<Text fw={"bold"}>{event.title}</Text>
<Text>Dibuat oleh : {event.dibuat}</Text>
</Box>
</Group>
</Box>
</Box>
)
})}
</Box>
);
}

4
src/module/division_new/index.ts
View File

@@ -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 ViewCreateTaskDivision from "./_division_fitur/task/view/view_create_division_task";
import ViewDetailDivisionTask from "./_division_fitur/task/view/view_detail_division_task";
import ViewDivisionTask from "./_division_fitur/task/view/view_division_task";
@@ -18,4 +20,6 @@ export { ViewDetailDivision }
export { ViewDivisionTask }
export { ViewDetailDivisionTask }
export { ViewUpdateProgressDivisionTask }
export { ViewDivisionCalender }
export { ViewCreateDivisionCalender }
export { ViewCreateTaskDivision }

12
src/module/home/components/list_event.tsx
View File

@@ -49,14 +49,16 @@ export default function ListEvent() {
}} mb={10}>
<Group>
<GoDiscussionClosed size={25} />
<Text fw={'bold'}>{v.judul}</Text>
<Box w={{ base: 230, md: 400 }}>
<Text fw={'bold'}>{v.judul}</Text>
</Box>
</Group>
<Group justify="space-between" mt={10} c={'#8C8C8C'}>
<Group>
<Group justify="space-between" mt={20} c={'#8C8C8C'}>
<Group gap={5} align="center">
<CiUser size={18} />
<Text fz={13}>{v.user}</Text>
</Group>
<Group>
</Group >
<Group gap={5} align="center">
<CiClock2 size={18} />
<Text fz={13}>{v.date}</Text>
</Group>