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

style : update style

Browse Source 
Deskripsi:
- update division
- update documents
- update layout

No Issue
This commit is contained in:
lukman
2024-09-04 11:25:24 +08:00
parent 6bebd7dbfa
commit 240e5cd74a
4 changed files with 46 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/module/_global/layout/layout_drawer.tsx
View File

@@ -5,7 +5,7 @@ import { WARNA } from '../fun/WARNA';
export default function LayoutDrawer({ opened, onClose, title, children, size }: { children: React.ReactNode, opened: boolean, size?: string, onClose: () => void, title: React.ReactNode }) { export default function LayoutDrawer({ opened, onClose, title, children, size }: { children: React.ReactNode, opened: boolean, size?: string, onClose: () => void, title: React.ReactNode }) {
return ( return (
<Box> <Box>
<Drawer opened={opened} title={<Text c={WARNA.biruTua} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '35%'} <Drawer opened={opened} title={<Text c={WARNA.biruTua} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'}
styles={{ styles={{
content: { content: {
backgroundColor: "white", backgroundColor: "white",

6
src/module/division_new/ui/list_document.tsx
View File

@@ -67,14 +67,14 @@ export default function ListDocumentOnDetailDivision() {
data.map((v) => data.map((v) =>
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id}>
<UnstyledButton onClick={() => router.push(`/document`)}> <UnstyledButton onClick={() => router.push(`/document`)}>
<Stack gap={0}> <Stack gap={0} w={200}>
<Paper withBorder shadow="sm" radius={12} > <Paper withBorder shadow="sm" radius={12} >
<Center p={"md"}> <Center p={"md"}>
<Image w={"75"} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" /> <Image w={"75"} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" />
</Center> </Center>
</Paper> </Paper>
<Box p={"sm"}> <Box>
<Text c={"dimmed"} truncate="end" ta={"center"}>{v.name + '.' + v.extension}</Text> <Text c={"dimmed"}ta={"center"} lineClamp={1}>{v.name + '.' + v.extension}</Text>
</Box> </Box>
</Stack> </Stack>
</UnstyledButton> </UnstyledButton>

15
src/module/division_new/ui/list_task.tsx
View File

@@ -9,6 +9,7 @@ import { CiClock2 } from "react-icons/ci";
import { funGetDetailDivisionById } from "../lib/api_division"; import { funGetDetailDivisionById } from "../lib/api_division";
import { useState } from "react"; import { useState } from "react";
import { IDataTaskOnDetailDivision } from "../lib/type_division"; import { IDataTaskOnDetailDivision } from "../lib/type_division";
import _ from "lodash";
export default function ListTaskOnDetailDivision() { export default function ListTaskOnDetailDivision() {
@@ -65,20 +66,12 @@ export default function ListTaskOnDetailDivision() {
{data.map((v, i) => {data.map((v, i) =>
<Carousel.Slide key={v.id}> <Carousel.Slide key={v.id}>
<Box p={20} w={{ base: 300, md: 400 }} onClick={() => router.push(`/task/${v.id}`)} bg={WARNA.biruTua} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}> <Box p={20} w={{ base: 300, md: 400 }} onClick={() => router.push(`/task/${v.id}`)} bg={WARNA.biruTua} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }}>
<Text fw={'bold'} c={WARNA.bgWhite} truncate="end">{v.title}</Text> <Text fw={'bold'} c={WARNA.bgWhite} lineClamp={1}>{_.startCase(v.title)}</Text>
<Group justify="space-between" mt={20} c={'#aeaeae'}> <Group justify="space-between" mt={20}>
<Group gap={5} align="center"> <Group gap={5} align="center" c={"#CFCDCD"}>
<CiClock2 size={18} /> <CiClock2 size={18} />
<Text fz={13}>{v.dateStart}</Text> <Text fz={13}>{v.dateStart}</Text>
</Group > </Group >
<Group gap={5} align="center">
{/* <Avatar.Group>
<Avatar>
<MdAccountCircle size={32} color={WARNA.biruTua} />
</Avatar>
<Avatar>+{v.jumlah}</Avatar>
</Avatar.Group> */}
</Group>
</Group> </Group>
</Box> </Box>
</Carousel.Slide> </Carousel.Slide>

55
src/module/document/ui/navbar_document_division.tsx
View File

@@ -308,7 +308,7 @@ export default function NavbarDocumentDivision() {
} }
/> />
<Box> <Box>
<Box p={20} pb={60}> <Box p={20} pb={100}>
<Box> <Box>
<Breadcrumbs separator={<GoChevronRight />} separatorMargin="md" mt="xs" style={{ cursor: 'pointer' }}> <Breadcrumbs separator={<GoChevronRight />} separatorMargin="md" mt="xs" style={{ cursor: 'pointer' }}>
{ {
@@ -327,12 +327,14 @@ export default function NavbarDocumentDivision() {
return ( return (
<Box key={i}> <Box key={i}>
<Box mt={10} mb={10}> <Box mt={10} mb={10}>
<Grid align='center' > <Grid align='center'
<Grid.Col span={10}
>
<Grid.Col span={2}
onClick={() => { onClick={() => {
if (v.category == "FOLDER" && selectedFiles.length == 0 && !dariSelectAll) { if (v.category == "FOLDER" && selectedFiles.length == 0 && !dariSelectAll) {
router.push('?path=' + v.id) router.push('?path=' + v.id)
} else if(v.category == "FILE" && selectedFiles.length == 0 && !dariSelectAll){ } else if (v.category == "FILE" && selectedFiles.length == 0 && !dariSelectAll) {
setExtension(v.extension) setExtension(v.extension)
setIdData(v.id) setIdData(v.id)
setOpenModalView(true) setOpenModalView(true)
@@ -340,41 +342,60 @@ export default function NavbarDocumentDivision() {
}} }}
> >
<Group gap={20}> <Group>
<Box> <Box>
{ {
(v.share) ? (v.share) ?
<Indicator offset={15} withBorder inline color={WARNA.borderBiruMuda} position="bottom-end" label={<FaShare />} size={25}> <Indicator offset={15} withBorder inline color={WARNA.borderBiruMuda} position="bottom-end" label={<FaShare />} size={25}>
{ {
(v.category == "FOLDER") ? (v.category == "FOLDER") ?
<FcFolder size={60} /> : <FcFolder size={50} /> :
(v.extension == "pdf" || v.extension == "csv") ? (v.extension == "pdf" || v.extension == "csv") ?
<FcDocument size={60} /> : <FcDocument size={50} /> :
<FcImageFile size={60} /> <FcImageFile size={50} />
} }
</Indicator> </Indicator>
: :
<> <>
{ {
(v.category == "FOLDER") ? (v.category == "FOLDER") ?
<FcFolder size={60} /> : <FcFolder size={50} /> :
(v.extension == "pdf" || v.extension == "csv") ? (v.extension == "pdf" || v.extension == "csv") ?
<FcDocument size={60} /> : <FcDocument size={50} /> :
<FcImageFile size={60} /> <FcImageFile size={50} />
} }
</> </>
} }
</Box> </Box>
<Flex direction={'column'}>
<Text>{(v.category == "FOLDER") ? v.name : v.name + '.' + v.extension}</Text>
<Text fz={10}>{v.updatedAt}</Text>
</Flex>
</Group> </Group>
</Grid.Col> </Grid.Col>
<Grid.Col span={2}> <Grid.Col span={10}>
<Group justify='flex-end'> <Group justify='space-between' align='center'>
<Flex direction={'column'}
onClick={() => {
if (v.category == "FOLDER" && selectedFiles.length == 0 && !dariSelectAll) {
router.push('?path=' + v.id)
} else if (v.category == "FILE" && selectedFiles.length == 0 && !dariSelectAll) {
setExtension(v.extension)
setIdData(v.id)
setOpenModalView(true)
}
}}
>
<Box w={{
base: 230,
xl: 380,
md: 380,
sm: 380,
xs: 380
}}>
<Text lineClamp={1}>{(v.category == "FOLDER") ? v.name : v.name + '.' + v.extension}</Text>
<Text fz={10}>{v.updatedAt}</Text>
</Box>
</Flex>
<Checkbox <Checkbox
color="teal" color="teal"
radius="lg" radius="lg"