style : update style

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

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 }) {
return (
<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={{
content: {
backgroundColor: "white",

View File

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

View File

@@ -9,6 +9,7 @@ import { CiClock2 } from "react-icons/ci";
import { funGetDetailDivisionById } from "../lib/api_division";
import { useState } from "react";
import { IDataTaskOnDetailDivision } from "../lib/type_division";
import _ from "lodash";
export default function ListTaskOnDetailDivision() {
@@ -65,20 +66,12 @@ export default function ListTaskOnDetailDivision() {
{data.map((v, i) =>
<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"}` }}>
<Text fw={'bold'} c={WARNA.bgWhite} truncate="end">{v.title}</Text>
<Group justify="space-between" mt={20} c={'#aeaeae'}>
<Group gap={5} align="center">
<Text fw={'bold'} c={WARNA.bgWhite} lineClamp={1}>{_.startCase(v.title)}</Text>
<Group justify="space-between" mt={20}>
<Group gap={5} align="center" c={"#CFCDCD"}>
<CiClock2 size={18} />
<Text fz={13}>{v.dateStart}</Text>
</Group >
<Group gap={5} align="center">
{/* <Avatar.Group>
<Avatar>
<MdAccountCircle size={32} color={WARNA.biruTua} />
</Avatar>
<Avatar>+{v.jumlah}</Avatar>
</Avatar.Group> */}
</Group>
</Group>
</Box>
</Carousel.Slide>

View File

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