From d1f9561d9b8c5548ff7bf2674e7a5ebc42a5edcd Mon Sep 17 00:00:00 2001 From: lukman Date: Mon, 19 Aug 2024 17:42:28 +0800 Subject: [PATCH] feat : update history --- .../calender/history/page.tsx | 4 +- src/app/api/calender/[id]/route.ts | 25 ++- src/app/api/calender/history/route.ts | 82 ++++++++ src/module/calender/index.ts | 4 +- src/module/calender/lib/api_calender.ts | 4 + src/module/calender/lib/type_calender.ts | 12 +- .../calender/ui/detail_event_division.tsx | 2 +- .../calender/ui/history_division_calender.tsx | 123 ++++++++++++ .../calender/ui/update_division_calender.tsx | 53 ++---- src/module/calender/ui/update_list_users.tsx | 177 ++++++++++++------ .../ui/update_user_division_calender.tsx | 16 -- .../components/history_division_calender.tsx | 101 ---------- .../view/view_history_division_calender.tsx | 2 +- src/module/division_new/index.ts | 2 - 14 files changed, 385 insertions(+), 222 deletions(-) create mode 100644 src/app/api/calender/history/route.ts create mode 100644 src/module/calender/ui/history_division_calender.tsx delete mode 100644 src/module/calender/ui/update_user_division_calender.tsx delete mode 100644 src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx diff --git a/src/app/(application)/division/[id]/(fitur-division)/calender/history/page.tsx b/src/app/(application)/division/[id]/(fitur-division)/calender/history/page.tsx index 555fef3..26817a2 100644 --- a/src/app/(application)/division/[id]/(fitur-division)/calender/history/page.tsx +++ b/src/app/(application)/division/[id]/(fitur-division)/calender/history/page.tsx @@ -1,9 +1,9 @@ -import { ViewHistoryDivisionCalender } from '@/module/division_new'; +import { HistoryDivisionCalender } from '@/module/calender'; import React from 'react'; function Page() { return ( - + ); } diff --git a/src/app/api/calender/[id]/route.ts b/src/app/api/calender/[id]/route.ts index 196c4d2..14da8c4 100644 --- a/src/app/api/calender/[id]/route.ts +++ b/src/app/api/calender/[id]/route.ts @@ -151,13 +151,15 @@ export async function DELETE(request: Request, context: { params: { id: string } // EDIT CALENDER BY ID export async function PUT(request: Request, context: { params: { id: string } }) { try { + + console.log('amalai') const user = await funGetUserByCookies() if (user.id == undefined) { return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 }); } const { id } = context.params - + const userId = user.id const { title, desc, timeStart, dateStart, timeEnd, linkMeet, repeatEventTyper, member } = await request.json() const cek = await prisma.divisionCalendar.count({ @@ -166,6 +168,8 @@ export async function PUT(request: Request, context: { params: { id: string } }) } }) + console.log(id, title, desc, timeStart, dateStart, timeEnd, linkMeet, repeatEventTyper, member) + if (cek == 0) { return NextResponse.json( { @@ -176,6 +180,11 @@ export async function PUT(request: Request, context: { params: { id: string } }) ); } + const y = new Date('1970-01-01 ' + timeStart) + const x = new Date('1970-01-01 ' + timeEnd) + const timeStartFix = new Date(y.getTime() - (y.getTimezoneOffset() * 60000)).toISOString() + const timeEndFix = new Date(x.getTime() - (x.getTimezoneOffset() * 60000)).toISOString() + const statusCalender = 0 const data = await prisma.divisionCalendar.update({ where: { id: id @@ -183,15 +192,17 @@ export async function PUT(request: Request, context: { params: { id: string } }) data: { title: title, desc: desc, - timeStart: timeStart, - dateStart: dateStart, - timeEnd: timeEnd, + createdBy: String(userId), + timeStart: timeStartFix, + dateStart: new Date(dateStart), + timeEnd: timeEndFix, linkMeet: linkMeet, - repeatEventTyper: repeatEventTyper + repeatEventTyper: repeatEventTyper, + status: statusCalender } }); - await prisma.divisionCalendarMember.deleteMany({ + const del = await prisma.divisionCalendarMember.deleteMany({ where: { idCalendar: id } @@ -207,6 +218,8 @@ export async function PUT(request: Request, context: { params: { id: string } }) data: omitMember }); + console.log(omitMember) + return NextResponse.json({ success: true, message: "Berhasil mengedit calender" }, { status: 200 }); diff --git a/src/app/api/calender/history/route.ts b/src/app/api/calender/history/route.ts new file mode 100644 index 0000000..07f57d1 --- /dev/null +++ b/src/app/api/calender/history/route.ts @@ -0,0 +1,82 @@ +import moment from "moment"; +import { NextResponse } from "next/server"; +import "moment/locale/id"; +import { funGetUserByCookies } from "@/module/auth"; +import { prisma } from "@/module/_global"; +import _ from "lodash"; + +// GET HSITORY +export async function GET(request: Request) { + try { + const user = await funGetUserByCookies() + if (user.id == undefined) { + return NextResponse.json({ success: false, message: "Anda harus login untuk mengakses ini" }, { status: 401 }); + } + + const { searchParams } = new URL(request.url); + const idDivision = searchParams.get("division"); + + if (idDivision != "null" && idDivision != null && idDivision != undefined) { + const cekDivision = await prisma.division.count({ + where: { + id: idDivision, + isActive: true + } + }) + + if (cekDivision == 0) { + return NextResponse.json({ success: false, message: "Gagal mendapatkan divisi, data tidak ditemukan" }, { status: 404 }); + } + + const data = await prisma.divisionCalendar.findMany({ + where: { + isActive: true, + idDivision: idDivision, + }, + select: { + id: true, + title: true, + timeStart: true, + dateStart: true, + timeEnd: true, + }, + orderBy: [ + { + dateStart: 'asc' + }, + { + timeStart: 'asc' + }, + { + timeEnd: 'asc' + } + ] + }); + + const allOmit = data.map((v: any) => ({ + ..._.omit(v, ["title", "timeStart", "timeEnd", "id", ]), + dateStart: v.dateStart, + data: [ + { + id: v.id, + title: v.title, + timeEnd: moment.utc(v.timeEnd).format('HH:mm'), + timeStart: moment.utc(v.timeStart).format('HH:mm') + } + ] + })) + + + + return NextResponse.json({ success: true, message: "Berhasil mendapatkan calender", data: allOmit }, { status: 200 }); + + } else { + return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, data tidak ditemukan" }, { status: 404 }); + + } + + } catch (error) { + console.log(error) + return NextResponse.json({ success: false, message: "Gagal mendapatkan calender, data tidak ditemukan" }, { status: 404 }); + } +} \ No newline at end of file diff --git a/src/module/calender/index.ts b/src/module/calender/index.ts index 9819d1c..ed688c7 100644 --- a/src/module/calender/index.ts +++ b/src/module/calender/index.ts @@ -1,5 +1,6 @@ import CreateCalenderDivisionCaleder from "./ui/create_calender_division_caleder"; import DetailEventDivision from "./ui/detail_event_division"; +import HistoryDivisionCalender from "./ui/history_division_calender"; import NavbarCreateDivisionCalender from "./ui/navbar_create_division_calender"; import NavbarDivisionCalender from "./ui/navbar_division_calender"; import UpdateDivisionCalender from "./ui/update_division_calender"; @@ -8,4 +9,5 @@ export { NavbarDivisionCalender } export { NavbarCreateDivisionCalender } export { CreateCalenderDivisionCaleder } export { DetailEventDivision } -export { UpdateDivisionCalender } \ No newline at end of file +export { UpdateDivisionCalender } +export { HistoryDivisionCalender } \ No newline at end of file diff --git a/src/module/calender/lib/api_calender.ts b/src/module/calender/lib/api_calender.ts index 67b3c25..7ad2c94 100644 --- a/src/module/calender/lib/api_calender.ts +++ b/src/module/calender/lib/api_calender.ts @@ -4,6 +4,10 @@ export const funGetAllCalender = async (path?: string) => { const response = await fetch(`/api/calender${(path) ? path : ''}`, { next: { tags: ['calender'] } }); return await response.json().catch(() => null); } +export const funGetHostory = async (path?: string) => { + const response = await fetch(`/api/calender/history${(path) ? path : ''}`, { next: { tags: ['hostory'] } }); + return await response.json().catch(() => null); +} export const funGetOneCalender = async (path: string) => { const response = await fetch(`/api/calender/${path}`); diff --git a/src/module/calender/lib/type_calender.ts b/src/module/calender/lib/type_calender.ts index e9bd438..3153c27 100644 --- a/src/module/calender/lib/type_calender.ts +++ b/src/module/calender/lib/type_calender.ts @@ -11,6 +11,16 @@ export interface IDataCalender { user_name: string } +export interface IHistoryCalender { + dateStart: string; + data: { + id: number; + title: string; + timeEnd: string; + timeStart: string; + }[]; +}[]; + export interface IDataDetailByIdCalender { id: string title: string @@ -61,7 +71,7 @@ export interface IEditCalender { linkMeet?: string repeatEventTyper?: string desc?: string, - member?: IEditMemberCalender[] + member?: IFormMemberCalender[] } export interface IEditMemberCalender { diff --git a/src/module/calender/ui/detail_event_division.tsx b/src/module/calender/ui/detail_event_division.tsx index 7a99999..b7eba9f 100644 --- a/src/module/calender/ui/detail_event_division.tsx +++ b/src/module/calender/ui/detail_event_division.tsx @@ -62,7 +62,7 @@ export default function DetailEventDivision() { - {moment.utc(isDataCalender?.timeStart).format('HH:mm')} | {moment.utc(isDataCalender?.timeEnd).format('HH:mm')} + {isDataCalender?.timeStart} | {isDataCalender?.timeEnd} diff --git a/src/module/calender/ui/history_division_calender.tsx b/src/module/calender/ui/history_division_calender.tsx new file mode 100644 index 0000000..0979b30 --- /dev/null +++ b/src/module/calender/ui/history_division_calender.tsx @@ -0,0 +1,123 @@ +"use client" +import { LayoutNavbarNew, WARNA } from '@/module/_global'; +import { Box, Center, Flex, Grid, Group, Text, TextInput } from '@mantine/core'; +import { useParams, useRouter } from 'next/navigation'; +import React, { useState } from 'react'; +import { HiMagnifyingGlass } from 'react-icons/hi2'; +import { IDataCalender, IHistoryCalender } from '../lib/type_calender'; +import { funGetAllCalender, funGetHostory } from '../lib/api_calender'; +import { useShallowEffect } from '@mantine/hooks'; +import moment from 'moment'; +import "moment/locale/id"; + +const history = [ + { + dateStart: "21", + data: [ + { + id: 1, + title: "Pembahasan Mengenai Darmasaba", + timeEnd: "10:00", + timeStart: "10.00", + status: "Selesai", + }, + { + id: 2, + title: "Pembahasan Mengenai Darmasaba", + timeEnd: "10:00", + timeStart: "13.00 - 14.00", + }, + ] + }, + { + dateStart: "21", + data: [ + { + id: 1, + title: "Pembahasan Mengenai Darmasaba", + timeEnd: "10:00", + timeStart: "10.00", + }, + { + id: 1, + title: "Pembahasan Mengenai Darmasaba", + timeEnd: "10:00", + timeStart: "13.00", + }, + { + id: 1, + title: "Pembahasan Mengenai Darmasaba", + timeEnd: "10:00", + timeStart: "15.00", + }, + ] + }, +] + +export default function HistoryDivisionCalender() { + const [isData, setData] = useState([]) + const router = useRouter() + const param = useParams<{ id: string, detail: string }>() + + const getData = async () => { + try { + const response = await funGetHostory('?division=' + param.id) + setData(response.data) + } catch (error) { + console.log(error) + } + } + + useShallowEffect(() => { + getData() + }, []) + return ( + + + 
{JSON.stringify(isData, null, 1)}
+ + } + placeholder="Pencarian" + /> + + + {isData.map((v, i) => { + return ( + + + + {moment(v.dateStart).format('D MMM')} + {moment(v.dateStart).format('dddd')} + + + + {v.data.map((d, x) => { + return ( + + {d.title} + {d.timeStart} | {d.timeEnd} + + ) + })} + + + ) + })} + + + + + ); +} diff --git a/src/module/calender/ui/update_division_calender.tsx b/src/module/calender/ui/update_division_calender.tsx index d4435b6..ef45ef5 100644 --- a/src/module/calender/ui/update_division_calender.tsx +++ b/src/module/calender/ui/update_division_calender.tsx @@ -14,6 +14,7 @@ import moment from 'moment'; import "moment/locale/id"; import { useHookstate } from '@hookstate/core'; import { globalCalender } from '../lib/val_calender'; +import UpdateListUsers from './update_list_users'; export default function UpdateDivisionCalender() { const [isModal, setModal] = useState(false) @@ -21,15 +22,13 @@ export default function UpdateDivisionCalender() { const memberUser = useHookstate(globalCalender) const memberValue = memberUser.get() as IFormMemberCalender[] const [isDataCalender, setDataCalender] = useState() - const [isDataAnggota, setDataAnggota] = useState([]) - const [isLengthMember, setLengthMember] = useState() + const [openMember, setOpenMember] = useState(false) const fetchGetOne = async () => { try { const response = await funGetOneCalender(param.detail) setDataCalender(response.data.calender) - setDataAnggota(response.data.member) - setLengthMember(response.data.member.length) + memberUser.set(response.data.member) } catch (error) { console.log(error) } @@ -39,12 +38,6 @@ export default function UpdateDivisionCalender() { fetchGetOne() }, []) - function onTrue(val: boolean) { - if (val) { - toast.success("Sukses! Data tersimpan"); - } - setModal(false) - } const [value, setValue] = useState(null); const router = useRouter() @@ -59,12 +52,13 @@ export default function UpdateDivisionCalender() { linkMeet: isDataCalender?.linkMeet, repeatEventTyper: isDataCalender?.repeatEventTyper, desc: isDataCalender?.desc, - member: isDataAnggota + member: memberValue }) if (response.success) { setModal(false) router.push(`/division/${param.id}/calender`) + toast.success(response.message) } else { toast.error(response.message) } @@ -77,22 +71,10 @@ export default function UpdateDivisionCalender() { } finally { setModal(false) } - if (val) { - console.log( - { - title: isDataCalender?.title, - dateStart: isDataCalender?.dateStart, - timeStart: isDataCalender?.timeStart, - timeEnd: isDataCalender?.timeEnd, - linkMeet: isDataCalender?.linkMeet, - repeatEventTyper: isDataCalender?.repeatEventTyper, - desc: isDataCalender?.desc, - member: isDataAnggota - } - ) - } } + if (openMember) return setOpenMember(false)} /> + return ( @@ -108,7 +90,7 @@ export default function UpdateDivisionCalender() { size="md" placeholder="Event Nama" label="Event Nama" - value={isDataCalender?.title} + defaultValue={isDataCalender?.title} onChange={ (event) => { setDataCalender({ @@ -153,7 +135,8 @@ export default function UpdateDivisionCalender() { }} size="md" label="Waktu Awal" - value={isDataCalender?.timeStart} + // value={isDataCalender?.timeStart} + defaultValue={isDataCalender?.timeStart} onChange={ (event) => { setDataCalender({ @@ -172,7 +155,8 @@ export default function UpdateDivisionCalender() { }} size="md" label="Waktu Akhir" - value={isDataCalender?.timeEnd} + // value={isDataCalender?.timeEnd} + defaultValue={isDataCalender?.timeEnd} onChange={ (event) => { setDataCalender({ @@ -193,7 +177,8 @@ export default function UpdateDivisionCalender() { size="md" placeholder="Link Meet" label="Link Meet" - value={isDataCalender?.linkMeet} + // value={isDataCalender?.linkMeet} + defaultValue={isDataCalender?.linkMeet} onChange={ (event) => { setDataCalender({ @@ -221,6 +206,7 @@ export default function UpdateDivisionCalender() { { value: '5', label: 'Tahunan' }, ]} value={isDataCalender?.repeatEventTyper} + defaultValue={isDataCalender?.repeatEventTyper} onChange={ (val: any) => { setDataCalender({ @@ -230,7 +216,7 @@ export default function UpdateDivisionCalender() { } } /> - router.push('/calender/update?page=update-user-calender')}> + setOpenMember(true)}> { setDataCalender({ @@ -263,7 +250,7 @@ export default function UpdateDivisionCalender() { Anggota Terpilih - Total {isLengthMember} Anggota + Total {memberUser.length} Anggota @@ -275,7 +262,7 @@ export default function UpdateDivisionCalender() { px={20} py={10} > - {isDataAnggota.map((v: any, i: any) => { + {memberUser.get().map((v: any, i: any) => { return ( void }) { const router = useRouter() - const [selectedFiles, setSelectedFiles] = useState>({}); + const param = useParams<{ id: string }>() + const [selectedFiles, setSelectedFiles] = useState([]) + const [isData, setData] = useState([]) + const member = useHookstate(globalCalender) + const [selectAll, setSelectAll] = useState(false) + + async function getData() { + try { + const response = await funGetDivisionById(param.id) + if (response.success) { + setData(response.data.member) + if (member.length > 0) { + setSelectedFiles(JSON.parse(JSON.stringify(member.get()))) + } + } else { + toast.error(response.message) + } + } catch (error) { + console.log(error) + toast.error("Gagal mendapatkan anggota, coba lagi nanti"); + } + } + + + useShallowEffect(() => { + getData() + }, []); const handleFileClick = (index: number) => { - setSelectedFiles((prevSelectedFiles) => ({ - ...prevSelectedFiles, - [index]: !prevSelectedFiles[index], - })); + if (selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) { + setSelectedFiles(selectedFiles.filter((i: any) => i.idUser != isData[index].idUser)) + } else { + setSelectedFiles([...selectedFiles, { idUser: isData[index].idUser, name: isData[index].name }]) + } }; + + + + const handleSelectAll = () => { + setSelectAll(!selectAll); + if (!selectAll) { + for (let index = 0; index < isData.length; index++) { + if (!selectedFiles.some((i: any) => i.idUser == isData[index].idUser)) { + const newArr = { + idUser: isData[index].idUser, name: isData[index].name + } + setSelectedFiles((selectedFiles: any) => [...selectedFiles, newArr]) + } + + } + } else { + setSelectedFiles([]); + } + }; + + + function onSubmit() { + if (selectedFiles.length == 0) { + return toast.error("Error! silahkan pilih anggota") + } + member.set(selectedFiles) + onClose(true) + } + return ( - - } - placeholder="Pencarian" - /> - - - {dataUser.map((v, index) => { - const isSelected = selectedFiles[index]; - return ( - - handleFileClick(index)} - > -
- -
- - {v.name} - - - - ); - })} - - - - + + + + + Pilih Semua Anggota + + {selectAll ? : ""} + + + {isData.map((v, i) => { + const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser); + return ( + handleFileClick(i)}> + + + + + {v.name} + + + + {isSelected ? : ""} + + + + + ); + })} + + + ); } diff --git a/src/module/calender/ui/update_user_division_calender.tsx b/src/module/calender/ui/update_user_division_calender.tsx deleted file mode 100644 index 59edfd2..0000000 --- a/src/module/calender/ui/update_user_division_calender.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import { LayoutNavbarNew } from '@/module/_global'; -import { Box } from '@mantine/core'; -import React from 'react'; -import UpdateListUsers from './update_list_users'; - -export default function UpdateUserDivisionCalender() { - return ( - - - - - - - ); -} - diff --git a/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx b/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx deleted file mode 100644 index df95d08..0000000 --- a/src/module/division_new/_division_fitur/calender/components/history_division_calender.tsx +++ /dev/null @@ -1,101 +0,0 @@ -"use client" -import { LayoutNavbarNew, WARNA } from '@/module/_global'; -import { Box, Center, Flex, Grid, Group, Text, TextInput } from '@mantine/core'; -import { useRouter } from 'next/navigation'; -import React from 'react'; -import { HiMagnifyingGlass } from 'react-icons/hi2'; - -const history = [ - { - id: 1, - tangal: 1, - hari: "Sab", - data: [ - { - id: 1, - judul: "Pembahasan Mengenai Darmasaba", - waktu: "10.00 - 12.00", - status: "Selesai", - }, - { - id: 2, - judul: "Pembahasan Mengenai Darmasaba", - waktu: "13.00 - 14.00", - }, - ] - }, - { - id: 2, - tangal: 2, - hari: "Min", - data: [ - { - id: 1, - judul: "Pembahasan Mengenai Darmasaba", - waktu: "10.00 - 12.00", - }, - { - id: 1, - judul: "Pembahasan Mengenai Darmasaba", - waktu: "13.00 - 14.00", - }, - { - id: 1, - judul: "Pembahasan Mengenai Darmasaba", - waktu: "15.00 - 16.00", - }, - ] - }, -] - -export default function HistoryDivisionCalender() { - const router = useRouter() - return ( - - - - } - placeholder="Pencarian" - /> - - - {history.map((v, i) => { - return ( - - - - {v.tangal} - {v.hari} - - - - {v.data.map((value) => { - return ( - router.push('/calender?page=detail-event')}> - {value.judul} - {value.waktu} - - ) - })} - - - ) - })} - - - - - ); -} diff --git a/src/module/division_new/_division_fitur/calender/view/view_history_division_calender.tsx b/src/module/division_new/_division_fitur/calender/view/view_history_division_calender.tsx index 58da010..b263e74 100644 --- a/src/module/division_new/_division_fitur/calender/view/view_history_division_calender.tsx +++ b/src/module/division_new/_division_fitur/calender/view/view_history_division_calender.tsx @@ -1,6 +1,6 @@ import { Box } from '@mantine/core'; import React from 'react'; -import HistoryDivisionCalender from '../components/history_division_calender'; +import HistoryDivisionCalender from '../../../../calender/ui/history_division_calender'; export default function ViewHistoryDivisionCalender() { return ( diff --git a/src/module/division_new/index.ts b/src/module/division_new/index.ts index 8523f3c..34294e4 100644 --- a/src/module/division_new/index.ts +++ b/src/module/division_new/index.ts @@ -2,7 +2,6 @@ import { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDa import CreateUserDivisionCalender from "./_division_fitur/calender/components/create_user_division_calender"; import UlangiEvent from "./_division_fitur/calender/components/ulangi_event"; import UpdateUlangiEvent from "./_division_fitur/calender/components/update_calander/update_ulangi_event"; -import UpdateUserDivisionCalender from "../calender/ui/update_user_division_calender"; import ViewCreateDivisionCalender from "./_division_fitur/calender/view/view_create_division_calender"; import ViewDetailEventDivision from "./_division_fitur/calender/view/view_detail_event_division"; import ViewDivisionCalender from "./_division_fitur/calender/view/view_division_calender"; @@ -35,7 +34,6 @@ export { CreateUserDivisionCalender }; export { ViewHistoryDivisionCalender }; export { ViewDetailEventDivision }; export { ViewUpdateDivisionCalender }; -export { UpdateUserDivisionCalender }; export { UpdateUlangiEvent }; export { ViewDocumentDivision }; export type { IFormDivision, IFormMemberDivision, IFormFixDivision, IDataDivison, IDataMemberDivision }