rev: report divisi

Deskripsi:
- table laporan tugas divisi
- api table laporan tugas divisi

nb: blm selesai report divisi

No Issues

src/app/api/division/report/route.ts

@@ -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,6 +25,72 @@ export async function GET(request: Request) {
          grup = idGroup
       }
 
+      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))
+                     }
+                  }
+               }
+            }
+         }
+
+
+         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") {
@@ -51,7 +119,7 @@ export async function GET(request: Request) {
             _count: true
          })
 
-      const dataStatus = [{ name: 'Segera dikerjakan', status: 0 }, { name: 'Dikerjakan', status: 1 }, { name: 'Selesai dikerjakan', status: 2 }, { name: 'Dibatalkan', status: 3 }]
+         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++) {
@@ -195,6 +263,8 @@ export async function GET(request: Request) {
          }
 
          return NextResponse.json({ success: true, message: "Berhasil mendapatkan data", data: allData }, { status: 200 });
+      }
+
 
    }
    catch (error) {

src/module/division_new/ui/report_division_id.tsx

@@ -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) {
+  async function onReportTable(awal: any, akhir: any) {
-    if (val != null && val != "") {
+    try {
-      onReport(val)
+      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)
+        }
+      }
+    }
   }
 
 
@@ -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"
+            label="Tanggal Awal"
-            placeholder="Tanggal"
+            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>
   );
 }
-