fix: download selected image in detail
This commit is contained in:
parent
16c469f72c
commit
035f33250e
|
|
@ -219,55 +219,95 @@ const DetailImage = (data: any) => {
|
|||
await postActivityLog(data);
|
||||
}
|
||||
|
||||
// const handleDownload = () => {
|
||||
// if (downloadProgress === 0) {
|
||||
// if (!imageSizeSelected) {
|
||||
// alert("Please select an image size before downloading.");
|
||||
// return;
|
||||
// }
|
||||
|
||||
// if (!userId) {
|
||||
// router.push("/auth");
|
||||
// } else {
|
||||
// sendActivityLog(2);
|
||||
// sendActivityLog(3);
|
||||
|
||||
// if (isDownloadAll) {
|
||||
// let url: string;
|
||||
// const baseId = slug.split("-")?.[0];
|
||||
|
||||
// // if (type === "1") {
|
||||
// // url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${resolutionSelected}`;
|
||||
// // } else if (type === "2") {
|
||||
// url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${imageSizeSelected}`;
|
||||
// // } else {
|
||||
// // url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}`;
|
||||
// // }
|
||||
|
||||
// downloadFile(url, "FileDownload.zip");
|
||||
// } else {
|
||||
// if (isFromSPIT && main?.url?.includes("spit.humas")) {
|
||||
// downloadFile(`${main?.url}`, `${main.names}`);
|
||||
// } else {
|
||||
// // const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`;
|
||||
// // downloadFile(url, `${main.names}`);
|
||||
// const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=image&resolution=${imageSizeSelected}`;
|
||||
// downloadFile(url, `${main.names}`);
|
||||
// }
|
||||
// }
|
||||
// // } else if (type === "1" && resolutionSelected?.length > 0) {
|
||||
// // if (isFromSPIT && main?.url?.includes("spit.humas")) {
|
||||
// // downloadFile(`${main?.url}`, `${main.names}`);
|
||||
// // } else {
|
||||
// // const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`;
|
||||
// // downloadFile(url, `${main.names}`);
|
||||
// // }
|
||||
// // } else if (type === "2" && imageSizeSelected?.length > 0) {
|
||||
// // const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=image&resolution=${imageSizeSelected}`;
|
||||
// // downloadFile(url, `${main.names}`);
|
||||
// // } else if (type === "3" || type === "4") {
|
||||
// // downloadFile(`${main?.url}`, `${main.names}`);
|
||||
// // }
|
||||
// }
|
||||
// }
|
||||
// };
|
||||
|
||||
const handleDownload = () => {
|
||||
if (downloadProgress === 0) {
|
||||
if (!imageSizeSelected) {
|
||||
alert("Please select an image size before downloading.");
|
||||
if (downloadProgress !== 0) return;
|
||||
|
||||
if (!imageSizeSelected) {
|
||||
alert("Please select an image size before downloading.");
|
||||
return;
|
||||
}
|
||||
|
||||
if (!userId) {
|
||||
router.push("/auth");
|
||||
return;
|
||||
}
|
||||
|
||||
sendActivityLog(2);
|
||||
sendActivityLog(3);
|
||||
|
||||
if (isDownloadAll) {
|
||||
const baseId = slug.split("-")?.[0];
|
||||
const url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${imageSizeSelected}`;
|
||||
downloadFile(url, "FileDownload.zip");
|
||||
} else {
|
||||
const selectedFile = detailDataImage?.files?.[selectedImage];
|
||||
|
||||
if (!selectedFile) {
|
||||
toast({
|
||||
description: "Gambar tidak ditemukan.",
|
||||
variant: "destructive",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!userId) {
|
||||
router.push("/auth");
|
||||
if (isFromSPIT && selectedFile?.url?.includes("spit.humas")) {
|
||||
downloadFile(selectedFile.url, selectedFile.names || "image.jpg");
|
||||
} else {
|
||||
sendActivityLog(2);
|
||||
sendActivityLog(3);
|
||||
|
||||
if (isDownloadAll) {
|
||||
let url: string;
|
||||
const baseId = slug.split("-")?.[0];
|
||||
|
||||
// if (type === "1") {
|
||||
// url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${resolutionSelected}`;
|
||||
// } else if (type === "2") {
|
||||
url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}&resolution=${imageSizeSelected}`;
|
||||
// } else {
|
||||
// url = `${process.env.NEXT_PUBLIC_API}/media/file/download-zip?id=${baseId}`;
|
||||
// }
|
||||
|
||||
downloadFile(url, "FileDownload.zip");
|
||||
} else {
|
||||
if (isFromSPIT && main?.url?.includes("spit.humas")) {
|
||||
downloadFile(`${main?.url}`, `${main.names}`);
|
||||
} else {
|
||||
// const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`;
|
||||
// downloadFile(url, `${main.names}`);
|
||||
const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=image&resolution=${imageSizeSelected}`;
|
||||
downloadFile(url, `${main.names}`);
|
||||
}
|
||||
}
|
||||
// } else if (type === "1" && resolutionSelected?.length > 0) {
|
||||
// if (isFromSPIT && main?.url?.includes("spit.humas")) {
|
||||
// downloadFile(`${main?.url}`, `${main.names}`);
|
||||
// } else {
|
||||
// const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=video&resolution=${resolutionSelected}p`;
|
||||
// downloadFile(url, `${main.names}`);
|
||||
// }
|
||||
// } else if (type === "2" && imageSizeSelected?.length > 0) {
|
||||
// const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${main?.id}&operation=file&type=image&resolution=${imageSizeSelected}`;
|
||||
// downloadFile(url, `${main.names}`);
|
||||
// } else if (type === "3" || type === "4") {
|
||||
// downloadFile(`${main?.url}`, `${main.names}`);
|
||||
// }
|
||||
const url = `${process.env.NEXT_PUBLIC_API}/media/view?id=${selectedFile.id}&operation=file&type=image&resolution=${imageSizeSelected}`;
|
||||
downloadFile(url, selectedFile.names || "image.jpg");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
@ -552,7 +592,23 @@ const DetailImage = (data: any) => {
|
|||
<Skeleton className="rounded-lg w-[120px] h-[90px]" />
|
||||
</div>
|
||||
) : (
|
||||
<div className="py-4 flex flex-row gap-3">
|
||||
// <div className="py-4 flex flex-row gap-3">
|
||||
// {detailDataImage?.files?.map((file: any, index: number) => (
|
||||
// <a onClick={() => setSelectedImage(index)} key={file?.id}>
|
||||
// <Image
|
||||
// placeholder={`data:image/svg+xml;base64,${toBase64(
|
||||
// shimmer(700, 475)
|
||||
// )}`}
|
||||
// width={1920}
|
||||
// height={1080}
|
||||
// alt="image-small"
|
||||
// src={file?.url}
|
||||
// className="w-[120px] h-[90px] object-cover rounded-md cursor-pointer hover:ring-2 hover:ring-red-600"
|
||||
// />
|
||||
// </a>
|
||||
// ))}
|
||||
// </div>
|
||||
<div className="py-4 px-1 flex flex-row gap-3 flex-wrap">
|
||||
{detailDataImage?.files?.map((file: any, index: number) => (
|
||||
<a onClick={() => setSelectedImage(index)} key={file?.id}>
|
||||
<Image
|
||||
|
|
@ -563,7 +619,9 @@ const DetailImage = (data: any) => {
|
|||
height={1080}
|
||||
alt="image-small"
|
||||
src={file?.url}
|
||||
className="w-[120px] h-[90px] object-cover rounded-md cursor-pointer hover:ring-2 hover:ring-red-600"
|
||||
className={`w-[120px] h-[90px] object-cover rounded-md cursor-pointer hover:ring-2 ${
|
||||
selectedImage === index ? "ring-2 ring-red-600" : ""
|
||||
}`}
|
||||
/>
|
||||
</a>
|
||||
))}
|
||||
|
|
|
|||
Loading…
Reference in New Issue