feat : update project

This commit is contained in:
lukman
2024-08-22 15:22:29 +08:00
parent 0c2694e9dc
commit 7c78d97427
26 changed files with 1526 additions and 131 deletions

View File

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

View File

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

View File

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

View File

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

View File

@@ -1,4 +1,4 @@
import { LiatAnggotaDetailProject, ListFileDetailProject, ListTugasDetailProject, NavbarDetailProject, ProgressDetailProject, ViewDetailProject } from '@/module/project';
import { ListAnggotaDetailProject, ListFileDetailProject, ListTugasDetailProject, NavbarDetailProject, ProgressDetailProject, ViewDetailProject } from '@/module/project';
import { Box } from '@mantine/core';
import React from 'react';
@@ -10,7 +10,7 @@ function Page() {
<ProgressDetailProject />
<ListTugasDetailProject />
<ListFileDetailProject />
<LiatAnggotaDetailProject />
<ListAnggotaDetailProject />
</Box>
</Box>
);

View File

@@ -1,6 +1,7 @@
import {
DetailCreateUserProject,
DetailDateEndTask,
EditDetailTaskProject,
FileUploadProgres,
ViewUpdateProgres,
} from "@/module/project";
@@ -8,12 +9,16 @@ import {
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" />;
// 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} />;
// return <ViewUpdateProgres searchParams={searchParams} />;
return (
<EditDetailTaskProject/>
)
}
export default Page;

View File

@@ -152,7 +152,6 @@ export async function DELETE(request: Request, context: { params: { id: string }
export async function PUT(request: Request, context: { params: { id: string } }) {
try {
console.log('amalai')
const user = await funGetUserByCookies()
if (user.id == undefined) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
@@ -168,8 +167,6 @@ export async function PUT(request: Request, context: { params: { id: string } })
}
})
console.log(id, title, desc, timeStart, dateStart, timeEnd, linkMeet, repeatEventTyper, member)
if (cek == 0) {
return NextResponse.json(
{
@@ -218,7 +215,6 @@ export async function PUT(request: Request, context: { params: { id: string } })
data: omitMember
});
console.log(omitMember)
return NextResponse.json({ success: true, message: "Berhasil mengedit calender" }, { status: 200 });

View File

@@ -61,7 +61,7 @@ export async function DELETE(request: Request, context: { params: { id: string }
const { id } = context.params
const { idUser } = (await request.json());
const data = await prisma.divisionProject.count({
const data = await prisma.project.count({
where: {
id: id,
},
@@ -91,4 +91,94 @@ export async function DELETE(request: Request, context: { params: { id: string }
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mengeluarkan anggota project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}
//GET MEMBER ALL USER ID GROUP
export async function GET(request: Request, context: { params: { id: string } }) {
try {
const user = await funGetUserByCookies()
if (user.id == undefined) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params
const groupId = user.idGroup
const userId = user.id
const data = await prisma.project.findUnique({
where: {
id: String(id),
isActive: true
}
})
if (data == null) {
return NextResponse.json(
{
success: false,
message: "Gagal, data tugas tidak ditemukan",
},
{ status: 404 }
);
}
// const member = await prisma.projectMember.findMany({
// where: {
// idProject: String(id),
// isActive: true
// },
// select: {
// id: true,
// isLeader: true,
// idUser: true,
// User: {
// select: {
// name: true
// }
// }
// },
// orderBy: {
// isLeader: 'desc',
// }
// })
// const fixMember = member.map((v: any) => ({
// ..._.omit(v, ["User"]),
// name: v.User.name
// }))
const member = await prisma.user.findMany({
where: {
idGroup: String(groupId),
id: {
not: String(userId)
},
isActive: true
},
select: {
id: true,
name: true,
email: true,
}
})
const fixMember = member.map((v: any) => ({
idUser: v.id,
name: v.name,
email: v.email,
}))
const dataFix = {
project: data,
member: fixMember
}
return NextResponse.json({ success: true, message: "Berhasil mendapatkan project", data: dataFix, }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mendapatkan project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}

View File

@@ -43,7 +43,6 @@ export async function GET(request: Request, context: { params: { id: string } })
}
})
console.log(dataProgress)
const semua = dataProgress.length
const selesai = _.filter(dataProgress, { status: 1 }).length
const progress = Math.ceil((selesai / semua) * 100)
@@ -185,10 +184,10 @@ export async function DELETE(request: Request, context: { params: { id: string }
}
const { id } = context.params
const { idTask } = await request.json()
const data = await prisma.projectTask.count({
const { reason } = await request.json()
const data = await prisma.project.count({
where: {
id: String(idTask)
id: id
}
})
@@ -207,7 +206,7 @@ export async function DELETE(request: Request, context: { params: { id: string }
},
data: {
status: 3,
reason: idTask
reason: reason
}
})

View File

@@ -1,5 +1,6 @@
import { prisma } from "@/module/_global";
import { funGetUserByCookies } from "@/module/auth";
import moment from "moment";
import { NextResponse } from "next/server";
@@ -52,3 +53,137 @@ export async function DELETE(request: Request, context: { params: { id: string }
// EDIT STATUS DETAIL PROJECT
export async function PUT(request: Request, context: { params: { id: string } }) {
try {
const user = await funGetUserByCookies()
if (user.id == undefined) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params;
const { status, idProject } = (await request.json());
const data = await prisma.projectTask.count({
where: {
id
}
})
if (data == 0) {
return NextResponse.json(
{
success: false, message: "Gagal mendapatkan project, data tidak ditemukan",
},
{ status: 404 }
);
}
const dataCreate = await prisma.projectTask.update({
where: {
id
},
data: {
status: status
}
})
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 update = await prisma.project.update({
where: {
id: idProject
},
data: {
status: statusProject
}
})
return NextResponse.json({ success: true, message: "Status detail Project berhasil diupdate", data }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal membatalkan project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}
// GET ONE DETAIL PROJECT
export async function GET(request: Request, context: { params: { id: string } }) {
try {
const user = await funGetUserByCookies()
if (user.id == undefined) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params;
const data = await prisma.projectTask.findUnique({
where: {
id: String(id),
isActive: true
}
})
if (!data) {
return NextResponse.json(
{
success: false, message: "Gagal mendapatkan project, data tidak ditemukan",
},
{ status: 404 }
);
}
return NextResponse.json({ success: true, message: "Detail project berhasil ditemukan", data }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mendapatkan project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}
// EDIT DETAIL PROJECT
export async function POST(request: Request, context: { params: { id: string } }) {
try {
const user = await funGetUserByCookies()
if (user.id == undefined) {
return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 });
}
const { id } = context.params;
const { name, dateStart, dateEnd } = (await request.json());
const data = await prisma.projectTask.update({
where: {
id
},
data: {
name: name,
dateStart: new Date(moment(dateStart).format('YYYY-MM-DD')),
dateEnd: new Date(moment(dateEnd).format('YYYY-MM-DD')),
}
})
return NextResponse.json({ success: true, message: "Detail project berhasil diupdate", data }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal membatalkan project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}

View File

@@ -1,6 +1,7 @@
import { prisma } from "@/module/_global";
import { funGetUserByCookies } from "@/module/auth";
import _ from "lodash";
import moment from "moment";
import { NextResponse } from "next/server";
@@ -62,4 +63,89 @@ export async function GET(request: Request) {
console.error(error);
return NextResponse.json({ success: false, message: "Gagal mendapatkan project, coba lagi nanti", reason: (error as Error).message, }, { status: 500 });
}
}
// CREATE PROJECT
export async function POST(request: Request) {
try {
const user = await funGetUserByCookies()
if (user.id == undefined) {
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 userId = user.id
const data = await prisma.project.create({
data: {
idVillage: String(idVillage),
idGroup: String(idGroup),
name: name,
desc: "",
createdBy: String(userId)
},
select: {
id: true
}
})
if (task.length > 0) {
const dataProject = task.map((v: any) => ({
..._.omit(v, ["dateStart", "dateEnd", "name"]),
idProject: data.id,
name: v.name,
dateStart: new Date(moment(v.dateStart).format('YYYY-MM-DD')),
dateEnd: new Date(moment(v.dateEnd).format('YYYY-MM-DD')),
}))
const insertTask = await prisma.projectTask.createMany({
data: dataProject
})
}
if (member.length > 0) {
const dataMember = member.map((v: any) => ({
..._.omit(v, ["idUser", "name"]),
idProject: data.id,
idUser: v.idUser,
name: v.name
}))
const insertMember = await prisma.projectMember.createMany({
data: dataMember
})
}
let fileFix: any[] = []
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 insertFile = await prisma.divisionProjectFile.createMany({
data: fileFix
})
}
return NextResponse.json({ success: true, message: "Berhasil mendapatkan divisi", 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 });
}
}

View File

@@ -14,7 +14,13 @@ import NavbarDetailProject from "./ui/navbar_detail_project";
import ProgressDetailProject from "./ui/progress_detail_project";
import ListTugasDetailProject from "./ui/list_tugas_detail_project";
import ListFileDetailProject from "./ui/list_file_detail_project";
import LiatAnggotaDetailProject from "./ui/liat_anggota_detail_project";
import LiatAnggotaDetailProject from "./ui/list_anggota_detail_project";
import EditTaskProject from "./ui/edit_task_project";
import EditDetailTaskProject from "./ui/edit_detail_task_project";
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";
export { ViewProject }
export { ViewCreateProject }
@@ -32,4 +38,9 @@ export { NavbarDetailProject }
export { ProgressDetailProject }
export { ListTugasDetailProject }
export { ListFileDetailProject }
export { LiatAnggotaDetailProject }
export { ListAnggotaDetailProject }
export { EditTaskProject }
export { EditDetailTaskProject }
export { AddDetailTaskProject }
export { CancelProject }
export { AddMemberDetailProject }

View File

@@ -1,3 +1,4 @@
import { IFormAddDetailproject, IFormAddMemberProject, IFormDateProject, IFormProject } from "./type_project";
export const funGetAllProject = async (path?: string) => {
@@ -5,7 +6,120 @@ export const funGetAllProject = async (path?: string) => {
return await response.json().catch(() => null);
}
export const funCreateProject = async (data: IFormProject) => {
const response = await fetch(`/api/project`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funGetOneProjectById = async (path: string, kategori: string) => {
const response = await fetch(`/api/project/${path}?cat=${kategori}`);
return await response.json().catch(() => null);
}
export const funGetAllMemberById = async (path?: string) => {
const response = await fetch(`/api/project/${path}/member`);
return await response.json().catch(() => null);
}
export const funDeleteDetailProject = async (path: string) => {
const response = await fetch(`/api/project/detail/${path}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
});
return await response.json().catch(() => null);
}
export const funUpdateStatusProject = async (path: string, data: { status: number, idProject: string }) => {
const response = await fetch(`/api/project/detail/${path}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funGetDetailProject = async (path: string) => {
const response = await fetch(`/api/project/detail/${path}`);
return await response.json().catch(() => null);
}
export const funEditDetailProject = async (path: string, data: IFormDateProject) => {
const response = await fetch(`/api/project/detail/${path}`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funCreateDetailProject = async (path: string, data: IFormAddDetailproject) => {
const response = await fetch(`/api/project/${path}`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funAddMemberProject = async (path: string, data: IFormAddMemberProject) => {
const response = await fetch(`/api/project/${path}/member`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funDeleteMemberProject = async (path: string, data: { idUser: string }) => {
const response = await fetch(`/api/project/${path}/member`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funCancelProject = async (path: string, data: { reason: string }) => {
const response = await fetch(`/api/project/${path}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funEditProject = async (path: string, data: { name: string }) => {
const response = await fetch(`/api/project/${path}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}

View File

@@ -1,11 +1,11 @@
export interface IDataProject {
id: string
name: string
desc: string
status: number
member: number
id: string
name: string
desc: string
status: number
member: number
}
export interface IDataListTaskProject {
id: string
name: string
@@ -26,4 +26,42 @@ export interface IDataMemberProject {
idUser: string
name: string
email: string
}
export interface IFormProject {
idDivision: string,
name: string,
task: IFormDateProject[] | [],
member: IFormMemberProject[] | [],
file: FormData[] | []
}
export interface IFormDateProject {
dateStart: Date,
dateEnd: Date,
name: string,
}
export interface IFormMemberProject {
idUser: string,
name: string
}
export interface IFormAddDetailproject {
dateStart: Date,
dateEnd: Date,
name: string
}
export interface IFormAddMemberProject {
member: IFormMemberProject[] | []
}
export interface IDataMemberProjectDetail {
id: string,
idUser: string,
isLeader: string,
name: string
}

View File

@@ -1,3 +1,14 @@
import { hookstate } from "@hookstate/core";
export const globalRefreshProject = hookstate<boolean>(false)
export const globalRefreshProject = hookstate<boolean>(false)
export const valStatusDetailProject = [
{
name: "Belum Dikerjakan",
value: 0
},
{
name: "Selesai",
value: 1
}
]

View File

@@ -0,0 +1,133 @@
"use client"
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { funCreateDetailProject } from '../lib/api_project';
import { Box, Button, Group, Input, SimpleGrid, Stack, Text } from '@mantine/core';
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { DatePicker } from '@mantine/dates';
import moment from 'moment';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function AddDetailTaskProject() {
const [value, setValue] = useState<[Date | null, Date | null]>([null, null]);
const router = useRouter()
const [name, setName] = useState("")
const [openModal, setOpenModal] = useState(false)
const param = useParams<{ id: string }>()
function onVerification() {
if (value[0] == null || value[1] == null)
return toast.error("Error! harus memilih tanggal")
if (name == "")
return toast.error("Error! harus memasukkan judul tugas")
setOpenModal(true)
}
async function onSubmit() {
try {
const res = await funCreateDetailProject(param.id, {
name,
dateStart: (value[0] != null) ? value[0] : new Date,
dateEnd: (value[1] != null) ? value[1] : new Date,
})
if (res.success) {
toast.success(res.message)
setOpenModal(false)
router.push(`/project/${param.id}`)
} else {
toast.error(res.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal menambahkan tugas, coba lagi nanti")
}
}
return (
<Box>
<LayoutNavbarNew back="" title={"Tambah Proyek"} 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={name}
onChange={(e) => setName(e.target.value)}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onVerification() }}
>
Simpan
</Button>
</Box>
</Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin menambahkan tugas?"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -0,0 +1,191 @@
"use client"
import { useParams, useRouter } from 'next/navigation';
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';
import { FaCheck } from 'react-icons/fa6';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function AddMemberDetailProject() {
const router = useRouter()
const param = useParams<{ id: string }>()
const [selectedFiles, setSelectedFiles] = useState<any>([])
const [isData, setData] = useState<IDataMemberProjectDetail[]>([])
const [isDataMember, setDataMember] = useState<IDataMemberProject[]>([])
const [selectAll, setSelectAll] = useState(false)
const [openModal, setOpenModal] = useState(false)
async function getData() {
try {
const response = await funGetAllMemberById(param.id)
if (response.success) {
setData(response.data.member)
} else {
toast.error(response.message)
}
const res = await funGetOneProjectById(param.id, 'member');
if (res.success) {
setDataMember(res.data)
} else {
toast.error(res.message);
}
} catch (error) {
console.log(error)
toast.error("Gagal mendapatkan anggota, coba lagi nanti");
}
}
const handleFileClick = (index: number) => {
if (selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) {
setSelectedFiles(selectedFiles.filter((i: any) => i.idUser != isData[index].idUser))
} else {
setSelectedFiles([...selectedFiles, { idUser: isData[index].idUser, name: isData[index].name }])
}
};
const handleSelectAll = () => {
setSelectAll(!selectAll);
if (!selectAll) {
for (let index = 0; index < isData.length; index++) {
if (!isDataMember.some((i: any) => i.idUser == isData[index].idUser)) {
if (!selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) {
const newArr = {
idUser: isData[index].idUser, name: isData[index].name
}
setSelectedFiles((selectedFiles: any) => [...selectedFiles, newArr])
}
}
}
} else {
setSelectedFiles([]);
}
};
function onVerifikasi() {
if (selectedFiles.length == 0) {
return toast.error("Error! silahkan pilih anggota")
}
setOpenModal(true)
}
useShallowEffect(() => {
getData()
}, []);
async function onSubmit() {
try {
const res = await funAddMemberProject(param.id, { member: selectedFiles });
if (res.success) {
toast.success(res.message)
router.back()
} else {
toast.error(res.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal menambahkan anggota, coba lagi nanti");
}
}
return (
<Box>
<LayoutNavbarNew
back=""
title="Pilih Anggotak"
menu
/>
<pre>{JSON.stringify(isData, null, 1)}</pre>
<pre>{JSON.stringify(isDataMember, null, 1)}</pre>
<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"
/> */}
<Group justify="space-between" mt={20} onClick={handleSelectAll}>
<Text c={WARNA.biruTua} fw={"bold"}>
Pilih Semua Anggota
</Text>
{selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Group>
<Box mt={15}>
{isData.map((v, i) => {
const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
const found = isDataMember.some((i: any) => i.idUser == v.idUser)
return (
<Box mb={15} key={i} onClick={() => (!found) ? handleFileClick(i) : null}>
<Flex justify={"space-between"} align={"center"}>
<Group>
<Avatar src={"v.image"} alt="it's me" size="lg" />
<Stack align="flex-start" justify="flex-start">
<Text style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
}}>
{v.name}
</Text>
<Text c={"dimmed"}>{(found) ? "sudah menjadi anggota" : ""}</Text>
</Stack>
</Group>
<Text
style={{
cursor: 'pointer',
display: 'flex',
alignItems: 'center',
paddingLeft: 20,
}}
>
{isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
</Text>
</Flex>
<Divider my={"md"} />
</Box>
);
})}
</Box>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onVerifikasi() }}
>
Simpan
</Button>
</Box>
</Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin menambahkan anggota?"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -0,0 +1,80 @@
"use client"
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { funCancelProject } from '../lib/api_project';
import { Box, Button, Stack, Textarea } from '@mantine/core';
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function CancelProject() {
const router = useRouter()
const [alasan, setAlasan] = useState("")
const [openModal, setOpenModal] = useState(false)
const param = useParams<{ id: string }>()
function onVerification() {
if (alasan == "")
return toast.error("Error! harus memasukkan alasan pembatalan proyek")
setOpenModal(true)
}
async function onSubmit() {
try {
const res = await funCancelProject(param.id, { reason: alasan })
if (res.success) {
toast.success(res.message)
router.push("/project")
} else {
toast.error(res.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal membatalkan proyek, coba lagi nanti")
}
}
return (
<Box>
<LayoutNavbarNew back="" title={"Pembatalan Proyek"} menu />
<Box p={20}>
<Stack pt={15}>
<Textarea styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
value={alasan}
size="md" placeholder='Contoh : proyek tidak sesuai' label="Alasan Pembatalan"
onChange={(event) => setAlasan(event.target.value)}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onVerification() }}
>
Simpan
</Button>
</Box>
</Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin membatalkan proyek ini? Pembatalan proyek bersifat permanen"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -0,0 +1,148 @@
"use client"
import { useParams } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { funEditDetailProject, funGetDetailProject } from '../lib/api_project';
import moment from 'moment';
import { useShallowEffect } from '@mantine/hooks';
import { Box, Button, Group, Input, SimpleGrid, Stack, Text } from '@mantine/core';
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import { DatePicker } from '@mantine/dates';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function EditDetailTaskProject() {
const [value, setValue] = useState<[Date | null, Date | null]>([null, null]);
const [name, setName] = useState("")
const param = useParams<{ id: string}>()
const [openModal, setOpenModal] = useState(false)
async function onSubmit() {
if (value[0] == null || value[1] == null)
return toast.error("Error! harus memilih tanggal")
if (name == "")
return toast.error("Error! harus memasukkan judul tugas")
try {
const res = await funEditDetailProject(param.id, {
name: name,
dateStart: value[0],
dateEnd: value[1],
})
if (res.success) {
toast.success(res.message);
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal edit detail tugas proyek, coba lagi nanti");
}
}
async function getOneData() {
try {
const res = await funGetDetailProject(param.id);
if (res.success) {
setName(res.data.name)
setValue([
new Date(moment(res.data.dateStart).format('YYYY-MM-DD')),
new Date(moment(res.data.dateEnd).format('YYYY-MM-DD')),
])
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan detail tugas proyek, coba lagi nanti");
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
return (
<Box>
<LayoutNavbarNew back="" title={"Edit Detail Proyek"} 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={name}
onChange={(e) => { setName(e.target.value) }}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { setOpenModal(true) }}
>
Simpan
</Button>
</Box>
</Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengubah data?"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -0,0 +1,102 @@
"use client"
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { funEditProject, funGetOneProjectById } from '../lib/api_project';
import { useShallowEffect } from '@mantine/hooks';
import { Box, Button, Input, Stack } from '@mantine/core';
import { LayoutNavbarNew, WARNA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function EditTaskProject() {
const router = useRouter()
const [name, setName] = useState("")
const [openModal, setOpenModal] = useState(false)
const param = useParams<{ id: string }>()
function onVerification() {
if (name == "")
return toast.error("Error! harus memasukkan judul tugas")
setOpenModal(true)
}
async function onSubmit() {
try {
const res = await funEditProject(param.id, { name })
if (res.success) {
toast.success(res.message)
router.push("./")
} else {
toast.error(res.message)
}
} catch (error) {
console.log(error)
toast.error("Gagal mengedit proyek, coba lagi nanti")
}
}
async function getOneData() {
try {
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setName(res.data.name);
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan data proyek, coba lagi nanti");
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
return (
<Box>
<LayoutNavbarNew back="" title={"Edit Judul Tugas"} menu />
<Box p={20}>
<Stack pt={15}>
<Input
styles={{
input: {
border: `1px solid ${"#D6D8F6"}`,
borderRadius: 10,
},
}}
placeholder="Tugas"
size="md"
value={name}
onChange={(e) => { setName(e.target.value) }}
/>
</Stack>
<Box mt={"xl"}>
<Button
c={"white"}
bg={WARNA.biruTua}
size="lg"
radius={30}
fullWidth
onClick={() => { onVerification() }}
>
Simpan
</Button>
</Box>
</Box>
<LayoutModal opened={openModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengedit tugas ini?"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -1,93 +0,0 @@
'use client'
import { WARNA } from '@/module/_global';
import { Avatar, Box, Flex, Group, Text } from '@mantine/core';
import React, { useState } from 'react';
import { funGetOneProjectById } from '../lib/api_project';
import toast from 'react-hot-toast';
import { useParams } from 'next/navigation';
import { useShallowEffect } from '@mantine/hooks';
import { IDataMemberProject } from '../lib/type_project';
export default function LiatAnggotaDetailProject() {
const [isData, setData] = useState<IDataMemberProject[]>([])
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
async function getOneData() {
try {
setLoading(true)
const res = await funGetOneProjectById(param.id, 'member');
if (res.success) {
setData(res.data)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan member proyek, coba lagi nanti");
} finally {
setLoading(false)
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
return (
<Box pt={20}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
<Text c={WARNA.biruTua}>Total {isData.length} Anggota</Text>
</Group>
<Box pt={10}>
<Box mb={20}>
<Box
style={{
border: `1px solid ${"#C7D6E8"}`,
borderRadius: 10,
}}
px={20}
py={10}
>
{
loading ? <Text>loading</Text> :
isData.length === 0 ? <Text>Tidak ada anggota</Text> :
isData.map((v, i) => {
return (
<Flex
justify={"space-between"}
align={"center"}
mt={20}
key={i}
onClick={() => {
// setDataChoose({ id: v.idUser, name: v.name })
// setOpenDrawer(true)
}}
>
<Group>
<Avatar src={""} 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>
);
}

View File

@@ -0,0 +1,155 @@
'use client'
import { LayoutDrawer, WARNA } from '@/module/_global';
import { Avatar, Box, Flex, Group, SimpleGrid, Stack, Text } from '@mantine/core';
import React, { useState } from 'react';
import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project';
import toast from 'react-hot-toast';
import { useParams, useRouter } from 'next/navigation';
import { useShallowEffect } from '@mantine/hooks';
import { IDataMemberProject } from '../lib/type_project';
import { FaUser } from 'react-icons/fa6';
import { IoIosCloseCircle } from 'react-icons/io';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function ListAnggotaDetailProject() {
const [isData, setData] = useState<IDataMemberProject[]>([])
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
const [openDrawer, setOpenDrawer] = useState(false)
const [isOpenModal, setOpenModal] = useState(false)
const [dataChoose, setDataChoose] = useState({ id: '', name: '' })
const router = useRouter()
async function getOneData() {
try {
setLoading(true)
const res = await funGetOneProjectById(param.id, 'member');
if (res.success) {
setData(res.data)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan member proyek, coba lagi nanti");
} finally {
setLoading(false)
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
async function onSubmit() {
try {
const res = await funDeleteMemberProject(param.id, { idUser: dataChoose.id });
if (res.success) {
toast.success(res.message)
setDataChoose({ id: '', name: '' })
getOneData()
setOpenDrawer(false)
} else {
toast.error(res.message)
}
} catch (error) {
console.error(error);
toast.error("Gagal menghapus anggota proyek, coba lagi nanti");
}
}
return (
<Box pt={20}>
<Group justify="space-between">
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
<Text c={WARNA.biruTua}>Total {isData.length} Anggota</Text>
</Group>
<Box pt={10}>
<Box mb={20}>
<Box
style={{
border: `1px solid ${"#C7D6E8"}`,
borderRadius: 10,
}}
px={20}
py={10}
>
{
loading ? <Text>loading</Text> :
isData.length === 0 ? <Text>Tidak ada anggota</Text> :
isData.map((v, i) => {
return (
<Flex
justify={"space-between"}
align={"center"}
mt={20}
key={i}
onClick={() => {
setDataChoose({ id: v.idUser, name: v.name })
setOpenDrawer(true)
}}
>
<Group>
<Avatar src={""} 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>
<LayoutDrawer opened={openDrawer} title={dataChoose.name} onClose={() => setOpenDrawer(false)}>
<Box>
<Stack pt={10}>
<SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }}
>
<Flex onClick={() => { router.push('/member/' + dataChoose.id) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<FaUser size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Lihat profil</Text>
</Box>
</Flex>
<Flex onClick={() => { setOpenModal(true) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<IoIosCloseCircle size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Keluarkan anggota</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
</Box>
</LayoutDrawer>
<LayoutModal opened={isOpenModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengeluarkan anggota?"
onYes={(val) => {
if (val) {
onSubmit()
}
setOpenModal(false)
}} />
</Box>
);
}

View File

@@ -1,18 +1,29 @@
'use client'
import { WARNA } from '@/module/_global';
import { Box, Center, Checkbox, Divider, Grid, Group, SimpleGrid, Text } from '@mantine/core';
import { LayoutDrawer, WARNA } from '@/module/_global';
import { Box, Center, Checkbox, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { AiOutlineFileSync } from 'react-icons/ai';
import { funGetOneProjectById } from '../lib/api_project';
import { useParams } from 'next/navigation';
import { AiOutlineFileDone, AiOutlineFileSync } from 'react-icons/ai';
import { funDeleteDetailProject, funGetOneProjectById, funUpdateStatusProject } from '../lib/api_project';
import { useParams, useRouter } from 'next/navigation';
import { useShallowEffect } from '@mantine/hooks';
import { IDataListTaskProject } from '../lib/type_project';
import { useHookstate } from '@hookstate/core';
import { globalRefreshProject, valStatusDetailProject } from '../lib/val_project';
import { FaCheck, FaPencil, FaTrash } from 'react-icons/fa6';
import LayoutModal from '@/module/_global/layout/layout_modal';
export default function ListTugasDetailProject() {
const [isData, setData] = useState<IDataListTaskProject[]>([])
const [loading, setLoading] = useState(true)
const param = useParams<{ id: string }>()
const [openDrawer, setOpenDrawer] = useState(false)
const [idData, setIdData] = useState('')
const refresh = useHookstate(globalRefreshProject)
const [statusData, setStatusData] = useState(0)
const [openDrawerStatus, setOpenDrawerStatus] = useState(false)
const [isOpenModal, setOpenModal] = useState(false)
const router = useRouter()
async function getOneData() {
try {
@@ -36,6 +47,42 @@ export default function ListTugasDetailProject() {
getOneData();
}, [param.id])
async function onDelete() {
try {
const res = await funDeleteDetailProject(idData);
if (res.success) {
toast.success(res.message);
getOneData();
setIdData("")
setOpenDrawer(false)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal hapus tugas proyek, coba lagi nanti");
}
}
async function onUpdateStatus(val: number) {
try {
const res = await funUpdateStatusProject(idData, { status: val, idProject: param.id });
if (res.success) {
toast.success(res.message);
getOneData();
setIdData("")
setOpenDrawer(false)
setOpenDrawerStatus(false)
refresh.set(true)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal update status tugas proyek, coba lagi nanti");
}
}
return (
<>
<Box pt={20}>
@@ -58,9 +105,9 @@ export default function ListTugasDetailProject() {
<Box key={index}>
<Grid
onClick={() => {
// setIdData(item.id)
// setStatusData(item.status)
// setOpenDrawer(true)
setIdData(item.id)
setStatusData(item.status)
setOpenDrawer(true)
}}
>
<Grid.Col span={"auto"}>
@@ -115,12 +162,96 @@ export default function ListTugasDetailProject() {
</Box>
</Grid.Col>
</Grid>
<Divider my={"lg"}/>
<Divider my={"lg"} />
</Box>
)
})
}
</Box>
<LayoutDrawer opened={openDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}>
<Box>
<Stack pt={10}>
<SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }}
>
<Flex onClick={() => { setOpenDrawerStatus(true) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<AiOutlineFileDone size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Update status</Text>
</Box>
</Flex>
<Flex onClick={() => { router.push('update/' + idData) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<FaPencil size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Edit tugas</Text>
</Box>
</Flex>
<Flex onClick={() => { setOpenModal(true) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<FaTrash size={30} color={WARNA.biruTua} />
</Box>
<Box>
<Text c={WARNA.biruTua}>Hapus tugas</Text>
</Box>
</Flex>
</SimpleGrid>
</Stack>
</Box>
</LayoutDrawer>
<LayoutModal opened={isOpenModal} onClose={() => 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>
</Box>
</>
);

View File

@@ -3,16 +3,39 @@ import { LayoutDrawer, LayoutNavbarNew, WARNA } from '@/module/_global';
import { ActionIcon, Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
import { useParams, useRouter } from 'next/navigation';
import React, { useState } from 'react';
import toast from 'react-hot-toast';
import { FaPencil, FaUsers } from 'react-icons/fa6';
import { HiMenu } from 'react-icons/hi';
import { IoAddCircle } from 'react-icons/io5';
import { MdCancel } from 'react-icons/md';
import { funGetOneProjectById } from '../lib/api_project';
import { useShallowEffect } from '@mantine/hooks';
export default function NavbarDetailProject() {
const router = useRouter()
const param = useParams<{ id: string }>()
const [name, setName] = useState('')
const [isOpen, setOpen] = useState(false)
async function getOneData() {
try {
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setName(res.data.name);
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan data proyek, coba lagi nanti");
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
return (
<>
<LayoutNavbarNew back="" title={name} menu={
@@ -28,7 +51,6 @@ export default function NavbarDetailProject() {
</ActionIcon>
} />
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)}>
<Box>
<Stack pt={10}>

View File

@@ -19,7 +19,6 @@ export default function ProgressDetailProject() {
async function getOneData() {
try {
const res = await funGetOneProjectById(param.id, 'progress');
console.log("data",res)
if (res.success) {
setValProgress(res.data.progress);
setValLastUpdate(res.data.lastUpdate);

View File

@@ -117,9 +117,11 @@ export default function AddMemberDetailTask() {
<Box>
<LayoutNavbarNew
back=""
title="Pilih Anggota"
title="Pilih Anggotak"
menu
/>
<pre>{JSON.stringify(isData, null, 1)}</pre>
<pre>{JSON.stringify(isDataMember, null, 1)}</pre>
<Box p={20}>
{/* <TextInput
styles={{