Merge pull request #272 from bipproduction/lukman/30-september-2024

Lukman/30 september 2024
This commit is contained in:
Amalia
2024-09-30 11:30:35 +08:00
committed by GitHub
11 changed files with 112 additions and 88 deletions

View File

@@ -3,6 +3,7 @@ import { funGetUserByCookies } from "@/module/auth";
import { createLogUser } from "@/module/user"; import { createLogUser } from "@/module/user";
import _ from "lodash"; import _ from "lodash";
import moment from "moment"; import moment from "moment";
import "moment/locale/id";
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";
// GET ALL NOTIFIKASI // GET ALL NOTIFIKASI

View File

@@ -8,7 +8,7 @@ export default function LayoutDrawer({ opened, onClose, title, children, size }:
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
return ( return (
<Box> <Box>
<Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'} <Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%' }
styles={{ styles={{
content: { content: {
backgroundColor: "white", backgroundColor: "white",

View File

@@ -320,7 +320,7 @@ export default function DetailEventDivision() {
<Box <Box
key={i} key={i}
> >
<SkeletonList/> <SkeletonList />
</Box> </Box>
))} ))}
</Box> </Box>
@@ -365,7 +365,7 @@ export default function DetailEventDivision() {
lg: 1, lg: 1,
xl: 1, xl: 1,
}}> }}>
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
</Grid.Col> </Grid.Col>
<Grid.Col span={{ <Grid.Col span={{
base: 11, base: 11,
@@ -375,14 +375,11 @@ export default function DetailEventDivision() {
lg: 11, lg: 11,
xl: 11, xl: 11,
}}> }}>
<Flex justify='space-between' align={"center"}> <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
<Flex direction={'column'} align="flex-start" justify="flex-start"> <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
<Text lineClamp={1} pl={isMobile ? 35 : 40}>{v.name}</Text> style={{
<Text c={"#5A687D"} fz={14} lineClamp={1} pl={isMobile ? 35 : 40}> overflowWrap: "break-word"
{v.email} }}>{v.email}</Text>
</Text>
</Flex>
</Flex>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}> <Box mt={10}>

View File

@@ -31,6 +31,7 @@ export default function InformationDivision() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const [isAdmin, setAdmin] = useState(false) const [isAdmin, setAdmin] = useState(false)
const isMobile = useMediaQuery('(max-width: 455px)'); const isMobile = useMediaQuery('(max-width: 455px)');
const isMobile2 = useMediaQuery("(max-width: 438px)");
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
async function getOneData() { async function getOneData() {
@@ -164,8 +165,8 @@ export default function InformationDivision() {
((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ? ((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ?
<Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}> <Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}>
<Avatar size={isMobile ? 'md' : 'lg'}> <Avatar size={'lg'}>
<AiOutlineUserAdd size={isMobile ? 25 : 30} color={tema.get().utama} /> <AiOutlineUserAdd size={30} color={tema.get().utama} />
</Avatar> </Avatar>
<Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text> <Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text>
</Group> </Group>
@@ -194,10 +195,10 @@ export default function InformationDivision() {
}} }}
> >
<Grid.Col span={1}> <Grid.Col span={1}>
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
</Grid.Col> </Grid.Col>
<Grid.Col span={8}> <Grid.Col span={8}>
<Text c={tema.get().utama} fw={"bold"} truncate="end" pl={isMobile ? 25 : 30} fz={isMobile ? 14 : 16}> <Text c={tema.get().utama} fw={"bold"} truncate="end" pl={isMobile2 ? 40 : 30} fz={isMobile ? 14 : 16}>
{v.name} {v.name}
</Text> </Text>
</Grid.Col> </Grid.Col>

View File

@@ -66,7 +66,7 @@ export default function ListTaskOnDetailDivision() {
: <></> : <></>
} }
</Group> </Group>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}> <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{data.map((v, i) => {data.map((v, i) =>
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id}>
<Box p={20} w={{ <Box p={20} w={{

View File

@@ -59,9 +59,9 @@ export default function ListDivisi() {
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada divisi</Text> <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada divisi</Text>
</Box> </Box>
: :
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}> <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{isData.map((v) => {isData.map((v) =>
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id} pb={20}>
<Box w={{ <Box w={{
base: isMobile ? 230 : 300, base: isMobile ? 230 : 300,
md: 400 md: 400

View File

@@ -59,9 +59,9 @@ export default function ListProjects() {
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada kegiatan terbaru</Text> <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada kegiatan terbaru</Text>
</Box> </Box>
: :
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}> <Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{isData.map((v) => {isData.map((v) =>
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id} pb={20}>
<Box w={{ <Box w={{
base: isMobile ? 230 : 300, base: isMobile ? 230 : 300,
md: 400 md: 400

View File

@@ -96,6 +96,23 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
getOneData() getOneData()
}, [refresh.get()]) }, [refresh.get()])
function onCheck() {
if (Object.values(touched).some((v) => v == true))
return false
onSubmit()
}
function onValidation(kategori: string, val: string) {
if (kategori == 'name') {
setData({...data, name: val})
if (val == "" || val.length < 3) {
setTouched({ ...touched, name: true })
} else {
setTouched({ ...touched, name: false })
}
}
}
async function nonActive(val: boolean) { async function nonActive(val: boolean) {
try { try {
if (val) { if (val) {
@@ -156,7 +173,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
{loading ? {loading ?
<Box> <Box>
<Skeleton height={40} mt={6} radius={10} /> <Skeleton height={40} mt={6} radius={10} />
<Skeleton height={40} mt={15} radius={10} />
</Box> </Box>
: :
<Box> <Box>
@@ -172,14 +188,12 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
required required
size="md" size="md"
value={String(data.name)} value={String(data.name)}
onChange={(e) => { onChange={(e) => { onValidation('name', e.target.value) }}
setData({ ...data, name: e.target.value })
setTouched({ ...touched, name: false })
}}
onBlur={() => setTouched({ ...touched, name: true })} onBlur={() => setTouched({ ...touched, name: true })}
error={ error={
touched.name && ( touched.name &&
data.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null (data.name == "" ? "Error! harus memasukkan Nama Jabatan" :
data.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
) )
} }
radius={10} radius={10}

View File

@@ -73,6 +73,30 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
} }
} }
function onCheck() {
if (Object.values(touched).some((v) => v == true))
return false
onSubmit()
}
function onValidation(kategori: string, val: string) {
if (kategori == 'name') {
setListData({...listData, name: val})
if (val == "" || val.length < 3) {
setTouched({ ...touched, name: true })
} else {
setTouched({ ...touched, name: false })
}
} else if (kategori == 'idGroup') {
setListData({ ...listData, idGroup: val })
if (val == "") {
setTouched({ ...touched, idGroup: true })
} else {
setTouched({ ...touched, idGroup: false })
}
}
}
return ( return (
<Box> <Box>
<Stack pt={10}> <Stack pt={10}>
@@ -102,9 +126,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
</Stack> </Stack>
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg"> <LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">
<Box pt={10} pos={"relative"} h={{ <Box pt={10} pos={"relative"} h={{
base: "69vh", base: "65vh",
sm: "69vh", sm: "67vh",
lg: "69vh", lg: "67vh",
xl: "70vh" xl: "70vh"
}}> }}>
@@ -125,13 +149,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
radius={10} radius={10}
mb={5} mb={5}
withAsterisk withAsterisk
onChange={(val: any) => { onChange={(e: any) =>
setListData({ { onValidation('idGroup', e) }
...listData, }
idGroup: val
})
setTouched({ ...touched, idGroup: false })
}}
styles={{ styles={{
input: { input: {
color: tema.get().utama, color: tema.get().utama,
@@ -144,8 +164,6 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
) )
} }
onFocus={() => setTouched({ ...touched, idGroup: true })}
onBlur={() => setTouched({ ...touched, idGroup: true })}
/> />
} }
<TextInput <TextInput
@@ -159,22 +177,15 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
}} }}
my={15} my={15}
size="md" size="md"
onChange={(event: any) => { onChange={(e) => { onValidation('name', e.target.value) }}
setListData({
...listData,
name: event.target.value
})
setTouched({ ...touched, name: false })
}}
radius={10} radius={10}
placeholder="Nama Jabatan" placeholder="Nama Jabatan"
error={ error={
touched.name && ( touched.name &&
listData.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null (listData.name == "" ? "Error! harus memasukkan Nama Jabatan" :
listData.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
) )
} }
onFocus={() => setTouched({ ...touched, name: true })}
onBlur={() => setTouched({ ...touched, name: true })}
required required
/> />
<Box pos={"absolute"} bottom={10} left={0} right={0}> <Box pos={"absolute"} bottom={10} left={0} right={0}>
@@ -184,7 +195,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
size="lg" size="lg"
radius={30} radius={30}
fullWidth fullWidth
onClick={onSubmit} onClick={() => { onCheck() }}
> >
SIMPAN SIMPAN
</Button> </Button>

View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from '@/module/_global'; import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
import { Avatar, Box, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core'; import { Avatar, Box, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project'; import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project';
import toast from 'react-hot-toast'; import toast from 'react-hot-toast';
@@ -24,6 +24,7 @@ export default function ListAnggotaDetailProject() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
const [reason, setReason] = useState("") const [reason, setReason] = useState("")
const isMobile2 = useMediaQuery("(max-width: 438px)");
async function getOneDataCancel() { async function getOneDataCancel() {
try { try {
@@ -83,7 +84,7 @@ export default function ListAnggotaDetailProject() {
toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti"); toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti");
} }
} }
const isMobile = useMediaQuery('(max-width: 369px)'); const isMobile = useMediaQuery('(max-width: 369px)');
return ( return (
<Box pt={20}> <Box pt={20}>
@@ -107,7 +108,7 @@ const isMobile = useMediaQuery('(max-width: 369px)');
.fill(null) .fill(null)
.map((_, i) => ( .map((_, i) => (
<Box key={i}> <Box key={i}>
<SkeletonSingle /> <SkeletonList />
</Box> </Box>
)) ))
: :
@@ -123,19 +124,15 @@ const isMobile = useMediaQuery('(max-width: 369px)');
: setOpenDrawer(false) : setOpenDrawer(false)
}} }}
> >
<Grid.Col span={9}> <Grid.Col span={1}>
<Group> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> </Grid.Col>
<Box w={{ <Grid.Col span={8}>
base: isMobile ? 130 : 140, <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
xl: 270 <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
}}> style={{
<Flex direction={'column'} align="flex-start" justify="flex-start"> overflowWrap: "break-word"
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text> }}>{v.email}</Text>
<Text c={"#5A687D"} fz={isMobile ? 10 : 14} lineClamp={1}>{v.email}</Text>
</Flex>
</Box>
</Group>
</Grid.Col> </Grid.Col>
<Grid.Col span={3}> <Grid.Col span={3}>
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}> <Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
@@ -143,6 +140,9 @@ const isMobile = useMediaQuery('(max-width: 369px)');
</Text> </Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}>
<Divider my={10} />
</Box>
</Box> </Box>
); );
})} })}

View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from "@/module/_global"; import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from "@/module/_global";
import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core"; import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid, Divider } from "@mantine/core";
import { useMediaQuery, useShallowEffect } from "@mantine/hooks"; import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation"; import { useParams, useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
@@ -25,6 +25,7 @@ export default function ListAnggotaDetailTask() {
const roleLogin = useHookstate(globalRole) const roleLogin = useHookstate(globalRole)
const adminLogin = useHookstate(globalIsAdminDivision) const adminLogin = useHookstate(globalIsAdminDivision)
const isMobile = useMediaQuery('(max-width: 369px)'); const isMobile = useMediaQuery('(max-width: 369px)');
const isMobile2 = useMediaQuery("(max-width: 438px)");
const tema = useHookstate(TEMA) const tema = useHookstate(TEMA)
const [reason, setReason] = useState("") const [reason, setReason] = useState("")
@@ -109,7 +110,7 @@ export default function ListAnggotaDetailTask() {
.fill(null) .fill(null)
.map((_, i) => ( .map((_, i) => (
<Box key={i}> <Box key={i}>
<SkeletonSingle /> <SkeletonList />
</Box> </Box>
)) ))
: :
@@ -125,19 +126,15 @@ export default function ListAnggotaDetailTask() {
: setOpenDrawer(false) : setOpenDrawer(false)
}} }}
> >
<Grid.Col span={9}> <Grid.Col span={1}>
<Group> <Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} /> </Grid.Col>
<Box w={{ <Grid.Col span={8}>
base: isMobile ? 130 : 140, <Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
xl: 270 <Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
}}> style={{
<Flex direction={'column'} align="flex-start" justify="flex-start"> overflowWrap: "break-word"
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text> }}>{v.email}</Text>
<Text c={"#5A687D"} lineClamp={1} fz={isMobile ? 10 : 14}>{v.email}</Text>
</Flex>
</Box>
</Group>
</Grid.Col> </Grid.Col>
<Grid.Col span={3}> <Grid.Col span={3}>
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}> <Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
@@ -145,6 +142,9 @@ export default function ListAnggotaDetailTask() {
</Text> </Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Box mt={10}>
<Divider my={10} />
</Box>
</Box> </Box>
); );
})} })}