diff --git a/src/module/calender/ui/date_event_division.tsx b/src/module/calender/ui/date_event_division.tsx index 9b936ce..125241b 100644 --- a/src/module/calender/ui/date_event_division.tsx +++ b/src/module/calender/ui/date_event_division.tsx @@ -1,4 +1,4 @@ -import { Box, Divider, Flex, Group, Indicator, Skeleton, Text } from '@mantine/core'; +import { Box, Divider, Flex, Grid, Group, Indicator, Skeleton, Text } from '@mantine/core'; import { DatePicker, DatePickerProps } from '@mantine/dates'; import { useParams, useRouter } from 'next/navigation'; import React, { useState } from 'react'; @@ -134,28 +134,36 @@ export default function DateEventDivision() { router.push(`/division/${param.id}/calender/${event.id}`)} bg={bgColor} pl={15} p={10} style={{ borderRadius: 10 }} h={113}> - - - - {event.timeStart} - {event.timeEnd} - + + + + + + + {event.timeStart} - {event.timeEnd} {_.startCase(event.title)} - - Dibuat oleh : {event.user_name} - - - + + + ) diff --git a/src/module/calender/ui/detail_event_division.tsx b/src/module/calender/ui/detail_event_division.tsx index ab8cb89..249dcf1 100644 --- a/src/module/calender/ui/detail_event_division.tsx +++ b/src/module/calender/ui/detail_event_division.tsx @@ -1,6 +1,6 @@ 'use client' -import { LayoutDrawer, LayoutNavbarNew, SkeletonSingle, TEMA } from '@/module/_global'; -import { ActionIcon, Avatar, Box, CopyButton, Divider, Flex, Grid, Group, SimpleGrid, Skeleton, Spoiler, Stack, Text, Tooltip } from '@mantine/core'; +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"; @@ -11,7 +11,7 @@ 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 { useShallowEffect } from '@mantine/hooks'; +import { useMediaQuery, useShallowEffect } from '@mantine/hooks'; import moment from "moment"; import "moment/locale/id"; import { IDataDetailByIdCalender, IDataDetailByIdMember } from '../lib/type_calender'; @@ -33,6 +33,8 @@ export default function DetailEventDivision() { const router = useRouter() const [dataChoose, setDataChoose] = useState({ id: '', name: '' }) const tema = useHookstate(TEMA) + const isMobile2 = useMediaQuery("(max-width: 460px)"); + const isMobile = useMediaQuery('(max-width: 369px)'); const getData = async () => { @@ -89,60 +91,116 @@ export default function DetailEventDivision() { borderRadius: 10 }}> - - - + + +
+ +
- - {isDataCalender?.title} + + {isDataCalender?.title} - - - + + +
+ +
- - {moment(isDataCalender?.dateStart).format('LL')} + + {moment(isDataCalender?.dateStart).format('LL')} - - - + + +
+ +
- - {isDataCalender?.timeStart} | {isDataCalender?.timeEnd} + + {isDataCalender?.timeStart} | {isDataCalender?.timeEnd} - - - + + +
+ +
- - + + {isDataCalender?.repeatEventTyper.toString() === 'once' ? 'Acara 1 Kali' : isDataCalender?.repeatEventTyper.toString() === 'daily' ? 'Setiap Hari' : // isDataCalender?.repeatEventTyper.toString() === 'weekdays' ? 'Hari Kerja (senin - jumat)' : @@ -153,24 +211,38 @@ export default function DetailEventDivision() { - - - + + +
+ +
- + {isDataCalender?.linkMeet ? ( - {isDataCalender?.linkMeet} + {isDataCalender?.linkMeet} {({ copied, copy }) => ( @@ -192,20 +264,34 @@ export default function DetailEventDivision() { } - - - + + +
+ +
- + {isDataCalender?.desc ? ( - {isDataCalender?.desc} + {isDataCalender?.desc} ) : ( - @@ -225,8 +311,8 @@ export default function DetailEventDivision() { border: `1px solid ${"#C7D6E8"}`, borderRadius: 10, }} + p={10} px={20} - pb={20} > {Array(4) .fill(null) @@ -234,7 +320,7 @@ export default function DetailEventDivision() { - + ))} @@ -252,8 +338,8 @@ export default function DetailEventDivision() { border: `1px solid ${"#C7D6E8"}`, borderRadius: 10, }} + p={10} px={20} - pt={20} > { isLengthMember == 0 ? ( @@ -270,21 +356,29 @@ export default function DetailEventDivision() { setOpenDrawerUser(true) }} key={i}> - + - + - {v.name} - + {v.name} + {v.email} @@ -319,7 +413,7 @@ export default function DetailEventDivision() { onClick={() => { router.push('/member/' + dataChoose.id) }} justify={'center'} align={'center'} direction={'column'} > - + Lihat profil @@ -328,7 +422,7 @@ export default function DetailEventDivision() { { setOpenModal(true) }} justify={'center'} align={'center'} direction={'column'} > - + Keluarkan anggota diff --git a/src/module/calender/ui/history_division_calender.tsx b/src/module/calender/ui/history_division_calender.tsx index b98c7ce..7aa3af6 100644 --- a/src/module/calender/ui/history_division_calender.tsx +++ b/src/module/calender/ui/history_division_calender.tsx @@ -20,7 +20,8 @@ export default function HistoryDivisionCalender() { const [searchQuery, setSearchQuery] = useState('') const [loading, setLoading] = useState(true) const tema = useHookstate(TEMA) - const isMobile = useMediaQuery('(max-width: 450px)'); + const isMobile = useMediaQuery('(max-width: 509px)'); + const isMobile2 = useMediaQuery('(max-width: 436px)'); const { value: containerRef } = useHookstate(currentScroll); const [isPage, setPage] = useState(1) @@ -122,41 +123,38 @@ export default function HistoryDivisionCalender() { return ( + }} mb={20} p={15} key={i}> + base: isMobile2 ? 2.5 : 2, + xs: 2, + sm: 2, + md: 2, + lg: 2, + xl: 2, + }}> - {moment(v.dateStart).format('D MMM')} - {moment(v.dateStart).format('dddd')} + {moment(v.dateStart).format('D MMM')} + {moment(v.dateStart).format('dddd')} + base: isMobile2 ? 9.5 : 10, + xs: 10, + sm: 10, + md: 10, + lg: 10, + xl: 10, + }}> {v.data.map((d, x) => { return ( - router.push(`/division/${param.id}/calender/${d.id}`)} > - {d.title} - {d.timeStart} | {d.timeEnd} + {d.title} + {d.timeStart} | {d.timeEnd} ) })} diff --git a/src/module/calender/ui/navbar_create_division_calender.tsx b/src/module/calender/ui/navbar_create_division_calender.tsx index 911f119..cc654be 100644 --- a/src/module/calender/ui/navbar_create_division_calender.tsx +++ b/src/module/calender/ui/navbar_create_division_calender.tsx @@ -238,7 +238,7 @@ export default function NavbarCreateDivisionCalender() { size="md" disabled placeholder='Jumlah pengulangan' - value={isData.repeatValue} + value={"1"} onChange={(event) => { setData({ ...isData, repeatValue: String(event.currentTarget.value) }) setTouched({ ...touched, repeatValue: false }) @@ -265,6 +265,7 @@ export default function NavbarCreateDivisionCalender() { size="md" placeholder='Jumlah pengulangan' value={isData.repeatValue} + min={1} onChange={(event) => { setData({ ...isData, repeatValue: String(event.currentTarget.value) }) setTouched({ ...touched, repeatValue: false }) @@ -273,8 +274,8 @@ export default function NavbarCreateDivisionCalender() { // TODO :: NANTI DIPERBAIKI error={ touched.repeatValue && ( - isData.repeatValue == "" ? "Jumlah pengulangan tidak boleh kosong" : "" - // || Number(isData.repeatValue) <= 0 ? "Jumlah pengulangan tidak boleh 0" : "" + isData.repeatValue == "" ? "Jumlah pengulangan tidak boleh kosong" : + Number(isData.repeatValue) <= 0 ? "Jumlah pengulangan tidak boleh di bawah 1" : "" ) } /> diff --git a/src/module/calender/ui/update_division_calender.tsx b/src/module/calender/ui/update_division_calender.tsx index 5e09979..271fac7 100644 --- a/src/module/calender/ui/update_division_calender.tsx +++ b/src/module/calender/ui/update_division_calender.tsx @@ -290,7 +290,7 @@ export default function UpdateDivisionCalender() { size="md" disabled placeholder='Jumlah pengulangan' - defaultValue={isDataCalender?.repeatValue} + defaultValue={"1"} onChange={(event) => { setDataCalender({ ...isDataCalender, repeatValue: String(event.currentTarget.value) }) setTouched({ ...touched, repeatValue: false }) @@ -314,6 +314,7 @@ export default function UpdateDivisionCalender() { required label="Jumlah pengulangan" size="md" + min={1} placeholder='Jumlah pengulangan' defaultValue={isDataCalender?.repeatValue} onChange={(event) => { @@ -323,8 +324,8 @@ export default function UpdateDivisionCalender() { onBlur={() => setTouched({ ...touched, repeatValue: true })} error={ touched.repeatValue && ( - isDataCalender?.repeatValue == "" ? "Jumlah pengulangan tidak boleh kosong" : null - // || Number(isDataCalender?.repeatValue) <= 0 ? "Jumlah pengulangan tidak boleh dibawah 1" : null + isDataCalender?.repeatValue == "" ? "Jumlah pengulangan tidak boleh kosong" : + Number(isDataCalender?.repeatValue) <= 0 ? "Jumlah pengulangan tidak boleh di bawah 1" : "" ) } /> diff --git a/src/module/division_new/ui/feature_detail_division.tsx b/src/module/division_new/ui/feature_detail_division.tsx index 70536f1..a82f1d2 100644 --- a/src/module/division_new/ui/feature_detail_division.tsx +++ b/src/module/division_new/ui/feature_detail_division.tsx @@ -44,7 +44,7 @@ export default function FeatureDetailDivision() { return ( - Features + Fitur {loading - ? Array(3) + ? Array(6) .fill(null) .map((_, i) => ( @@ -193,18 +193,13 @@ export default function InformationDivision() { } }} > - - + - - + + + {v.name} - - diff --git a/src/module/position/ui/list_position_active.tsx b/src/module/position/ui/list_position_active.tsx index df77fbf..ef7bd3e 100644 --- a/src/module/position/ui/list_position_active.tsx +++ b/src/module/position/ui/list_position_active.tsx @@ -145,7 +145,7 @@ export default function ListPositionActive() {