Merge pull request #129 from bipproduction/lukman/19-agustus-2024
feat : update history
This commit is contained in:
@@ -1,9 +1,9 @@
|
||||
import { ViewHistoryDivisionCalender } from '@/module/division_new';
|
||||
import { HistoryDivisionCalender } from '@/module/calender';
|
||||
import React from 'react';
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<ViewHistoryDivisionCalender />
|
||||
<HistoryDivisionCalender />
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -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 });
|
||||
|
||||
|
||||
82
src/app/api/calender/history/route.ts
Normal file
82
src/app/api/calender/history/route.ts
Normal file
@@ -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 });
|
||||
}
|
||||
}
|
||||
@@ -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 }
|
||||
export { UpdateDivisionCalender }
|
||||
export { HistoryDivisionCalender }
|
||||
@@ -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}`);
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -62,7 +62,7 @@ export default function DetailEventDivision() {
|
||||
</Group>
|
||||
<Group mb={10} gap={30}>
|
||||
<LuClock size={25} color={WARNA.biruTua} />
|
||||
<Text>{moment.utc(isDataCalender?.timeStart).format('HH:mm')} | {moment.utc(isDataCalender?.timeEnd).format('HH:mm')} </Text>
|
||||
<Text>{isDataCalender?.timeStart} | {isDataCalender?.timeEnd} </Text>
|
||||
</Group>
|
||||
<Group mb={10} gap={30}>
|
||||
<BsCalendarDate size={25} color={WARNA.biruTua} />
|
||||
|
||||
123
src/module/calender/ui/history_division_calender.tsx
Normal file
123
src/module/calender/ui/history_division_calender.tsx
Normal file
@@ -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<IHistoryCalender[]>([])
|
||||
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 (
|
||||
<Box>
|
||||
<LayoutNavbarNew back="/calender" title="History kalender" menu />
|
||||
<pre>{JSON.stringify(isData, null, 1)}</pre>
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
<Box mt={30}>
|
||||
<Box bg={"#DBE9D8"} style={{
|
||||
borderRadius: 10
|
||||
}}>
|
||||
{isData.map((v, i) => {
|
||||
return (
|
||||
<Grid key={i}>
|
||||
<Grid.Col span={2}>
|
||||
<Flex justify={"center"} direction={'column'}>
|
||||
<Text ta={"center"} fz={20} fw={'bold'}>{moment(v.dateStart).format('D MMM')}</Text>
|
||||
<Text ta={"center"} fz={15}>{moment(v.dateStart).format('dddd')}</Text>
|
||||
</Flex>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={'auto'}>
|
||||
{v.data.map((d, x) => {
|
||||
return (
|
||||
<Box mb={10} key={x} >
|
||||
<Text fw={"bold"}>{d.title}</Text>
|
||||
<Text>{d.timeStart} | {d.timeEnd}</Text>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -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<IDetailByIdCalender>()
|
||||
const [isDataAnggota, setDataAnggota] = useState<IEditMemberCalender[]>([])
|
||||
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<Date | null>(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 <UpdateListUsers onClose={() => setOpenMember(false)} />
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<LayoutNavbarNew back={`/division/${param.id}/calender`} title="Edit kalender" menu />
|
||||
@@ -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() {
|
||||
}
|
||||
}
|
||||
/>
|
||||
<Box mt={5} onClick={() => router.push('/calender/update?page=update-user-calender')}>
|
||||
<Box mt={5} onClick={() => setOpenMember(true)}>
|
||||
<Group
|
||||
justify="space-between"
|
||||
p={10}
|
||||
@@ -250,7 +236,8 @@ export default function UpdateDivisionCalender() {
|
||||
},
|
||||
}}
|
||||
size="md" placeholder='Deskripsi' label="Deskripsi"
|
||||
value={isDataCalender?.desc}
|
||||
// value={isDataCalender?.desc}
|
||||
defaultValue={isDataCalender?.desc}
|
||||
onChange={
|
||||
(event) => {
|
||||
setDataCalender({
|
||||
@@ -263,7 +250,7 @@ export default function UpdateDivisionCalender() {
|
||||
<Box pt={30}>
|
||||
<Group justify="space-between">
|
||||
<Text c={WARNA.biruTua}>Anggota Terpilih</Text>
|
||||
<Text c={WARNA.biruTua}>Total {isLengthMember} Anggota</Text>
|
||||
<Text c={WARNA.biruTua}>Total {memberUser.length} Anggota</Text>
|
||||
</Group>
|
||||
<Box pt={10}>
|
||||
<Box mb={20}>
|
||||
@@ -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 (
|
||||
<Flex
|
||||
justify={"space-between"}
|
||||
|
||||
@@ -1,9 +1,15 @@
|
||||
"use client"
|
||||
import { WARNA } from '@/module/_global';
|
||||
import { Avatar, Box, Button, Center, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { LayoutNavbarNew, WARNA } from '@/module/_global';
|
||||
import { funGetDivisionById, IDataMemberDivision } from '@/module/division_new';
|
||||
import { useHookstate } from '@hookstate/core';
|
||||
import { Avatar, Box, Button, Center, Divider, Flex, Group, SimpleGrid, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { HiMagnifyingGlass } from 'react-icons/hi2';
|
||||
import { globalCalender } from '../lib/val_calender';
|
||||
import toast from 'react-hot-toast';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { FaCheck } from 'react-icons/fa6';
|
||||
|
||||
const dataUser = [
|
||||
{
|
||||
@@ -38,77 +44,132 @@ const dataUser = [
|
||||
},
|
||||
];
|
||||
|
||||
export default function UpdateListUsers() {
|
||||
export default function UpdateListUsers({ onClose }: { onClose: (val: any) => void }) {
|
||||
const router = useRouter()
|
||||
const [selectedFiles, setSelectedFiles] = useState<Record<number, boolean>>({});
|
||||
const param = useParams<{ id: string }>()
|
||||
const [selectedFiles, setSelectedFiles] = useState<any>([])
|
||||
const [isData, setData] = useState<IDataMemberDivision[]>([])
|
||||
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 (
|
||||
<Box>
|
||||
<Stack>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: '#A3A3A3',
|
||||
borderColor: '#A3A3A3',
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
<Box pt={10}>
|
||||
<SimpleGrid
|
||||
cols={{ base: 2, sm: 2, lg: 2 }}
|
||||
spacing={{ base: 20, sm: "xl" }}
|
||||
verticalSpacing={{ base: "md", sm: "xl" }}
|
||||
>
|
||||
{dataUser.map((v, index) => {
|
||||
const isSelected = selectedFiles[index];
|
||||
return (
|
||||
<Box key={index} mb={10}>
|
||||
<Box
|
||||
bg={isSelected ? WARNA.bgHijauMuda : "white"}
|
||||
style={{
|
||||
border: `1px solid ${WARNA.biruTua}`,
|
||||
borderRadius: 20,
|
||||
}}
|
||||
py={10}
|
||||
onClick={() => handleFileClick(index)}
|
||||
>
|
||||
<Center>
|
||||
<Avatar src={v.img} alt="it's me" size="xl" />
|
||||
</Center>
|
||||
<Text mt={20} ta="center">
|
||||
{v.name}
|
||||
</Text>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
</SimpleGrid>
|
||||
</Box>
|
||||
</Stack>
|
||||
<Box mt="xl">
|
||||
<LayoutNavbarNew
|
||||
// back=""
|
||||
title="Pilih Anggota"
|
||||
menu
|
||||
/>
|
||||
<Box p={20}>
|
||||
<Group justify="space-between" mt={20} onClick={handleSelectAll}>
|
||||
<Text c={WARNA.biruTua} fw={"bold"}>
|
||||
Pilih Semua Anggota
|
||||
</Text>
|
||||
{selectAll ? <FaCheck style={{ marginRight: 10 }} /> : ""}
|
||||
</Group>
|
||||
<Box mt={15}>
|
||||
{isData.map((v, i) => {
|
||||
const isSelected = selectedFiles.some((i: any) => i?.idUser == v.idUser);
|
||||
return (
|
||||
<Box mb={15} key={i} onClick={() => handleFileClick(i)}>
|
||||
<Flex justify={"space-between"} align={"center"}>
|
||||
<Group>
|
||||
<Avatar src={"v.image"} alt="it's me" size="lg" />
|
||||
<Text style={{
|
||||
cursor: 'pointer',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
}}>
|
||||
{v.name}
|
||||
</Text>
|
||||
</Group>
|
||||
<Text
|
||||
style={{
|
||||
cursor: 'pointer',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
paddingLeft: 20,
|
||||
}}
|
||||
>
|
||||
{isSelected ? <FaCheck style={{ marginRight: 10 }} /> : ""}
|
||||
</Text>
|
||||
</Flex>
|
||||
<Divider my={"md"} />
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
</Box>
|
||||
<Box mt={"xl"}>
|
||||
<Button
|
||||
color="white"
|
||||
c={"white"}
|
||||
bg={WARNA.biruTua}
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={() => router.push("/calender/update")}
|
||||
onClick={() => {onSubmit()}}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -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 (
|
||||
<Box>
|
||||
<LayoutNavbarNew back="/calender/update" title="Tambah Anggota" menu />
|
||||
<Box p={20}>
|
||||
<UpdateListUsers />
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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 (
|
||||
<Box>
|
||||
<LayoutNavbarNew back="/calender" title="History kalender" menu />
|
||||
<Box p={20}>
|
||||
<TextInput
|
||||
styles={{
|
||||
input: {
|
||||
color: WARNA.biruTua,
|
||||
borderRadius: WARNA.biruTua,
|
||||
borderColor: WARNA.biruTua,
|
||||
},
|
||||
}}
|
||||
size="md"
|
||||
radius={30}
|
||||
leftSection={<HiMagnifyingGlass size={20} />}
|
||||
placeholder="Pencarian"
|
||||
/>
|
||||
<Box mt={30}>
|
||||
<Box bg={"#DBE9D8"} style={{
|
||||
borderRadius: 10
|
||||
}}>
|
||||
{history.map((v, i) => {
|
||||
return (
|
||||
<Grid key={i}>
|
||||
<Grid.Col span={2}>
|
||||
<Flex justify={"center"} direction={'column'}>
|
||||
<Text ta={"center"} fz={20} fw={'bold'}>{v.tangal}</Text>
|
||||
<Text ta={"center"} fz={15}>{v.hari}</Text>
|
||||
</Flex>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={'auto'}>
|
||||
{v.data.map((value) => {
|
||||
return (
|
||||
<Box mb={10} key={value.id} onClick={() => router.push('/calender?page=detail-event')}>
|
||||
<Text fw={"bold"}>{value.judul}</Text>
|
||||
<Text>{value.waktu}</Text>
|
||||
</Box>
|
||||
)
|
||||
})}
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
)
|
||||
})}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@@ -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 (
|
||||
|
||||
@@ -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 }
|
||||
|
||||
Reference in New Issue
Block a user