mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix:penugasan redirect, approval image

This commit is contained in:
Rama Priyanto 2025-06-09 14:16:37 +07:00
parent 30a97afcfb
commit 8515a9956e
4 changed files with 222 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
components/form/content/image-detail-form.tsx
View File

@ -66,6 +66,7 @@ import { UnitMapping } from "@/app/[locale]/(protected)/contributor/agenda-setti
import SuggestionModal from "@/components/modal/suggestions-modal"; import SuggestionModal from "@/components/modal/suggestions-modal";
import { formatDateToIndonesian } from "@/utils/globals"; import { formatDateToIndonesian } from "@/utils/globals";
import ApprovalHistoryModal from "@/components/modal/approval-history-modal"; import ApprovalHistoryModal from "@/components/modal/approval-history-modal";
import Image from "next/image";
const imageSchema = z.object({ const imageSchema = z.object({
title: z.string().min(1, { message: "Judul diperlukan" }), title: z.string().min(1, { message: "Judul diperlukan" }),
@ -437,6 +438,22 @@ export default function FormImageDetail() {
successCallback(); successCallback();
}; };
const [portraitMap, setPortraitMap] = useState<any>({});
const handleImageLoad = (e: any, index: number) => {
const { naturalWidth, naturalHeight } = e.target;
const isPortrait = naturalHeight > naturalWidth;
setPortraitMap((prev: any) => ({
...prev,
[index]: isPortrait,
}));
};
useEffect(() => {
console.log("portrai", portraitMap);
}, [portraitMap]);
return ( return (
<form> <form>
{detail !== undefined ? ( {detail !== undefined ? (
@ -513,19 +530,19 @@ export default function FormImageDetail() {
thumbs={{ swiper: thumbsSwiper }} thumbs={{ swiper: thumbsSwiper }}
modules={[FreeMode, Navigation, Thumbs]} modules={[FreeMode, Navigation, Thumbs]}
navigation={false} navigation={false}
className="w-full" className="h-[480px] object-cover w-full"
> >
{detailThumb?.map((data: any) => ( {detailThumb?.map((data: any) => (
<SwiperSlide key={data.id}> <SwiperSlide key={data.id}>
<img <img
className="object-fill h-full w-full rounded-md" className="h-[480px] max-w-[600px] rounded-md object-cover mx-auto border-2"
src={data} src={data}
alt={` ${data.id}`} alt={` ${data.id}`}
/> />
</SwiperSlide> </SwiperSlide>
))} ))}
</Swiper> </Swiper>
<div className=" mt-2 "> <div className="mt-2 mx-auto min-w-fit max-w-[600px]">
<Swiper <Swiper
onSwiper={setThumbsSwiper} onSwiper={setThumbsSwiper}
slidesPerView={6} slidesPerView={6}
@ -539,7 +556,7 @@ export default function FormImageDetail() {
{detailThumb?.map((data: any) => ( {detailThumb?.map((data: any) => (
<SwiperSlide key={data.id}> <SwiperSlide key={data.id}>
<img <img
className="object-cover h-[60px] w-[80px]" className="object-cover h-[60px] w-[80px] border-2 border-slate-100"
src={data} src={data}
alt={` ${data.id}`} alt={` ${data.id}`}
/> />
@ -579,11 +596,11 @@ export default function FormImageDetail() {
</div> </div>
<div className="mt-3 px-3 space-y-2"> <div className="mt-3 px-3 space-y-2">
<Label>{t("preview")}</Label> <Label>{t("preview")}</Label>
<Card className="mt-2"> <Card className="mt-2 w-fit">
<img <img
src={detail.thumbnailLink} src={detail.thumbnailLink}
alt="Thumbnail Gambar Utama" alt="Thumbnail Gambar Utama"
className="w-full h-auto rounded" className="h-[200px] rounded"
/> />
</Card> </Card>
</div> </div>
@ -699,17 +716,28 @@ export default function FormImageDetail() {
)} */} )} */}
<Dialog open={modalOpen} onOpenChange={setModalOpen}> <Dialog open={modalOpen} onOpenChange={setModalOpen}>
<DialogContent className="min-w-max h-[600px] overflow-y-auto"> <DialogContent size="md" className="max-h-[600px]">
<DialogHeader> <DialogHeader>
<DialogTitle>{t("leave-comment")}</DialogTitle> <DialogTitle>{t("leave-comment")}</DialogTitle>
</DialogHeader> </DialogHeader>
<div className="flex flex-col gap-2 max-h-[208px] md:max-h-[312px] overflow-y-auto">
{status == "2" {status == "2"
? files?.map((file, index) => ( ? files?.map((file, index) => (
<div <div
key={file.id} key={file.id}
className="flex flex-row gap-2 items-center" className="flex flex-row gap-5 items-center w-full"
> >
<img src={file.url} className="w-[200px]" /> <div className="w-[200px] h-[100px] flex justify-center items-center">
<img
key={index}
alt={`files-${index + 1}`}
src={file.url}
onLoad={(e) => handleImageLoad(e, index)}
className={`h-[100px] object-cover ${
portraitMap[index] ? "w-auto" : "!w-[200px]"
}`}
/>
</div>
<div className="flex flex-col gap-2 w-full"> <div className="flex flex-col gap-2 w-full">
<div className="flex justify-between text-sm"> <div className="flex justify-between text-sm">
{file.fileName} {file.fileName}
@ -748,7 +776,11 @@ export default function FormImageDetail() {
"mabes" "mabes"
)} )}
onCheckedChange={(e) => onCheckedChange={(e) =>
setupPlacement(index, "mabes", Boolean(e)) setupPlacement(
index,
"mabes",
Boolean(e)
)
} }
/> />
<label <label
@ -765,7 +797,11 @@ export default function FormImageDetail() {
"polda" "polda"
)} )}
onCheckedChange={(e) => onCheckedChange={(e) =>
setupPlacement(index, "polda", Boolean(e)) setupPlacement(
index,
"polda",
Boolean(e)
)
} }
/> />
<label <label
@ -812,6 +848,7 @@ export default function FormImageDetail() {
</div> </div>
)) ))
: ""} : ""}
</div>
<div className="flex flex-col gap-4"> <div className="flex flex-col gap-4">
<Textarea <Textarea
placeholder="Type your message here." placeholder="Type your message here."
@ -821,7 +858,8 @@ export default function FormImageDetail() {
</div> </div>
{status == "3" || status == "4" ? ( {status == "3" || status == "4" ? (
<div className="flex flex-row gap-2"> <div className="flex flex-row gap-2">
<Badge <Button
size="sm"
color={ color={
description === "Kualitas media kurang baik" description === "Kualitas media kurang baik"
? "primary" ? "primary"
@ -833,9 +871,10 @@ export default function FormImageDetail() {
} }
> >
Kualitas media kurang baik Kualitas media kurang baik
</Badge> </Button>
<Badge <Button
size="sm"
color={ color={
description === "Deskripsi kurang lengkap" description === "Deskripsi kurang lengkap"
? "primary" ? "primary"
@ -847,8 +886,9 @@ export default function FormImageDetail() {
} }
> >
Deskripsi kurang lengkap Deskripsi kurang lengkap
</Badge> </Button>
<Badge <Button
size="sm"
color={ color={
description === "Judul kurang tepat" description === "Judul kurang tepat"
? "primary" ? "primary"
@ -858,11 +898,12 @@ export default function FormImageDetail() {
onClick={() => setDescription("Judul kurang tepat")} onClick={() => setDescription("Judul kurang tepat")}
> >
Judul kurang tepat Judul kurang tepat
</Badge> </Button>
</div> </div>
) : ( ) : (
<div className="flex flex-row gap-2"> <div className="flex flex-row gap-2">
<Badge <Button
size="sm"
color={ color={
description === "Konten sangat bagus" description === "Konten sangat bagus"
? "primary" ? "primary"
@ -872,8 +913,9 @@ export default function FormImageDetail() {
onClick={() => setDescription("Konten sangat bagus")} onClick={() => setDescription("Konten sangat bagus")}
> >
Konten sangat bagus Konten sangat bagus
</Badge> </Button>
<Badge <Button
size="sm"
color={ color={
description === "Konten menarik" description === "Konten menarik"
? "primary" ? "primary"
@ -883,10 +925,12 @@ export default function FormImageDetail() {
onClick={() => setDescription("Konten menarik")} onClick={() => setDescription("Konten menarik")}
> >
Konten menarik Konten menarik
</Badge> </Button>
</div> </div>
)} )}
<DialogFooter> <DialogFooter>
<div className="flex flex-row gap-2 justify-end">
{" "}
<Button <Button
type="button" type="button"
color="primary" color="primary"
@ -903,6 +947,7 @@ export default function FormImageDetail() {
> >
{t("cancel")} {t("cancel")}
</Button> </Button>
</div>
</DialogFooter> </DialogFooter>
</DialogContent> </DialogContent>
</Dialog> </Dialog>

8
components/form/task/task-detail-form.tsx
View File

@ -1361,20 +1361,22 @@ export default function FormTaskDetail() {
<div className="mt-4"> <div className="mt-4">
<Label>Link Url</Label> <Label>Link Url</Label>
{urlInputs.map((url: any, index: any) => ( {urlInputs.map((url: any, index: any) => (
<div <Link
key={url.id} key={url.id}
href={url}
target="_blank"
className="flex items-center gap-2 mt-2" className="flex items-center gap-2 mt-2"
> >
<input <input
type="url" type="url"
className="border rounded p-2 w-full" className="border rounded p-2 w-full cursor-pointer"
value={url} value={url}
// onChange={(e) => // onChange={(e) =>
// handleLinkChange(index, e.target.value) // handleLinkChange(index, e.target.value)
// } // }
placeholder={`Masukkan link berita ${index + 1}`} placeholder={`Masukkan link berita ${index + 1}`}
/> />
</div> </Link>
))} ))}
</div> </div>
</div> </div>

18
components/form/task/task-form.tsx
View File

@ -36,7 +36,7 @@ import { ChevronDown, ChevronUp, Trash2 } from "lucide-react";
import { AudioRecorder } from "react-audio-voice-recorder"; import { AudioRecorder } from "react-audio-voice-recorder";
import FileUploader from "@/components/form/shared/file-uploader"; import FileUploader from "@/components/form/shared/file-uploader";
import { Upload } from "tus-js-client"; import { Upload } from "tus-js-client";
import { error } from "@/config/swal"; import { close, error } from "@/config/swal";
import { getCsrfToken } from "@/service/auth"; import { getCsrfToken } from "@/service/auth";
import { loading } from "@/lib/swal"; import { loading } from "@/lib/swal";
import { useTranslations } from "next-intl"; import { useTranslations } from "next-intl";
@ -320,28 +320,31 @@ export default function FormTask() {
loading(); loading();
if (imageFiles?.length == 0) { if (imageFiles?.length == 0) {
setIsImageUploadFinish(true); setIsImageUploadFinish(true);
} } else {
imageFiles?.map(async (item: any, index: number) => { imageFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "1", "0"); await uploadResumableFile(index, String(id), item, "1", "0");
}); });
}
if (videoFiles?.length == 0) { if (videoFiles?.length == 0) {
setIsVideoUploadFinish(true); setIsVideoUploadFinish(true);
} } else {
videoFiles?.map(async (item: any, index: number) => { videoFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "2", "0"); await uploadResumableFile(index, String(id), item, "2", "0");
}); });
}
if (textFiles?.length == 0) { if (textFiles?.length == 0) {
setIsTextUploadFinish(true); setIsTextUploadFinish(true);
} } else {
textFiles?.map(async (item: any, index: number) => { textFiles?.map(async (item: any, index: number) => {
await uploadResumableFile(index, String(id), item, "3", "0"); await uploadResumableFile(index, String(id), item, "3", "0");
}); });
}
if (audioFiles?.length == 0) { if (audioFiles?.length == 0) {
setIsAudioUploadFinish(true); setIsAudioUploadFinish(true);
} } else {
audioFiles.map(async (item: FileWithPreview, index: number) => { audioFiles.map(async (item: FileWithPreview, index: number) => {
await uploadResumableFile( await uploadResumableFile(
index, index,
@ -351,6 +354,8 @@ export default function FormTask() {
"0" // Optional: Replace with actual duration if available "0" // Optional: Replace with actual duration if available
); );
}); });
}
close();
}; };
const onSubmit = (data: TaskSchema) => { const onSubmit = (data: TaskSchema) => {
@ -479,7 +484,8 @@ export default function FormTask() {
successTodo(); successTodo();
if (fileTypeId == "1") { if (fileTypeId == "1") {
setIsImageUploadFinish(true); setIsImageUploadFinish(true);
} else if (fileTypeId == "2") { }
if (fileTypeId == "2") {
setIsVideoUploadFinish(true); setIsVideoUploadFinish(true);
} }
if (fileTypeId == "3") { if (fileTypeId == "3") {

19
components/partials/auth/login-form.tsx
View File

@ -281,16 +281,17 @@ const LoginForm = () => {
return false; return false;
} }
const msg = response?.data?.message; const msg = response?.data?.message;
if (msg == "Continue to setup email") {
setStep(2);
} else if (msg == "Email is valid and OTP has been sent") {
setStep(3);
} else if (msg == "Username & password valid") {
onSubmit(data); onSubmit(data);
} else {
error("Username / password incorrect"); // if (msg == "Continue to setup email") {
} // setStep(2);
// } else if (msg == "Email is valid and OTP has been sent") {
// setStep(3);
// } else if (msg == "Username & password valid") {
// onSubmit(data);
// } else {
// error("Username / password incorrect");
// }
// else { // else {
// setStep(1); // setStep(1);
// } // }