Merge pull request #272 from bipproduction/lukman/30-september-2024
Lukman/30 september 2024
This commit is contained in:
@@ -8,7 +8,7 @@ export default function LayoutDrawer({ opened, onClose, title, children, size }:
|
||||
const tema = useHookstate(TEMA)
|
||||
return (
|
||||
<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={{
|
||||
content: {
|
||||
backgroundColor: "white",
|
||||
|
||||
@@ -320,7 +320,7 @@ export default function DetailEventDivision() {
|
||||
<Box
|
||||
key={i}
|
||||
>
|
||||
<SkeletonList/>
|
||||
<SkeletonList />
|
||||
</Box>
|
||||
))}
|
||||
</Box>
|
||||
@@ -365,7 +365,7 @@ export default function DetailEventDivision() {
|
||||
lg: 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 span={{
|
||||
base: 11,
|
||||
@@ -375,14 +375,11 @@ export default function DetailEventDivision() {
|
||||
lg: 11,
|
||||
xl: 11,
|
||||
}}>
|
||||
<Flex justify='space-between' align={"center"}>
|
||||
<Flex direction={'column'} align="flex-start" justify="flex-start">
|
||||
<Text lineClamp={1} pl={isMobile ? 35 : 40}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} fz={14} lineClamp={1} pl={isMobile ? 35 : 40}>
|
||||
{v.email}
|
||||
</Text>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
|
||||
style={{
|
||||
overflowWrap: "break-word"
|
||||
}}>{v.email}</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Box mt={10}>
|
||||
|
||||
@@ -31,6 +31,7 @@ export default function InformationDivision() {
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const [isAdmin, setAdmin] = useState(false)
|
||||
const isMobile = useMediaQuery('(max-width: 455px)');
|
||||
const isMobile2 = useMediaQuery("(max-width: 438px)");
|
||||
const tema = useHookstate(TEMA)
|
||||
|
||||
async function getOneData() {
|
||||
@@ -164,8 +165,8 @@ export default function InformationDivision() {
|
||||
|
||||
((roleLogin.get() != 'user' && roleLogin.get() != 'coadmin') || isAdmin) ?
|
||||
<Group align='center' onClick={() => router.push('/division/add-member/' + param.id)}>
|
||||
<Avatar size={isMobile ? 'md' : 'lg'}>
|
||||
<AiOutlineUserAdd size={isMobile ? 25 : 30} color={tema.get().utama} />
|
||||
<Avatar size={'lg'}>
|
||||
<AiOutlineUserAdd size={30} color={tema.get().utama} />
|
||||
</Avatar>
|
||||
<Text fz={isMobile ? 14 : 16}>Tambah Anggota</Text>
|
||||
</Group>
|
||||
@@ -194,10 +195,10 @@ export default function InformationDivision() {
|
||||
}}
|
||||
>
|
||||
<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 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}
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
|
||||
@@ -66,7 +66,7 @@ export default function ListTaskOnDetailDivision() {
|
||||
: <></>
|
||||
}
|
||||
</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) =>
|
||||
<Carousel.Slide key={v.id}>
|
||||
<Box p={20} w={{
|
||||
|
||||
@@ -59,9 +59,9 @@ export default function ListDivisi() {
|
||||
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada divisi</Text>
|
||||
</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) =>
|
||||
<Carousel.Slide key={v.id}>
|
||||
<Carousel.Slide key={v.id} pb={20}>
|
||||
<Box w={{
|
||||
base: isMobile ? 230 : 300,
|
||||
md: 400
|
||||
|
||||
@@ -59,9 +59,9 @@ export default function ListProjects() {
|
||||
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada kegiatan terbaru</Text>
|
||||
</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) =>
|
||||
<Carousel.Slide key={v.id}>
|
||||
<Carousel.Slide key={v.id} pb={20}>
|
||||
<Box w={{
|
||||
base: isMobile ? 230 : 300,
|
||||
md: 400
|
||||
|
||||
@@ -96,6 +96,23 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
|
||||
getOneData()
|
||||
}, [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) {
|
||||
try {
|
||||
if (val) {
|
||||
@@ -156,7 +173,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
|
||||
{loading ?
|
||||
<Box>
|
||||
<Skeleton height={40} mt={6} radius={10} />
|
||||
<Skeleton height={40} mt={15} radius={10} />
|
||||
</Box>
|
||||
:
|
||||
<Box>
|
||||
@@ -172,16 +188,14 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
|
||||
required
|
||||
size="md"
|
||||
value={String(data.name)}
|
||||
onChange={(e) => {
|
||||
setData({ ...data, name: e.target.value })
|
||||
setTouched({ ...touched, name: false })
|
||||
}}
|
||||
onChange={(e) => { onValidation('name', e.target.value) }}
|
||||
onBlur={() => setTouched({ ...touched, name: true })}
|
||||
error={
|
||||
touched.name && (
|
||||
data.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
|
||||
touched.name &&
|
||||
(data.name == "" ? "Error! harus memasukkan Nama Jabatan" :
|
||||
data.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
|
||||
)
|
||||
}
|
||||
}
|
||||
radius={10}
|
||||
placeholder="Nama Jabatan"
|
||||
/>
|
||||
|
||||
@@ -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 (
|
||||
<Box>
|
||||
<Stack pt={10}>
|
||||
@@ -102,9 +126,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
|
||||
</Stack>
|
||||
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">
|
||||
<Box pt={10} pos={"relative"} h={{
|
||||
base: "69vh",
|
||||
sm: "69vh",
|
||||
lg: "69vh",
|
||||
base: "65vh",
|
||||
sm: "67vh",
|
||||
lg: "67vh",
|
||||
xl: "70vh"
|
||||
|
||||
}}>
|
||||
@@ -125,13 +149,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
|
||||
radius={10}
|
||||
mb={5}
|
||||
withAsterisk
|
||||
onChange={(val: any) => {
|
||||
setListData({
|
||||
...listData,
|
||||
idGroup: val
|
||||
})
|
||||
setTouched({ ...touched, idGroup: false })
|
||||
}}
|
||||
onChange={(e: any) =>
|
||||
{ onValidation('idGroup', e) }
|
||||
}
|
||||
styles={{
|
||||
input: {
|
||||
color: tema.get().utama,
|
||||
@@ -144,8 +164,6 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
|
||||
listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
|
||||
)
|
||||
}
|
||||
onFocus={() => setTouched({ ...touched, idGroup: true })}
|
||||
onBlur={() => setTouched({ ...touched, idGroup: true })}
|
||||
/>
|
||||
}
|
||||
<TextInput
|
||||
@@ -159,22 +177,15 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
|
||||
}}
|
||||
my={15}
|
||||
size="md"
|
||||
onChange={(event: any) => {
|
||||
setListData({
|
||||
...listData,
|
||||
name: event.target.value
|
||||
})
|
||||
setTouched({ ...touched, name: false })
|
||||
}}
|
||||
onChange={(e) => { onValidation('name', e.target.value) }}
|
||||
radius={10}
|
||||
placeholder="Nama Jabatan"
|
||||
error={
|
||||
touched.name && (
|
||||
listData.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
|
||||
touched.name &&
|
||||
(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
|
||||
/>
|
||||
<Box pos={"absolute"} bottom={10} left={0} right={0}>
|
||||
@@ -184,7 +195,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
|
||||
size="lg"
|
||||
radius={30}
|
||||
fullWidth
|
||||
onClick={onSubmit}
|
||||
onClick={() => { onCheck() }}
|
||||
>
|
||||
SIMPAN
|
||||
</Button>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
'use client'
|
||||
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from '@/module/_global';
|
||||
import { Avatar, Box, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from '@/module/_global';
|
||||
import { Avatar, Box, Divider, Flex, Grid, Group, SimpleGrid, Stack, Text } from '@mantine/core';
|
||||
import React, { useState } from 'react';
|
||||
import { funDeleteMemberProject, funGetOneProjectById } from '../lib/api_project';
|
||||
import toast from 'react-hot-toast';
|
||||
@@ -24,6 +24,7 @@ export default function ListAnggotaDetailProject() {
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const tema = useHookstate(TEMA)
|
||||
const [reason, setReason] = useState("")
|
||||
const isMobile2 = useMediaQuery("(max-width: 438px)");
|
||||
|
||||
async function getOneDataCancel() {
|
||||
try {
|
||||
@@ -83,7 +84,7 @@ export default function ListAnggotaDetailProject() {
|
||||
toast.error("Gagal menghapus anggota Kegiatan, coba lagi nanti");
|
||||
}
|
||||
}
|
||||
const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
|
||||
return (
|
||||
<Box pt={20}>
|
||||
@@ -107,7 +108,7 @@ const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
.fill(null)
|
||||
.map((_, i) => (
|
||||
<Box key={i}>
|
||||
<SkeletonSingle />
|
||||
<SkeletonList />
|
||||
</Box>
|
||||
))
|
||||
:
|
||||
@@ -123,19 +124,15 @@ const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
: setOpenDrawer(false)
|
||||
}}
|
||||
>
|
||||
<Grid.Col span={9}>
|
||||
<Group>
|
||||
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} />
|
||||
<Box w={{
|
||||
base: isMobile ? 130 : 140,
|
||||
xl: 270
|
||||
}}>
|
||||
<Flex direction={'column'} align="flex-start" justify="flex-start">
|
||||
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} fz={isMobile ? 10 : 14} lineClamp={1}>{v.email}</Text>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Group>
|
||||
<Grid.Col span={1}>
|
||||
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={8}>
|
||||
<Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
|
||||
style={{
|
||||
overflowWrap: "break-word"
|
||||
}}>{v.email}</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={3}>
|
||||
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
|
||||
@@ -143,6 +140,9 @@ const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Box mt={10}>
|
||||
<Divider my={10} />
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
'use client'
|
||||
import { globalRole, LayoutDrawer, SkeletonSingle, TEMA } from "@/module/_global";
|
||||
import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid } from "@mantine/core";
|
||||
import { globalRole, LayoutDrawer, SkeletonList, SkeletonSingle, TEMA } from "@/module/_global";
|
||||
import { Box, Group, Flex, Avatar, Text, SimpleGrid, Stack, Grid, Divider } from "@mantine/core";
|
||||
import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
|
||||
import { useParams, useRouter } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
@@ -25,6 +25,7 @@ export default function ListAnggotaDetailTask() {
|
||||
const roleLogin = useHookstate(globalRole)
|
||||
const adminLogin = useHookstate(globalIsAdminDivision)
|
||||
const isMobile = useMediaQuery('(max-width: 369px)');
|
||||
const isMobile2 = useMediaQuery("(max-width: 438px)");
|
||||
const tema = useHookstate(TEMA)
|
||||
const [reason, setReason] = useState("")
|
||||
|
||||
@@ -109,7 +110,7 @@ export default function ListAnggotaDetailTask() {
|
||||
.fill(null)
|
||||
.map((_, i) => (
|
||||
<Box key={i}>
|
||||
<SkeletonSingle />
|
||||
<SkeletonList />
|
||||
</Box>
|
||||
))
|
||||
:
|
||||
@@ -121,23 +122,19 @@ export default function ListAnggotaDetailTask() {
|
||||
onClick={() => {
|
||||
setDataChoose({ id: v.idUser, name: v.name })
|
||||
reason == null ?
|
||||
setOpenDrawer(true)
|
||||
: setOpenDrawer(false)
|
||||
setOpenDrawer(true)
|
||||
: setOpenDrawer(false)
|
||||
}}
|
||||
>
|
||||
<Grid.Col span={9}>
|
||||
<Group>
|
||||
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={isMobile ? 'md' : 'lg'} />
|
||||
<Box w={{
|
||||
base: isMobile ? 130 : 140,
|
||||
xl: 270
|
||||
}}>
|
||||
<Flex direction={'column'} align="flex-start" justify="flex-start">
|
||||
<Text lineClamp={1} fz={isMobile ? 14 : 16}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} lineClamp={1} fz={isMobile ? 10 : 14}>{v.email}</Text>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Group>
|
||||
<Grid.Col span={1}>
|
||||
<Avatar src={`https://wibu-storage.wibudev.com/api/files/${v.img}`} alt="it's me" size={'lg'} />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={8}>
|
||||
<Text lineClamp={1} pl={isMobile2 ? 40 : 30} fz={isMobile ? 15 : 16}>{v.name}</Text>
|
||||
<Text c={"#5A687D"} truncate="end" fz={isMobile ? 12 : 14} pl={isMobile2 ? 40 : 30}
|
||||
style={{
|
||||
overflowWrap: "break-word"
|
||||
}}>{v.email}</Text>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={3}>
|
||||
<Text c={tema.get().utama} fw={"bold"} ta={'end'} fz={isMobile ? 13 : 16}>
|
||||
@@ -145,6 +142,9 @@ export default function ListAnggotaDetailTask() {
|
||||
</Text>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
<Box mt={10}>
|
||||
<Divider my={10} />
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
})}
|
||||
|
||||
Reference in New Issue
Block a user