From e0a6310e657a471a66ba7316fdfaaed3ff1542b1 Mon Sep 17 00:00:00 2001 From: amel Date: Wed, 30 Oct 2024 11:57:00 +0800 Subject: [PATCH 1/2] fix : tombol back Deskripsi - update link back pda detail kegiatan - update link back pada detail divisi No Issues --- src/module/_global/layout/layout_icon_back.tsx | 10 ++++------ .../_global/layout/layout_navbar_new.tsx | 9 ++++----- .../division_new/ui/navbar_detail_division.tsx | 18 +++++++++--------- .../project/ui/navbar_detail_project.tsx | 4 ++-- 4 files changed, 19 insertions(+), 22 deletions(-) diff --git a/src/module/_global/layout/layout_icon_back.tsx b/src/module/_global/layout/layout_icon_back.tsx index d4658fa..a84f8c1 100644 --- a/src/module/_global/layout/layout_icon_back.tsx +++ b/src/module/_global/layout/layout_icon_back.tsx @@ -1,11 +1,9 @@ 'use client' -import { ActionIcon, Box } from '@mantine/core'; -import { useRouter } from 'next/navigation'; -import React from 'react'; -import { HiChevronLeft } from 'react-icons/hi2'; -import { WARNA } from '../fun/WARNA'; -import _ from 'lodash'; import { useHookstate } from '@hookstate/core'; +import { ActionIcon, Box } from '@mantine/core'; +import _ from 'lodash'; +import { useRouter } from 'next/navigation'; +import { HiChevronLeft } from 'react-icons/hi2'; import { TEMA } from '../bin/val_global'; function LayoutIconBack({ back }: { back?: string }) { diff --git a/src/module/_global/layout/layout_navbar_new.tsx b/src/module/_global/layout/layout_navbar_new.tsx index bd2059a..5f5a244 100644 --- a/src/module/_global/layout/layout_navbar_new.tsx +++ b/src/module/_global/layout/layout_navbar_new.tsx @@ -1,11 +1,10 @@ 'use client' -import { ActionIcon, Box, Grid, Group, Text, Title } from '@mantine/core'; -import React from 'react'; -import { WARNA } from '../fun/WARNA'; -import LayoutIconBack from './layout_icon_back'; -import _ from 'lodash'; import { useHookstate } from '@hookstate/core'; +import { Box, Grid, Group, Title } from '@mantine/core'; +import _ from 'lodash'; +import React from 'react'; import { TEMA } from '../bin/val_global'; +import LayoutIconBack from './layout_icon_back'; export const LayoutNavbarNew = ({ back, state, title, menu }: { back?: string, title: string, menu: React.ReactNode, state?: React.ReactNode }) => { const tema = useHookstate(TEMA) diff --git a/src/module/division_new/ui/navbar_detail_division.tsx b/src/module/division_new/ui/navbar_detail_division.tsx index d857157..007c0bd 100644 --- a/src/module/division_new/ui/navbar_detail_division.tsx +++ b/src/module/division_new/ui/navbar_detail_division.tsx @@ -1,14 +1,14 @@ 'use client' import { LayoutDrawer, LayoutNavbarNew, TEMA } from "@/module/_global"; -import { ActionIcon, Box } from "@mantine/core"; -import { useState } from "react"; -import { HiMenu } from "react-icons/hi"; -import DrawerDetailDivision from "./drawer_detail_division"; -import { funGetDivisionById } from "../lib/api_division"; -import { useParams } from "next/navigation"; -import toast from "react-hot-toast"; -import { useShallowEffect } from "@mantine/hooks"; import { useHookstate } from "@hookstate/core"; +import { ActionIcon } from "@mantine/core"; +import { useShallowEffect } from "@mantine/hooks"; +import { useParams } from "next/navigation"; +import { useState } from "react"; +import toast from "react-hot-toast"; +import { HiMenu } from "react-icons/hi"; +import { funGetDivisionById } from "../lib/api_division"; +import DrawerDetailDivision from "./drawer_detail_division"; export default function NavbarDetailDivision() { const [openDrawer, setOpenDrawer] = useState(false) @@ -37,7 +37,7 @@ export default function NavbarDetailDivision() { return ( <> - (setOpenDrawer(true))} bg={tema.get().bgIcon} size="lg" radius="lg" aria-label="Settings"> diff --git a/src/module/project/ui/navbar_detail_project.tsx b/src/module/project/ui/navbar_detail_project.tsx index 0568bf5..d6e6676 100644 --- a/src/module/project/ui/navbar_detail_project.tsx +++ b/src/module/project/ui/navbar_detail_project.tsx @@ -10,8 +10,8 @@ import { FaFileCirclePlus, 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 { useWibuRealtime } from 'wibu-realtime'; +import { funGetOneProjectById } from '../lib/api_project'; export default function NavbarDetailProject() { const router = useRouter() @@ -54,7 +54,7 @@ export default function NavbarDetailProject() { return ( <> - Date: Wed, 30 Oct 2024 14:55:33 +0800 Subject: [PATCH 2/2] fix: home Deskripsi: - memberi status pada kegiatan - menghilangkan ,00 pada persen hcart proses kegiatan - menambahkan skeleton loading pada pencarian - fix : hasil pencarian yg telat - menambahkan tampilan tidak ada data pada pencarian No Issues --- src/app/api/home/route.ts | 3 +- src/module/home/lib/type_home.ts | 2 +- src/module/home/ui/chart_progress_tugas.tsx | 10 +- src/module/home/ui/list_project.tsx | 21 +- src/module/home/ui/view_search.tsx | 552 ++++++++++---------- 5 files changed, 305 insertions(+), 283 deletions(-) diff --git a/src/app/api/home/route.ts b/src/app/api/home/route.ts index aee2186..d2cde94 100644 --- a/src/app/api/home/route.ts +++ b/src/app/api/home/route.ts @@ -185,9 +185,10 @@ export async function GET(request: Request) { 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.substr(-2, 2) == "00" ? find.substr(0, 2) : find input = { name: dataStatus[index].name, - value: find + value: fix } } else { input = { diff --git a/src/module/home/lib/type_home.ts b/src/module/home/lib/type_home.ts index 3dd4c64..a447b57 100644 --- a/src/module/home/lib/type_home.ts +++ b/src/module/home/lib/type_home.ts @@ -2,7 +2,7 @@ export interface IDataHomeKegiatan { id: string title: string desc: string - status: string + status: number progress: number createdAt: string } diff --git a/src/module/home/ui/chart_progress_tugas.tsx b/src/module/home/ui/chart_progress_tugas.tsx index 9d72fe5..3e6caac 100644 --- a/src/module/home/ui/chart_progress_tugas.tsx +++ b/src/module/home/ui/chart_progress_tugas.tsx @@ -1,13 +1,13 @@ 'use client' -import { TEMA, WARNA } from "@/module/_global"; -import { Box, Text } from "@mantine/core"; +import { TEMA } from "@/module/_global"; +import { useHookstate } from "@hookstate/core"; +import { Box } from "@mantine/core"; import { useShallowEffect } from "@mantine/hooks"; import { EChartsOption } from "echarts"; import EChartsReact from "echarts-for-react"; import { useState } from "react"; -import { funGetHome } from "../lib/api_home"; import toast from "react-hot-toast"; -import { useHookstate } from "@hookstate/core"; +import { funGetHome } from "../lib/api_home"; export default function ChartProgressHome() { const [options, setOptions] = useState({}); @@ -41,7 +41,7 @@ export default function ChartProgressHome() { } }; - const loadData = (value:any) => { + const loadData = (value: any) => { const option: EChartsOption = { title: { text: "PROGRES KEGIATAN", diff --git a/src/module/home/ui/list_project.tsx b/src/module/home/ui/list_project.tsx index e1c8767..7dc653e 100644 --- a/src/module/home/ui/list_project.tsx +++ b/src/module/home/ui/list_project.tsx @@ -2,7 +2,7 @@ import { TEMA } from "@/module/_global"; import { useHookstate } from "@hookstate/core"; import { Carousel } from "@mantine/carousel"; -import { Box, Card, Flex, Progress, Skeleton, Stack, Text, Title } from "@mantine/core"; +import { Badge, Box, Card, Flex, Group, Progress, Skeleton, Stack, Text, Title } from "@mantine/core"; import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import _ from "lodash"; import { useRouter } from "next/navigation"; @@ -79,7 +79,24 @@ export default function ListProjects() { {_.isNull(v.progress) ? 0 : v.progress}% - {v.createdAt} + + {v.createdAt} + + { + v.status === 0 ? 'Segera' : + v.status === 1 ? 'Dikerjakan' : + v.status === 2 ? 'Selesai' : + v.status === 3 ? 'Dibatalkan' : + "Segera" + } + + diff --git a/src/module/home/ui/view_search.tsx b/src/module/home/ui/view_search.tsx index 263298c..bd9bb47 100644 --- a/src/module/home/ui/view_search.tsx +++ b/src/module/home/ui/view_search.tsx @@ -1,62 +1,49 @@ "use client"; -import { LayoutNavbarNew, TEMA, WARNA } from "@/module/_global"; -import { - ActionIcon, - Avatar, - Box, - Divider, - Grid, - Group, - Text, - TextInput, -} from "@mantine/core"; -import React, { useState } from "react"; -import { - HiMagnifyingGlass, - HiMiniPresentationChartBar, - HiMiniUserGroup, -} from "react-icons/hi2"; -import { funGetSearchAll } from "../lib/api_search"; -import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; -import { - IDataDivisionSearch, - IDataProjectSearch, - IDataUserSearch, -} from "../lib/type_search"; -import { useRouter } from "next/navigation"; -import _ from "lodash"; +import { LayoutNavbarNew, SkeletonList, TEMA, WARNA } from "@/module/_global"; import { useHookstate } from "@hookstate/core"; +import { ActionIcon, Avatar, Box, Divider, Grid, Text, TextInput } from "@mantine/core"; +import { useMediaQuery } from "@mantine/hooks"; +import _ from "lodash"; +import { useRouter } from "next/navigation"; +import { useState } from "react"; +import toast from "react-hot-toast"; +import { HiMagnifyingGlass, HiMiniPresentationChartBar, HiMiniUserGroup, } from "react-icons/hi2"; +import { funGetSearchAll } from "../lib/api_search"; +import { IDataDivisionSearch, IDataProjectSearch, IDataUserSearch, } from "../lib/type_search"; export default function ViewSearch() { - const [search, setSearch] = useState(""); - const [dataUser, setDataUser] = useState([]); - const [dataProject, setDataProject] = useState([]); - const [dataDivision, setDataDivision] = useState([]); - const router = useRouter(); - const tema = useHookstate(TEMA); + const [search, setSearch] = useState("") + const [dataUser, setDataUser] = useState([]) + const [dataProject, setDataProject] = useState([]) + const [dataDivision, setDataDivision] = useState([]) + const [loading, setLoading] = useState(false) + const router = useRouter() + const tema = useHookstate(TEMA) + const isMobile2 = useMediaQuery("(max-width: 460px)"); - async function featchSearch() { + async function featchSearch(cari: string) { try { - const res = await funGetSearchAll("?search=" + search); - setDataUser(res.data.user); - setDataProject(res.data.project); - setDataDivision(res.data.division); + setLoading(true) + setSearch(cari) + if (cari != "") { + const res = await funGetSearchAll("?search=" + cari); + setDataUser(res.data.user); + setDataProject(res.data.project); + setDataDivision(res.data.division); + } else { + setDataUser([]); + setDataProject([]); + setDataDivision([]); + } } catch (error) { console.error(error); - throw new Error("Error"); + toast.error("Gagal mendapatkan data, coba lagi nanti"); + } finally { + setLoading(false) } } - useShallowEffect(() => { - if (search != "") { - featchSearch(); - } else { - setDataUser([]); - setDataProject([]); - setDataDivision([]); - } - }, [search]); - const isMobile2 = useMediaQuery("(max-width: 460px)"); + return ( <> @@ -74,263 +61,280 @@ export default function ViewSearch() { radius={30} leftSection={} placeholder="Pencarian" - onChange={(e) => setSearch(e.target.value)} + onChange={(e) => featchSearch(e.target.value)} /> - {dataUser.length || dataProject.length || dataDivision.length > 0 ? ( - - - {dataUser.length > 0 ? ( - - ANGGOTA + { + loading ? + Array(5) + .fill(null) + .map((_, i) => ( + + + + )) + : + dataUser.length || dataProject.length || dataDivision.length > 0 ? + ( + {dataUser.length > 0 ? ( - - {dataUser.map((v, i) => { - return ( - - { - router.push(`/member/${v.id}`); - }} - > - - - - - - + ANGGOTA + + {dataUser.length > 0 ? ( + + {dataUser.map((v, i) => { + return ( + + { + router.push(`/member/${v.id}`); + }} > - {_.startCase(v.name)} - - - {v.group + " - " + v.position} - - - - - + + + + + + + {_.startCase(v.name)} + + + {v.group + " - " + v.position} + + + + + + + ); + })} - ); - })} + ) : null} + ) : null} - - - ) : null} - {dataDivision.length > 0 ? ( - - DIVISI - {dataDivision.length > 0 ? ( - - {dataDivision.map((v, i) => { - return ( - router.push(`/division/${v.id}`)} - > - - - - - - - + + DIVISI + + {dataDivision.length > 0 ? ( + + {dataDivision.map((v, i) => { + return ( router.push(`/division/${v.id}`)} > + + + + + + + + + + {v.name.toUpperCase()} + + + + {v.group} + + + - {v.name.toUpperCase()} + {v.desc} + - - {v.group} - - - - - {v.desc} - - + ); + })} - ); - })} + ) : null} + ) : null} - - - ) : null} - {dataProject.length > 0 ? ( - - KEGIATAN - {dataProject.length > 0 ? ( - - {dataProject.map((v, i) => { - return ( - router.push(`/project/${v.id}`)} - > - - - - - - - + + KEGIATAN + + {dataProject.length > 0 ? ( + + {dataProject.map((v, i) => { + return ( router.push(`/project/${v.id}`)} > - - {v.title.toUpperCase()} - + + + + + + + + + + {v.title.toUpperCase()} + + + + {v.group} + + + + - - {v.group} - - - - + ); + })} - ); - })} + ) : null} + ) : null} - ) : null} - - - ) : null} + ) : + search != '' ? + + Tidak ada data + + : null + } );