rev: report divisi
Deskripsi: - table laporan tugas divisi - api table laporan tugas divisi nb: blm selesai report divisi No Issues
This commit is contained in:
amel
@@ -1,6 +1,6 @@
|
||||
import { prisma } from "@/module/_global";
|
||||
import { funGetUserByCookies } from "@/module/auth";
|
||||
import _ from "lodash";
|
||||
import _, { ceil } from "lodash";
|
||||
import moment from "moment";
|
||||
import { NextResponse } from "next/server";
|
||||
|
||||
@@ -11,6 +11,8 @@ export async function GET(request: Request) {
|
||||
const idGroup = searchParams.get("group")
|
||||
const division = searchParams.get("division")
|
||||
const date = searchParams.get("date")
|
||||
const dateAkhir = searchParams.get("date-end")
|
||||
const kat = searchParams.get("cat")
|
||||
let grup
|
||||
|
||||
if (user.id == undefined) {
|
||||
@@ -23,178 +25,246 @@ export async function GET(request: Request) {
|
||||
grup = idGroup
|
||||
}
|
||||
|
||||
// CHART PROGRESS
|
||||
let kondisiProgress
|
||||
if (division == "undefined") {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
updatedAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
idDivision: String(division),
|
||||
updatedAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const data = await prisma.divisionProject.groupBy({
|
||||
where: kondisiProgress,
|
||||
by: ["status"],
|
||||
_count: true
|
||||
})
|
||||
|
||||
const dataStatus = [{ name: 'Segera dikerjakan', status: 0 }, { name: 'Dikerjakan', status: 1 }, { name: 'Selesai dikerjakan', status: 2 }, { name: 'Dibatalkan', status: 3 }]
|
||||
const hasilProgres: any[] = []
|
||||
let input
|
||||
for (let index = 0; index < dataStatus.length; index++) {
|
||||
const cek = data.some((i: any) => i.status == dataStatus[index].status)
|
||||
if (cek) {
|
||||
const find = ((Number(data.find((i: any) => i.status == dataStatus[index].status)?._count) * 100) / data.reduce((n, { _count }) => n + _count, 0)).toFixed(2)
|
||||
const fix = find != "100.00" ? find.substr(-2, 2) == "00" ? find.substr(0, 2) : find : "100"
|
||||
input = {
|
||||
name: dataStatus[index].name,
|
||||
value: fix
|
||||
}
|
||||
} else {
|
||||
input = {
|
||||
name: dataStatus[index].name,
|
||||
value: 0
|
||||
}
|
||||
}
|
||||
hasilProgres.push(input)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// CHART DOKUMEN
|
||||
let kondisi
|
||||
if (division == "undefined") {
|
||||
kondisi = {
|
||||
isActive: true,
|
||||
category: 'FILE',
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
},
|
||||
createdAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
} else {
|
||||
kondisi = {
|
||||
isActive: true,
|
||||
category: 'FILE',
|
||||
idDivision: String(division),
|
||||
createdAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const dataDokumen = await prisma.divisionDocumentFolderFile.findMany({
|
||||
where: kondisi,
|
||||
})
|
||||
|
||||
const groupData = _.map(_.groupBy(dataDokumen, "extension"), (v: any) => ({
|
||||
file: v[0].extension,
|
||||
jumlah: v.length,
|
||||
}))
|
||||
|
||||
const image = ['jpg', 'jpeg', 'png', 'heic']
|
||||
|
||||
let hasilImage = {
|
||||
name: 'Gambar',
|
||||
value: 0
|
||||
}
|
||||
|
||||
let hasilFile = {
|
||||
name: 'Dokumen',
|
||||
value: 0
|
||||
}
|
||||
|
||||
groupData.map((v: any) => {
|
||||
if (image.some((i: any) => i == v.file)) {
|
||||
hasilImage = {
|
||||
name: 'Gambar',
|
||||
value: hasilImage.value + v.jumlah
|
||||
}
|
||||
} else {
|
||||
hasilFile = {
|
||||
name: 'Dokumen',
|
||||
value: hasilFile.value + v.jumlah
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const hasilDokumen = [hasilImage, hasilFile]
|
||||
|
||||
|
||||
|
||||
// CHART EVENT
|
||||
let kondisiEvent
|
||||
if (division == "undefined") {
|
||||
kondisiEvent = {
|
||||
isActive: true,
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
},
|
||||
dateStart: new Date(String(date))
|
||||
}
|
||||
} else {
|
||||
kondisiEvent = {
|
||||
isActive: true,
|
||||
idDivision: String(division),
|
||||
dateStart: new Date(String(date))
|
||||
}
|
||||
}
|
||||
|
||||
const dataEvent = await prisma.divisionCalendar.findMany({
|
||||
where: kondisiEvent,
|
||||
select: {
|
||||
id: true,
|
||||
idDivision: true,
|
||||
title: true,
|
||||
desc: true,
|
||||
status: true,
|
||||
timeStart: true,
|
||||
dateStart: true,
|
||||
timeEnd: true,
|
||||
dateEnd: true,
|
||||
createdAt: true,
|
||||
User: {
|
||||
select: {
|
||||
name: true
|
||||
if (kat == "table-progress") {
|
||||
let kondisiProgress
|
||||
const dateStart = date
|
||||
const dateEnd = dateAkhir
|
||||
if (division == "undefined") {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
},
|
||||
DivisionProjectTask: {
|
||||
some: {
|
||||
dateStart: {
|
||||
gte: new Date(String(dateStart))
|
||||
},
|
||||
dateEnd: {
|
||||
lte: new Date(String(dateEnd))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
} else {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
idDivision: String(division),
|
||||
DivisionProjectTask: {
|
||||
some: {
|
||||
dateStart: {
|
||||
gte: new Date(String(dateStart))
|
||||
},
|
||||
dateEnd: {
|
||||
lte: new Date(String(dateEnd))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
orderBy: {
|
||||
createdAt: 'desc'
|
||||
}
|
||||
})
|
||||
|
||||
const hasilEvent = dataEvent.map((v: any) => ({
|
||||
..._.omit(v, ["User"]),
|
||||
user_name: v.User.name,
|
||||
timeStart: moment.utc(v.timeStart).format('HH:mm'),
|
||||
timeEnd: moment.utc(v.timeEnd).format('HH:mm')
|
||||
}))
|
||||
|
||||
|
||||
const allData = {
|
||||
progress: hasilProgres,
|
||||
dokumen: hasilDokumen,
|
||||
event: hasilEvent
|
||||
const data = await prisma.divisionProject.findMany({
|
||||
where: kondisiProgress,
|
||||
select: {
|
||||
id: true,
|
||||
title: true,
|
||||
status: true,
|
||||
DivisionProjectTask: {
|
||||
where: {
|
||||
isActive: true
|
||||
},
|
||||
select: {
|
||||
title: true,
|
||||
status: true
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const dataFix = data.map((v: any) => ({
|
||||
..._.omit(v, ["DivisionProjectTask"]),
|
||||
progress: ceil((v.DivisionProjectTask.filter((i: any) => i.status == 1).length * 100) / v.DivisionProjectTask.length),
|
||||
}))
|
||||
|
||||
return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: dataFix }, { status: 200 });
|
||||
|
||||
} else {
|
||||
// CHART PROGRESS
|
||||
let kondisiProgress
|
||||
if (division == "undefined") {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
updatedAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
kondisiProgress = {
|
||||
isActive: true,
|
||||
idDivision: String(division),
|
||||
updatedAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const data = await prisma.divisionProject.groupBy({
|
||||
where: kondisiProgress,
|
||||
by: ["status"],
|
||||
_count: true
|
||||
})
|
||||
|
||||
const dataStatus = [{ name: 'Segera', status: 0 }, { name: 'Dikerjakan', status: 1 }, { name: 'Selesai', status: 2 }, { name: 'Dibatalkan', status: 3 }]
|
||||
const hasilProgres: any[] = []
|
||||
let input
|
||||
for (let index = 0; index < dataStatus.length; index++) {
|
||||
const cek = data.some((i: any) => i.status == dataStatus[index].status)
|
||||
if (cek) {
|
||||
const find = ((Number(data.find((i: any) => i.status == dataStatus[index].status)?._count) * 100) / data.reduce((n, { _count }) => n + _count, 0)).toFixed(2)
|
||||
const fix = find != "100.00" ? find.substr(-2, 2) == "00" ? find.substr(0, 2) : find : "100"
|
||||
input = {
|
||||
name: dataStatus[index].name,
|
||||
value: fix
|
||||
}
|
||||
} else {
|
||||
input = {
|
||||
name: dataStatus[index].name,
|
||||
value: 0
|
||||
}
|
||||
}
|
||||
hasilProgres.push(input)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// CHART DOKUMEN
|
||||
let kondisi
|
||||
if (division == "undefined") {
|
||||
kondisi = {
|
||||
isActive: true,
|
||||
category: 'FILE',
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
},
|
||||
createdAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
} else {
|
||||
kondisi = {
|
||||
isActive: true,
|
||||
category: 'FILE',
|
||||
idDivision: String(division),
|
||||
createdAt: {
|
||||
lte: new Date(String(date))
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
const dataDokumen = await prisma.divisionDocumentFolderFile.findMany({
|
||||
where: kondisi,
|
||||
})
|
||||
|
||||
const groupData = _.map(_.groupBy(dataDokumen, "extension"), (v: any) => ({
|
||||
file: v[0].extension,
|
||||
jumlah: v.length,
|
||||
}))
|
||||
|
||||
const image = ['jpg', 'jpeg', 'png', 'heic']
|
||||
|
||||
let hasilImage = {
|
||||
name: 'Gambar',
|
||||
value: 0
|
||||
}
|
||||
|
||||
let hasilFile = {
|
||||
name: 'Dokumen',
|
||||
value: 0
|
||||
}
|
||||
|
||||
groupData.map((v: any) => {
|
||||
if (image.some((i: any) => i == v.file)) {
|
||||
hasilImage = {
|
||||
name: 'Gambar',
|
||||
value: hasilImage.value + v.jumlah
|
||||
}
|
||||
} else {
|
||||
hasilFile = {
|
||||
name: 'Dokumen',
|
||||
value: hasilFile.value + v.jumlah
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const hasilDokumen = [hasilImage, hasilFile]
|
||||
|
||||
|
||||
|
||||
// CHART EVENT
|
||||
let kondisiEvent
|
||||
if (division == "undefined") {
|
||||
kondisiEvent = {
|
||||
isActive: true,
|
||||
Division: {
|
||||
idGroup: String(grup)
|
||||
},
|
||||
dateStart: new Date(String(date))
|
||||
}
|
||||
} else {
|
||||
kondisiEvent = {
|
||||
isActive: true,
|
||||
idDivision: String(division),
|
||||
dateStart: new Date(String(date))
|
||||
}
|
||||
}
|
||||
|
||||
const dataEvent = await prisma.divisionCalendar.findMany({
|
||||
where: kondisiEvent,
|
||||
select: {
|
||||
id: true,
|
||||
idDivision: true,
|
||||
title: true,
|
||||
desc: true,
|
||||
status: true,
|
||||
timeStart: true,
|
||||
dateStart: true,
|
||||
timeEnd: true,
|
||||
dateEnd: true,
|
||||
createdAt: true,
|
||||
User: {
|
||||
select: {
|
||||
name: true
|
||||
}
|
||||
}
|
||||
},
|
||||
orderBy: {
|
||||
createdAt: 'desc'
|
||||
}
|
||||
})
|
||||
|
||||
const hasilEvent = dataEvent.map((v: any) => ({
|
||||
..._.omit(v, ["User"]),
|
||||
user_name: v.User.name,
|
||||
timeStart: moment.utc(v.timeStart).format('HH:mm'),
|
||||
timeEnd: moment.utc(v.timeEnd).format('HH:mm')
|
||||
}))
|
||||
|
||||
|
||||
const allData = {
|
||||
progress: hasilProgres,
|
||||
dokumen: hasilDokumen,
|
||||
event: hasilEvent
|
||||
}
|
||||
|
||||
return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: allData }, { status: 200 });
|
||||
}
|
||||
|
||||
return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: allData }, { status: 200 });
|
||||
|
||||
}
|
||||
catch (error) {
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
"use client"
|
||||
import { LayoutNavbarNew, TEMA } from '@/module/_global';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Box, Skeleton, Stack } from '@mantine/core';
|
||||
import { Badge, Box, Skeleton, Stack, Table } from '@mantine/core';
|
||||
import { DateInput } from '@mantine/dates';
|
||||
import _ from 'lodash';
|
||||
import moment from 'moment';
|
||||
import "moment/locale/id";
|
||||
import { useParams } from 'next/navigation';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import toast from 'react-hot-toast';
|
||||
import { funGetReportDivision } from '../lib/api_division';
|
||||
@@ -16,15 +17,24 @@ import EventReport from './event_report';
|
||||
|
||||
export default function ReportDivisionId() {
|
||||
const [value, setValue] = useState<Date | null>(null);
|
||||
const [valueAkhir, setValueAkhir] = useState<Date | null>(null);
|
||||
const param = useParams<{ id: string }>()
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [loadingTable, setLoadingTable] = useState(false);
|
||||
const [tampil, setTampil] = useState(false);
|
||||
const tema = useHookstate(TEMA)
|
||||
const router = useRouter()
|
||||
const [report, setReport] = useState({
|
||||
progress: [],
|
||||
dokumen: [],
|
||||
event: [],
|
||||
})
|
||||
const [reportTable, setReportTable] = useState<any[]>([])
|
||||
|
||||
const [touched, setTouched] = useState({
|
||||
start_date: false,
|
||||
end_date: false
|
||||
})
|
||||
|
||||
async function onReport(date: any) {
|
||||
try {
|
||||
@@ -49,11 +59,48 @@ export default function ReportDivisionId() {
|
||||
}
|
||||
}
|
||||
|
||||
function onChangeDate(val: any) {
|
||||
if (val != null && val != "") {
|
||||
onReport(val)
|
||||
async function onReportTable(awal: any, akhir: any) {
|
||||
try {
|
||||
setLoadingTable(true)
|
||||
const res = await funGetReportDivision(`?cat=table-progress&division=${param.id}&date=${moment(awal).format("YYYY-MM-DD")}&date-end=${moment(akhir).format("YYYY-MM-DD")}`)
|
||||
if (res.success) {
|
||||
setReportTable(res.data)
|
||||
} else {
|
||||
toast.error(res.message)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
} finally {
|
||||
setLoadingTable(false)
|
||||
}
|
||||
}
|
||||
|
||||
function onChangeDate(val: any, kat: string) {
|
||||
if (kat == "start-date") {
|
||||
setValue(val)
|
||||
if (valueAkhir != null && valueAkhir != undefined) {
|
||||
if (val >= valueAkhir) {
|
||||
setTouched({ ...touched, end_date: true })
|
||||
setTampil(false)
|
||||
} else {
|
||||
setTouched({ ...touched, end_date: false })
|
||||
onReport(val)
|
||||
onReportTable(val, valueAkhir)
|
||||
}
|
||||
}
|
||||
} else if (kat == "end-date") {
|
||||
setValueAkhir(val)
|
||||
if (value != null && value != undefined) {
|
||||
if (value >= val) {
|
||||
setTouched({ ...touched, end_date: true })
|
||||
setTampil(false)
|
||||
} else {
|
||||
setTouched({ ...touched, end_date: false })
|
||||
onReport(val)
|
||||
onReportTable(value, val)
|
||||
}
|
||||
}
|
||||
}
|
||||
setValue(val)
|
||||
}
|
||||
|
||||
|
||||
@@ -65,12 +112,23 @@ export default function ReportDivisionId() {
|
||||
<DateInput
|
||||
valueFormat='DD-MM-YYYY'
|
||||
value={value}
|
||||
onChange={(val) => { onChangeDate(val) }}
|
||||
onChange={(val) => { onChangeDate(val, 'start-date') }}
|
||||
radius={10}
|
||||
size="md"
|
||||
required
|
||||
label="Tanggal"
|
||||
placeholder="Tanggal"
|
||||
label="Tanggal Awal"
|
||||
placeholder="Tanggal Awal"
|
||||
/>
|
||||
<DateInput
|
||||
valueFormat='DD-MM-YYYY'
|
||||
value={valueAkhir}
|
||||
onChange={(val) => { onChangeDate(val, 'end-date') }}
|
||||
radius={10}
|
||||
size="md"
|
||||
required
|
||||
label="Tanggal Akhir"
|
||||
placeholder="Tanggal Akhir"
|
||||
error={touched.end_date && "Tanggal akhir harus lebih besar dari tanggal awal"}
|
||||
/>
|
||||
{
|
||||
tampil &&
|
||||
@@ -103,6 +161,53 @@ export default function ReportDivisionId() {
|
||||
}}
|
||||
>
|
||||
<EchartPaiReport data={report.progress} />
|
||||
{
|
||||
!loadingTable ?
|
||||
<Table highlightOnHover striped withTableBorder mt={50}>
|
||||
<Table.Tr>
|
||||
<Table.Th>Tugas</Table.Th>
|
||||
<Table.Th>Progres</Table.Th>
|
||||
<Table.Th>Status</Table.Th>
|
||||
</Table.Tr>
|
||||
{
|
||||
reportTable.length == 0 ?
|
||||
<Table.Tr>
|
||||
<Table.Td colSpan={3} ta={"center"}>Data kosong</Table.Td>
|
||||
</Table.Tr>
|
||||
:
|
||||
reportTable.map((item: any, i: number) => {
|
||||
return (
|
||||
<Table.Tr key={i} onClick={() => { router.push(`/division/${param.id}/task/${item.id}`) }}>
|
||||
<Table.Td>{item.title}</Table.Td>
|
||||
<Table.Td>
|
||||
{_.isNull(item.progress) ? 0 : item.progress}%
|
||||
</Table.Td>
|
||||
<Table.Td>
|
||||
<Badge size="xs" color={
|
||||
item.status === 0 ? '#5470c6' :
|
||||
item.status === 2 ? '#fac858' :
|
||||
item.status === 1 ? '#92cc76' :
|
||||
item.status === 3 ? '#ef6666' :
|
||||
"grey"
|
||||
}>
|
||||
{
|
||||
item.status === 0 ? 'Segera' :
|
||||
item.status === 1 ? 'Dikerjakan' :
|
||||
item.status === 2 ? 'Selesai' :
|
||||
item.status === 3 ? 'Dibatalkan' :
|
||||
"Segera"
|
||||
}
|
||||
</Badge>
|
||||
</Table.Td>
|
||||
</Table.Tr>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
</Table>
|
||||
: <></>
|
||||
}
|
||||
|
||||
</Box>
|
||||
</Box>
|
||||
<Box pt={10}>
|
||||
@@ -139,4 +244,3 @@ export default function ReportDivisionId() {
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user