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

upd: hapus file yg ga kepake

Browse Source 
Deskripsi:
- hapus file atau dokumen yang tidak terpakai

No Issues
This commit is contained in:
amel
2024-08-28 13:57:46 +08:00
parent cffc411fa8
commit b213d7aa5e
58 changed files with 2 additions and 1624 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/module/division/api/get/listProject.ts
View File

@@ -1,3 +0,0 @@
export function listProject(req: Request) {
return Response.json({ message: "ini adalah project" })
}

4
src/module/division/api/post/createProject.ts
View File

@@ -1,4 +0,0 @@
export async function createProject(req: Request) {
const data = await req.json()
return Response.json({ message: "success create projects" })
}

0
src/module/division/calendar/index.ts
View File

68
src/module/division/component/BottomDrawer.tsx
View File

@@ -1,68 +0,0 @@
'use client'
import { ActionIcon, Drawer, Flex, Stack, Text } from "@mantine/core";
import { MdAddCircle, MdClose, MdFileCopy, MdSort } from "react-icons/md";
import { pagePathTestDivision } from "@/lib/pagePath";
export function BottomDrawer({ openDrawer, setOpenDrawer }: { openDrawer: boolean, setOpenDrawer: any }) {
function onAddDivisi() {
window.location.href = pagePathTestDivision({ searchParams: { page: "division-create" } })
}
function onDivisionFilter() {
window.location.href = pagePathTestDivision({ searchParams: { page: "division-filter" } })
}
function onDivisionReport() {
window.location.href = pagePathTestDivision({ searchParams: { page: "division-report" } })
}
return <Drawer
p={0}
opened={openDrawer}
onClose={() => setOpenDrawer(false)}
position="bottom"
withCloseButton={false}
styles={{
content: {
margin: "0 auto",
maxWidth: 550,
height: 200,
borderTopRightRadius: 20,
borderTopLeftRadius: 20
}
}}
>
<Stack gap={"md"}>
<Flex justify="space-between">
<Flex justify={"end"}>
<Text>Menu</Text>
</Flex>
<ActionIcon onClick={() => setOpenDrawer(false)} variant="subtle">
<MdClose />
</ActionIcon>
</Flex>
<Flex gap={"md"} justify={"space-evenly"}>
<Stack align="center">
<ActionIcon onClick={onAddDivisi} size={"xl"} variant="subtle">
<MdAddCircle size={32} />
</ActionIcon>
<Text>Tambah Divisi</Text>
</Stack>
<Stack align="center">
<ActionIcon onClick={onDivisionFilter} size={"xl"} variant="subtle">
<MdSort size={32} />
</ActionIcon>
<Text>Filter</Text>
</Stack>
<Stack align="center">
<ActionIcon onClick={onDivisionReport} variant="subtle" size={"xl"}>
<MdFileCopy size={32} />
</ActionIcon>
<Text>Report</Text>
</Stack>
</Flex>
</Stack>
</Drawer>
}

26
src/module/division/component/ContainerDivision.tsx
View File

@@ -1,26 +0,0 @@
'use client'
import { Box } from "@mantine/core"
import _ from "lodash"
import { DivisionCreate } from "../ui/DivisionCreate"
import { DivisionFilter } from "../ui/DivisionFilter"
import { DivisionReport } from "../ui/DivisionReport"
import { HeadDivision } from "./HeadDivision"
import { ListWithSearch } from "./ListWithSearch"
import { DivisionView } from "../ui/DivisionView"
const listPage = ["division", "division-create", "division-filter", "division-report"]
export function ContainerDevision({ params, searchParams, list_devision, countDevision }: { params: any, searchParams: any, list_devision: any[], countDevision: any }) {
const page = searchParams.page || "division"
const division = list_devision.map((v) => ({ ...v, name: _.kebabCase(v.name) })).find((v) => v.name === page) || null
return <Box>
<HeadDivision title={page} />
{/* {JSON.stringify(division)} */}
{page === "division" && <ListWithSearch count={countDevision} listData={list_devision} />}
{page === "division-create" && <DivisionCreate />}
{page === "division-filter" && <DivisionFilter />}
{page === "division-report" && <DivisionReport />}
{division && division.name === page && <DivisionView id={division.id} />}
</Box>
}

36
src/module/division/component/HeadDivision.tsx
View File

@@ -1,36 +0,0 @@
'use client'
import { WARNA } from "@/module/_global";
import { ActionIcon, Box, Flex, Title } from "@mantine/core";
import { useSearchParams } from "next/navigation";
import { useState } from "react";
import { MdArrowBackIos, MdMenu } from "react-icons/md";
import { useTitle } from "../lib/devision_state";
import { BottomDrawer } from "./BottomDrawer";
import { pagePathTestDivision } from "@/lib/pagePath";
import _ from "lodash";
export function HeadDivision({ title }: { title: string }) {
const [openDrawer, setOpenDrawer] = useState(false)
function onBack() {
window.location.href = pagePathTestDivision()
}
return <Box pos={"sticky"} top={0} bg={WARNA.biruTua} p={"lg"} style={{
borderBottomLeftRadius: 20,
borderBottomRightRadius: 20,
zIndex: 999,
boxShadow: "0px 4px 4px rgba(0, 0, 0, 0.25)"
}}>
<Flex justify={"space-between"}>
<ActionIcon onClick={onBack} bg={WARNA.bgIcon} radius={100}>
<MdArrowBackIos />
</ActionIcon>
<Title c={WARNA.bgWhite} order={3}>{_.startCase(title)}</Title>
<ActionIcon onClick={() => setOpenDrawer(true)} bg={WARNA.bgIcon} >
<MdMenu />
</ActionIcon>
</Flex>
<BottomDrawer openDrawer={openDrawer} setOpenDrawer={setOpenDrawer} />
</Box>
}

11
src/module/division/component/ListDivision.tsx
View File

@@ -1,11 +0,0 @@
import { Stack } from "@mantine/core";
import { ViewGrid } from "./ViewGrid";
import { ViewList } from "./ViewList";
export function ListDivision({ listData, isGrid }: { listData: any[], isGrid?: boolean }) {
return <Stack gap={"md"} p={"md"}>
{listData.map((v, k) => isGrid ? <ViewGrid v={v} key={k} /> : <ViewList v={v} key={k} />)}
</Stack>
}

40
src/module/division/component/ListWithSearch.tsx
View File

@@ -1,40 +0,0 @@
'use client'
import { Box, Card, Center, Flex, Stack, Text, Title } from "@mantine/core"
import { ListDivision } from "./ListDivision"
import { SearchDivision } from "./SearchDivision"
import { ToogleList } from "./ToogleList"
import { useState } from "react"
import { useShallowEffect } from "@mantine/hooks"
import { WARNA } from "@/module/_global"
import { apiFetchTestDevisionListDivisionGET } from "@/lib/apiFetch"
export function ListWithSearch({ listData, count }: { listData: any[], count: number }) {
const [isGrid, setIsGrid] = useState(true)
const [search, setSearch] = useState("")
const [listDivision, setListDivision] = useState(listData)
useShallowEffect(() => {
apiFetchTestDevisionListDivisionGET().then(setListDivision)
}, [])
return <Stack>
<Flex align={"center"} p={"md"} gap={"md"}>
<SearchDivision setText={setSearch} text={search} />
<ToogleList isGrid={isGrid} setIsGrid={setIsGrid} />
</Flex>
<Box p={"md"}>
<Card p={"md"} bg={WARNA.biruTua}>
<Stack>
<Text size="md" fw={"bold"} c={WARNA.bgWhite}>Total Divisi</Text>
<Center>
<Title c={WARNA.bgWhite}>{count}</Title>
</Center>
</Stack>
</Card>
</Box>
<ListDivision listData={listDivision.filter((v) => v.name.toLowerCase().includes(search.toLowerCase()))} isGrid={isGrid} />
</Stack>
}

16
src/module/division/component/MorePeopleIcon.tsx
View File

@@ -1,16 +0,0 @@
'use client'
import { WARNA } from "@/module/_global"
import { Avatar } from "@mantine/core"
import { MdAccountCircle, MdPeople } from "react-icons/md"
export function MorePeopleIcon() {
return <Avatar.Group>
<Avatar>
<MdAccountCircle size={32} color={WARNA.biruTua} />
</Avatar>
<Avatar>
+5
</Avatar>
</Avatar.Group>
}

8
src/module/division/component/SearchDivision.tsx
View File

@@ -1,8 +0,0 @@
'use client'
import { TextInput } from "@mantine/core"
import { MdSearch } from "react-icons/md"
export function SearchDivision({ text, setText }: { text: string, setText: any }) {
return <TextInput onChange={(e) => setText(e.target.value)} value={text} radius={30} leftSection={<MdSearch />} placeholder="Cari Divisi" />
}

17
src/module/division/component/ToogleList.tsx
View File

@@ -1,17 +0,0 @@
'use client'
import { ActionIcon, Box } from "@mantine/core"
import { useState } from "react"
import { MdGrid3X3, MdGridView, MdList, MdViewList } from "react-icons/md"
export function ToogleList({ isGrid, setIsGrid }: { isGrid: boolean, setIsGrid: any }) {
function onToogleList() {
setIsGrid(!isGrid)
}
return <Box>
<ActionIcon variant="light" onClick={onToogleList}>
{isGrid ? <MdList size={24} /> : <MdGridView size={22} />}
</ActionIcon>
</Box>
}

36
src/module/division/component/ViewGrid.tsx
View File

@@ -1,36 +0,0 @@
import { WARNA } from "@/module/_global";
import { Stack, Box, Title, Group, Text, UnstyledButton } from "@mantine/core";
import { MorePeopleIcon } from "./MorePeopleIcon";
import { pagePathTestDivision } from "@/lib/pagePath";
import _ from "lodash";
export function ViewGrid({ v }: { v: any }) {
return (
<UnstyledButton onClick={() => {
window.location.href = pagePathTestDivision({ searchParams: { page: _.kebabCase(v.name) } })
}}>
<Stack gap={0}>
<Box style={{
borderTopLeftRadius: 8,
borderTopRightRadius: 8
}} p={"xl"} bg={WARNA.biruTua}>
<Title style={{
textAlign: "center"
}} order={3} c={WARNA.bgWhite}>{v.name}</Title>
</Box>
<Box style={{
border: "1px solid " + WARNA.biruTua,
borderBottomLeftRadius: 8,
borderBottomRightRadius: 8
}} p={"md"}>
<Stack>
<Text pr={100}>{v.desc}</Text>
<Group justify="end">
<MorePeopleIcon />
</Group>
</Stack>
</Box>
</Stack>
</UnstyledButton>
);
}

23
src/module/division/component/ViewList.tsx
View File

@@ -1,23 +0,0 @@
import { pagePathTestDivision } from "@/lib/pagePath";
import { Avatar, Flex, Stack, Text, Title, UnstyledButton } from "@mantine/core";
import _ from "lodash";
import { MdPeople } from "react-icons/md";
export function ViewList({ v }: { v: any }) {
return (
<UnstyledButton onClick={() => {
window.location.href = pagePathTestDivision({ searchParams: { page: _.kebabCase(v.name) } })
}}>
<Stack py={"md"} style={{
borderBottom: "0.5px solid " + "gray"
}}>
<Flex gap={"md"} align={"center"}>
<Avatar bg={"orange"} color="white">
<MdPeople size={32} />
</Avatar>
<Text fw={"bold"}>{v.name}</Text>
</Flex>
</Stack>
</UnstyledButton>
)
}

0
src/module/division/discussion/index.ts
View File

0
src/module/division/document/index.ts
View File

0
src/module/division/index.ts
View File

33
src/module/division/lib/BottomMenu.tsx
View File

@@ -1,33 +0,0 @@
import { ActionIcon, Drawer, Flex, Stack, Text } from "@mantine/core";
import { MdClose } from "react-icons/md";
export function BottomMenu({size, title, openDrawer, setOpenDrawer, children }: { size?: number | string, title?: string, openDrawer: boolean, setOpenDrawer: any, children: React.ReactNode }) {
return <Drawer
p={0}
opened={openDrawer}
onClose={() => setOpenDrawer(false)}
position="bottom"
withCloseButton={false}
size={size || "md"}
styles={{
content: {
margin: "0 auto",
maxWidth: 550,
borderTopRightRadius: 20,
borderTopLeftRadius: 20
}
}}
>
<Stack gap={"md"}>
<Flex justify="space-between">
<Flex justify={"end"}>
<Text>{title || 'Menu'}</Text>
</Flex>
<ActionIcon onClick={() => setOpenDrawer(false)} variant="subtle">
<MdClose />
</ActionIcon>
</Flex>
{children}
</Stack>
</Drawer>
}

25
src/module/division/lib/ButtonConfirm.tsx
View File

@@ -1,25 +0,0 @@
import { WARNA } from "@/module/_global";
import { Button, Flex, Stack, Text, UnstyledButton } from "@mantine/core";
import { BottomMenu } from "./BottomMenu";
import { useState } from "react";
export function ButtonConfirm({ label, desc, onConfirm }: { label: string, desc: string, onConfirm: () => void }) {
const [open, setOpen] = useState(false)
const onClickConfirm = () => {
setOpen(false)
onConfirm()
}
return <Stack>
<Button onClick={() => setOpen(true)} radius={50} color={WARNA.biruTua}>{label}</Button>
<BottomMenu size={"xs"} title="Konfirmasi" openDrawer={open} setOpenDrawer={setOpen}>
<Stack gap={"xl"}>
<Text>{desc}</Text>
<Flex justify={"end"} gap={"xl"}>
<UnstyledButton onClick={() => setOpen(false)}>Cancel</UnstyledButton>
<Button onClick={onClickConfirm} color={WARNA.biruTua}>Confirm</Button>
</Flex>
</Stack>
</BottomMenu>
</Stack>
}

6
src/module/division/lib/ButtonNavi.tsx
View File

@@ -1,6 +0,0 @@
import { WARNA } from "@/module/_global";
import { Button } from "@mantine/core";
export function ButtonNavi({ children, onClick }: { children: React.ReactNode, onClick?: () => void }) {
return <Button radius={50} color={WARNA.biruTua} onClick={onClick}>{children}</Button>
}

53
src/module/division/lib/MultiSelectList.tsx
View File

@@ -1,53 +0,0 @@
'use client'
import { ActionIcon, Anchor, Button, Card, Divider, Flex, Group, NavLink, Paper, ScrollArea, Select, Stack, Text, UnstyledButton } from "@mantine/core";
import { useState } from "react";
import { MdArrowForwardIos, MdCheckBox, MdCheckBoxOutlineBlank } from "react-icons/md";
import { BottomMenu } from "./BottomMenu";
import { ButtonNavi } from "./ButtonNavi";
import _ from "lodash";
import { WARNA } from "@/module/_global";
export function MultiSelectList(
{ label, placeholder, data = [], listSelected = [], setListSelected }:
{ label?: string, placeholder?: string, data?: any[], listSelected: any[], setListSelected: any }
) {
const [open, setOpen] = useState(false)
// const [listSelected, setListSelected] = useState(defaultValue)
function selected(value: { label: string, value: any }) {
if (listSelected.includes(value.value)) {
setListSelected(listSelected.filter((v) => v !== value.value))
} else {
setListSelected([...listSelected, value.value])
}
}
const onClickSimpan = () => {
setOpen(false)
}
return <Stack>
<UnstyledButton onClick={() => setOpen(true)}>
<Paper p={"sm"} withBorder radius={12}>
<Flex justify={"space-between"}>
<Text>{_.isEmpty(listSelected) ? "Pilih Anggota" : "Tambah Anggota"}</Text>
<MdArrowForwardIos size={"1.5rem"} />
</Flex>
</Paper>
</UnstyledButton>
<BottomMenu title="Pilih Anggota" openDrawer={open} setOpenDrawer={setOpen}>
<Stack>
<ScrollArea.Autosize mah={300} >
{data.map((v, k) => <Stack key={k} gap={"lg"}>
<NavLink
onClick={() => selected(v)}
leftSection={listSelected.includes(v.value) ? <MdCheckBox size={"1.5rem"} /> : <MdCheckBoxOutlineBlank size={"1.5rem"} />}
label={v.label} />
</Stack>)}
</ScrollArea.Autosize>
<Group justify="end">
<ButtonNavi onClick={onClickSimpan}>Simpan</ButtonNavi>
</Group>
</Stack>
</BottomMenu>
</Stack>
}

46
src/module/division/lib/SingleSelect.tsx
View File

@@ -1,46 +0,0 @@
'use client'
import { Flex, Group, NavLink, Paper, ScrollArea, Select, Stack, Text, UnstyledButton } from "@mantine/core";
import { useState } from "react";
import { BottomMenu } from "./BottomMenu";
import { MdArrowForwardIos, MdCheckBox, MdCheckBoxOutlineBlank } from "react-icons/md";
import _ from "lodash";
export function SingleSelect({ desc, icon, placeholder, selected, setSelected, data }: { desc?: string, icon?: any, placeholder: string, selected: any, setSelected: any, data: any[] }) {
const [open, setOpen] = useState(false)
const completed = desc && !_.isEmpty(data) && !_.isEmpty(selected)
const onSelected = (value: any) => {
setSelected(value)
setOpen(false)
}
return <Stack>
<UnstyledButton onClick={() => setOpen(true)} disabled={_.isEmpty(data)}>
<Paper p={"sm"} withBorder radius={12} bg={_.isEmpty(data) ? "transparent" : "white"}>
<Stack gap={ completed ? "sm" : 0}>
<Flex justify={"space-between"}>
<Flex gap={"md"} align={"center"}>
{icon && icon}
<Text c={_.isEmpty(selected) ? "dimmed" : "black"}>{!_.isEmpty(data) ? data?.filter((v) => v.value === selected)[0]?.label || placeholder : placeholder}</Text>
</Flex>
<MdArrowForwardIos color={_.isEmpty(data) ? "light" : "black"} size={"1.5rem"} />
</Flex>
{completed && <Group justify="end"><Text c="dimmed" size="sm">{desc}</Text></Group>}
</Stack>
</Paper>
</UnstyledButton>
<BottomMenu openDrawer={open} setOpenDrawer={setOpen} >
<Stack>
<ScrollArea.Autosize mah={300} >
{data?.map((v, k) => <NavLink
onClick={() => onSelected(v.value)}
leftSection={selected === v.value ?
<MdCheckBox size={"1.5rem"} /> :
<MdCheckBoxOutlineBlank
size={"1.5rem"} />}
key={k}
label={v.label} />)}
</ScrollArea.Autosize>
</Stack>
</BottomMenu>
</Stack>
}

12
src/module/division/lib/WebVitals.tsx
View File

@@ -1,12 +0,0 @@
'use client'
import { useReportWebVitals } from 'next/web-vitals';
export function WebVitals({ searchParams }: { searchParams: any }) {
const log = searchParams.log;
useReportWebVitals((metric) => {
log && console.log(JSON.stringify(metric, null, 4));
});
return null;
}

14
src/module/division/lib/devision_state.ts
View File

@@ -1,14 +0,0 @@
import { State, hookstate, useHookstate } from "@hookstate/core";
const useState = <T>(s: State<T>) => {
const state = useHookstate(s);
const get = state.value;
const set = (v: typeof state.value) => state.set(v);
return [get, set] as const;
};
const title = hookstate("Divisi")
export const useTitle = () => useState<string>(title);
const filter = hookstate("")
export const useDivisionfilter = () => useState<string>(filter)

5
src/module/division/lib/division/get_count_devision.ts
View File

@@ -1,5 +0,0 @@
import { list_devision } from "@/dummy_data";
export async function getCountDivision() {
return list_devision.length
}

45
src/module/division/lib/division/get_list_anggota.ts
View File

@@ -1,45 +0,0 @@
const listAnggota = [
{
id: "1",
name: "Anggota 1",
},
{
id: "2",
name: "Anggota 2",
},
{
id: "3",
name: "Anggota 3",
},
{
id: "4",
name: "Anggota 4",
},
{
id: "5",
name: "Anggota 5",
},
{
id: "6",
name: "Anggota 6",
},
{
id: "7",
name: "Anggota 7",
},
{
id: "8",
name: "Anggota 8",
},
{
id: "9",
name: "Anggota 9",
},
{
id: "10",
name: "Anggota 10",
},
]
export async function getListAnggota() {
return listAnggota
}

5
src/module/division/lib/division/get_list_devision.ts
View File

@@ -1,5 +0,0 @@
import { list_devision } from "@/dummy_data";
export async function getListDevision() {
return list_devision
}

18
src/module/division/lib/division/get_list_group.ts
View File

@@ -1,18 +0,0 @@
const listGroup = [
{
id: "1",
name: "Group 1",
},
{
id: "2",
name: "Group 2",
},
{
id: "3",
name: "Group 3",
}
]
export async function getListGroup() {
return listGroup
}

20
src/module/division/lib/toast.tsx
View File

@@ -1,20 +0,0 @@
import { WARNA } from '@/module/_global'
import t from 'react-simple-toasts'
type Event = "error" | "success" | "info" | "warning"
export const toast = (message: string, event?: Event) => {
t(message, {
position: "center",
render: (message) => <div style={{
padding: 12,
paddingLeft: 24,
paddingRight: 24,
borderRadius: "100px",
backgroundColor: event === "error" ? "red" : event === "success" ? "green" : event === "warning" ? "orange" : WARNA.biruTua,
color: "white",
boxShadow: "0px 0px 10px rgba(0, 0, 0, 0.3)",
}}>
<div >{message?.toString()}</div>
</div>,
})
}

0
src/module/division/project/index.ts
View File

82
src/module/division/ui/DivisionCreate.tsx
View File

@@ -1,82 +0,0 @@
'use client'
import { ActionIcon, Avatar, Button, Card, Flex, ScrollArea, Select, Stack, Text, TextInput, Textarea } from "@mantine/core"
import { MultiSelectList } from "../lib/MultiSelectList"
import { WARNA } from "@/module/_global"
import { useTestDevisionListAnggota, useTestDevisionListGroup } from "@/lib/stateApi"
import { useState } from "react"
import _ from "lodash"
import { MdAccountCircle, MdClose, MdGroup, MdGroupAdd, MdGroupWork, MdShield } from "react-icons/md"
import { ButtonNavi } from "../lib/ButtonNavi"
import { pagePathTestDivision } from "@/lib/pagePath"
import { SingleSelect } from "../lib/SingleSelect"
import { ButtonConfirm } from "../lib/ButtonConfirm"
import { toast } from "../lib/toast"
export function DivisionCreate() {
const [val, setVal, load] = useTestDevisionListGroup<any[]>()
const [listAnggota, setListAnggota] = useTestDevisionListAnggota<any[]>()
const [listSelectedAnggota, setListSelectedAnggota] = useState<any[]>([])
const [selectedAdmin, setSelectedAdmin] = useState("")
const [selectedGroup, setSelectedGroup] = useState("")
return <Stack p={"md"} gap={"md"} >
<SingleSelect
desc="Pilih Grup"
icon={<MdGroupWork size={"1.5rem"} />}
selected={selectedGroup}
setSelected={setSelectedGroup}
data={val && val.map((v) => ({ label: v.name, value: v.id }))}
placeholder="Pilih Grup" />
<TextInput
size="md"
withAsterisk
radius={12}
placeholder="Nama"
label="Masukan Nama" />
<Textarea
size="md"
withAsterisk
radius={12}
autosize
minRows={6}
maxRows={12}
placeholder="Masukan Deskripsi"
label="Masukan Deskripsi" />
<MultiSelectList setListSelected={setListSelectedAnggota} listSelected={listSelectedAnggota} placeholder="Pilih Anggota" data={listAnggota.map((v) => ({ label: v.name, value: v.id }))} />
<SelectedAnggotaContainer setListSelectedAnggota={setListSelectedAnggota} listSelectedAnggota={listSelectedAnggota} listAnggota={listAnggota} />
<SingleSelect desc="Pilih Admin" icon={<MdShield size={"1.5rem"} />} selected={selectedAdmin} setSelected={setSelectedAdmin} data={listAnggota.filter((v) => listSelectedAnggota.includes(v.id)).map((v) => ({ label: v.name, value: v.id }))} placeholder="Select Admin" />
<ButtonConfirm onConfirm={() => {
toast("Simpan Berhasil", "success")
}} label="Simpan" desc="Apakah anda yakin ingin menyimpan data?" />
</Stack>
}
function SelectedAnggotaContainer({ listSelectedAnggota, listAnggota, setListSelectedAnggota }: { listSelectedAnggota: any[], listAnggota?: any[], setListSelectedAnggota: any }) {
if (_.isEmpty(listSelectedAnggota)) return null
return <Card>
<Stack>
<Flex justify={"space-between"}>
<Text>Anggota Terpilih</Text>
<Text>Total: {listSelectedAnggota.length}</Text>
</Flex>
<ScrollArea.Autosize mah={200}>
{listAnggota?.filter((v) => listSelectedAnggota.includes(v.id)).map((v, k) => <Stack py={"sm"} key={k}>
<Flex align={"center"} gap={"md"} justify={"space-between"}>
<Flex gap={"md"}>
<Avatar size={"md"} color={WARNA.biruTua}><MdAccountCircle /></Avatar><Text>{v.name}</Text>
</Flex>
<ActionIcon onClick={() => {
setListSelectedAnggota((prev: any) => prev.filter((val: any) => val !== v.id))
}} variant="subtle">
<MdClose />
</ActionIcon>
</Flex>
</Stack>)}
</ScrollArea.Autosize>
</Stack>
</Card>
}

22
src/module/division/ui/DivisionFilter.tsx
View File

@@ -1,22 +0,0 @@
import { Button, Divider, Flex, ScrollArea, Stack, Text } from "@mantine/core";
import { useDivisionfilter } from "../lib/devision_state";
import { useTestDevisionListDivision } from "@/lib/stateApi";
import { WARNA } from "@/module/_global";
export function DivisionFilter() {
const [filterText, setFilterText] = useDivisionfilter()
const [listDevision, setListDevision] = useTestDevisionListDivision<any[]>()
return <Stack>
{/* {listDevision.map((v, k) => <ViewList key={k} v={v} />)} */}
<Button color={WARNA.biruTua} radius={100}>Terapkan</Button>
</Stack>
}
function ViewList({ v }: { v: any }) {
return <Stack gap={0}>
<Flex p={"md"}>
<Text>{v.name}</Text>
</Flex>
<Divider />
</Stack>
}

5
src/module/division/ui/DivisionLayout.tsx
View File

@@ -1,5 +0,0 @@
export function DevisionLayout({ children }: { children: React.ReactNode }) {
return <div>
{children}
</div>
}

21
src/module/division/ui/DivisionPage.tsx
View File

@@ -1,21 +0,0 @@
import { getCountDivision } from "@/module/division/lib/division/get_count_devision";
import { getListDevision } from "@/module/division/lib/division/get_list_devision";
import { ContainerDevision } from "../component/ContainerDivision";
import { WebVitals } from "../lib/WebVitals";
import { ProviderTestDevisionListAnggota, ProviderTestDevisionListDivision, ProviderTestDevisionListGroup } from "@/lib/stateApi";
import { getListGroup } from "../lib/division/get_list_group";
import { getListAnggota } from "../lib/division/get_list_anggota";
export async function DivisionPage({ params, searchParams }: { params: any, searchParams: any }) {
const list_devision = await getListDevision();
const countDevision = await getCountDivision()
const listGroup = await getListGroup()
const listAnggota = await getListAnggota()
return <div>
<WebVitals searchParams={searchParams} />
<ProviderTestDevisionListDivision data={list_devision} />
<ProviderTestDevisionListGroup data={listGroup} />
<ProviderTestDevisionListAnggota data={listAnggota} />
<ContainerDevision params={params} searchParams={searchParams} list_devision={list_devision} countDevision={countDevision} />
</div>
}

5
src/module/division/ui/DivisionReport.tsx
View File

@@ -1,5 +0,0 @@
export function DivisionReport() {
return <div>
report
</div>
}

270
src/module/division/ui/DivisionView.tsx
View File

@@ -1,270 +0,0 @@
'use client'
import { Carousel } from "@mantine/carousel";
import { Avatar, Box, Center, Flex, Grid, Image, Paper, ScrollArea, SimpleGrid, Stack, Text, Title, UnstyledButton } from "@mantine/core";
import { MdAccountCircle, MdArrowForwardIos, MdCalendarMonth, MdEditCalendar, MdEditDocument, MdFileCopy, MdMessage, MdPeople, MdTimer, MdWhatsapp } from "react-icons/md";
import * as ICON from './../lib/file_icon'
import { WARNA } from "@/module/_global";
const listCaresoul = [
{
"id": "1",
"title": "title 1",
"description": "description 1",
"image": "https://cdn.digitaldesa.com/uploads/landing/artikel/thumbs/360175162e868c7d0ae0dc7dbc62adf9.jpg",
},
{
"id": "2",
"title": "title 2",
"description": "description 2",
"image": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRxDUAjhyxqYuPigHXxQev_jX2zVqy9ULX5vQ&s",
},
{
"id": "3",
"title": "title 3",
"description": "description 3",
"image": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRxDUAjhyxqYuPigHXxQev_jX2zVqy9ULX5vQ&s",
}
]
const listFeatures = [
{
"id": "1",
"title": "tugas",
"description": "description 1",
"total": "10",
"icon": MdEditDocument
},
{
"id": "2",
"title": "document",
"description": "description 2",
"total": "10",
"icon": MdFileCopy
},
{
"id": "3",
"title": "diskusi",
"description": "description 3",
"total": "10",
"icon": MdWhatsapp
},
{
"id": "4",
"title": "kalendar",
"description": "kalendar",
"total": "10",
"icon": MdEditCalendar
}
]
const iconContainer = (icon: string) => 'data:image/svg+xml;base64,' + btoa(icon)
const listDocument = [
{
"id": "1",
"title": "image 1",
"description": "description 1",
"image": iconContainer(ICON.IMAGE),
},
{
"id": "2",
"title": "data pdf",
"description": "description 2",
"image": iconContainer(ICON.PDF),
},
{
"id": "3",
"title": "data pdf 3",
"description": "description 3",
"image": iconContainer(ICON.PDF),
},
{
"id": "4",
"title": "text 4",
"description": "description 4",
"image": iconContainer(ICON.TEXT),
},
{
"id": "5",
"title": "text 5",
"description": "description 5",
"image": iconContainer(ICON.TEXT),
}
]
const listTugasHariIni = [
{
"id": "1",
"title": "image 1",
"description": "description 1",
"image": iconContainer(ICON.IMAGE),
},
{
"id": "2",
"title": "data pdf",
"description": "description 2",
"image": iconContainer(ICON.PDF),
},
{
"id": "3",
"title": "data pdf 3",
"description": "description 3",
"image": iconContainer(ICON.PDF),
},
{
"id": "4",
"title": "text 4",
"description": "description 4",
"image": iconContainer(ICON.TEXT),
},
]
const diskusiTerbaru = [
{
"id": "1",
"title": "image 1",
"user": "description 1",
"date": "10-10-2022"
},
{
"id": "2",
"title": "data pdf",
"user": "description 2",
"date": "10-10-2022"
},
{
"id": "3",
"title": "data pdf 3",
"user": "description 3",
"date": "10-10-2022"
},
{
"id": "4",
"title": "text 4",
"user": "description 4",
"date": "10-10-2022"
},
{
"id": "5",
"title": "text 5",
"user": "description 5",
"date": "10-10-2022"
}
]
export function DivisionView({ id }: { id: string }) {
return (
<Stack>
<Carousel withIndicators height={200}>
{listCaresoul.map((v) => <Carousel.Slide key={v.id} p={"md"}>
<Paper withBorder shadow="sm" radius={12}>
<Image src={v.image} alt="image" />
</Paper>
</Carousel.Slide>)}
</Carousel>
<Stack p={"md"}>
<Title order={4}>Features</Title>
<SimpleGrid cols={2} spacing={"md"}>
{listFeatures.map((v) => <UnstyledButton key={v.id}>
<Paper withBorder radius={12} p={"sm"}>
<Grid >
<Grid.Col span={"content"}>
<Avatar size={"lg"} bg={"#DCEED8"} color={WARNA.biruTua}>
<v.icon size={"2.5rem"} />
</Avatar>
</Grid.Col>
<Grid.Col span={"auto"}>
<Stack gap={0}>
<Box>
<Title order={5}>{v.title}</Title>
</Box>
<Flex justify={"space-between"} align={"center"}>
<Text size="sm" c="dimmed">{v.total} totall</Text>
<MdArrowForwardIos />
</Flex>
</Stack>
</Grid.Col>
</Grid>
</Paper>
</UnstyledButton>)}
</SimpleGrid>
</Stack>
<Stack p={"md"}>
<Title order={4}>Tugas Hari Ini</Title>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
{listTugasHariIni.map((v) => <Carousel.Slide key={v.id}>
<UnstyledButton>
<Paper withBorder shadow="sm" radius={12} p={"md"} w={300} bg={WARNA.biruTua}>
<Stack>
<Title order={5} c={"white"} >{v.title}</Title>
<Flex w={"100%"} justify={"space-between"} align={"center"}>
<Flex gap={"sm"}>
<MdCalendarMonth color={"white"} size={"1.5rem"} />
<Text c={"white"}>{v.description}</Text>
</Flex>
<Avatar.Group>
<Avatar size={"md"} >
<MdAccountCircle size={"2.5rem"} />
</Avatar>
<Avatar size={"md"}>
+ 15
</Avatar>
</Avatar.Group>
</Flex>
</Stack>
</Paper>
</UnstyledButton>
</Carousel.Slide>)}
</Carousel>
</Stack>
<Stack p={"md"}>
<Title order={4}>Document Terbaru</Title>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
{listDocument.map((v) => <Carousel.Slide key={v.id}>
<UnstyledButton>
<Stack gap={0}>
<Paper withBorder shadow="sm" radius={12} >
<Center p={"md"}>
<Image w={"75"} src={v.image} alt="image" />
</Center>
</Paper>
<Box p={"sm"}>
<Text c={"dimmed"}>{v.title}</Text>
</Box>
</Stack>
</UnstyledButton>
</Carousel.Slide>)}
</Carousel>
</Stack>
<Stack p={"md"}>
<Title order={4}>Diskusi Terbaru</Title>
<Stack gap={"md"}>
{diskusiTerbaru.map((v) => <UnstyledButton key={v.id}>
<Paper withBorder radius={12} p={"md"}>
<Stack>
<Flex gap={"md"} align={"center"}>
<MdMessage size={"1.5rem"} />
<Title order={4}>{v.title}</Title>
</Flex>
<Flex justify={"space-between"} align={"center"}>
<Flex gap={"xs"} align={"center"} c={"dimmed"}>
<MdAccountCircle size={"1.5rem"} />
<Text>{v.user}</Text>
</Flex>
<Flex gap={"xs"} align={"center"} c={"dimmed"}>
<MdTimer size={"1.5rem"} />
<Text>{v.date}</Text>
</Flex>
</Flex>
</Stack>
</Paper>
</UnstyledButton>)}
</Stack>
</Stack>
</Stack>
)
}

11
src/module/division_new/_division_fitur/calender/components/create_user_division_calender.tsx
View File

@@ -1,11 +0,0 @@
import { Box } from '@mantine/core';
import React from 'react';
import NavbarCreateUserCalender from './navbar_create_user_calender';
export default function CreateUserDivisionCalender() {
return (
<Box>
<NavbarCreateUserCalender />
</Box>
);
}

67
src/module/division_new/_division_fitur/calender/components/list_ulangi_event.tsx
View File

@@ -1,67 +0,0 @@
"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 (
<Box>
{dataUlangi.map((v, i) => {
return (
<Box key={i} mb={20}>
<Box style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
padding: 20
}}
>
<Checkbox
label={v.name}
color="teal"
radius="xl"
/>
</Box>
</Box>
)
})}
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => router.push(``)}
>
Simpan
</Button>
</Box>
</Box>
);
}

119
src/module/division_new/_division_fitur/calender/components/navbar_create_user_calender.tsx
View File

@@ -1,119 +0,0 @@
'use client'
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { Avatar, Box, Button, Center, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
import { useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { HiMagnifyingGlass } from 'react-icons/hi2';
const dataUser = [
{
id: 1,
img: "https://i.pravatar.cc/500?img=3",
name: "Doni Setiawan",
},
{
id: 2,
img: "https://i.pravatar.cc/500?img=10",
name: "Ilham Udin",
},
{
id: 3,
img: "https://i.pravatar.cc/500?img=11",
name: "Didin Anang",
},
{
id: 4,
img: "https://i.pravatar.cc/500?img=1",
name: "Angga Saputra",
},
{
id: 5,
img: "https://i.pravatar.cc/500?img=2",
name: "Marcel Widianto",
},
{
id: 6,
img: "https://i.pravatar.cc/500?img=7",
name: "Bagas Nusantara",
},
];
export default function NavbarCreateUserCalender() {
const router = useRouter()
const [selectedFiles, setSelectedFiles] = useState<Record<number, boolean>>({});
const handleFileClick = (index: number) => {
setSelectedFiles((prevSelectedFiles) => ({
...prevSelectedFiles,
[index]: !prevSelectedFiles[index],
}));
};
return (
<Box>
<LayoutNavbarNew back="/calender/create" title="Tambah Anggota" menu />
<Box p={20}>
<Stack>
<TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: '#A3A3A3',
borderColor: '#A3A3A3',
},
}}
size="md"
radius={30}
leftSection={<HiMagnifyingGlass size={20} />}
placeholder="Pencarian"
/>
<Box pt={10}>
<SimpleGrid
cols={{ base: 2, sm: 2, lg: 2 }}
spacing={{ base: 20, sm: "xl" }}
verticalSpacing={{ base: "md", sm: "xl" }}
>
{dataUser.map((v, index) => {
const isSelected = selectedFiles[index];
return (
<Box key={index} mb={10}>
<Box
bg={isSelected ? WARNA.bgHijauMuda : "white"}
style={{
border: `1px solid ${WARNA.biruTua}`,
borderRadius: 20,
}}
py={10}
onClick={() => handleFileClick(index)}
>
<Center>
<Avatar src={v.img} alt="it's me" size="xl" />
</Center>
<Text mt={20} ta="center">
{v.name}
</Text>
</Box>
</Box>
);
})}
</SimpleGrid>
</Box>
</Stack>
<Box mt="xl">
<Button
color="white"
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => router.push("/calender/create")}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

15
src/module/division_new/_division_fitur/calender/components/ulangi_event.tsx
View File

@@ -1,15 +0,0 @@
import { LayoutNavbarNew } from '@/module/_global';
import { ActionIcon, Box } from '@mantine/core';
import React from 'react';
import ListUlangiEvent from './list_ulangi_event';
export default function UlangiEvent() {
return (
<Box>
<LayoutNavbarNew back='/calender/create' title='ulangi event' menu />
<Box p={20}>
<ListUlangiEvent />
</Box>
</Box>
);
}

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

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

9
src/module/division_new/_division_fitur/calender/view/view_detail_event_division.tsx
View File

@@ -1,9 +0,0 @@
import React from 'react';
import DetailEventDivision from '../../../../calender/ui/detail_event_division';
export default function ViewDetailEventDivision() {
return (
<DetailEventDivision />
);
}

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

@@ -1,12 +0,0 @@
import React from 'react';
import NavbarDivisionCalender from '../../../../calender/ui/navbar_division_calender';
import { Box } from '@mantine/core';
export default function ViewDivisionCalender() {
return (
<Box>
<NavbarDivisionCalender />
</Box>
);
}

12
src/module/division_new/_division_fitur/calender/view/view_history_division_calender.tsx
View File

@@ -1,12 +0,0 @@
import { Box } from '@mantine/core';
import React from 'react';
import HistoryDivisionCalender from '../../../../calender/ui/history_division_calender';
export default function ViewHistoryDivisionCalender() {
return (
<Box>
<HistoryDivisionCalender />
</Box>
);
}

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

@@ -1,9 +1,4 @@
import { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDataMemberDivision } from './lib/type_division';
import CreateUserDivisionCalender from "./_division_fitur/calender/components/create_user_division_calender";
import ViewCreateDivisionCalender from "./_division_fitur/calender/view/view_create_division_calender";
import ViewDetailEventDivision from "./_division_fitur/calender/view/view_detail_event_division";
import ViewDivisionCalender from "./_division_fitur/calender/view/view_division_calender";
import ViewHistoryDivisionCalender from "./_division_fitur/calender/view/view_history_division_calender";
import CreateAdminDivision from "./ui/create_admin_division";
import CreateUsers from "./ui/create_users";
import ListDivision from './ui/list_division';
@@ -20,15 +15,9 @@ import EditDivision from './ui/edit_division';
import CreateReport from './ui/create_report';
import ReportDivisionId from './ui/report_division_id';
import { funGetDivisionById, funGetListDivisionByIdDivision } from './lib/api_division';
import UlangiEvent from './_division_fitur/calender/components/ulangi_event';
export { CreateUsers };
export { CreateAdminDivision };
export { ViewDivisionCalender };
export { ViewCreateDivisionCalender };
export { CreateUserDivisionCalender };
export { ViewHistoryDivisionCalender };
export { ViewDetailEventDivision };
export type { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDataMemberDivision }
export { ListDivision }
export { CreateDivision }
@@ -45,4 +34,3 @@ export { CreateReport }
export { ReportDivisionId }
export { funGetDivisionById }
export { funGetListDivisionByIdDivision }
export { UlangiEvent }

0
src/module/division/lib/file_icon.ts → src/module/division_new/lib/file_icon.ts
View File

2
src/module/division_new/ui/list_document.tsx
View File

@@ -2,7 +2,7 @@
import { WARNA } from "@/module/_global";
import { Carousel } from "@mantine/carousel";
import { Box, Image, Text, Center, Paper, Stack, UnstyledButton, Skeleton, Group } from "@mantine/core";
import * as ICON from '../../division/lib/file_icon'
import * as ICON from '../lib/file_icon'
import { useParams, useRouter } from "next/navigation";
import { useShallowEffect } from "@mantine/hooks";
import toast from "react-hot-toast";