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

upd: division task

Browse Source 
Deskripsi:
- detail task
- update progress task

NO Issues
This commit is contained in:
amel
2024-07-11 17:23:16 +08:00
parent 6c503d01e3
commit e98302c199
12 changed files with 595 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
src/module/division_new/_division_fitur/task/component/detail_list_anggota_task.tsx Normal file
View File

@@ -0,0 +1,89 @@
import { WARNA } from "@/module/_global";
import { Box, Group, Flex, Avatar, Text } from "@mantine/core";
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 ListAnggotaDetailTask() {
return (
<Box pt={20}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
<Text c={WARNA.biruTua}>Total 10 Anggota</Text>
</Group>
<Box pt={10}>
<Box mb={20}>
<Box
style={{
border: `1px solid ${"#C7D6E8"}`,
borderRadius: 10,
}}
px={20}
py={10}
>
<Text c={WARNA.biruTua} fw={"bold"}>
Divisi Kerohanian
</Text>
{dataAnggota.map((v, i) => {
return (
<Flex
justify={"space-between"}
align={"center"}
mt={20}
key={i}
>
<Group>
<Avatar src={v.image} alt="it's me" size="lg" />
<Box>
<Text c={WARNA.biruTua} fw={"bold"}>
{v.name}
</Text>
<Text c={"#5A687D"} fz={14}>
{v.email}
</Text>
</Box>
</Group>
<Text c={WARNA.biruTua} fw={"bold"}>
Anggota
</Text>
</Flex>
);
})}
</Box>
</Box>
</Box>
</Box>
)
}

37
src/module/division_new/_division_fitur/task/component/detail_list_file_task.tsx Normal file
View File

@@ -0,0 +1,37 @@
import { WARNA } from "@/module/_global";
import { Box, Group, Text } from "@mantine/core";
import { BsFiletypeCsv } from "react-icons/bs";
export default function ListFileDetailTask() {
return (
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>File</Text>
<Box bg={"white"} style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20
}}>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}} mb={10}>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}}>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
</Box>
</Box>
)
}

77
src/module/division_new/_division_fitur/task/component/detail_list_tugas_task.tsx Normal file
View File

@@ -0,0 +1,77 @@
'use client'
import { WARNA } from "@/module/_global"
import { Box, Grid, Center, Checkbox, Group, SimpleGrid, Text } from "@mantine/core"
import { AiOutlineFileSync } from "react-icons/ai"
export default function ListTugasDetailTask() {
return (
<Box pt={20}>
<Text fw={"bold"} c={WARNA.biruTua}>
Tanggal & Tugas
</Text>
<Box
bg={"white"}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
}}
>
<Grid>
<Grid.Col span={"auto"}>
<Center>
<Checkbox color="teal" size="md" />
</Center>
</Grid.Col>
<Grid.Col span={10}>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
>
<Group>
<AiOutlineFileSync size={25} />
<Text>Laporan Permasyarakatan</Text>
</Group>
</Box>
<Box>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Text>Tanggal Mulai</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>16 Juni 2024</Text>
</Group>
</Box>
<Box>
<Text c={WARNA.biruTua}>Tanggal Berakhir</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>20 Juni 2024</Text>
</Group>
</Box>
</SimpleGrid>
</Box>
</Grid.Col>
</Grid>
</Box>
</Box>
)
}

48
src/module/division_new/_division_fitur/task/component/detail_progress_task.tsx Normal file
View File

@@ -0,0 +1,48 @@
'use client'
import { WARNA } from "@/module/_global";
import { Box, Grid, ActionIcon, Progress, Text } from "@mantine/core";
import { HiMiniPresentationChartBar } from "react-icons/hi2";
export default function ProgressDetailTask() {
return (
<Box mt={10}>
<Box
p={20}
bg={"#DCEED8"}
style={{
borderRadius: 10,
}}
>
<Grid gutter={"lg"}>
<Grid.Col span={3}>
<ActionIcon
variant="gradient"
size={68}
aria-label="Gradient action icon"
radius={100}
gradient={{ from: "#DFDA7C", to: "#F2AF46", deg: 174 }}
>
<HiMiniPresentationChartBar size={35} color={WARNA.biruTua} />
</ActionIcon>
</Grid.Col>
<Grid.Col span={9}>
<Box>
<Text>Kemajuan Proyek 60%</Text>
<Progress
style={{
border: `1px solid ${"#BDBDBD"}`,
}}
w={"100%"}
color="#FCAA4B"
radius="md"
size="xl"
value={60}
/>
<Text>18 Juni 2024</Text>
</Box>
</Grid.Col>
</Grid>
</Box>
</Box>
)
}

23
src/module/division_new/_division_fitur/task/component/navbar_detail_division_task.tsx Normal file
View File

@@ -0,0 +1,23 @@
'use client'
import { LayoutNavbarNew, WARNA } from "@/module/_global";
import { ActionIcon } from "@mantine/core";
import { useRouter } from "next/navigation";
import { LuClipboardEdit } from "react-icons/lu";
export default function NavbarDetailDivisionTask() {
const router = useRouter()
return (
<LayoutNavbarNew back="" title="Tugas 1" menu={
<ActionIcon
variant="light"
bg={WARNA.bgIcon}
size="lg"
radius="lg"
aria-label="Settings"
onClick={() => router.push("/task/update/1")}
>
<LuClipboardEdit size={20} color="white" />
</ActionIcon>
} />
)
}

20
src/module/division_new/_division_fitur/task/view/view_detail_division_task.tsx Normal file
View File

@@ -0,0 +1,20 @@
import { Box } from "@mantine/core";
import NavbarDetailDivisionTask from "../component/navbar_detail_division_task";
import ProgressDetailTask from "../component/detail_progress_task";
import ListTugasDetailTask from "../component/detail_list_tugas_task";
import ListFileDetailTask from "../component/detail_list_file_task";
import ListAnggotaDetailTask from "../component/detail_list_anggota_task";
export default function ViewDetailDivisionTask() {
return (
<Box>
<NavbarDetailDivisionTask />
<Box p={20}>
<ProgressDetailTask />
<ListTugasDetailTask />
<ListFileDetailTask />
<ListAnggotaDetailTask />
</Box>
</Box>
)
}

273
src/module/division_new/_division_fitur/task/view/view_update_progress_division_task.tsx Normal file
View File

@@ -0,0 +1,273 @@
'use client'
import { LayoutNavbarNew, WARNA, LayoutDrawer } from "@/module/_global";
import { Box, Group, Grid, Center, Checkbox, SimpleGrid, Button, Flex, Text } from "@mantine/core";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { AiOutlineFileSync } from "react-icons/ai";
import { BsFiletypeCsv } from "react-icons/bs";
import { IoIosArrowDropright } from "react-icons/io";
export default function ViewUpdateProgressDivisionTask({ searchParams }: { searchParams: any }) {
const router = useRouter();
const [openDrawer, setOpenDrawer] = useState(false);
return (
<Box>
<LayoutNavbarNew back="" title="Progres Tugas" menu />
<Box p={20}>
<Box mb={20}>
<Group
justify="space-between"
bg={"white"}
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
onClick={() => setOpenDrawer(true)}
>
<Text>Upload File</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Box mb={20}>
<Group
justify="space-between"
bg={"white"}
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
onClick={() =>
router.push("/task/update/1?page=detail-date-task")
}
>
<Text>Tambah Tanggal & Tugas</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Text fw={"bold"} c={WARNA.biruTua}>
Tanggal & Tugas
</Text>
<Box
bg={"white"}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
}}
>
<Grid>
<Grid.Col span={"auto"}>
<Center>
<Checkbox color="teal" size="md" />
</Center>
</Grid.Col>
<Grid.Col span={10}>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
>
<Group>
<AiOutlineFileSync size={25} />
<Text>Laporan Permasyarakatan</Text>
</Group>
</Box>
<Box>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Text>Tanggal Mulai</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>16 Juni 2024</Text>
</Group>
</Box>
<Box>
<Text c={WARNA.biruTua}>Tanggal Berakhir</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>20 Juni 2024</Text>
</Group>
</Box>
</SimpleGrid>
</Box>
</Grid.Col>
</Grid>
{searchParams.tugas == "yes" && (
<>
<Grid mt={20}>
<Grid.Col span={"auto"}>
<Center>
<Checkbox color="teal" size="md" />
</Center>
</Grid.Col>
<Grid.Col span={10}>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
>
<Group>
<AiOutlineFileSync size={25} />
<Text>Laporan Dua</Text>
</Group>
</Box>
<Box>
<SimpleGrid cols={{ base: 2, sm: 2, lg: 2 }} mt={20}>
<Box>
<Text>Tanggal Mulai</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>21 Juni 2024</Text>
</Group>
</Box>
<Box>
<Text c={WARNA.biruTua}>Tanggal Berakhir</Text>
<Group
justify="center"
bg={"white"}
h={45}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
>
<Text>30 Juni 2024</Text>
</Group>
</Box>
</SimpleGrid>
</Box>
</Grid.Col>
</Grid>
</>
)}
</Box>
<Box pt={20}>
<Text fw={"bold"} c={WARNA.biruTua}>
File
</Text>
<Box
bg={"white"}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
}}
>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
mb={10}
>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
<Box
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10,
}}
>
<Group>
<BsFiletypeCsv size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
</Group>
</Box>
</Box>
</Box>
<Box mt="xl">
<Button
color="white"
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => router.push("/task/1")}
>
Simpan
</Button>
</Box>
</Box>
<LayoutDrawer
opened={openDrawer}
onClose={() => setOpenDrawer(false)}
title={"Pilih File"}
>
<Flex justify={"space-around"}>
<Box onClick={() => ""}>
<Box
bg={"#DCEED8"}
style={{
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
borderRadius: 10,
}}
>
<Center>
<BsFiletypeCsv size={40} />
</Center>
</Box>
<Text mt={10} ta={"center"}>
Pilih file
</Text>
<Text ta={"center"}>diperangkat</Text>
</Box>
<Box
onClick={() =>
router.push("/task/update/1?page=upload-progres")
}
>
<Box
bg={"#DCEED8"}
style={{
border: `1px solid ${"#D6D8F6"}`,
padding: 20,
borderRadius: 10,
}}
>
<Center>
<BsFiletypeCsv size={40} />
</Center>
</Box>
<Text mt={10} ta={"center"}>
Pilih file yang
</Text>
<Text ta={"center"}>sudah ada</Text>
</Box>
</Flex>
</LayoutDrawer>
</Box>
)
}

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

@@ -1,4 +1,6 @@
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";
import CreateAdminDivision from "./components/create_admin_division";
import CreateUsers from "./components/create_users";
import ViewCreateDivision from "./view/view_create_division";
@@ -12,4 +14,6 @@ export { CreateUsers }
export { CreateAdminDivision }
export { ViewCreateReport }
export { ViewDetailDivision }
export { ViewDivisionTask }
export { ViewDivisionTask }
export { ViewDetailDivisionTask }
export { ViewUpdateProgressDivisionTask }

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

@@ -8,6 +8,7 @@ import ViewUpdateProgres from "./view/view_update_progres";
import DetailCreateUserProject from "./components/detail_project/detail_create_user_project";
import DetailDateEndTask from "./components/detail_project/detail_date_end_task";
import DetailFileSave from "./components/detail_project/detail_file_save";
import FileUploadProgres from "./components/detail_project/file_upload_progres";
export { ViewProject }
export { ViewCreateProject }
@@ -18,4 +19,5 @@ export { ViewDetailProject }
export { ViewUpdateProgres }
export { DetailCreateUserProject }
export { DetailDateEndTask }
export { DetailFileSave }
export { DetailFileSave }
export { FileUploadProgres }