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

Merge pull request #145 from bipproduction/amalia/23-agustus-24

Browse Source 
Amalia/23 agustus 24
This commit is contained in:
Amalia
2024-08-23 18:11:47 +08:00
committed by GitHub
parent 6fc15d463a 5b05edaf38
commit 5f169a7e5f
38 changed files with 936 additions and 857 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
prisma/schema.prisma
View File

@@ -166,7 +166,7 @@ model Project {
idVillage String
Group Group @relation(fields: [idGroup], references: [id])
idGroup String
name String
title String
status Int @default(0) // 0 = pending, 1 = ongoing, 2 = done, 3 = cancelled
desc String? @db.Text
reason String? @db.Text
@@ -208,9 +208,9 @@ model ProjectTask {
id String @id @default(cuid())
Project Project @relation(fields: [idProject], references: [id])
idProject String
name String
title String
desc String?
status Int @default(0) // 0 = pending, 1 = ongoing
status Int @default(0) // 0 = todo, 1 = done
dateStart DateTime @db.Date
dateEnd DateTime @db.Date
isActive Boolean @default(true)

4
src/app/(application)/division/[id]/(fitur-division)/calender/update/[detail]/page.tsx
View File

@@ -2,10 +2,6 @@ import { UpdateDivisionCalender } from '@/module/calender';
import React from 'react';
function Page({ searchParams }: { searchParams: any }) {
// if (searchParams.page == "update-ulangi-event")
// return <UpdateUlangiEvent />
// if (searchParams.page == "update-user-calender")
// return <UpdateUserDivisionCalender />
return (
<UpdateDivisionCalender/>
);

9
src/app/(application)/project/create/page.tsx
View File

@@ -1,15 +1,12 @@
import { CreateUsersProject, ViewCreateProject, ViewDateEndTask, ViewFileSave } from "@/module/project";
import { CreateProject, ViewFileSave } from "@/module/project";
import React from "react";
function Page({ searchParams }: { searchParams: any }) {
if (searchParams.page == "task")
return <ViewDateEndTask kategori="project" />;
if (searchParams.page == "create-users")
return <CreateUsersProject kategori="project" />
if (searchParams.page == "file-save")
return <ViewFileSave kategori="project" />
return <ViewCreateProject searchParams={searchParams} />;
return <CreateProject />;
}
export default Page;

17
src/app/(application)/project/update/[id]/page.tsx
View File

@@ -1,21 +1,8 @@
import {
DetailCreateUserProject,
DetailDateEndTask,
EditDetailTaskProject,
FileUploadProgres,
ViewUpdateProgres,
} from "@/module/project";
import { EditDetailTaskProject } from "@/module/project";
import React from "react";
function Page({ searchParams }: { searchParams: any }) {
// if (searchParams.page == "upload-progres") return <FileUploadProgres kategori="project" />;
// if (searchParams.page == "detail-create-user")
// return <DetailCreateUserProject kategori="project" />;
// if (searchParams.page == "detail-date-task") return <DetailDateEndTask kategori="project" />;
// return <ViewUpdateProgres searchParams={searchParams} />;
function Page() {
return (
<EditDetailTaskProject/>
)

6
src/app/api/project/[id]/route.ts
View File

@@ -59,7 +59,7 @@ export async function GET(request: Request, context: { params: { id: string } })
},
select: {
id: true,
name: true,
title: true,
desc: true,
status: true,
dateStart: true,
@@ -159,7 +159,7 @@ export async function POST(request: Request, context: { params: { id: string } }
const dataCreate = await prisma.projectTask.create({
data: {
name,
title: name,
idProject: id,
dateStart: new Date(moment(dateStart).format('YYYY-MM-DD')),
dateEnd: new Date(moment(dateEnd).format('YYYY-MM-DD')),
@@ -249,7 +249,7 @@ export async function PUT(request: Request, context: { params: { id: string } })
id
},
data: {
name
title: name
}
})

35
src/app/api/project/detail/[id]/route.ts
View File

@@ -12,6 +12,8 @@ export async function DELETE(request: Request, context: { params: { id: string }
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params;
const { idProject } = (await request.json());
const data = await prisma.projectTask.count({
where: {
id: id,
@@ -37,6 +39,35 @@ export async function DELETE(request: Request, context: { params: { id: string }
},
});
const dataTask = await prisma.projectTask.findMany({
where: {
isActive: true,
idProject: idProject,
}
})
const semua = dataTask.length
const selesai = dataTask.filter((item) => item.status == 1).length
const prosess = Math.ceil((selesai / semua) * 100)
let statusProject = 1
if (prosess == 100) {
statusProject = 2
} else if (prosess == 0) {
statusProject = 0
}
const updProject = await prisma.project.update({
where: {
id: idProject
},
data: {
status: statusProject
}
})
return NextResponse.json(
{
success: true,
@@ -87,6 +118,8 @@ export async function PUT(request: Request, context: { params: { id: string } })
}
})
// const cek progress
const dataTask = await prisma.projectTask.findMany({
where: {
isActive: true,
@@ -174,7 +207,7 @@ export async function POST(request: Request, context: { params: { id: string } }
id
},
data: {
name: name,
title: name,
dateStart: new Date(moment(dateStart).format('YYYY-MM-DD')),
dateEnd: new Date(moment(dateEnd).format('YYYY-MM-DD')),
}

52
src/app/api/project/route.ts
View File

@@ -29,7 +29,7 @@ export async function GET(request: Request) {
idVillage: String(villageId),
idGroup: String(groupId),
createdBy: String(userId),
name: {
title: {
contains: (name == undefined || name == "null") ? "" : name,
mode: "insensitive"
},
@@ -37,7 +37,7 @@ export async function GET(request: Request) {
},
select: {
id: true,
name: true,
title: true,
desc: true,
status: true,
ProjectMember: {
@@ -73,16 +73,15 @@ export async function POST(request: Request) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { idVillage, idGroup, name, task, member, file } = (await request.json())
const { idGroup, title, task, member, file } = (await request.json())
const userId = user.id
const data = await prisma.project.create({
data: {
idVillage: String(idVillage),
idVillage: String(user.idVillage),
idGroup: String(idGroup),
name: name,
desc: "",
title,
createdBy: String(userId)
},
select: {
@@ -94,7 +93,7 @@ export async function POST(request: Request) {
const dataProject = task.map((v: any) => ({
..._.omit(v, ["dateStart", "dateEnd", "name"]),
idProject: data.id,
name: v.name,
title: v.title,
dateStart: new Date(moment(v.dateStart).format('YYYY-MM-DD')),
dateEnd: new Date(moment(v.dateEnd).format('YYYY-MM-DD')),
}))
@@ -109,7 +108,6 @@ export async function POST(request: Request) {
..._.omit(v, ["idUser", "name"]),
idProject: data.id,
idUser: v.idUser,
name: v.name
}))
const insertMember = await prisma.projectMember.createMany({
@@ -121,31 +119,31 @@ export async function POST(request: Request) {
if (file.length > 0) {
file.map((v: any, index: any) => {
const f: any = file[index].get('file')
const fName = f.name
const fExt = fName.split(".").pop()
// funUploadFile(fName, f)
const dataFile = {
name: fName,
extension: fExt,
idProject: data.id,
}
fileFix.push(dataFile)
const f: any = file[index].get('file')
const fName = f.name
const fExt = fName.split(".").pop()
// funUploadFile(fName, f)
const dataFile = {
name: fName,
extension: fExt,
idProject: data.id,
}
fileFix.push(dataFile)
})
const insertFile = await prisma.divisionProjectFile.createMany({
data: fileFix
data: fileFix
})
}
}
return NextResponse.json({ success: true, message: "Berhasil mendapatkan divisi", data: data, }, { status: 200 });
return NextResponse.json({ success: true, message: "Berhasil membuat proyek", data: data, }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mendapatkan divisi, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
return NextResponse.json({ success: false, message: "Gagal membuat proyek, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}

29
src/app/api/task/detail/[id]/route.ts
View File

@@ -13,6 +13,7 @@ export async function DELETE(request: Request, context: { params: { id: string }
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params;
const { idProject } = (await request.json());
const data = await prisma.divisionProjectTask.count({
where: {
id: id,
@@ -38,6 +39,34 @@ export async function DELETE(request: Request, context: { params: { id: string }
},
});
// const cek progress
const dataTask = await prisma.divisionProjectTask.findMany({
where: {
isActive: true,
idProject: idProject
}
})
const semua = dataTask.length
const selesai = _.filter(dataTask, { status: 1 }).length
const progress = Math.ceil((selesai / semua) * 100)
let statusProject = 1
if (progress == 100) {
statusProject = 2
} else if (progress == 0) {
statusProject = 0
}
const updProject = await prisma.divisionProject.update({
where: {
id: idProject
},
data: {
status: statusProject
}
})
return NextResponse.json(
{
success: true,

139
src/module/division_new/_division_fitur/calender/components/update_calander/update_division_calender.tsx
View File

@@ -1,139 +0,0 @@
"use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { Box, Button, Group, Input, SimpleGrid, Stack, Text, Textarea, TextInput } from '@mantine/core';
import { DateInput, TimeInput } from '@mantine/dates';
import React, { useState } from 'react';
import { IoIosArrowDropright } from 'react-icons/io';
import { useRouter } from 'next/navigation';
import LayoutModal from '@/module/_global/layout/layout_modal';
import toast from 'react-hot-toast';
export default function UpdateDivisionCalender() {
const [isModal, setModal] = useState(false)
function onTrue(val: boolean) {
if (val) {
toast.success("Sukses! Data tersimpan");
}
setModal(false)
}
const [value, setValue] = useState<Date | null>(null);
const router = useRouter()
return (
<Box>
<LayoutNavbarNew back="/calender" title="Edit kalender" menu />
<Box p={20}>
<Stack>
<TextInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md"
placeholder="Event Nama"
label="Event Nama"
/>
<DateInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md"
value={value}
onChange={setValue}
placeholder="Input Tanggal"
label="Tanggal"
/>
<SimpleGrid
cols={{ base: 2, sm: 2, lg: 2 }}
>
<TimeInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md"
label="Waktu Awal"
/>
<TimeInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md"
label="Waktu Akhir"
/>
</SimpleGrid>
<TextInput
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md"
placeholder="Link Meet"
label="Link Meet"
/>
<Box mt={5} onClick={() => router.push('/calender/update?page=update-ulangi-event')}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Ulangi Event</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Box mt={5} onClick={() => router.push('/calender/update?page=update-user-calender')}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Tambah Anggota</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Textarea styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
size="md" placeholder='Deskripsi' label="Deskripsi" />
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => setModal(true)}
>
Simpan
</Button>
</Box>
</Stack>
</Box>
<LayoutModal opened={isModal} onClose={() => setModal(false)}
description="Apakah Anda yakin ingin menambahkan data?"
onYes={(val) => { onTrue(val) }} />
</Box>
);
}

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

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

11
src/module/division_new/_division_fitur/calender/view/view_update_division_calender.tsx
View File

@@ -1,11 +0,0 @@
import { Box } from '@mantine/core';
import React from 'react';
import UpdateDivisionCalender from '../components/update_calander/update_division_calender';
export default function ViewUpdateDivisionCalender() {
return (
<Box>
<UpdateDivisionCalender/>
</Box>
);
}

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

@@ -1,12 +1,9 @@
import { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDataMemberDivision } from './lib/type_division';
import CreateUserDivisionCalender from "./_division_fitur/calender/components/create_user_division_calender";
import UlangiEvent from "./_division_fitur/calender/components/ulangi_event";
import UpdateUlangiEvent from "./_division_fitur/calender/components/update_calander/update_ulangi_event";
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 ViewUpdateDivisionCalender from "./_division_fitur/calender/view/view_update_division_calender";
import CreateAdminDivision from "./ui/create_admin_division";
import CreateUsers from "./ui/create_users";
import ListDivision from './ui/list_division';
@@ -23,17 +20,15 @@ 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 { UlangiEvent };
export { CreateUserDivisionCalender };
export { ViewHistoryDivisionCalender };
export { ViewDetailEventDivision };
export { ViewUpdateDivisionCalender };
export { UpdateUlangiEvent };
export type { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDataMemberDivision }
export { ListDivision }
export { CreateDivision }
@@ -50,3 +45,4 @@ export { CreateReport }
export { ReportDivisionId }
export { funGetDivisionById }
export { funGetListDivisionByIdDivision }
export { UlangiEvent }

4
src/module/document/ui/navbar_document_division.tsx
View File

@@ -23,7 +23,7 @@ import { globalRefreshDocument } from '../lib/val_document';
import { RiListCheck } from 'react-icons/ri';
import { GoChevronRight } from 'react-icons/go';
import DrawerShareDocument from './drawer_share_document';
import { FaSlideshare } from 'react-icons/fa6';
import { FaShare } from 'react-icons/fa6';
export default function NavbarDocumentDivision() {
const router = useRouter()
@@ -309,7 +309,7 @@ export default function NavbarDocumentDivision() {
<Box>
{
(v.share) ?
<Indicator offset={15} withBorder inline color={WARNA.borderBiruMuda} position="bottom-end" label={<FaSlideshare />} size={25}>
<Indicator offset={15} withBorder inline color={WARNA.borderBiruMuda} position="bottom-end" label={<FaShare />} size={25}>
{
(v.category == "FOLDER") ?
<FcFolder size={60} /> :

187
src/module/project/components/create_date_end_task.tsx
View File

@@ -1,187 +0,0 @@
"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 ViewDateEndTask({ kategori }: { kategori: string }) {
const [value, setValue] = useState<[Date | null, Date | null]>([null, null]);
const router = useRouter()
return (
<Box>
<LayoutNavbarNew back="" title={"Tanggal Tugas"} menu />
<Box p={20}>
<Group
justify="center"
bg={"white"}
py={20}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<DatePicker
styles={{}}
type="range"
value={value}
onChange={setValue}
size="md"
c={WARNA.biruTua}
/>
</Group>
<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>{value[0] ? `${value[0].toLocaleDateString()}` : ""}</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>{value[1] ? `${value[1].toLocaleDateString()}` : ""}</Text>
</Group>
</Box>
</SimpleGrid>
<Stack pt={15}>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Input Nama Tahapan"
size="md"
/>
<Box onClick={() => router.push(`/${kategori}/create?page=create-users`)}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text c={WARNA.biruTua}>Tambah Anggota</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
</Stack>
<Box pt={30}>
<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>
{dataTugas.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>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => router.push(`/${kategori}/create?anggota=yes`)}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

156
src/module/project/components/create_project.tsx
View File

@@ -1,156 +0,0 @@
"use client";
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { Box, Button, Center, Flex, Group, Select, Stack, Text, TextInput } from "@mantine/core";
import { useRouter } from "next/navigation";
import React, { useState } from "react";
import { IoIosArrowDropright } from "react-icons/io";
import { BsFiletypeCsv } from "react-icons/bs";
import ResultsDateAndTask from "./results_date-and_task";
import ResultsFile from "./results_file";
import LayoutModal from "@/module/_global/layout/layout_modal";
import toast from "react-hot-toast";
export default function CreateProject({ searchParams }: { searchParams: any }) {
const router = useRouter();
const [openDrawer, setOpenDrawer] = useState(false);
const [isModal, setModal] = useState(false)
function onTrue(val: boolean) {
if (val) {
toast.success("Sukses! Data tersimpan");
router.push('/project')
}
setModal(false)
}
return (
<Box>
<LayoutNavbarNew back="/project" title="tambah proyek" menu />
<Box p={20}>
<Stack>
<Select
placeholder="Pilih Grup" label="Grup" w={"100%"} size="md" required withAsterisk radius={30}
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
data={['Dinas', 'Adat', 'LPD', 'PKK']}
/>
<TextInput
label="Proyek"
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
required withAsterisk
placeholder="Nama Proyek"
size="md"
/>
<Box onClick={() => router.push("/project/create?page=task")}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Tambah Tanggal & Tugas</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
onClick={() => setOpenDrawer(true)}
>
<Text>Upload File</Text>
<IoIosArrowDropright size={25} />
</Group>
</Stack>
{
(searchParams.anggota == 'yes') &&
<>
<ResultsDateAndTask />
</>
}
{(searchParams.files == 'yes') &&
<>
<ResultsFile />
</>
}
{
(searchParams.button == 'yes') &&
<>
<Box mt="xl">
<Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => setModal(true)}>
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("/project/create?page=file-save")}>
<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>
<LayoutModal opened={isModal} onClose={() => setModal(false)}
description="Apakah Anda yakin ingin mengubah data?"
onYes={(val) => { onTrue(val) }} />
</Box >
);
}

114
src/module/project/components/create_users_project.tsx
View File

@@ -1,114 +0,0 @@
"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 CreateUsersProject({ kategori }: { kategori: string }) {
const router = useRouter()
return (
<Box>
<LayoutNavbarNew
back=""
title="Pilih Anggota"
menu
/>
<Box p={20}>
<TextInput
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
size="md"
radius={30}
leftSection={<HiMagnifyingGlass size={20} />}
placeholder="Pencarian"
/>
<Flex justify={"space-between"} mt={20}>
<Text c={WARNA.biruTua} fw={"bold"}>
Pilih Semua Divisi
</Text>
<Checkbox defaultChecked color="teal" size="md" />
</Flex>
<Flex justify={"space-between"} mt={20}>
<Text c={WARNA.biruTua} fw={"bold"}>
Divisi Kerohanian
</Text>
<Anchor>Pilih Semua</Anchor>
</Flex>
<Box mt={15}>
{DateUsers.map((v, i) => {
return (
<Box mb={15} key={i}>
<Flex justify={"space-between"} align={"center"}>
<Group>
<Avatar src={v.image} alt="it's me" size="lg" />
<Text c={WARNA.biruTua} fw={"bold"}>
{v.name}
</Text>
</Group>
<Checkbox defaultChecked color="teal" size="md" />
</Flex>
<Divider my={"md"} />
</Box>
);
})}
</Box>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => router.push(`/${kategori}/create?page=task`)}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

6
src/module/project/components/detail_project/detail_project.tsx
View File

@@ -16,8 +16,8 @@ import {
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 ResultsDateAndTask from "../../ui/results_date-and_task";
import ResultsFile from "../../ui/results_file";
import { AiOutlineFileSync } from "react-icons/ai";
import { useRouter } from "next/navigation";
import { LuClipboardEdit } from "react-icons/lu";
@@ -181,7 +181,7 @@ export default function DetailProject() {
</Grid>
</Box>
</Box>
<ResultsFile />
{/* <ResultsFile /> */}
<Box pt={20}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>

38
src/module/project/components/results_file.tsx
View File

@@ -1,38 +0,0 @@
import { WARNA } from '@/module/_global';
import { Box, Group, Text } from '@mantine/core';
import React from 'react';
import { BsFiletypeCsv } from 'react-icons/bs';
export default function ResultsFile() {
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>
);
}

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

@@ -1,7 +1,6 @@
import ViewCreateProject from "./view/view_create_project";
import ViewDateEndTask from "./components/create_date_end_task";
import ViewDateEndTask from "./ui/create_date_end_task";
import ViewProject from "./view/view_project";
import CreateUsersProject from "./components/create_users_project";
import CreateUsersProject from "./ui/create_users_project";
import ViewFileSave from "./view/view_file_save";
import ViewDetailProject from "./view/view_detail_project";
import ViewUpdateProgres from "./view/view_update_progres";
@@ -21,9 +20,9 @@ import ListAnggotaDetailProject from "./ui/list_anggota_detail_project";
import AddDetailTaskProject from "./ui/add_detail_task_project";
import CancelProject from "./ui/cancel_project";
import AddMemberDetailProject from "./ui/add_member_detail_project";
import CreateProject from "./ui/create_project";
export { ViewProject }
export { ViewCreateProject }
export { ViewDateEndTask }
export { CreateUsersProject }
export { ViewFileSave }
@@ -43,4 +42,5 @@ export { EditTaskProject }
export { EditDetailTaskProject }
export { AddDetailTaskProject }
export { CancelProject }
export { AddMemberDetailProject }
export { AddMemberDetailProject }
export { CreateProject }

6
src/module/project/lib/api_project.ts
View File

@@ -7,6 +7,9 @@ export const funGetAllProject = async (path?: string) => {
}
export const funCreateProject = async (data: IFormProject) => {
if (data.title.length < 3)
return { success: false, message: 'Nama proyek minimal 3 karakter' }
const response = await fetch(`/api/project`, {
method: "POST",
headers: {
@@ -28,12 +31,13 @@ export const funGetAllMemberById = async (path?: string) => {
}
export const funDeleteDetailProject = async (path: string) => {
export const funDeleteDetailProject = async (path: string, data: { idProject: string }) => {
const response = await fetch(`/api/project/detail/${path}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}

15
src/module/project/lib/type_project.ts
View File

@@ -1,6 +1,6 @@
export interface IDataProject {
id: string
name: string
title: string
desc: string
status: number
member: number
@@ -8,7 +8,7 @@ export interface IDataProject {
export interface IDataListTaskProject {
id: string
name: string
title: string
desc: string
status: number
dateStart: string
@@ -29,8 +29,8 @@ export interface IDataMemberProject {
}
export interface IFormProject {
idDivision: string,
name: string,
title: string,
idGroup: string,
task: IFormDateProject[] | [],
member: IFormMemberProject[] | [],
file: FormData[] | []
@@ -39,7 +39,7 @@ export interface IFormProject {
export interface IFormDateProject {
dateStart: Date,
dateEnd: Date,
name: string,
title: string,
}
export interface IFormMemberProject {
@@ -64,4 +64,9 @@ export interface IDataMemberProjectDetail {
idUser: string,
isLeader: string,
name: string
}
export interface IListFileTaskProject {
name: string,
extension: string
}

2
src/module/project/lib/val_project.ts
View File

@@ -1,6 +1,8 @@
import { hookstate } from "@hookstate/core";
import { IFormMemberProject } from "./type_project";
export const globalRefreshProject = hookstate<boolean>(false)
export const globalMemberProject = hookstate<IFormMemberProject[]>([]);
export const valStatusDetailProject = [
{

5
src/module/project/ui/add_member_detail_project.tsx
View File

@@ -4,7 +4,6 @@ import React, { useState } from 'react';
import { IDataMemberProject, IDataMemberProjectDetail } from '../lib/type_project';
import toast from 'react-hot-toast';
import { funAddMemberProject, funGetAllMemberById, funGetOneProjectById } from '../lib/api_project';
import { funGetDivisionById } from '@/module/division_new';
import { useShallowEffect } from '@mantine/hooks';
import { Avatar, Box, Button, Divider, Flex, Group, Stack, Text } from '@mantine/core';
import { LayoutNavbarNew, WARNA } from '@/module/_global';
@@ -103,11 +102,9 @@ export default function AddMemberDetailProject() {
<Box>
<LayoutNavbarNew
back=""
title="Pilih Anggotak"
title="Pilih Anggota"
menu
/>
<pre>{JSON.stringify(isData, null, 1)}</pre>
<pre>{JSON.stringify(isDataMember, null, 1)}</pre>
<Box p={20}>
{/* <TextInput
styles={{

116
src/module/project/ui/create_date_end_task.tsx Normal file
View File

@@ -0,0 +1,116 @@
"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 { useRouter } from "next/navigation";
import toast from "react-hot-toast";
import moment from "moment";
import { IFormDateProject } from "../lib/type_project";
export default function ViewDateEndTask({ onClose }: { onClose: (val: IFormDateProject) => void }) {
const [value, setValue] = useState<[Date | null, Date | null]>([null, null]);
const router = useRouter()
const [title, setTitle] = useState("")
function onSubmit() {
if (value[0] == null || value[1] == null)
return toast.error("Error! harus memilih tanggal")
if (title == "")
return toast.error("Error! harus memasukkan judul tugas")
onClose(
{
dateStart: value[0],
dateEnd: value[1],
title: title
}
)
}
return (
<Box>
<LayoutNavbarNew back="" title={"Tanggal Tugas"} menu />
<Box p={20}>
<Group
justify="center"
bg={"white"}
py={20}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<DatePicker
styles={{}}
type="range"
value={value}
onChange={setValue}
size="md"
c={WARNA.biruTua}
/>
</Group>
<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>{value[0] ? `${moment(value[0]).format('DD-MM-YYYY')}` : ""}</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>{value[1] ? `${moment(value[1]).format('DD-MM-YYYY')}` : ""}</Text>
</Group>
</Box>
</SimpleGrid>
<Stack pt={15}>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Input Nama Tahapan"
size="md"
value={title}
onChange={(e) => setTitle(e.target.value)}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onSubmit() }}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

416
src/module/project/ui/create_project.tsx Normal file
View File

@@ -0,0 +1,416 @@
"use client";
import { LayoutDrawer, LayoutNavbarNew, WARNA } from "@/module/_global";
import { Avatar, Box, Button, Center, Flex, Group, Select, SimpleGrid, Stack, Text, TextInput } from "@mantine/core";
import { useRouter, useSearchParams } from "next/navigation";
import React, { useRef, useState } from "react";
import { IoIosArrowDropright } from "react-icons/io";
import { BsFiletypeCsv } from "react-icons/bs";
import ResultsDateAndTask from "./results_date-and_task";
import ResultsFile from "./results_file";
import LayoutModal from "@/module/_global/layout/layout_modal";
import toast from "react-hot-toast";
import { funGetAllGroup, IDataGroup } from "@/module/group";
import { funGetUserByCookies } from "@/module/auth";
import { useShallowEffect } from "@mantine/hooks";
import { useHookstate } from "@hookstate/core";
import { globalMemberProject } from "../lib/val_project";
import ViewDateEndTask from "./create_date_end_task";
import { IFormDateProject, IFormMemberProject, IListFileTaskProject } from "../lib/type_project";
import CreateUsersProject from "./create_users_project";
import { FaTrash } from "react-icons/fa6";
import { Dropzone } from "@mantine/dropzone";
import _ from "lodash";
import { funCreateProject } from "../lib/api_project";
export default function CreateProject() {
const router = useRouter();
const [openDrawer, setOpenDrawer] = useState(false)
const [openDrawerFile, setOpenDrawerFile] = useState(false)
const [openDrawerTask, setOpenDrawerTask] = useState(false)
const [isModal, setModal] = useState(false)
const [dataGroup, setDataGroup] = useState<IDataGroup[]>([]);
const [roleUser, setRoleUser] = useState<any>("")
const [isChooseAnggota, setChooseAnggota] = useState(false)
const member = useHookstate(globalMemberProject)
const memberValue = member.get() as IFormMemberProject[]
const [openTugas, setOpenTugas] = useState(false)
const [dataTask, setDataTask] = useState<IFormDateProject[]>([])
const openRef = useRef<() => void>(null)
const [fileForm, setFileForm] = useState<FormData[]>([])
const [listFile, setListFile] = useState<IListFileTaskProject[]>([])
const [indexDelFile, setIndexDelFile] = useState<number>(0)
const [indexDelTask, setIndexDelTask] = useState<number>(0)
const [body, setBody] = useState<any>({
idGroup: "",
title: "",
desc: "",
});
function deleteFile(index: number) {
setListFile([...listFile.filter((val, i) => i !== index)])
setFileForm([...fileForm.filter((val, i) => i !== index)])
setOpenDrawerFile(false)
}
function deleteTask(index: number) {
setDataTask([...dataTask.filter((val, i) => i !== index)])
setOpenDrawerTask(false)
}
async function loadData() {
const loadGroup = await funGetAllGroup('?active=true')
if (loadGroup.success) {
setDataGroup(loadGroup.data);
} else {
toast.error(loadGroup.message);
}
const loadUser = await funGetUserByCookies();
setRoleUser(loadUser.idUserRole)
}
function onToChooseAnggota() {
if (roleUser == "supadmin" && body.idGroup == "")
return toast.error("Error! grup harus diisi")
setChooseAnggota(true)
}
function onChooseGroup(val: any) {
member.set([])
setBody({ ...body, idGroup: val })
}
useShallowEffect(() => {
loadData();
}, []);
async function onSubmit() {
try {
const response = await funCreateProject({ title: body.title, idGroup: body.idGroup, task: dataTask, file: fileForm, member: memberValue })
if (response.success) {
toast.success(response.message)
setBody({
idGroup: "",
title: "",
desc: "",
})
member.set([])
setFileForm([])
setListFile([])
setDataTask([])
} else {
toast.error(response.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal menambahkan tugas divisi, coba lagi nanti");
}
}
if (openTugas) return <ViewDateEndTask onClose={(val) => {
setDataTask([...dataTask, val])
setOpenTugas(false)
}} />;
if (isChooseAnggota) return <CreateUsersProject grup={body.idGroup} onClose={() => { setChooseAnggota(false) }} />
return (
<Box>
<LayoutNavbarNew back="/project" title="tambah proyek" menu />
<Box p={20}>
<Stack>
{
(roleUser == "supadmin") && (
<Select
placeholder="Grup"
label="Grup"
size="md"
required
radius={40}
data={dataGroup?.map((pro: any) => ({
value: String(pro.id),
label: pro.name
}))}
onChange={(val) => {
onChooseGroup(val)
}}
value={(body.idGroup=="")?null:body.idGroup}
/>
)
}
<TextInput
label="Proyek"
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
required withAsterisk
placeholder="Nama Proyek"
size="md"
value={body.title}
onChange={(e) => setBody({ ...body, title: e.target.value })}
/>
<Box onClick={() => { setOpenTugas(true) }}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Tambah Tanggal & Tugas</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
onClick={() => setOpenDrawer(true)}
>
<Text>Upload File</Text>
<IoIosArrowDropright size={25} />
</Group>
<Box onClick={() => { onToChooseAnggota() }}>
<Group
justify="space-between"
p={10}
style={{
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
}}
>
<Text>Pilih Anggota</Text>
<IoIosArrowDropright size={25} />
</Group>
</Box>
</Stack>
{
dataTask.length > 0 &&
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>Tanggal & Tugas</Text>
{
dataTask.map((v, i) => {
return (
<Box key={i} onClick={() => {
setIndexDelTask(i)
setOpenDrawerTask(true)
}}>
<ResultsDateAndTask dateStart={v.dateStart} dateEnd={v.dateEnd} title={v.title} />
</Box>
)
})
}
</Box>
}
{
listFile.length > 0 &&
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>File</Text>
<Box bg={"white"} style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 20
}}>
{
listFile.map((v, i) => {
return (
<Box key={i} onClick={() => {
setIndexDelFile(i)
setOpenDrawerFile(true)
}}>
<ResultsFile name={v.name} extension={v.extension} />
</Box>
)
})
}
</Box>
</Box>
}
{
member.length > 0 &&
<Box pt={30}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
<Text c={WARNA.biruTua}>Total {member.length} Anggota</Text>
</Group>
<Box pt={10}>
<Box mb={20}>
<Box
style={{
border: `1px solid ${"#C7D6E8"}`,
borderRadius: 10,
}}
px={20}
py={10}
>
{member.get().map((v: any, i: any) => {
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>
</Box>
</Group>
<Text c={WARNA.biruTua} fw={"bold"}>
Anggota
</Text>
</Flex>
);
})}
</Box>
</Box>
</Box>
</Box>
}
<Box mt="xl">
<Button color="white" bg={WARNA.biruTua} size="lg" radius={30} fullWidth onClick={() => setModal(true)}>
Simpan
</Button>
</Box>
</Box>
{/* Drawer pilih file */}
<LayoutDrawer
opened={openDrawer}
onClose={() => setOpenDrawer(false)}
title={"Pilih File"}
>
<Flex justify={"space-around"}>
<Dropzone
openRef={openRef}
onDrop={async (files) => {
if (!files || _.isEmpty(files))
return toast.error('Tidak ada file yang dipilih')
const fd = new FormData();
fd.append("file", files[0]);
setFileForm([...fileForm, fd])
setListFile([...listFile, { name: files[0].name, extension: files[0].type.split("/")[1] }])
}}
activateOnClick={false}
maxSize={3 * 1024 ** 2}
accept={['text/csv', 'image/png', 'image/jpeg', 'image/heic', 'application/pdf']}
onReject={(files) => {
return toast.error('File yang diizinkan: .csv, .png, .jpg, .heic, .pdf dengan ukuran maksimal 3 MB')
}}
>
<Box onClick={() => openRef.current?.()}>
<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>
</Dropzone>
<Box onClick={() => router.push("/project/create?page=file-save")}>
<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>
{/* Drawer hapus file */}
<LayoutDrawer
opened={openDrawerFile}
onClose={() => setOpenDrawerFile(false)}
title={""}
>
<Stack pt={10}>
<SimpleGrid cols={{ base: 3, sm: 3, lg: 3 }} >
<Flex style={{ cursor: 'pointer' }} justify={'center'} align={'center'} direction={'column'} onClick={() => deleteFile(indexDelFile)}>
<Box>
<FaTrash size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Hapus File</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
</LayoutDrawer>
{/* Drawer hapus tugas */}
<LayoutDrawer
opened={openDrawerTask}
onClose={() => setOpenDrawerTask(false)}
title={""}
>
<Stack pt={10}>
<SimpleGrid cols={{ base: 3, sm: 3, lg: 3 }} >
<Flex style={{ cursor: 'pointer' }} justify={'center'} align={'center'} direction={'column'} onClick={() => deleteTask(indexDelTask)}>
<Box>
<FaTrash size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua} ta='center'>Hapus Tugas</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
</LayoutDrawer>
<LayoutModal opened={isModal} onClose={() => setModal(false)}
description="Apakah Anda yakin ingin menambahkan data?"
onYes={(val) => {
if (val) {
onSubmit()
}
setModal(false)
}} />
</Box >
);
}

146
src/module/project/ui/create_users_project.tsx Normal file
View File

@@ -0,0 +1,146 @@
"use client"
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Avatar, Box, Button, Center, Input, SimpleGrid, Skeleton, Stack, Text, TextInput } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useRouter } from 'next/navigation';
import React, { useState } from 'react';
import { HiMagnifyingGlass } from 'react-icons/hi2';
import { funGetAllmember, TypeUser } from '@/module/user';
import { funGetUserByCookies } from '@/module/auth';
import toast from 'react-hot-toast';
import { globalMemberProject } from '../lib/val_project';
export default function CreateUsersProject({ grup, onClose }: { grup?: string, onClose: (val: any) => void }) {
const router = useRouter()
const member = useHookstate(globalMemberProject)
const [selectedFiles, setSelectedFiles] = useState<any>([]);
const [dataMember, setDataMember] = useState<TypeUser>([])
const [loading, setLoading] = useState(true)
const [openTugas, setOpenTugas] = useState(false)
const handleFileClick = (index: number) => {
if (selectedFiles.some((i: any) => i.idUser == dataMember[index].id)) {
setSelectedFiles(selectedFiles.filter((i: any) => i.idUser != dataMember[index].id))
} else {
setSelectedFiles([...selectedFiles, { idUser: dataMember[index].id, name: dataMember[index].name }])
}
};
async function loadData(search: string) {
setLoading(true)
const res = await funGetAllmember('?active=true&group=' + grup + '&search=' + search);
const user = await funGetUserByCookies();
if (res.success) {
setDataMember(res.data.filter((i: any) => i.id != user.id))
// cek data member sebelumnya
if (member.length > 0) {
setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
}
} else {
toast.error(res.message)
}
setLoading(false)
}
function onSubmit() {
if (selectedFiles.length == 0) {
return toast.error("Error! silahkan pilih anggota")
}
member.set(selectedFiles)
onClose(true)
}
useShallowEffect(() => {
loadData("")
}, []);
return (
<Box>
<LayoutNavbarNew title="Pilih 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"
onChange={(e) => loadData(e.target.value)}
/>
<Box pt={10}>
{loading ?
<SimpleGrid
cols={{ base: 2, sm: 2, lg: 2 }}
spacing={{ base: 20, sm: "xl" }}
verticalSpacing={{ base: "md", sm: "xl" }}
>
{Array(6)
.fill(null)
.map((_, i) => (
<Box key={i}>
<Skeleton width={"100%"} height={100} radius={"md"} />
</Box>
))}
</SimpleGrid>
:
<SimpleGrid
cols={{ base: 2, sm: 2, lg: 2 }}
spacing={{ base: 20, sm: "xl" }}
verticalSpacing={{ base: "md", sm: "xl" }}
>
{dataMember.map((v, index) => {
const isSelected = selectedFiles.some((i: any) => i.idUser == dataMember[index].id);
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={"https://i.pravatar.cc/1000?img=37"} 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={() => { onSubmit() }}
>
Simpan
</Button>
</Box>
</Box>
</Box>
);
}

4
src/module/project/ui/edit_detail_task_project.tsx
View File

@@ -25,7 +25,7 @@ export default function EditDetailTaskProject() {
try {
const res = await funEditDetailProject(param.id, {
name: name,
title: name,
dateStart: value[0],
dateEnd: value[1],
@@ -46,7 +46,7 @@ export default function EditDetailTaskProject() {
try {
const res = await funGetDetailProject(param.id);
if (res.success) {
setName(res.data.name)
setName(res.data.title)
setValue([
new Date(moment(res.data.dateStart).format('YYYY-MM-DD')),
new Date(moment(res.data.dateEnd).format('YYYY-MM-DD')),

4
src/module/project/ui/edit_task_project.tsx
View File

@@ -40,7 +40,7 @@ export default function EditTaskProject() {
try {
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setName(res.data.name);
setName(res.data.title);
} else {
toast.error(res.message);
}
@@ -57,7 +57,7 @@ export default function EditTaskProject() {
return (
<Box>
<LayoutNavbarNew back="" title={"Edit Judul Tugas"} menu />
<LayoutNavbarNew back="" title={"Edit Judul Proyek"} menu />
<Box p={20}>
<Stack pt={15}>
<Input

4
src/module/project/ui/list_project.tsx
View File

@@ -110,7 +110,7 @@ export default function ListProject() {
<HiMiniPresentationChartBar size={25} color={WARNA.biruTua} />
</ActionIcon>
</Center>
<Text>{v.name}</Text>
<Text>{v.title}</Text>
</Group>
<Box>
<RiCircleFill size={12} color={
@@ -136,7 +136,7 @@ export default function ListProject() {
<Card.Section>
<Box h={120} bg={WARNA.biruTua}>
<Flex justify={'center'} align={'center'} h={"100%"}>
<Title order={3} c={"white"}>{v.name}</Title>
<Title order={3} c={"white"}>{v.title}</Title>
</Flex>
</Box>
</Card.Section>

91
src/module/project/ui/list_tugas_detail_project.tsx
View File

@@ -49,12 +49,13 @@ export default function ListTugasDetailProject() {
async function onDelete() {
try {
const res = await funDeleteDetailProject(idData);
const res = await funDeleteDetailProject(idData, { idProject: param.id });
if (res.success) {
toast.success(res.message);
getOneData();
setIdData("")
setOpenDrawer(false)
refresh.set(true)
} else {
toast.error(res.message);
}
@@ -125,7 +126,7 @@ export default function ListTugasDetailProject() {
>
<Group>
<AiOutlineFileSync size={25} />
<Text>{item.name}</Text>
<Text>{item.title}</Text>
</Group>
</Box>
<Box>
@@ -206,51 +207,51 @@ export default function ListTugasDetailProject() {
</LayoutDrawer>
<LayoutModal opened={isOpenModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin menghapus proyek ini?"
onYes={(val) => {
if (val) {
onDelete()
}
setOpenModal(false)
description="Apakah Anda yakin ingin menghapus proyek ini?"
onYes={(val) => {
if (val) {
onDelete()
}
setOpenModal(false)
}} />
<LayoutDrawer opened={openDrawerStatus} title={'Status'} onClose={() => setOpenDrawerStatus(false)}>
<Box>
<Stack pt={10}>
{
valStatusDetailProject.map((item, index) => {
return (
<Box mb={5} key={index} onClick={() => { onUpdateStatus(item.value) }}>
<Flex justify={"space-between"} align={"center"}>
<Group>
<Text style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
}}>
{item.name}
</Text>
</Group>
<Text
style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
paddingLeft: 20,
}}
>
{statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Text>
</Flex>
<Divider my={"md"} />
</Box>
)
})
}
</Stack>
</Box>
</LayoutDrawer>
<LayoutDrawer opened={openDrawerStatus} title={'Status'} onClose={() => setOpenDrawerStatus(false)}>
<Box>
<Stack pt={10}>
{
valStatusDetailProject.map((item, index) => {
return (
<Box mb={5} key={index} onClick={() => { onUpdateStatus(item.value) }}>
<Flex justify={"space-between"} align={"center"}>
<Group>
<Text style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
}}>
{item.name}
</Text>
</Group>
<Text
style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
paddingLeft: 20,
}}
>
{statusData === item.value ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Text>
</Flex>
<Divider my={"md"} />
</Box>
)
})
}
</Stack>
</Box>
</LayoutDrawer>
</Box>
</>

2
src/module/project/ui/navbar_detail_project.tsx
View File

@@ -21,7 +21,7 @@ export default function NavbarDetailProject() {
try {
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setName(res.data.name);
setName(res.data.title);
} else {
toast.error(res.message);
}

4
src/module/project/ui/progress_detail_project.tsx
View File

@@ -3,7 +3,7 @@ import { WARNA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { ActionIcon, Box, Grid, Progress, Text } from '@mantine/core';
import { useParams } from 'next/navigation';
import React, { useEffect, useState } from 'react';
import React, { useState } from 'react';
import { HiMiniPresentationChartBar } from 'react-icons/hi2';
import { globalRefreshProject } from '../lib/val_project';
import toast from 'react-hot-toast';
@@ -39,7 +39,7 @@ export default function ProgressDetailProject() {
}
}
useEffect(() => {
useShallowEffect(() => {
onRefresh()
}, [refresh.get()])

13
src/module/project/components/results_date-and_task.tsx → src/module/project/ui/results_date-and_task.tsx
View File

@@ -2,11 +2,12 @@ import { WARNA } from '@/module/_global';
import { Box, Group, SimpleGrid, Text } from '@mantine/core';
import React from 'react';
import { AiOutlineFileSync } from "react-icons/ai";
import { IFormDateProject } from '../lib/type_project';
import moment from 'moment';
export default function ResultsDateAndTask() {
export default function ResultsDateAndTask(data: IFormDateProject) {
return (
<Box pt={20}>
<Text fw={'bold'} c={WARNA.biruTua}>Tanggal & Tugas</Text>
<Box pt={5}>
<Box bg={"white"} style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
@@ -19,7 +20,7 @@ export default function ResultsDateAndTask() {
}}>
<Group>
<AiOutlineFileSync size={25} />
<Text>Proyek Laporan Permasyarakatan</Text>
<Text>{data.title}</Text>
</Group>
</Box>
<Box>
@@ -32,7 +33,7 @@ export default function ResultsDateAndTask() {
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>16 Juni 2024</Text>
<Text>{moment(data.dateStart).format('DD-MM-YYYY')}</Text>
</Group>
</Box>
<Box>
@@ -43,7 +44,7 @@ export default function ResultsDateAndTask() {
h={45}
style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}
>
<Text>20 Juni 2024</Text>
<Text>{moment(data.dateEnd).format('DD-MM-YYYY')}</Text>
</Group>
</Box>
</SimpleGrid>

24
src/module/project/ui/results_file.tsx Normal file
View File

@@ -0,0 +1,24 @@
import { WARNA } from '@/module/_global';
import { Box, Group, Text } from '@mantine/core';
import React from 'react';
import { BsFiletypeCsv, BsFiletypeHeic, BsFiletypeJpg, BsFiletypePdf, BsFiletypePng } from 'react-icons/bs';
import { IListFileTaskProject } from '../lib/type_project';
export default function ResultsFile({ name, extension }: IListFileTaskProject) {
return (
<Box style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
padding: 10
}} mb={10}>
<Group>
{extension == "pdf" && <BsFiletypePdf size={25} />}
{extension == "csv" && <BsFiletypeCsv size={25} />}
{extension == "png" && <BsFiletypePng size={25} />}
{extension == "jpg" || extension == "jpeg" && <BsFiletypeJpg size={25} />}
{extension == "heic" && <BsFiletypeHeic size={25} />}
<Text>{name}</Text>
</Group>
</Box>
);
}

9
src/module/project/view/view_create_project.tsx
View File

@@ -1,9 +0,0 @@
import React from 'react';
import CreateProject from '../components/create_project';
export default function ViewCreateProject({ searchParams }: { searchParams: any }) {
return (
<CreateProject searchParams={searchParams} />
);
}

3
src/module/task/lib/api_task.ts
View File

@@ -26,12 +26,13 @@ export const funGetTaskDivisionById = async (path: string, kategori: string) =>
}
export const funDeleteDetailTask = async (path: string) => {
export const funDeleteDetailTask = async (path: string, data: { idProject: string }) => {
const response = await fetch(`/api/task/detail/${path}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
};

2
src/module/task/ui/detail_list_tugas_task.tsx
View File

@@ -49,7 +49,7 @@ export default function ListTugasDetailTask() {
async function onDelete() {
try {
const res = await funDeleteDetailTask(idData);
const res = await funDeleteDetailTask(idData, { idProject: param.detail });
if (res.success) {
toast.success(res.message);
refresh.set(true)

81
src/module/task/ui/detail_progress_task.tsx
View File

@@ -6,7 +6,7 @@ import { useParams } from "next/navigation";
import toast from "react-hot-toast";
import { HiMiniPresentationChartBar } from "react-icons/hi2";
import { funGetTaskDivisionById } from "../lib/api_task";
import { useEffect, useState } from "react";
import { useState } from "react";
import { globalRefreshTask } from "../lib/val_task";
import { useHookstate } from "@hookstate/core";
@@ -44,8 +44,7 @@ export default function ProgressDetailTask() {
}
useEffect(() => {
useShallowEffect(() => {
onRefresh()
}, [refresh.get()])
@@ -56,44 +55,44 @@ export default function ProgressDetailTask() {
return (
<Box mt={10}>
{loading ?
<Skeleton width={"100%"} height={100} radius={"md"} />
:
<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 {valProgress}%</Text>
<Progress
style={{
border: `1px solid ${"#BDBDBD"}`,
}}
w={"100%"}
color="#FCAA4B"
radius="md"
size="xl"
value={valProgress}
/>
</Box>
</Grid.Col>
</Grid>
</Box>
<Skeleton width={"100%"} height={100} radius={"md"} />
:
<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 {valProgress}%</Text>
<Progress
style={{
border: `1px solid ${"#BDBDBD"}`,
}}
w={"100%"}
color="#FCAA4B"
radius="md"
size="xl"
value={valProgress}
/>
</Box>
</Grid.Col>
</Grid>
</Box>
}
</Box>
)