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

rev: file upload ekstensi

Browse Source 
Deskripsi:
- tambah type ekstensi file upload pada project, task divisi dan dokumen divisi

No Issues
This commit is contained in:
amel
2025-01-05 17:15:53 +08:00
parent 8bfd85c49a
commit b2801480aa
10 changed files with 219 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/module/project/ui/add_file_detail_project.tsx
View File

@@ -69,7 +69,6 @@ export default function AddFileDetailProject() {
}
const response = await funAddFileProject(param.id, fd)
console.group(response)
if (response.success) {
setDataRealtime([{
category: "project-detail-file",
@@ -107,7 +106,7 @@ export default function AddFileDetailProject() {
}}
activateOnClick={false}
maxSize={3 * 1024 ** 2}
accept={['image/png', 'image/jpeg', 'image/heic', 'application/pdf']}
accept={['image/png', 'image/jpeg', 'image/heic', 'application/pdf', 'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']}
onReject={(files) => {
return toast.error('File yang diizinkan: .png, .jpg, .heic, .pdf dengan ukuran maksimal 3 MB')
}}

2
src/module/project/ui/create_project.tsx
View File

@@ -413,7 +413,7 @@ export default function CreateProject() {
}}
activateOnClick={false}
maxSize={3 * 1024 ** 2}
accept={['image/png', 'image/jpeg', 'image/heic', 'application/pdf']}
accept={['image/png', 'image/jpeg', 'image/heic', 'application/pdf', 'application/msword', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet']}
onReject={(files) => {
return toast.error('File yang diizinkan: .png, .jpg, .heic, .pdf dengan ukuran maksimal 3 MB')
}}

60
src/module/project/ui/list_file_detail_project.tsx
View File

@@ -7,8 +7,9 @@ import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
import { useParams } from 'next/navigation';
import { useState } from 'react';
import toast from 'react-hot-toast';
import { BsFileTextFill, BsFiletypeCsv, BsFiletypeHeic, BsFiletypeJpg, BsFiletypePdf, BsFiletypePng } from 'react-icons/bs';
import { BsFileTextFill, BsFiletypeCsv, BsFiletypeDocx, BsFiletypeHeic, BsFiletypeJpg, BsFiletypePdf, BsFiletypePng, BsFiletypePptx, BsFiletypeXlsx } from 'react-icons/bs';
import { FaTrash } from 'react-icons/fa6';
import { ImDownload3 } from "react-icons/im";
import { useWibuRealtime } from 'wibu-realtime';
import { funDeleteFileProject, funGetOneProjectById } from '../lib/api_project';
import { IDataFileProject } from '../lib/type_project';
@@ -113,6 +114,28 @@ export default function ListFileDetailProject() {
}
}, [dataRealTime])
const onDownload = async () => {
try {
const fileUrl = `https://wibu-storage.wibudev.com/api/files/${idStorage}`;
const response = await fetch(fileUrl);
const blob = await response.blob();
// Create a link element, use Blob URL
const link = document.createElement("a");
const url = window.URL.createObjectURL(blob);
link.href = url;
link.download = `${nameData}`; // Nama file yang akan diunduh
document.body.appendChild(link);
link.click();
// Cleanup
window.URL.revokeObjectURL(url);
document.body.removeChild(link);
} catch (error) {
alert(error);
}
};
return (
<>
<Box pt={20}>
@@ -167,13 +190,12 @@ export default function ListFileDetailProject() {
}}>
{item.extension == "pdf" && <BsFiletypePdf size={30} />}
{item.extension == "csv" && <BsFiletypeCsv size={30} />}
{item.extension == "png" && <BsFiletypePng size={30} />}
{item.extension == "jpg" && <BsFiletypeJpg size={30} />}
{item.extension == "jpeg" && <BsFiletypeJpg size={30} />}
{item.extension == "PNG" && <BsFiletypePng size={30} />}
{item.extension == "JPG" && <BsFiletypeJpg size={30} />}
{item.extension == "JPEG" && <BsFiletypeJpg size={30} />}
{(item.extension == "png" || item.extension == "PNG") && <BsFiletypePng size={30} />}
{(item.extension == "jpg" || item.extension == "jpeg" || item.extension == "JPG" || item.extension == "JPEG") && <BsFiletypeJpg size={30} />}
{item.extension == "heic" && <BsFiletypeHeic size={30} />}
{(item.extension == "doc" || item.extension == "docx") && <BsFiletypeDocx size={30} />}
{(item.extension == "xls" || item.extension == "xlsx") && <BsFiletypeXlsx size={30} />}
{(item.extension == "ppt" || item.extension == "pptx") && <BsFiletypePptx size={30} />}
</Grid.Col>
<Grid.Col
span={{
@@ -203,15 +225,25 @@ export default function ListFileDetailProject() {
<LayoutDrawer opened={openDrawer} title={<Text truncate="end">{nameData}</Text>} onClose={() => setOpenDrawer(false)}>
<Box>
<Stack pt={10}>
<SimpleGrid
cols={{ base: 3, sm: 3, lg: 3 }}
>
<Flex onClick={() => { setOpenModalView(true) }} justify={'center'} align={'center'} direction={'column'} >
<SimpleGrid cols={{ base: 3, sm: 3, lg: 3 }}>
{
(isExtension != "doc" && isExtension != "docx" && isExtension != "xls" && isExtension != "xlsx" && isExtension != "ppt" && isExtension != "pptx") &&
<Flex onClick={() => { setOpenModalView(true) }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<BsFileTextFill size={30} color={tema.get().utama} />
</Box>
<Box>
<Text c={tema.get().utama}>Lihat file</Text>
</Box>
</Flex>
}
<Flex onClick={() => { onDownload() }} justify={'center'} align={'center'} direction={'column'} >
<Box>
<BsFileTextFill size={30} color={tema.get().utama} />
<ImDownload3 size={30} color={tema.get().utama} />
</Box>
<Box>
<Text c={tema.get().utama}>Lihat file</Text>
<Text c={tema.get().utama}>Download</Text>
</Box>
</Flex>
@@ -227,7 +259,7 @@ export default function ListFileDetailProject() {
<FaTrash size={30} color={reason == null ? tema.get().utama : "gray"} />
</Box>
<Box>
<Text c={reason == null ? tema.get().utama : "gray"}>Hapus file</Text>
<Text c={reason == null ? tema.get().utama : "gray"}>Hapus</Text>
</Box>
</Flex>
}

47
src/module/project/ui/results_file.tsx
View File

@@ -1,10 +1,38 @@
import { Box, Center, Grid, Group, Text } from '@mantine/core';
import React from 'react';
import { BsFiletypeCsv, BsFiletypeHeic, BsFiletypeJpg, BsFiletypePdf, BsFiletypePng } from 'react-icons/bs';
import { useShallowEffect } from '@mantine/hooks';
import { useState } from 'react';
import { BsFiletypeCsv, BsFiletypeDocx, BsFiletypeHeic, BsFiletypeJpg, BsFiletypePdf, BsFiletypePng, BsFiletypePptx, BsFiletypeXlsx } from 'react-icons/bs';
import { IListFileTaskProject } from '../lib/type_project';
export default function ResultsFile({ name, extension }: IListFileTaskProject) {
const [fixed, setFixed] = useState(extension)
function cekExtension() {
let jadi = extension
if (extension == "msword") {
jadi = "doc"
} else if (extension == "vnd.openxmlformats-officedocument.wordprocessingml.document") {
jadi = "docx"
} else if (extension == "vnd.ms-excel") {
jadi = "xls"
} else if (extension == "vnd.openxmlformats-officedocument.spreadsheetml.sheet") {
jadi = "xlsx"
} else if (extension == "vnd.ms-powerpoint") {
jadi = "ppt"
} else if (extension == "vnd.openxmlformats-officedocument.presentationml.presentation") {
jadi = "pptx"
} else {
jadi = extension
}
setFixed(jadi)
}
useShallowEffect(() => {
cekExtension()
}, []);
return (
<Box style={{
borderRadius: 10,
@@ -14,11 +42,14 @@ export default function ResultsFile({ name, extension }: IListFileTaskProject) {
<Grid gutter={"sm"} justify='flex-start' align='flex-start'>
<Grid.Col span={"auto"}>
<Center >
{extension == "pdf" && <BsFiletypePdf size={30} />}
{extension == "csv" && <BsFiletypeCsv size={30} />}
{extension == "png" && <BsFiletypePng size={30} />}
{extension == "jpg" || extension == "jpeg" && <BsFiletypeJpg size={30} />}
{extension == "heic" && <BsFiletypeHeic size={30} />}
{fixed == "pdf" && <BsFiletypePdf size={30} />}
{fixed == "csv" && <BsFiletypeCsv size={30} />}
{fixed == "png" && <BsFiletypePng size={30} />}
{fixed == "jpg" || fixed == "jpeg" && <BsFiletypeJpg size={30} />}
{fixed == "heic" && <BsFiletypeHeic size={30} />}
{fixed == "doc" || fixed == "docx" && <BsFiletypeDocx size={30} />}
{fixed == "xls" || fixed == "xlsx" && <BsFiletypeXlsx size={30} />}
{fixed == "ppt" || fixed == "pptx" && <BsFiletypePptx size={30} />}
</Center>
</Grid.Col>
<Grid.Col span={10}>