wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #197 from bipproduction/lukman/5-september-2024

Browse Source 
style : update style
This commit is contained in:
Amalia
2024-09-05 11:20:16 +08:00
committed by GitHub
parent 36bbe99a5a 7b54be072c
commit 9c6c3b6e92
9 changed files with 148 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/module/_global/layout/layout_modal_view_file.tsx
View File

@@ -27,6 +27,7 @@ export default function LayoutModal({ opened, onClose, extension, fitur, file }:
}} }}
fit="contain" fit="contain"
src={`/api/file/img?cat=${fitur}&file=${file}&jenis=file`} src={`/api/file/img?cat=${fitur}&file=${file}&jenis=file`}
alt={file}
/> />
} }
</Modal> </Modal>

2
src/module/calender/ui/detail_event_division.tsx
View File

@@ -176,7 +176,7 @@ export default function DetailEventDivision() {
xl: 11 xl: 11
}}> }}>
{isDataCalender?.desc ? ( {isDataCalender?.desc ? (
<Spoiler maxHeight={80} showLabel="Lebih banyak" hideLabel="Lebih dikit"> <Spoiler maxHeight={80} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
<Text>{isDataCalender?.desc}</Text> <Text>{isDataCalender?.desc}</Text>
</Spoiler> </Spoiler>
) : ( ) : (

57
src/module/group/ui/list_group_active.tsx
View File

@@ -2,6 +2,8 @@ import { LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global";
import { import {
ActionIcon, ActionIcon,
Box, Box,
Flex,
Grid,
Group, Group,
Skeleton, Skeleton,
Text, Text,
@@ -85,7 +87,7 @@ export default function ListGroupActive() {
_.isEmpty(isData) _.isEmpty(isData)
? ?
<Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '60vh' }}> <Box style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '60vh' }}>
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada grup</Text> <Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada grup</Text>
</Box> </Box>
: :
isData.map((v, i) => { isData.map((v, i) => {
@@ -106,25 +108,42 @@ export default function ListGroupActive() {
setActive(v.isActive); setActive(v.isActive);
}} }}
> >
<Box> <Grid justify='center' align='center' >
<ActionIcon <Grid.Col span={{
variant="light" base: 3,
bg={"#DCEED8"} xl: 2
size={50} }}>
radius={100} <Flex justify={{base: "center", xl: "flex-start"}}>
aria-label="icon" <ActionIcon
> variant="light"
<HiOutlineOfficeBuilding bg={"#DCEED8"}
color={WARNA.biruTua} size={50}
size={25} radius={100}
/> aria-label="icon"
</ActionIcon> >
</Box> <HiOutlineOfficeBuilding
<Box> color={WARNA.biruTua}
<Text fw={"bold"} c={WARNA.biruTua}> size={25}
/>
</ActionIcon>
</Flex>
</Grid.Col>
<Grid.Col span={{
base: 9,
xl: 10
}}>
<Box
w={{
base: 220,
xl: 400
}}
>
<Text fw={"bold"} c={WARNA.biruTua} lineClamp={1}>
{v.name} {v.name}
</Text> </Text>
</Box> </Box>
</Grid.Col>
</Grid>
</Group> </Group>
</Box> </Box>
); );
@@ -133,7 +152,7 @@ export default function ListGroupActive() {
<LayoutDrawer <LayoutDrawer
opened={openDrawer} opened={openDrawer}
onClose={() => setOpenDrawer(false)} onClose={() => setOpenDrawer(false)}
title={valChoose} title={<Text lineClamp={1}>{valChoose}</Text>}
> >
<EditDrawerGroup <EditDrawerGroup
id={selectId} id={selectId}

39
src/module/home/ui/list_notification.tsx
View File

@@ -1,6 +1,6 @@
"use client" "use client"
import { WARNA } from '@/module/_global'; import { WARNA } from '@/module/_global';
import { ActionIcon, Box, Center, Grid, Group, Text } from '@mantine/core'; import { ActionIcon, Box, Center, Grid, Group, Spoiler, Text } from '@mantine/core';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import React from 'react'; import React from 'react';
import { FaBell } from 'react-icons/fa6'; import { FaBell } from 'react-icons/fa6';
@@ -8,58 +8,58 @@ import { FaBell } from 'react-icons/fa6';
const dataNotification = [ const dataNotification = [
{ {
id: 1, id: 1,
title: 'Rapat Kamis', title: 'Rapat Kamis Kamis Kamis Kamis Kamis Kamis Kamis Kamis ',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 2, id: 2,
title: 'Rapat Jumat', title: 'Rapat Jumat',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 3, id: 3,
title: 'Rapat Senin', title: 'Rapat Senin',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 4, id: 4,
title: 'Rapat Selasa', title: 'Rapat Selasa',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
{ {
id: 5, id: 5,
title: 'Rapat Rabu', title: 'Rapat Rabu',
description: 'Dipta menambahkan berkas di document dan file.', description: 'Dipta menambahkan berkas di document dan file. Dipta menambahkan berkas di document dan file Dipta menambahkan berkas di document dan file',
}, },
] ]
@@ -79,9 +79,18 @@ export default function ListNotification() {
<ActionIcon variant="light" bg={WARNA.biruTua} size={35} radius={100} aria-label="icon"> <ActionIcon variant="light" bg={WARNA.biruTua} size={35} radius={100} aria-label="icon">
<FaBell size={20} color='white' /> <FaBell size={20} color='white' />
</ActionIcon> </ActionIcon>
<Text fw={'bold'} fz={18}>{v.title}</Text> <Box
w={{
base: 240,
xl: 380
}}
>
<Text fw={'bold'} fz={18} lineClamp={1}>{v.title}</Text>
</Box>
</Group> </Group>
<Text mt={10} fz={15}>{v.description}</Text> <Spoiler maxHeight={60} showLabel="Lebih banyak" hideLabel="Lebih sedikit">
<Text mt={10} fz={15}>{v.description}</Text>
</Spoiler>
</Box> </Box>
</Box> </Box>
) )

63
src/module/home/ui/view_search.tsx
View File

@@ -7,6 +7,7 @@ import { funGetSearchAll } from '../lib/api_search';
import { useShallowEffect } from '@mantine/hooks'; import { useShallowEffect } from '@mantine/hooks';
import { IDataDivisionSearch, IDataProjectSearch, IDataUserSearch } from '../lib/type_search'; import { IDataDivisionSearch, IDataProjectSearch, IDataUserSearch } from '../lib/type_search';
import { useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
import _ from 'lodash';
export default function ViewSearch() { export default function ViewSearch() {
const [search, setSearch] = useState(''); const [search, setSearch] = useState('');
@@ -73,21 +74,27 @@ export default function ViewSearch() {
borderRadius: 5 borderRadius: 5
}}> }}>
{dataUser.length > 0 ? ( {dataUser.length > 0 ? (
<Box> <Box mt={5}>
{dataUser.map((v, i) => { {dataUser.map((v, i) => {
return ( return (
<Box key={i} onClick={() => router.push(`/member/${v.id}`)}> <Box key={i}>
<Group align='center' style={{ <Box onClick={() => {
padding: 5, router.push(`/member/${v.id}`)
paddingLeft: 0, }}>
}} > <Grid gutter={{
<Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} size="lg" /> base: 60,
<Box> xl: "xs"
<Text fw={'bold'} c={WARNA.biruTua}>{v.name}</Text> }} align="center">
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text> <Grid.Col span={2}>
</Box> <Avatar src={`/api/file/img?jenis=image&cat=user&file=${v.img}`} size={50} alt="image" />
</Group> </Grid.Col>
<Divider my={5} /> <Grid.Col span={9}>
<Text fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{_.startCase(v.name)}</Text>
<Text fw={'lighter'} fz={12}>{v.group + ' - ' + v.position}</Text>
</Grid.Col>
</Grid>
</Box>
<Divider my={10} />
</Box> </Box>
) )
})} })}
@@ -112,18 +119,25 @@ export default function ViewSearch() {
{dataDivision.map((v, i) => { {dataDivision.map((v, i) => {
return ( return (
<Box key={i} onClick={() => router.push(`/division/${v.id}`)}> <Box key={i} onClick={() => router.push(`/division/${v.id}`)}>
<Grid justify='center' align='center' mt={15}> <Grid justify='center' align='center' mt={15} >
<Grid.Col span={"auto"}> <Grid.Col span={2}>
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon"> <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
<HiMiniUserGroup color={'white'} size={25} /> <HiMiniUserGroup color={'white'} size={25} />
</ActionIcon> </ActionIcon>
</Grid.Col> </Grid.Col>
<Grid.Col span={10}> <Grid.Col span={10}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.name.toUpperCase()}</Text> <Box
<Text fw={'lighter'} fz={12}>{v.group}</Text> w={{
base: 220,
xl: 380
}}
>
<Text pl={{base: 10, xl:0}} fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{v.name.toUpperCase()}</Text>
</Box>
<Text pl={{base: 10, xl:0}} fw={'lighter'} fz={12} lineClamp={1}>{v.group}</Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Text fw={'lighter'} mt={5} mb={10} lineClamp={2}>{v.desc}</Text> <Text fw={'lighter'} mt={10} mb={10} lineClamp={2}>{v.desc}</Text>
<Divider my={5} /> <Divider my={5} />
</Box> </Box>
) )
@@ -150,14 +164,21 @@ export default function ViewSearch() {
return ( return (
<Box key={i} onClick={() => router.push(`/project/${v.id}`)}> <Box key={i} onClick={() => router.push(`/project/${v.id}`)}>
<Grid justify='center' align='center' mt={10}> <Grid justify='center' align='center' mt={10}>
<Grid.Col span={"auto"}> <Grid.Col span={2}>
<ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon"> <ActionIcon variant="light" bg={WARNA.biruTua} size={50} radius={100} aria-label="icon">
<HiMiniPresentationChartBar color={'white'} size={25} /> <HiMiniPresentationChartBar color={'white'} size={25} />
</ActionIcon> </ActionIcon>
</Grid.Col> </Grid.Col>
<Grid.Col span={10}> <Grid.Col span={10}>
<Text fw={'bold'} c={WARNA.biruTua}>{v.title.toUpperCase()}</Text> <Box
<Text fw={'lighter'} fz={12}>{v.group}</Text> w={{
base: 220,
xl: 380
}}
>
<Text pl={{base: 10, xl:0}} fw={'bold'} c={WARNA.biruTua} lineClamp={1}>{v.title.toUpperCase()}</Text>
</Box>
<Text pl={{base: 10, xl:0}} fw={'lighter'} fz={12} lineClamp={1}>{v.group}</Text>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
<Divider mt={10} /> <Divider mt={10} />

39
src/module/position/ui/drawer_detail_position.tsx
View File

@@ -150,8 +150,8 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
</SimpleGrid> </SimpleGrid>
</Stack> </Stack>
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Edit Jabatan'} size="lg"> <LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Edit Jabatan'} >
<Box pt={10} pos={"relative"} h={"70vh"}> <Box pt={10} pos={"relative"} h={"28.5vh"}>
{loading ? {loading ?
<Box> <Box>
<Skeleton height={40} mt={6} radius={10} /> <Skeleton height={40} mt={6} radius={10} />
@@ -159,40 +159,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
</Box> </Box>
: :
<Box> <Box>
{/* <Select
label="Grup"
placeholder="Pilih grup"
size="md"
radius={10}
data={
listGroup
? listGroup.map((data) => ({
value: data.id,
label: data.name,
}))
: []
}
value={String(data.idGroup)}
mb={5}
onChange={(val) => {
setData({ ...data, idGroup: val })
setTouched({ ...touched, idGroup: false })
}}
withAsterisk
styles={{
input: {
color: WARNA.biruTua,
borderRadius: WARNA.biruTua,
borderColor: WARNA.biruTua,
},
}}
error={
touched.idGroup && (
data.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
)
}
onBlur={() => setTouched({ ...touched, idGroup: true })}
/> */}
<TextInput <TextInput
label="Jabatan" label="Jabatan"
styles={{ styles={{
@@ -203,7 +169,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
}, },
}} }}
required required
my={15}
size="md" size="md"
value={String(data.name)} value={String(data.name)}
onChange={(e) => { onChange={(e) => {

2
src/module/position/ui/drawer_list_position.tsx
View File

@@ -76,7 +76,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
<Box> <Box>
<Stack pt={10}> <Stack pt={10}>
<SimpleGrid <SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }} cols={{ base: 2, sm: 3, lg: 3 }}
onClick={() => setOpenDrawerGroup(true)} onClick={() => setOpenDrawerGroup(true)}
> >
<Flex justify={'center'} align={'center'} direction={'column'} > <Flex justify={'center'} align={'center'} direction={'column'} >

59
src/module/position/ui/list_position_active.tsx
View File

@@ -1,5 +1,5 @@
import { globalRole, LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global"; import { globalRole, LayoutDrawer, SkeletonSingle, WARNA } from "@/module/_global";
import { ActionIcon, Box, Group, Text, TextInput } from "@mantine/core"; import { ActionIcon, Box, Flex, Grid, Group, Text, TextInput } from "@mantine/core";
import React, { useState } from "react"; import React, { useState } from "react";
import { FaUserTie } from "react-icons/fa6"; import { FaUserTie } from "react-icons/fa6";
import { HiMagnifyingGlass } from "react-icons/hi2"; import { HiMagnifyingGlass } from "react-icons/hi2";
@@ -97,25 +97,42 @@ export default function ListPositionActive() {
} }
}} }}
> >
<Box> <Grid justify='center' align='center' >
<ActionIcon <Grid.Col span={{
variant="light" base: 3,
bg={"#DCEED8"} xl: 2
size={50} }}>
radius={100} <Flex justify={{ base: "center", xl: "flex-start" }}>
aria-label="icon" <ActionIcon
> variant="light"
<FaUserTie color={WARNA.biruTua} size={25} /> bg={"#DCEED8"}
</ActionIcon> size={50}
</Box> radius={100}
<Box> aria-label="icon"
<Text fw={"bold"} c={WARNA.biruTua}> >
{v.name} <FaUserTie color={WARNA.biruTua} size={25} />
</Text> </ActionIcon>
<Text fw={"lighter"} fz={12}> </Flex>
{v.group} </Grid.Col>
</Text> <Grid.Col span={{
</Box> base: 9,
xl: 10
}}>
<Box
w={{
base: 220,
xl: 400
}}
>
<Text fw={"bold"} c={WARNA.biruTua} lineClamp={1}>
{v.name}
</Text>
<Text fw={"lighter"} fz={12} lineClamp={1}>
{v.group}
</Text>
</Box>
</Grid.Col>
</Grid>
</Group> </Group>
</Box> </Box>
); );
@@ -126,7 +143,7 @@ export default function ListPositionActive() {
<LayoutDrawer <LayoutDrawer
opened={openDrawer} opened={openDrawer}
onClose={() => setOpenDrawer(false)} onClose={() => setOpenDrawer(false)}
title={isData} title={<Text lineClamp={1}>{isData}</Text>}
> >
<DrawerDetailPosition <DrawerDetailPosition
id={selectId} id={selectId}

2
src/module/user/profile/ui/profile.tsx
View File

@@ -80,7 +80,7 @@ export default function Profile() {
<Skeleton height={62} mt={10} width={"40%"} /> <Skeleton height={62} mt={10} width={"40%"} />
: :
<> <>
<Text c={'white'} fw={'bold'} fz={25}>{isData?.name}</Text> <Text c={'white'} fw={'bold'} fz={25} ta={"center"}>{isData?.name}</Text>
<Text c={'white'} fw={'lighter'} fz={15}>{isData?.group} - {isData?.position}</Text> <Text c={'white'} fw={'lighter'} fz={15}>{isData?.group} - {isData?.position}</Text>
</> </>
} }