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

upd: laporan kegiatan

Browse Source 
Deskripsi:
- update  struktur database
- api update laporan kegiatan project
- tampilan laporan kegiatan project
- form update laporan kegiatan project
- integrasi api update laporan kegiatan project
- api update laporan kegiatan tugas divisi
- tampilan laporan kegiatan tugas divisi
- form update laporan kegiatan tugas divisi
- integrasi api update laporan kegiatan tugas divisi

No Issues
This commit is contained in:
amal
2025-08-14 16:50:02 +08:00
parent 2c98c2581d
commit 1f856ad3ab
17 changed files with 689 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -5,7 +5,6 @@ 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/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";
@@ -16,6 +15,8 @@ import CreateProject from "./ui/create_project";
import AddFileDetailProject from "./ui/add_file_detail_project";
import WrapLayoutProject from "./ui/wrap_project";
import ListLinkDetailProject from "./ui/list_link_detail_project";
import AddReportProject from "./ui/add_report_project";
import ListReportDetailProject from "./ui/list_report_project";
export { ViewDateEndTask }
export { CreateUsersProject }
@@ -33,4 +34,6 @@ export { AddMemberDetailProject }
export { CreateProject }
export { AddFileDetailProject }
export { WrapLayoutProject }
export { ListLinkDetailProject }
export { ListLinkDetailProject }
export { AddReportProject }
export { ListReportDetailProject }

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

@@ -122,6 +122,17 @@ export const funEditProject = async (path: string, data: { name: string }) => {
return await response.json().catch(() => null);
}
export const funEditReportProject = async (path: string, data: { report: string }) => {
const response = await fetch(`/api/project/${path}/lainnya`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
}
export const funDeleteFileProject = async (path: string) => {
const response = await fetch(`/api/project/file/${path}`, {

157
src/module/project/ui/add_report_project.tsx Normal file
View File

@@ -0,0 +1,157 @@
"use client"
import { keyWibu, LayoutNavbarNew, TEMA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { useHookstate } from '@hookstate/core';
import { Box, Button, rem, Skeleton, Stack, Textarea } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useParams, useRouter } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { useWibuRealtime } from 'wibu-realtime';
import { funEditReportProject, funGetOneProjectById } from '../lib/api_project';
export default function AddReportProject() {
const router = useRouter()
const [report, setReport] = useState("")
const [openModal, setOpenModal] = useState(false)
const param = useParams<{ id: string }>()
const [loading, setLoading] = useState(true)
const [loadingSubmit, setLoadingSubmit] = useState(false)
const tema = useHookstate(TEMA)
const [touched, setTouched] = useState({
report: false,
});
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function onSubmit() {
try {
setLoadingSubmit(true)
const res = await funEditReportProject(param.id, { report })
if (res.success) {
setDataRealtime([{
category: "project-report",
id: param.id,
}])
toast.success(res.message)
router.push("./")
} else {
toast.error(res.message)
}
} catch (error) {
console.error(error)
toast.error("Gagal mengedit Laporan Kegiatan, coba lagi nanti")
} finally {
setLoadingSubmit(false)
setOpenModal(false)
}
}
function onCheck() {
if (report == "") {
setTouched({ ...touched, report: true })
return false
}
setOpenModal(true)
}
function onValidation(kategori: string, val: string) {
if (kategori == 'report') {
setReport(val)
if (val === "") {
setTouched({ ...touched, report: true })
} else {
setTouched({ ...touched, report: false })
}
}
}
async function getOneData() {
try {
setLoading(true)
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setReport(res.data.report);
} else {
toast.error(res.message);
}
setLoading(false);
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan data Kegiatan, coba lagi nanti");
} finally {
setLoading(false);
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
return (
<Box >
<LayoutNavbarNew back="" title={"Laporan Kegiatan"} menu />
<Box p={20}>
<Stack pt={15}>
{loading ?
<Skeleton height={150} mt={20} radius={10} />
:
<Textarea placeholder="Laporan Kegiatan" label="Laporan Kegiatan" size="md" radius={10}
value={report}
required
error={
touched.report && (
report == "" ? "Laporan Tidak Boleh Kosong" : null
)
}
onChange={(e) => { onValidation('report', e.currentTarget.value) }}
styles={{
input: {
height: "30vh"
}
}}
/>
}
</Stack>
</Box>
<Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{
maxWidth: rem(550),
zIndex: 999,
backgroundColor: `${tema.get().bgUtama}`,
}}>
{loading ?
<Skeleton height={50} radius={30} />
:
<Button
c={"white"}
bg={Object.values(touched).some((v) => v == true) || report == "" || report == null ? 'gray' : tema.get().utama}
size="lg"
radius={30}
fullWidth
onClick={() => { onCheck() }}
disabled={Object.values(touched).some((v) => v == true) || report == "" || report == null ? true : false}
>
Simpan
</Button>
}
</Box>
<LayoutModal opened={openModal} loading={loadingSubmit} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengedit Laporan Kegiatan ini?"
onYes={(val) => {
if (val) {
onSubmit()
} else {
setOpenModal(false)
}
}} />
</Box>
);
}

82
src/module/project/ui/list_report_project.tsx Normal file
View File

@@ -0,0 +1,82 @@
'use client'
import { keyWibu, TEMA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Box, Spoiler, Text } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useParams } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { useWibuRealtime } from 'wibu-realtime';
import { funGetOneProjectById } from '../lib/api_project';
import { globalRefreshProject } from '../lib/val_project';
export default function ListReportDetailProject() {
const [isData, setData] = useState("")
const param = useParams<{ id: string }>()
const refresh = useHookstate(globalRefreshProject)
const tema = useHookstate(TEMA)
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function getOneData() {
try {
const res = await funGetOneProjectById(param.id, 'data');
if (res.success) {
setData(res.data.report)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan list Laporan Kegiatan, coba lagi nanti");
}
}
useShallowEffect(() => {
getOneData();
}, [param.id])
useShallowEffect(() => {
if (dataRealTime && dataRealTime.some((i: any) => i.category == 'project-report' && i.id == param.id)) {
refresh.set(true)
getOneData()
}
}, [dataRealTime])
return (
<>
{
isData != "" && isData != null
&&
<Box pt={20}>
<Text fw={"bold"} c={tema.get().utama}>
Laporan Kegiatan
</Text>
<Box
bg={"white"}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
pt={10}
pb={10}
pl={20}
pr={20}
>
<Spoiler maxHeight={50} showLabel="Lihat Detail" hideLabel="Tutup Detail">
<Text style={{ overflowWrap: "break-word", whiteSpace: "pre-line" }}>
{isData}
</Text>
</Spoiler>
</Box>
</Box>
}
</>
);
}

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

@@ -8,6 +8,7 @@ import { useShallowEffect } from '@mantine/hooks';
import { useParams, useRouter } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { AiFillFileText } from 'react-icons/ai';
import { FaFileCirclePlus, FaPencil, FaTrash, FaUsers } from 'react-icons/fa6';
import { HiMenu } from 'react-icons/hi';
import { IoAddCircle } from 'react-icons/io5';
@@ -138,7 +139,7 @@ export default function NavbarDetailProject() {
</ActionIcon>
} />
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)}>
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)} size='md'>
<Box>
<Stack pt={10}>
<SimpleGrid
@@ -206,6 +207,26 @@ export default function NavbarDetailProject() {
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => {
if (reason == null) {
router.push(param.id + '/report')
} else {
null
}
}}
>
<Box>
<AiFillFileText size={30} color={reason == null ? tema.get().utama : "gray"} />
</Box>
<Box>
<Text c={reason == null ? tema.get().utama : "gray"} ta='center'>Laporan</Text>
</Box>
</Flex>
{
(roleLogin.get() != "user" && roleLogin.get() != "coadmin") &&
<>

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

@@ -1,6 +1,7 @@
import AddDetailTask from "./ui/add_detail_task";
import AddFileDetailTask from "./ui/add_file_detail_task";
import AddMemberDetailTask from "./ui/add_member_detail_task";
import AddReportTask from "./ui/add_report_detail_task";
import CancelTask from "./ui/cancel_task";
import ViewDateEndTask from "./ui/create_date_end_task";
import CreateTask from "./ui/create_task";
@@ -8,6 +9,7 @@ import CreateUsersProject from "./ui/create_users_project";
import ListAnggotaDetailTask from "./ui/detail_list_anggota_task";
import ListFileDetailTask from "./ui/detail_list_file_task";
import ListLinkDetailTask from "./ui/detail_list_link_task";
import ListReportDetailTask from "./ui/detail_list_report_task";
import ListTugasDetailTask from "./ui/detail_list_tugas_task";
import ProgressDetailTask from "./ui/detail_progress_task";
import EditDetailTask from "./ui/edit_detail_task";
@@ -34,4 +36,6 @@ export { AddMemberDetailTask }
export { CancelTask }
export { EditTask }
export { AddFileDetailTask }
export { ListLinkDetailTask }
export { ListLinkDetailTask }
export { AddReportTask }
export { ListReportDetailTask }

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

@@ -61,6 +61,17 @@ export const funEditDetailTask = async (path: string, data: IFormDateTask) => {
return await response.json().catch(() => null);
};
export const funEditReportTask = async (path: string, data: { report: string }) => {
const response = await fetch(`/api/task/${path}/lainnya`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
return await response.json().catch(() => null);
};
export const funCreateDetailTask = async (path: string, data: IFormAddDetailTask) => {
const response = await fetch(`/api/task/${path}`, {

156
src/module/task/ui/add_report_detail_task.tsx Normal file
View File

@@ -0,0 +1,156 @@
"use client"
import { keyWibu, LayoutNavbarNew, TEMA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { useHookstate } from '@hookstate/core';
import { Box, Button, rem, Skeleton, Stack, Textarea } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useParams, useRouter } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { useWibuRealtime } from 'wibu-realtime';
import { funEditReportTask, funGetTaskDivisionById } from '../lib/api_task';
export default function AddReportTask() {
const router = useRouter()
const [report, setReport] = useState("")
const [openModal, setOpenModal] = useState(false)
const param = useParams<{ id: string, detail: string }>()
const [loading, setLoading] = useState(true)
const [loadingSubmit, setLoadingSubmit] = useState(false)
const tema = useHookstate(TEMA)
const [touched, setTouched] = useState({
report: false,
});
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function onSubmit() {
try {
setLoadingSubmit(true)
const res = await funEditReportTask(param.detail, { report })
if (res.success) {
setDataRealtime([{
category: "tugas-detail-report",
id: param.detail,
}])
toast.success(res.message)
router.push("./")
} else {
toast.error(res.message)
}
} catch (error) {
console.error(error)
toast.error("Gagal mengedit Laporan Kegiatan, coba lagi nanti")
} finally {
setLoadingSubmit(false)
setOpenModal(false)
}
}
function onCheck() {
if (report == "") {
setTouched({ ...touched, report: true })
return false
}
setOpenModal(true)
}
function onValidation(kategori: string, val: string) {
if (kategori == 'report') {
setReport(val)
if (val === "") {
setTouched({ ...touched, report: true })
} else {
setTouched({ ...touched, report: false })
}
}
}
async function getOneData() {
try {
setLoading(true)
const res = await funGetTaskDivisionById(param.detail, 'data');
if (res.success) {
setReport(res.data.report);
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan data Tugas, coba lagi nanti");
} finally {
setLoading(false);
}
}
useShallowEffect(() => {
getOneData();
}, [param.detail])
return (
<Box >
<LayoutNavbarNew back="" title={"Laporan Kegiatan"} menu />
<Box p={20}>
<Stack pt={15}>
{loading ?
<Skeleton height={150} mt={20} radius={10} />
:
<Textarea placeholder="Laporan Kegiatan" label="Laporan Kegiatan" size="md" radius={10}
value={report}
required
error={
touched.report && (
report == "" ? "Laporan Tidak Boleh Kosong" : null
)
}
onChange={(e) => { onValidation('report', e.currentTarget.value) }}
styles={{
input: {
height: "30vh"
}
}}
/>
}
</Stack>
</Box>
<Box pos={'fixed'} bottom={0} p={rem(20)} w={"100%"} style={{
maxWidth: rem(550),
zIndex: 999,
backgroundColor: `${tema.get().bgUtama}`,
}}>
{loading ?
<Skeleton height={50} radius={30} />
:
<Button
c={"white"}
bg={Object.values(touched).some((v) => v == true) || report == "" || report == null ? 'gray' : tema.get().utama}
size="lg"
radius={30}
fullWidth
onClick={() => { onCheck() }}
disabled={Object.values(touched).some((v) => v == true) || report == "" || report == null ? true : false}
>
Simpan
</Button>
}
</Box>
<LayoutModal opened={openModal} loading={loadingSubmit} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengedit Laporan Kegiatan ini?"
onYes={(val) => {
if (val) {
onSubmit()
} else {
setOpenModal(false)
}
}} />
</Box>
);
}

83
src/module/task/ui/detail_list_report_task.tsx Normal file
View File

@@ -0,0 +1,83 @@
'use client'
import { keyWibu, TEMA } from '@/module/_global';
import { useHookstate } from '@hookstate/core';
import { Box, Spoiler, Text } from '@mantine/core';
import { useShallowEffect } from '@mantine/hooks';
import { useParams } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { useWibuRealtime } from 'wibu-realtime';
import { funGetTaskDivisionById } from '../lib/api_task';
import { globalRefreshTask } from '../lib/val_task';
export default function ListReportDetailTask() {
const [isData, setData] = useState("")
const param = useParams<{ id: string, detail: string }>()
const refresh = useHookstate(globalRefreshTask)
const tema = useHookstate(TEMA)
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function getOneData() {
try {
const res = await funGetTaskDivisionById(param.detail, 'data');
if (res.success) {
setData(res.data.report)
} else {
toast.error(res.message);
}
} catch (error) {
console.error(error);
toast.error("Gagal mendapatkan list Laporan Kegiatan, coba lagi nanti");
}
}
useShallowEffect(() => {
getOneData();
}, [param.detail])
useShallowEffect(() => {
if (dataRealTime && dataRealTime.some((i: any) => i.category == 'tugas-detail-report' && i.id == param.detail)) {
refresh.set(true)
getOneData()
}
}, [dataRealTime])
return (
<>
{
isData != "" && isData != null
&&
<Box pt={20}>
<Text fw={"bold"} c={tema.get().utama}>
Laporan Kegiatan
</Text>
<Box
bg={"white"}
style={{
borderRadius: 10,
border: `1px solid ${"#D6D8F6"}`,
}}
pt={10}
pb={10}
pl={20}
pr={20}
>
<Spoiler maxHeight={50} showLabel="Lihat Detail" hideLabel="Tutup Detail">
<Text style={{ overflowWrap: "break-word", whiteSpace: "pre-line" }}>
{isData}
</Text>
</Spoiler>
</Box>
</Box>
}
</>
);
}

23
src/module/task/ui/navbar_detail_division_task.tsx
View File

@@ -9,6 +9,7 @@ import { useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react";
import toast from "react-hot-toast";
import { AiFillFileText } from "react-icons/ai";
import { FaFileCirclePlus, FaPencil, FaTrash, FaUsers } from "react-icons/fa6";
import { HiMenu } from "react-icons/hi";
import { IoAddCircle } from "react-icons/io5";
@@ -138,7 +139,7 @@ export default function NavbarDetailDivisionTask() {
} />
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)}>
<LayoutDrawer opened={isOpen} title={'Menu'} onClose={() => setOpen(false)} size='md'>
<Box>
<Stack pt={10}>
<SimpleGrid
@@ -206,6 +207,26 @@ export default function NavbarDetailDivisionTask() {
</Box>
</Flex>
<Flex justify={'center'} align={'center'} direction={'column'}
style={{
cursor: 'pointer'
}}
onClick={() => {
if (reason == null) {
router.push(param.detail + '/report')
} else {
null
}
}}
>
<Box>
<AiFillFileText size={30} color={reason == null ? tema.get().utama : "gray"} />
</Box>
<Box>
<Text c={reason == null ? tema.get().utama : "gray"} ta='center'>Laporan</Text>
</Box>
</Flex>
{
(roleLogin.get() != "user" && roleLogin.get() != "coadmin") || adminLogin.get() ?
<>