Merge pull request #382 from bipproduction/amalia/20-jan-25

Amalia/20 jan 25
This commit is contained in:
Amalia
2025-01-20 15:07:23 +08:00
committed by GitHub
6 changed files with 92 additions and 73 deletions

View File

@@ -2,7 +2,7 @@ import { NextResponse } from "next/server";
export async function GET(request: Request) { export async function GET(request: Request) {
try { try {
return NextResponse.json({ success: true, version: "1.1.1", tahap: "beta", update:"-pdf viewer -jumlah anggota pada grid list divisi" }, { status: 200 }); return NextResponse.json({ success: true, version: "1.1.2", tahap: "beta", update:"-pdf viewer new -jumlah anggota pada grid list divisi" }, { status: 200 });
} catch (error) { } catch (error) {
console.error(error); console.error(error);
return NextResponse.json({ success: false, version: "Gagal mendapatkan version, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 }); return NextResponse.json({ success: false, version: "Gagal mendapatkan version, coba lagi nanti (error: 500)", reason: (error as Error).message, }, { status: 500 });

View File

@@ -7,7 +7,7 @@ import toast from 'react-hot-toast';
import { funReadPdf } from '../fun/read_pdf'; import { funReadPdf } from '../fun/read_pdf';
const PdfToImage = dynamic(() => import('./../components/pdf_viewer').then((mod) => mod.default), { ssr: false }); const PdfToImage = dynamic(() => import('./../components/pdf_viewer').then((mod) => mod.default), { ssr: false });
export default function LayoutModal({ opened, onClose, extension, fitur, file }: { opened: boolean, onClose: () => void, extension: string, fitur: string, file: string }) { export default function LayoutModal({ opened, onClose, extension, fitur, name, file }: { opened: boolean, onClose: () => void, extension: string, fitur: string, name?: string, file: string }) {
const [zoom, setZoom] = useState(1) const [zoom, setZoom] = useState(1)
const [loadingPdf, setLoadingPdf] = useState(true) const [loadingPdf, setLoadingPdf] = useState(true)
const [dataPdf, setDataPdf] = useState([]) const [dataPdf, setDataPdf] = useState([])
@@ -46,80 +46,96 @@ export default function LayoutModal({ opened, onClose, extension, fitur, file }:
}, [file, extension]) }, [file, extension])
return ( return (
<Modal styles={{ <>
content: { <Modal.Root styles={{
maxWidth: 550, content: {
} maxWidth: 550,
}} opened={opened} onClose={onClose} withCloseButton={true} centered closeOnClickOutside={false} fullScreen> }
<Box }} opened={opened} onClose={onClose} centered closeOnClickOutside={false} fullScreen>
pos="sticky" <Modal.Overlay />
top={60} <Modal.Content>
right={10} <Modal.Header py={0}>
w={"100%"} <Modal.Title>
pb={10} <Text lineClamp={1}>{name}</Text>
</Modal.Title>
<Modal.CloseButton />
</Modal.Header>
<Modal.Body pl={0} pr={0}>
<Box
pos="sticky"
top={60}
right={0}
w={"100%"}
pb={10}
px={10}
style={{ style={{
background: 'white', background: 'white',
zIndex: 999, zIndex: 999,
}} }}
> >
<Group justify="space-between"> <Group justify="space-between">
<Flex direction="row" gap="xs" align="center"> <Flex direction="row" gap="xs" align="center">
<Button variant="light" onClick={handleZoomOut}> - </Button> <Button variant="light" onClick={handleZoomOut}> - </Button>
<Button variant="light" onClick={handleZoomIn}> + </Button> <Button variant="light" onClick={handleZoomIn}> + </Button>
</Flex> </Flex>
{ {
extension == "pdf" && extension == "pdf" &&
<Flex direction="row" gap="xs" align="center"> <Flex direction="row" gap="xs" align="center">
<Button variant="light" disabled={page == 1 ? true : false} onClick={() => { getPdfToImg(page - 1) }}> Prev </Button> <Button variant="light" disabled={page == 1 ? true : false} onClick={() => { getPdfToImg(page - 1) }}> Prev </Button>
<Text c={"gray"}> {page} / {totalPage} </Text> <Text c={"gray"}> {page} / {totalPage} </Text>
<Button variant="light" disabled={page == totalPage ? true : false} onClick={() => { getPdfToImg(page + 1) }}> Next </Button> <Button variant="light" disabled={page == totalPage ? true : false} onClick={() => { getPdfToImg(page + 1) }}> Next </Button>
</Flex> </Flex>
} }
</Group> </Group>
</Box> </Box>
<Box pos={"relative"} style={{ <Box pos={"relative"} style={{
transform: `scale(${zoom})`, transform: `scale(${zoom})`,
transformOrigin: 'center', transformOrigin: 'center',
maxWidth: rem(550), maxWidth: rem(550),
}}> paddingLeft: 10,
<div style={{ transform: `scale(${zoom})`, transformOrigin: 'center' }}> paddingRight: 10
{ }}>
extension === 'pdf' ? <div style={{ transform: `scale(${zoom})`, transformOrigin: 'center' }}>
// <PdfToImage md={`https://wibu-storage.wibudev.com/api/files/${file}`} /> {
loadingPdf ? extension === 'pdf' ?
<Stack p="md"> // <PdfToImage md={`https://wibu-storage.wibudev.com/api/files/${file}`} />
{[...Array(1)].map((_, index) => ( loadingPdf ?
<Skeleton key={index} height={500} /> <Stack p="md">
))} {[...Array(1)].map((_, index) => (
</Stack> <Skeleton key={index} height={500} />
: ))}
<> </Stack>
{dataPdf.map((item: any, index: any) => ( :
<>
{dataPdf.map((item: any, index: any) => (
<Image
w={"100%"}
alt={file}
key={index}
src={item.imageUrl}
/>
))}
</>
:
<Image <Image
w={"100%"} style={{
maxWidth: '100%',
maxHeight: '100%',
}}
fit="contain"
src={`https://wibu-storage.wibudev.com/api/files/${file}`}
alt={file} alt={file}
key={index}
src={item.imageUrl}
/> />
))} }
</> </div>
: </Box>
<Image </Modal.Body>
style={{ </Modal.Content>
maxWidth: '100%', </Modal.Root>
maxHeight: '100%', </>
}}
fit="contain"
src={`https://wibu-storage.wibudev.com/api/files/${file}`}
alt={file}
/>
}
</div>
</Box>
</Modal>
); );
} }

View File

@@ -21,6 +21,7 @@ function ListBanner() {
const [openDrawer, setOpenDrawer] = useState(false); const [openDrawer, setOpenDrawer] = useState(false);
const [idDataStorage, setIdDataStorage] = useState('') const [idDataStorage, setIdDataStorage] = useState('')
const [isExtension, setExtension] = useState('') const [isExtension, setExtension] = useState('')
const [isName, setName] = useState('')
const [loading, setLoading] = useState(true) const [loading, setLoading] = useState(true)
const [isData, setData] = useState<IDataBanner[]>([]) const [isData, setData] = useState<IDataBanner[]>([])
const [idData, setIdData] = useState('') const [idData, setIdData] = useState('')
@@ -109,6 +110,7 @@ function ListBanner() {
setIdDataStorage(v.image); setIdDataStorage(v.image);
setExtension(v.extension); setExtension(v.extension);
setOpenDrawer(true) setOpenDrawer(true)
setName(v.title)
} }
} }
style={{ style={{
@@ -194,7 +196,7 @@ function ListBanner() {
} }
}} /> }} />
<LayoutModalViewFile opened={isOpenModalView} onClose={() => setOpenModalView(false)} file={idDataStorage} extension={isExtension} fitur="image" /> <LayoutModalViewFile name={isName} opened={isOpenModalView} onClose={() => setOpenModalView(false)} file={idDataStorage} extension={isExtension} fitur="image" />
</Box> </Box>
); );
} }

View File

@@ -923,6 +923,7 @@ export default function NavbarDocumentDivision() {
file={idStorage} file={idStorage}
extension={isExtension} extension={isExtension}
fitur="dokumen" fitur="dokumen"
name={nameFileFull}
/> />
</Box> </Box>
); );

View File

@@ -279,7 +279,7 @@ export default function ListFileDetailProject() {
} }
}} /> }} />
<LayoutModalViewFile opened={isOpenModalView} onClose={() => setOpenModalView(false)} file={idStorage} extension={isExtension} fitur='project' /> <LayoutModalViewFile opened={isOpenModalView} onClose={() => setOpenModalView(false)} name={nameData} file={idStorage} extension={isExtension} fitur='project' />
</Box> </Box>
</> </>
); );

View File

@@ -259,7 +259,7 @@ export default function ListFileDetailTask() {
} }
}} /> }} />
<LayoutModalViewFile opened={isOpenModalView} onClose={() => setOpenModalView(false)} file={idDataStorage} extension={isExtension} fitur='task' /> <LayoutModalViewFile name={nameData} opened={isOpenModalView} onClose={() => setOpenModalView(false)} file={idDataStorage} extension={isExtension} fitur='task' />
</Box> </Box>
) )
} }