rev: divisi detail

Deskripsi:
- menampilkan file share pada dokumen terkini

No Issues
This commit is contained in:
amel
2025-01-30 16:30:14 +08:00
parent cd3cd6e0c0
commit 293abfb258
3 changed files with 80 additions and 9 deletions

View File

@@ -42,7 +42,8 @@ export interface IDataKalenderOnDetailDivision {
id: string,
name: string,
extension: string,
path: string
path: string,
share:boolean
}
export interface IDataDiscussionOnDetailDivision {

View File

@@ -2,7 +2,7 @@
import { TEMA, } from "@/module/_global";
import { useHookstate } from "@hookstate/core";
import { Carousel } from "@mantine/carousel";
import { Box, Center, Group, Image, Skeleton, Stack, Text, UnstyledButton } from "@mantine/core";
import { Box, Center, Flex, Group, Image, Indicator, Skeleton, Stack, Text, UnstyledButton } from "@mantine/core";
import { useMediaQuery, useShallowEffect } from "@mantine/hooks";
import { useParams, useRouter } from "next/navigation";
import { useState } from "react";
@@ -10,6 +10,7 @@ import toast from "react-hot-toast";
import { funGetDetailDivisionById } from "../lib/api_division";
import * as ICON from '../lib/file_icon';
import { IDataKalenderOnDetailDivision } from "../lib/type_division";
import { FaShare } from "react-icons/fa6";
const iconContainer = (icon: string) => 'data:image/svg+xml;base64,' + btoa(icon)
@@ -44,7 +45,7 @@ export default function ListDocumentOnDetailDivision() {
return (
<Box pt={10}>
<Text c={tema.get().utama} mb={10} fw={'bold'} fz={16}>Dokumen Terbaru</Text>
<Text c={tema.get().utama} mb={10} fw={'bold'} fz={16}>Dokumen Terkini</Text>
<Group justify="center" grow>
{
loading
@@ -70,11 +71,31 @@ export default function ListDocumentOnDetailDivision() {
<Carousel.Slide key={v.id}>
<UnstyledButton onClick={() => router.push(`/division/${param.id}/document?path=${v.path}`)}>
<Stack gap={0} w={isMobile ? 100 : 170}>
<Box bg={"white"} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} >
<Center p={"md"}>
<Image w={isMobile ? 50 : 75} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" />
</Center>
</Box>
{
v.share ?
<Indicator
offset={15}
withBorder
inline
color={'#D6D8F6'}
position="bottom-end"
label={<FaShare />}
size={25}
>
<Box bg={"white"} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} >
<Center p={"md"}>
<Image w={isMobile ? 50 : 75} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" />
</Center>
</Box>
</Indicator>
:
<Box bg={"white"} style={{ borderRadius: 10, border: `1px solid ${"#D6D8F6"}` }} >
<Center p={"md"}>
<Image w={isMobile ? 50 : 75} src={(v.extension == "pdf") ? iconContainer(ICON.PDF) : iconContainer(ICON.IMAGE)} alt="image" />
</Center>
</Box>
}
<Box>
<Text c={"dimmed"} ta={"center"} lineClamp={1} fz={isMobile ? 14 : 16}>{v.name + '.' + v.extension}</Text>
</Box>