diff --git a/src/app/(application)/project/update-detail/page.tsx b/src/app/(application)/project/update-detail/page.tsx index 9301a6c..241e2b8 100644 --- a/src/app/(application)/project/update-detail/page.tsx +++ b/src/app/(application)/project/update-detail/page.tsx @@ -1,13 +1,19 @@ -import { ViewUpdateProgres } from '@/module/project'; -import FileUploadProgres from '@/module/project/components/file_upload_progres'; -import React from 'react'; +import { + DetailCreateUserProject, + DetailDateEndTask, + ViewUpdateProgres, +} from "@/module/project"; +import FileUploadProgres from "@/module/project/components/detail_project/file_upload_progres"; + +import React from "react"; function Page({ searchParams }: { searchParams: any }) { - if (searchParams.page == "upload-progres") - return + if (searchParams.page == "upload-progres") return ; + if (searchParams.page == "detail-create-user") + return ; + if (searchParams.page == "detail-date-task") return ; - - return + return ; } export default Page; diff --git a/src/module/_global/layout/layout_navbar_new.tsx b/src/module/_global/layout/layout_navbar_new.tsx index 2f2f743..977a840 100644 --- a/src/module/_global/layout/layout_navbar_new.tsx +++ b/src/module/_global/layout/layout_navbar_new.tsx @@ -19,7 +19,7 @@ export const LayoutNavbarNew = ({ back, title, menu }: { back: string, title: st - + {/* GROUP */} {_.startCase(title)} diff --git a/src/module/project/components/create_project.tsx b/src/module/project/components/create_project.tsx index da5a72b..6b06afa 100644 --- a/src/module/project/components/create_project.tsx +++ b/src/module/project/components/create_project.tsx @@ -69,7 +69,7 @@ export default function CreateProject({ searchParams }: { searchParams: any }) { (searchParams.button == 'yes') && <> - diff --git a/src/module/project/components/detail_project/detail_create_user_project.tsx b/src/module/project/components/detail_project/detail_create_user_project.tsx new file mode 100644 index 0000000..f694bc2 --- /dev/null +++ b/src/module/project/components/detail_project/detail_create_user_project.tsx @@ -0,0 +1,115 @@ +"use client"; +import { LayoutNavbarNew, WARNA } from "@/module/_global"; +import { + Anchor, + Avatar, + Box, + Button, + Checkbox, + Divider, + Flex, + Group, + Text, + TextInput, +} from "@mantine/core"; +import { useRouter } from "next/navigation"; +import React from "react"; +import { HiMagnifyingGlass } from "react-icons/hi2"; +const DateUsers = [ + { + id: 1, + name: "Iqbal Ramadan", + image: "https://i.pravatar.cc/1000?img=5", + }, + { + id: 2, + name: "Doni Setiawan", + image: "https://i.pravatar.cc/1000?img=10", + }, + { + id: 3, + name: "Rangga Agung", + image: "https://i.pravatar.cc/1000?img=51", + }, + { + id: 4, + name: "Ramadan Sananta", + image: "https://i.pravatar.cc/1000?img=15", + }, + { + id: 5, + name: "Imam Baroni", + image: "https://i.pravatar.cc/1000?img=22", + }, +]; + +export default function DetailCreateUserProject() { + const router = useRouter(); + + return ( + + + + } + placeholder="Pencarian" + /> + + + Pilih Semua Divisi + + + + + + Divisi Kerohanian + + Pilih Semua + + + {DateUsers.map((v, i) => { + return ( + + + + + + {v.name} + + + + + + + ); + })} + + + + + + + ); +} diff --git a/src/module/project/components/detail_project/detail_date_end_task.tsx b/src/module/project/components/detail_project/detail_date_end_task.tsx new file mode 100644 index 0000000..06e9237 --- /dev/null +++ b/src/module/project/components/detail_project/detail_date_end_task.tsx @@ -0,0 +1,187 @@ +"use client"; +import { LayoutNavbarNew, WARNA } from "@/module/_global"; +import { + Avatar, + Box, + Button, + Flex, + Group, + Input, + SimpleGrid, + Stack, + Text, +} from "@mantine/core"; +import React, { useState } from "react"; +import { DatePicker } from "@mantine/dates"; +import moment from "moment"; +import { IoIosArrowDropright } from "react-icons/io"; +import { useRouter } from "next/navigation"; + +const dataTugas = [ + { + 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 DetailDateEndTask() { + const [value, setValue] = useState<[Date | null, Date | null]>([null, null]); + const router = useRouter() + return ( + + + + + + + + + Tanggal Mulai + + {value[0] ? `${value[0].toLocaleDateString()}` : ""} + + + + Tanggal Berakhir + + {value[1] ? `${value[1].toLocaleDateString()}` : ""} + + + + + + router.push('/project/update-detail?page=detail-create-user')}> + + Tambah Anggota + + + + + + + Anggota Terpilih + Total 10 Anggota + + + + + + Divisi Kerohanian + + {dataTugas.map((v, i) => { + return ( + + + + + + {v.name} + + + {v.email} + + + + + Anggota + + + ); + })} + + + + + + + + + + ); +} + diff --git a/src/module/project/components/detail_project/detail_file_save.tsx b/src/module/project/components/detail_project/detail_file_save.tsx new file mode 100644 index 0000000..a6573a1 --- /dev/null +++ b/src/module/project/components/detail_project/detail_file_save.tsx @@ -0,0 +1,9 @@ +import React from 'react'; + +export default function DetailFileSave() { + return ( +
+ DetailFileSave +
+ ); +} diff --git a/src/module/project/components/detail_project.tsx b/src/module/project/components/detail_project/detail_project.tsx similarity index 63% rename from src/module/project/components/detail_project.tsx rename to src/module/project/components/detail_project/detail_project.tsx index a11dcc3..dea41a3 100644 --- a/src/module/project/components/detail_project.tsx +++ b/src/module/project/components/detail_project/detail_project.tsx @@ -1,13 +1,26 @@ -"use client" -import { LayoutNavbarNew, WARNA } from '@/module/_global'; -import { ActionIcon, Avatar, Box, Center, Checkbox, Flex, Grid, Group, Progress, SimpleGrid, Text } from '@mantine/core'; -import React from 'react'; -import { HiMiniPresentationChartBar } from 'react-icons/hi2'; -import { IoIosArrowDropright } from 'react-icons/io'; -import ResultsDateAndTask from './results_date-and_task'; -import ResultsFile from './results_file'; -import { AiOutlineFileSync } from 'react-icons/ai'; -import { useRouter } from 'next/navigation'; +"use client"; +import { LayoutNavbarNew, WARNA } from "@/module/_global"; +import { + ActionIcon, + Avatar, + Box, + Center, + Checkbox, + Flex, + Grid, + Group, + Progress, + SimpleGrid, + Text, +} from "@mantine/core"; +import React from "react"; +import { HiMiniPresentationChartBar } from "react-icons/hi2"; +import { IoIosArrowDropright } from "react-icons/io"; +import ResultsDateAndTask from "../results_date-and_task"; +import ResultsFile from "../results_file"; +import { AiOutlineFileSync } from "react-icons/ai"; +import { useRouter } from "next/navigation"; +import { LuClipboardEdit } from "react-icons/lu"; const dataTugas = [ { @@ -43,73 +56,91 @@ const dataTugas = [ ]; export default function DetailProject() { - const router = useRouter() + const router = useRouter(); return ( - + router.push("/project/update-detail")} + > + + + } + /> - Proyek Desa Maju - - - + + - + gradient={{ from: "#DFDA7C", to: "#F2AF46", deg: 174 }} + > Kemajuan Proyek 60% - + 18 Juni 2024 - - router.push('/project/update-detail')} - > - Update Kemajuan Tugas - - - - Tanggal & Tugas - + + Tanggal & Tugas + + - +
- +
- + Laporan Permasyarakatan @@ -123,7 +154,10 @@ export default function DetailProject() { justify="center" bg={"white"} h={45} - style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} + style={{ + borderRadius: 10, + border: `1px solid ${"#D6D8F6"}`, + }} > 16 Juni 2024 @@ -134,7 +168,10 @@ export default function DetailProject() { justify="center" bg={"white"} h={45} - style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} + style={{ + borderRadius: 10, + border: `1px solid ${"#D6D8F6"}`, + }} > 20 Juni 2024 @@ -197,4 +234,3 @@ export default function DetailProject() { ); } - diff --git a/src/module/project/components/file_upload_progres.tsx b/src/module/project/components/detail_project/file_upload_progres.tsx similarity index 100% rename from src/module/project/components/file_upload_progres.tsx rename to src/module/project/components/detail_project/file_upload_progres.tsx diff --git a/src/module/project/components/detail_project/update_progres.tsx b/src/module/project/components/detail_project/update_progres.tsx new file mode 100644 index 0000000..2210556 --- /dev/null +++ b/src/module/project/components/detail_project/update_progres.tsx @@ -0,0 +1,283 @@ +"use client"; +import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global"; +import { + Box, + Button, + Center, + Checkbox, + Flex, + Grid, + Group, + SimpleGrid, + Text, +} from "@mantine/core"; +import { useRouter } from "next/navigation"; +import React, { useState } from "react"; +import { AiOutlineFileSync } from "react-icons/ai"; +import { BsFiletypeCsv } from "react-icons/bs"; +import { IoIosArrowDropright } from "react-icons/io"; + +export default function UpdateProgres({ searchParams }: { searchParams: any }) { + const router = useRouter(); + const [openDrawer, setOpenDrawer] = useState(false); + return ( + + + + + setOpenDrawer(true)} + > + Upload File + + + + + + router.push("/project/update-detail?page=detail-date-task") + } + > + Tambah Tanggal & Tugas + + + + + Tanggal & Tugas + + + + +
+ +
+ + + + + + Laporan Permasyarakatan + + + + + + Tanggal Mulai + + 16 Juni 2024 + + + + Tanggal Berakhir + + 20 Juni 2024 + + + + + + + {searchParams.tugas == "yes" && ( + <> + + +
+ +
+ + + + + + Laporan Dua + + + + + + Tanggal Mulai + + 21 Juni 2024 + + + + Tanggal Berakhir + + 30 Juni 2024 + + + + + + + + )} + + + + File + + + + + + Proyek Laporan Permasyarakatan + + + + + + Proyek Laporan Permasyarakatan + + + + + + + + + setOpenDrawer(false)} + title={"Pilih File"} + > + + ""}> + +
+ +
+ + + Pilih file + + diperangkat + + + router.push("/project/update-detail?page=upload-progres") + } + > + +
+ +
+ + + Pilih file yang + + sudah ada + + + + + ); +} diff --git a/src/module/project/components/update_progres.tsx b/src/module/project/components/update_progres.tsx deleted file mode 100644 index bb9baa9..0000000 --- a/src/module/project/components/update_progres.tsx +++ /dev/null @@ -1,165 +0,0 @@ -'use client' -import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global'; -import { Box, Button, Center, Checkbox, Flex, Grid, Group, SimpleGrid, Text } from '@mantine/core'; -import { useRouter } from 'next/navigation'; -import React, { useState } from 'react'; -import { AiOutlineFileSync } from 'react-icons/ai'; -import { BsFiletypeCsv } from 'react-icons/bs'; -import { IoIosArrowDropright } from 'react-icons/io'; - -export default function UpdateProgres() { - const router = useRouter() - const [openDrawer, setOpenDrawer] = useState(false); - return ( - - - - - setOpenDrawer(true)} - > - Upload File - - - - Tanggal & Tugas - - - -
- -
- - - - - - Laporan Permasyarakatan - - - - - - Tanggal Mulai - - 16 Juni 2024 - - - - Tanggal Berakhir - - 20 Juni 2024 - - - - - - - - - File - - - - - Proyek Laporan Permasyarakatan - - - - - - Proyek Laporan Permasyarakatan - - - - - - - - - setOpenDrawer(false)} - title={"Pilih File"} - > - - ""}> - -
- -
- - - Pilih file - - diperangkat - - router.push("/project/update-detail?page=upload-progres")}> - -
- -
- - - Pilih file yang - - sudah ada - - - - - ); -} diff --git a/src/module/project/index.ts b/src/module/project/index.ts index 9b66f52..329799b 100644 --- a/src/module/project/index.ts +++ b/src/module/project/index.ts @@ -6,6 +6,9 @@ import CreateUsersProject from "./components/create_users_project"; import ViewFileSave from "./view/view_file_save"; import ViewDetailProject from "./view/view_detail_project"; 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"; export { ViewProject } export { ViewCreateProject } @@ -14,4 +17,7 @@ export { ViewDateEndTask } export { CreateUsersProject } export { ViewFileSave } export { ViewDetailProject } -export { ViewUpdateProgres } \ No newline at end of file +export { ViewUpdateProgres } +export { DetailCreateUserProject } +export { DetailDateEndTask } +export { DetailFileSave } \ No newline at end of file diff --git a/src/module/project/view/view_detail_project.tsx b/src/module/project/view/view_detail_project.tsx index 9c2c478..eb65846 100644 --- a/src/module/project/view/view_detail_project.tsx +++ b/src/module/project/view/view_detail_project.tsx @@ -1,9 +1,6 @@ -import React from 'react'; -import DetailProject from '../components/detail_project'; +import React from "react"; +import DetailProject from "../components/detail_project/detail_project"; export default function ViewDetailProject() { - return ( - - ); + return ; } - diff --git a/src/module/project/view/view_update_progres.tsx b/src/module/project/view/view_update_progres.tsx index 016d3f5..bf4ed13 100644 --- a/src/module/project/view/view_update_progres.tsx +++ b/src/module/project/view/view_update_progres.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import UpdateProgres from '../components/update_progres'; +import UpdateProgres from '../components/detail_project/update_progres'; -export default function ViewUpdateProgres() { +export default function ViewUpdateProgres({searchParams}: {searchParams: any}) { return ( - + ); }