Merge pull request #327 from bipproduction/amalia/06-nov-24

Amalia/06 nov 24
This commit is contained in:
Amalia
2024-11-06 11:26:50 +08:00
committed by GitHub
9 changed files with 126 additions and 62 deletions

View File

@@ -1,10 +1,9 @@
import { DetailEventDivision } from '@/module/calender';
import React from 'react';
function Page() {
return (
<>
<DetailEventDivision />
<DetailEventDivision />
</>
);
}

View File

@@ -100,7 +100,7 @@ export async function GET(request: Request, context: { params: { id: string } })
}
return NextResponse.json({ success: true, message: "Berhasil mendapatkan kalender", data: dataFix }, { status: 200 });
return NextResponse.json({ success: true, message: "Berhasil mendapatkan kalender", data: dataFix, user: user.id }, { status: 200 });
} catch (error) {
return NextResponse.json({ success: false, message: "Gagal mendapatkan kalender, data tidak ditemukan (error: 500)", }, { status: 500 });
@@ -139,13 +139,16 @@ export async function DELETE(request: Request, context: { params: { id: string }
},
data: {
isActive: false
},
select: {
dateStart: true
}
});
// create log user
const log = await createLogUser({ act: 'DELETE', desc: 'User menghapus data acara kalender', table: 'divisionCalendar', data: id })
return NextResponse.json({ success: true, message: "Berhasil menghapus acara kalender", data }, { status: 200 });
return NextResponse.json({ success: true, message: "Berhasil menghapus acara kalender", data, user: user.id }, { status: 200 });
} catch (error) {
return NextResponse.json({ success: false, message: "Gagal menghapus kalender, coba lagi nanti (error: 500)", }, { status: 500 }

View File

@@ -2,7 +2,7 @@ import { NextResponse } from "next/server";
export async function GET(request: Request) {
try {
return NextResponse.json({ success: true, version: "0.1.8", mode: "staging" }, { status: 200 });
return NextResponse.json({ success: true, version: "0.1.9", mode: "staging" }, { status: 200 });
} catch (error) {
console.error(error);
return NextResponse.json({ success: false, version: "Gagal mendapatkan version, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 });

View File

@@ -211,6 +211,7 @@ export default function CreateCalenderDivisionCaleder() {
}
/>
<DateInput
valueFormat='DD-MM-YYYY'
required
styles={{
input: {

View File

@@ -1,19 +1,18 @@
import React, { useState } from 'react';
import { globalCalender } from '../lib/val_calender';
import { useParams, useRouter } from 'next/navigation';
import { funGetDivisionById, funGetSearchMemberDivision, IDataMemberDivision } from '@/module/division_new';
import { LayoutNavbarNew, SkeletonList, TEMA } from '@/module/_global';
import { funGetSearchMemberDivision, IDataMemberDivision } from '@/module/division_new';
import { useHookstate } from '@hookstate/core';
import toast from 'react-hot-toast';
import { Carousel } from '@mantine/carousel';
import { ActionIcon, Avatar, Box, Button, Center, Divider, Flex, Grid, Indicator, rem, Stack, Text, TextInput } from '@mantine/core';
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import { LayoutNavbarNew, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
import { ActionIcon, Avatar, Box, Button, Center, Divider, Flex, Grid, Group, Indicator, rem, Stack, Text, TextInput } from '@mantine/core';
import { useParams } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { FaCheck } from 'react-icons/fa6';
import { HiChevronLeft, HiMagnifyingGlass } from 'react-icons/hi2';
import { IoArrowBackOutline, IoClose } from 'react-icons/io5';
import { Carousel } from '@mantine/carousel';
import { globalCalender } from '../lib/val_calender';
export default function CreateUserCalender({ onClose }: { onClose: (val: any) => void }) {
const router = useRouter()
const param = useParams<{ id: string }>()
const [selectedFiles, setSelectedFiles] = useState<any>([])
const [isData, setData] = useState<IDataMemberDivision[]>([])
@@ -34,11 +33,9 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
if (member.length > 0) {
setSelectedFiles(JSON.parse(JSON.stringify(member.get())))
}
setLoading(false)
} else {
toast.error(response.message)
}
} catch (error) {
console.error(error)
toast.error("Gagal mendapatkan anggota, coba lagi nanti");
@@ -103,6 +100,7 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
async function fetchGetMember(val: string) {
setSearchQuery(val)
try {
setLoading(true)
const res = await funGetSearchMemberDivision('?search=' + val, param.id);
if (res.success) {
setData(res.data)
@@ -111,6 +109,8 @@ export default function CreateUserCalender({ onClose }: { onClose: (val: any) =>
}
} catch (error) {
console.error(error);
} finally {
setLoading(false)
}
}

View File

@@ -1,18 +1,19 @@
"use client"
import React, { useState } from 'react';
import { useParams, useRouter } from 'next/navigation';
import { keyWibu, LayoutNavbarNew, SkeletonList, TEMA } from '@/module/_global';
import { funGetSearchMemberDivision, IDataMemberDivision } from '@/module/division_new';
import toast from 'react-hot-toast';
import { useHookstate } from '@hookstate/core';
import { Carousel } from '@mantine/carousel';
import { ActionIcon, Avatar, Box, Button, Center, Divider, Flex, Grid, Indicator, rem, Stack, Text, TextInput } from '@mantine/core';
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import { LayoutNavbarNew, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
import { ActionIcon, Avatar, Box, Button, Center, Divider, Flex, Grid, Group, Indicator, rem, Stack, Text, TextInput } from '@mantine/core';
import { useParams, useRouter } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { FaCheck } from 'react-icons/fa6';
import { HiMagnifyingGlass } from 'react-icons/hi2';
import { IoArrowBackOutline, IoClose } from 'react-icons/io5';
import { Carousel } from '@mantine/carousel';
import { funAddMemberCalender, funGetOneCalender } from '../lib/api_calender';
import { IDataDetailByIdCalender, IDataDetailByIdMember } from '../lib/type_calender';
import { useHookstate } from '@hookstate/core';
import { useWibuRealtime } from 'wibu-realtime';
export default function CreateUserDetailCalender() {
const router = useRouter()
@@ -27,6 +28,11 @@ export default function CreateUserDetailCalender() {
const [searchQuery, setSearchQuery] = useState('')
const tema = useHookstate(TEMA)
const isMobile2 = useMediaQuery("(max-width: 438px)");
const [loadingSubmit, setLoadingSubmit] = useState(false)
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function getData() {
try {
@@ -88,9 +94,13 @@ export default function CreateUserDetailCalender() {
if (selectedFiles.length == 0) {
return toast.error("Error! silahkan pilih anggota")
}
setLoadingSubmit(true)
const res = await funAddMemberCalender(String(isDataCalender?.idCalendar), selectedFiles)
if (res.success) {
setDataRealtime([{
category: "calendar-detail",
id: isDataCalender?.idCalendar,
}])
toast.success(res.message)
router.push('./')
} else {
@@ -99,6 +109,8 @@ export default function CreateUserDetailCalender() {
} catch (error) {
console.error(error);
toast.error("Gagal menambahkan anggota, coba lagi nanti");
} finally {
setLoadingSubmit(false)
}
}
@@ -290,6 +302,7 @@ export default function CreateUserDetailCalender() {
backgroundColor: `${tema.get().bgUtama}`,
}}>
<Button
loading={loadingSubmit}
c={"white"}
bg={tema.get().utama}
size="lg"

View File

@@ -1,25 +1,26 @@
'use client'
import { LayoutDrawer, LayoutNavbarNew, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
import { ActionIcon, Avatar, Box, Center, CopyButton, Divider, Flex, Grid, Group, SimpleGrid, Skeleton, Spoiler, Stack, Text, Tooltip } from '@mantine/core';
import React, { useState } from 'react';
import { BsCalendar2Event, BsCalendarDate } from 'react-icons/bs';
import { MdEventNote, MdOutlineFormatListBulleted } from "react-icons/md";
import { LuClock, LuCopy, LuLink } from "react-icons/lu";
import { FaCheck, FaUser } from 'react-icons/fa6';
import { TbCopy } from 'react-icons/tb';
import { HiMenu } from 'react-icons/hi';
import DrawerDetailEvent from './drawer_detail_event';
import { useParams, useRouter } from 'next/navigation';
import { funDeleteMemberCalender, funGetOneCalender } from '../lib/api_calender';
import { keyWibu, LayoutDrawer, LayoutNavbarNew, SkeletonList, TEMA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { useHookstate } from '@hookstate/core';
import { ActionIcon, Avatar, Box, Center, CopyButton, Divider, Flex, Grid, Group, SimpleGrid, Spoiler, Stack, Text, Tooltip } from '@mantine/core';
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import moment from "moment";
import "moment/locale/id";
import { IDataDetailByIdCalender, IDataDetailByIdMember } from '../lib/type_calender';
import SkeletonDetailEvent from './skeleton_detail_event';
import { IoIosCloseCircle } from 'react-icons/io';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { useParams, useRouter } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { useHookstate } from '@hookstate/core';
import { BsCalendar2Event, BsCalendarDate } from 'react-icons/bs';
import { FaCheck, FaUser } from 'react-icons/fa6';
import { HiMenu } from 'react-icons/hi';
import { IoIosCloseCircle } from 'react-icons/io';
import { LuClock, LuLink } from "react-icons/lu";
import { MdOutlineFormatListBulleted } from "react-icons/md";
import { TbCopy } from 'react-icons/tb';
import { useWibuRealtime } from 'wibu-realtime';
import { funDeleteMemberCalender, funGetOneCalender } from '../lib/api_calender';
import { IDataDetailByIdCalender, IDataDetailByIdMember } from '../lib/type_calender';
import DrawerDetailEvent from './drawer_detail_event';
import SkeletonDetailEvent from './skeleton_detail_event';
export default function DetailEventDivision() {
const param = useParams<{ id: string, detail: string }>()
@@ -35,16 +36,22 @@ export default function DetailEventDivision() {
const tema = useHookstate(TEMA)
const isMobile2 = useMediaQuery("(max-width: 460px)");
const isMobile = useMediaQuery('(max-width: 369px)');
const [loadingDelete, setLoadingDelete] = useState(false)
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
const [isUserLogin, setUserLogin] = useState('')
const getData = async () => {
const getData = async (loading: boolean) => {
try {
setLoading(true)
setLoading(loading)
const response = await funGetOneCalender(param.detail)
setUserLogin(response.user)
setDataCalender(response.data.calender)
setDataAnggota(response.data.member)
setLengthMember(response.data.total)
setLoading(false)
} catch (error) {
console.error(error)
} finally {
@@ -53,16 +60,34 @@ export default function DetailEventDivision() {
}
useShallowEffect(() => {
getData()
getData(true)
}, [])
useShallowEffect(() => {
if (dataRealTime && dataRealTime.some((i: any) => i.category == 'calendar-detail' && i.id == isDataCalender?.idCalendar)) {
getData(false)
}
if (dataRealTime && dataRealTime.some((i: any) => i.category == 'calendar-detail-delete' && i.id == isDataCalender?.idCalendar && i.idUserFrom != isUserLogin)) {
toast.error("Data telah di hapus, anda akan beralih ke halaman list acara")
setTimeout(() => {
router.push(`/division/${param.id}/calender`)
}, 2000)
}
}, [dataRealTime])
async function onSubmit() {
try {
setLoadingDelete(true)
const res = await funDeleteMemberCalender(String(isDataCalender?.idCalendar), { idUser: dataChoose.id });
if (res.success) {
setDataRealtime([{
category: "calendar-detail",
id: isDataCalender?.idCalendar,
}])
toast.success(res.message)
setDataChoose({ id: '', name: '' })
getData()
getData(false)
setOpenDrawer(false)
setOpenDrawerUser(false)
} else {
@@ -71,6 +96,9 @@ export default function DetailEventDivision() {
} catch (error) {
console.error(error);
toast.error("Gagal mengeluarkan anggota, coba lagi nanti");
} finally {
setLoadingDelete(false)
setOpenModal(false)
}
}
@@ -432,16 +460,17 @@ export default function DetailEventDivision() {
</Box>
</LayoutDrawer>
<LayoutModal opened={isOpenModal} onClose={() => setOpenModal(false)}
<LayoutModal loading={loadingDelete} opened={isOpenModal} onClose={() => setOpenModal(false)}
description="Apakah Anda yakin ingin mengeluarkan anggota?"
onYes={(val) => {
if (val) {
onSubmit()
} else {
setOpenModal(false)
}
setOpenModal(false)
}} />
<LayoutDrawer opened={openDrawer} title={'Menu'} onClose={() => setOpenDrawer(false)}>
<DrawerDetailEvent idCalendar={String(isDataCalender?.idCalendar)} />
<DrawerDetailEvent idCalendar={String(isDataCalender?.idCalendar)} close={() => { setOpenDrawer(false) }} />
</LayoutDrawer>
</Box>
);

View File

@@ -1,5 +1,5 @@
"use client"
import { TEMA } from '@/module/_global';
import { keyWibu, TEMA } from '@/module/_global';
import LayoutModal from '@/module/_global/layout/layout_modal';
import { Box, Flex, SimpleGrid, Stack, Text } from '@mantine/core';
import { useParams, useRouter } from 'next/navigation';
@@ -9,30 +9,50 @@ import { MdDelete, MdEdit } from 'react-icons/md';
import { funDeleteCalenderById } from '../lib/api_calender';
import { FaUsers } from 'react-icons/fa6';
import { useHookstate } from '@hookstate/core';
import { useWibuRealtime } from 'wibu-realtime';
export default function DrawerDetailEvent({ idCalendar }: { idCalendar: string }) {
export default function DrawerDetailEvent({ idCalendar, close }: { idCalendar: string, close: (val:boolean) => void }) {
const router = useRouter()
const [isModal, setModal] = useState(false)
const param = useParams<{ id: string, detail: string }>()
const tema = useHookstate(TEMA)
const [loadingDelete, setLoadingDelete] = useState(false)
const [dataRealTime, setDataRealtime] = useWibuRealtime({
WIBU_REALTIME_TOKEN: keyWibu,
project: "sdm"
})
async function fetchDeleteCalender(val: boolean) {
try {
if (val) {
setLoadingDelete(true)
const response = await funDeleteCalenderById(idCalendar)
if (response.success) {
setDataRealtime([
{
category: "calendar-detail-delete",
id: idCalendar,
},
{
category: "calendar-event",
division: param.id,
date: response.data.dateStart,
idUserFrom: response.user
}
])
toast.success(response.message)
setModal(false)
router.push(`/division/${param.id}/calender`)
} else {
toast.error(response.message)
}
}
setModal(false)
} catch (error) {
console.error(error);
setModal(false)
toast.error("Gagal hapus acara, coba lagi nanti");
} finally {
close(true)
setLoadingDelete(false)
setModal(false)
}
}
@@ -72,7 +92,7 @@ export default function DrawerDetailEvent({ idCalendar }: { idCalendar: string }
</Flex>
</SimpleGrid>
</Stack>
<LayoutModal opened={isModal} onClose={() => setModal(false)}
<LayoutModal loading={loadingDelete} opened={isModal} onClose={() => setModal(false)}
description="Apakah Anda yakin ingin menghapus data acara ini? Data ini akan mempengaruhi semua data yang terkait"
onYes={(val) => { fetchDeleteCalender(val) }} />
</Box>

View File

@@ -54,17 +54,16 @@ export default function ListDivisionTask() {
}
};
useShallowEffect(() => {
fetchData(false)
}, [isPage])
useShallowEffect(() => {
setPage(1)
fetchData(true);
}, [status, searchQuery]);
useShallowEffect(() => {
fetchData(false)
}, [isPage])
useEffect(() => {
const handleScroll = async () => {
if (containerRef && containerRef.current) {
@@ -249,8 +248,8 @@ export default function ListDivisionTask() {
</Card.Section>
<Box pt={10}>
<Progress.Root size="xl" radius="xl" style={{ border: `1px solid ${'#BDBDBD'}` }}>
<Progress.Section value={v.progress} color="yellow" striped >
<Progress.Label>{v.progress}%</Progress.Label>
<Progress.Section value={_.isNull(v.progress) ? 0 : v.progress} color="yellow" striped >
<Progress.Label>{_.isNull(v.progress) ? 0 : v.progress}%</Progress.Label>
</Progress.Section>
</Progress.Root>
<Text my={10}>{v.desc}</Text>