update table agent,banner,promotion,galery,product and approve flow
This commit is contained in:
parent
5579ad8c20
commit
c2c08a1c4e
|
|
@ -8,14 +8,39 @@ import {
|
|||
DialogFooter,
|
||||
} from "@/components/ui/dialog";
|
||||
import Image from "next/image";
|
||||
import { CheckCircle } from "lucide-react";
|
||||
import { Check, CheckCheck, CheckCircle, Clock, X } from "lucide-react";
|
||||
import { useEffect, useState } from "react";
|
||||
import { getGaleryFileData } from "@/service/galery";
|
||||
import { approveGalery, getGaleryFileData } from "@/service/galery";
|
||||
import { convertDateFormat } from "@/utils/global";
|
||||
import { Button } from "../ui/button";
|
||||
import { useRouter } from "next/navigation";
|
||||
import Cookies from "js-cookie";
|
||||
import { error, loading, success } from "@/config/swal";
|
||||
|
||||
export function DialogDetailGaleri({ open, onClose, data }: any) {
|
||||
const [images, setImages] = useState<any[]>([]);
|
||||
const [openApproverHistory, setOpenApproverHistory] = useState(false);
|
||||
const [userLevelId, setUserLevelId] = useState<string | null>(null);
|
||||
const [openViewDialog, setOpenViewDialog] = useState(false);
|
||||
const router = useRouter();
|
||||
|
||||
// 🔹 Ambil userlevelId dari cookies
|
||||
useEffect(() => {
|
||||
const ulne = Cookies.get("ulne"); // contoh: "3"
|
||||
setUserLevelId(ulne ?? null);
|
||||
}, []);
|
||||
|
||||
const [openCommentModal, setOpenCommentModal] = useState(false);
|
||||
const [commentValue, setCommentValue] = useState("");
|
||||
|
||||
const handleSubmitComment = async () => {
|
||||
// await api.post("/banner/comment", {
|
||||
// bannerId: viewBanner.id,
|
||||
// comment: commentValue,
|
||||
// });
|
||||
|
||||
setOpenCommentModal(false);
|
||||
};
|
||||
const fetchImages = async () => {
|
||||
try {
|
||||
const res = await getGaleryFileData(data.id);
|
||||
|
|
@ -44,6 +69,21 @@ export function DialogDetailGaleri({ open, onClose, data }: any) {
|
|||
setOpenApproverHistory(true);
|
||||
};
|
||||
|
||||
const handleApproveGalery = async (id: number) => {
|
||||
loading();
|
||||
const res = await approveGalery(id);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message || "Gagal menyetujui galeri");
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
close();
|
||||
success("Galeri berhasil disetujui");
|
||||
fetchImages(); // refresh table
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Dialog open={open} onOpenChange={onClose}>
|
||||
|
|
@ -107,43 +147,59 @@ export function DialogDetailGaleri({ open, onClose, data }: any) {
|
|||
|
||||
{/* Timeline */}
|
||||
<div>
|
||||
<p className="font-medium text-sm text-gray-700 mb-2">
|
||||
<h4 className="text-sm font-semibold text-gray-700 mb-3">
|
||||
Status Timeline
|
||||
</p>
|
||||
</h4>
|
||||
|
||||
<div className="flex flex-col gap-3">
|
||||
<div className="flex items-start gap-3">
|
||||
<CheckCircle className="text-green-600" />
|
||||
<div className="space-y-4">
|
||||
<div className="flex gap-3">
|
||||
<div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-semibold">Diupload Oleh :</p>
|
||||
<p className="text-gray-500 text-sm">
|
||||
{new Date(data.created_at).toLocaleString("id-ID")}
|
||||
<p className="font-medium text-gray-800">
|
||||
Diupload oleh Operator
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-start gap-3">
|
||||
<CheckCircle className="text-green-600" />
|
||||
<div>
|
||||
<p className="font-semibold">Disetujui Oleh :</p>
|
||||
<p className="text-gray-500 text-sm">
|
||||
{new Date(data.created_at).toLocaleString("id-ID")}
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(data?.created_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{data.approved_at && (
|
||||
<div className="flex items-start gap-3">
|
||||
<CheckCircle className="text-green-600" />
|
||||
<div>
|
||||
<p className="font-semibold">Disetujui oleh Approver</p>
|
||||
<p className="text-gray-500 text-sm">
|
||||
{new Date(data.approved_at).toLocaleString("id-ID")}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-3">
|
||||
<div
|
||||
className={`w-6 h-6 rounded-full flex items-center justify-center ${
|
||||
data?.status_id === 1
|
||||
? "bg-yellow-100"
|
||||
: data?.status_id === 2
|
||||
? "bg-green-100"
|
||||
: "bg-red-100"
|
||||
}`}
|
||||
>
|
||||
{data?.status_id === 1 ? (
|
||||
<Clock className="w-4 h-4 text-yellow-700" />
|
||||
) : data?.status_id === 2 ? (
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
) : (
|
||||
<X className="w-4 h-4 text-red-700" />
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
{data?.status_id === 1
|
||||
? "Menunggu disetujui oleh Approver"
|
||||
: data?.status_id === 2
|
||||
? "Disetujui oleh Approver"
|
||||
: "Ditolak oleh Approver"}
|
||||
</p>
|
||||
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(data?.updated_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="border rounded-lg px-3 py-3">
|
||||
<p>Comment : </p>
|
||||
<div className="flex flex-row justify-between">
|
||||
|
|
@ -157,6 +213,63 @@ export function DialogDetailGaleri({ open, onClose, data }: any) {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{openViewDialog && userLevelId !== "2" && (
|
||||
<div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
|
||||
{data.status_id === 1 ? (
|
||||
<>
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="bg-blue-200 hover:bg-blue-400"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setOpenCommentModal(true);
|
||||
}}
|
||||
>
|
||||
Beri Tanggapan
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
className=" w-[180]"
|
||||
variant="destructive"
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleReject();
|
||||
// }}
|
||||
>
|
||||
Reject
|
||||
</Button>
|
||||
|
||||
{userLevelId === "1" && (
|
||||
<Button
|
||||
// variant="ghost"
|
||||
size="sm"
|
||||
className="bg-green-600 hover:bg-green-700 text-white w-[180]"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleApproveGalery(data.id);
|
||||
}}
|
||||
>
|
||||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="mx-auto"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setOpenViewDialog(false);
|
||||
}}
|
||||
>
|
||||
Tutup
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* <DialogFooter className="px-6 pb-6">
|
||||
<button
|
||||
|
|
|
|||
|
|
@ -7,8 +7,20 @@ import {
|
|||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import { CheckCircle2, FileText } from "lucide-react";
|
||||
import { getPromotionById } from "@/service/promotion";
|
||||
import {
|
||||
Check,
|
||||
CheckCheck,
|
||||
CheckCircle2,
|
||||
Clock,
|
||||
FileText,
|
||||
X,
|
||||
} from "lucide-react";
|
||||
import { approvePromotion, getPromotionById } from "@/service/promotion";
|
||||
import { convertDateFormat } from "@/utils/global";
|
||||
import { Button } from "../ui/button";
|
||||
import { useRouter } from "next/navigation";
|
||||
import Cookies from "js-cookie";
|
||||
import { error, loading, success } from "@/config/swal";
|
||||
|
||||
type PromoDetailDialogProps = {
|
||||
promoId: number | null;
|
||||
|
|
@ -21,10 +33,20 @@ export default function PromoDetailDialog({
|
|||
open,
|
||||
onOpenChange,
|
||||
}: PromoDetailDialogProps) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [loadingData, setLoadingData] = useState(false);
|
||||
const [promo, setPromo] = useState<any>(null);
|
||||
const [openApproverHistory, setOpenApproverHistory] = useState(false);
|
||||
|
||||
const [userLevelId, setUserLevelId] = useState<string | null>(null);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// 🔹 Ambil userlevelId dari cookies
|
||||
useEffect(() => {
|
||||
const ulne = Cookies.get("ulne"); // contoh: "3"
|
||||
setUserLevelId(ulne ?? null);
|
||||
}, []);
|
||||
|
||||
// FORMAT TANGGAL → DD-MM-YYYY
|
||||
const formatDate = (dateStr: string) => {
|
||||
const d = new Date(dateStr);
|
||||
|
|
@ -37,17 +59,37 @@ export default function PromoDetailDialog({
|
|||
const handleOpenApproverHistory = () => {
|
||||
setOpenApproverHistory(true);
|
||||
};
|
||||
|
||||
const handleApprovePromotion = async (promoId: number) => {
|
||||
loading();
|
||||
const res = await approvePromotion(promoId);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message || "Gagal menyetujui promotion");
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
close();
|
||||
success("Promotion berhasil disetujui");
|
||||
// fetchData(); // refresh table
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!promoId || !open) return;
|
||||
|
||||
async function fetchData() {
|
||||
try {
|
||||
setLoading(true);
|
||||
setLoadingData(true);
|
||||
const res = await getPromotionById(promoId);
|
||||
|
||||
// Mapping ke format dialog
|
||||
const mapped = {
|
||||
id: res?.data?.data?.id,
|
||||
title: res?.data?.data?.title,
|
||||
status_id: res?.data?.data?.status_id,
|
||||
created_at: res?.data?.data?.created_at,
|
||||
updated_at: res?.data?.data?.updated_at,
|
||||
fileSize: "Tidak diketahui",
|
||||
uploadDate: formatDate(res?.data?.data?.created_at),
|
||||
status: res?.data?.data?.is_active ? "Aktif" : "Nonaktif",
|
||||
|
|
@ -75,19 +117,32 @@ export default function PromoDetailDialog({
|
|||
} catch (err) {
|
||||
console.error("ERROR FETCH PROMO:", err);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setLoadingData(false);
|
||||
}
|
||||
}
|
||||
|
||||
fetchData();
|
||||
}, [promoId, open]);
|
||||
|
||||
const [openCommentModal, setOpenCommentModal] = useState(false);
|
||||
const [commentValue, setCommentValue] = useState("");
|
||||
const [openViewDialog, setOpenViewDialog] = useState(false);
|
||||
|
||||
if (!open) return null;
|
||||
|
||||
const handleSubmitComment = async () => {
|
||||
// await api.post("/banner/comment", {
|
||||
// bannerId: promo.id,
|
||||
// comment: commentValue,
|
||||
// });
|
||||
|
||||
setOpenCommentModal(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent className="p-0 max-w-xl overflow-hidden rounded-2xl">
|
||||
<DialogContent className="p-0 max-w-lg overflow-hidden">
|
||||
{/* HEADER */}
|
||||
<div className="bg-gradient-to-r from-[#0f6c75] to-[#145f66] text-white px-6 py-5 relative">
|
||||
<DialogHeader>
|
||||
|
|
@ -107,7 +162,7 @@ export default function PromoDetailDialog({
|
|||
|
||||
{/* BODY */}
|
||||
<div className="p-6">
|
||||
{loading ? (
|
||||
{loadingData ? (
|
||||
<p className="text-Start text-gray-600">Memuat data...</p>
|
||||
) : promo ? (
|
||||
<>
|
||||
|
|
@ -133,28 +188,61 @@ export default function PromoDetailDialog({
|
|||
</div>
|
||||
|
||||
{/* TIMELINE */}
|
||||
<div className="mt-4">
|
||||
<p className="text-gray-600 mb-3 font-medium">
|
||||
<div>
|
||||
<h4 className="text-sm font-semibold text-gray-700 mb-3">
|
||||
Status Timeline
|
||||
</p>
|
||||
</h4>
|
||||
|
||||
<div className="space-y-4">
|
||||
{promo.timeline.map((item: any, idx: number) => (
|
||||
<div key={idx} className="flex gap-3 items-start">
|
||||
<CheckCircle2
|
||||
size={20}
|
||||
className="text-green-600 shrink-0"
|
||||
/>
|
||||
<div className="flex gap-3">
|
||||
<div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-medium">{item.label}</p>
|
||||
<p className="text-gray-600 text-sm">
|
||||
{item.date} • {item.time} WIB
|
||||
<p className="font-medium text-gray-800">
|
||||
Diupload oleh Operator
|
||||
</p>
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(promo?.created_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
<div className="flex gap-3">
|
||||
<div
|
||||
className={`w-6 h-6 rounded-full flex items-center justify-center ${
|
||||
promo?.status_id === 1
|
||||
? "bg-yellow-100"
|
||||
: promo?.status_id === 2
|
||||
? "bg-green-100"
|
||||
: "bg-red-100"
|
||||
}`}
|
||||
>
|
||||
{promo?.status_id === 1 ? (
|
||||
<Clock className="w-4 h-4 text-yellow-700" />
|
||||
) : promo?.status_id === 2 ? (
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
) : (
|
||||
<X className="w-4 h-4 text-red-700" />
|
||||
)}
|
||||
</div>
|
||||
<div className="border rounded-lg px-3 py-3 mt-3">
|
||||
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
{promo?.status_id === 1
|
||||
? "Menunggu disetujui oleh Approver"
|
||||
: promo?.status_id === 2
|
||||
? "Disetujui oleh Approver"
|
||||
: "Ditolak oleh Approver"}
|
||||
</p>
|
||||
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(promo?.updated_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="border rounded-lg px-3 py-3">
|
||||
<p>Comment : </p>
|
||||
<div className="flex flex-row justify-between">
|
||||
<button
|
||||
|
|
@ -168,11 +256,67 @@ export default function PromoDetailDialog({
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<p className="text-center text-gray-600">Data tidak ditemukan</p>
|
||||
)}
|
||||
</div>
|
||||
{userLevelId !== "2" && promo && (
|
||||
<div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
|
||||
{promo.status_id === 1 ? (
|
||||
<>
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="bg-blue-200 hover:bg-blue-400"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setOpenCommentModal(true);
|
||||
}}
|
||||
>
|
||||
Beri Tanggapan
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
className=" w-[150]"
|
||||
variant="destructive"
|
||||
// onClick={(e) => {
|
||||
// e.stopPropagation();
|
||||
// handleReject();
|
||||
// }}
|
||||
>
|
||||
Reject
|
||||
</Button>
|
||||
|
||||
{userLevelId === "1" && (
|
||||
<Button
|
||||
// variant="ghost"
|
||||
size="sm"
|
||||
className="bg-green-600 hover:bg-green-700 text-white w-[150]"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleApprovePromotion(promo.id);
|
||||
}}
|
||||
>
|
||||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="mx-auto"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
setOpenViewDialog(false);
|
||||
}}
|
||||
>
|
||||
Tutup
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{openApproverHistory && (
|
||||
<div
|
||||
className="fixed inset-0 z-[60] flex items-center justify-center bg-black/50 p-4"
|
||||
|
|
@ -271,7 +415,7 @@ export default function PromoDetailDialog({
|
|||
</div>
|
||||
</div>
|
||||
)}
|
||||
{/* FOOTER */}
|
||||
{/* FOOTER
|
||||
<div className="bg-[#E3EFF4] text-center py-3">
|
||||
<button
|
||||
onClick={() => onOpenChange(false)}
|
||||
|
|
@ -279,7 +423,7 @@ export default function PromoDetailDialog({
|
|||
>
|
||||
Tutup
|
||||
</button>
|
||||
</div>
|
||||
</div> */}
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
{openApproverHistory && (
|
||||
|
|
@ -380,6 +524,76 @@ export default function PromoDetailDialog({
|
|||
</div>
|
||||
</div>
|
||||
)}
|
||||
{openCommentModal && promo && (
|
||||
<div
|
||||
className="fixed inset-0 z-[60] flex items-center justify-center bg-black/50 p-4"
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
>
|
||||
<div
|
||||
className="bg-white rounded-2xl shadow-2xl max-w-lg w-full overflow-hidden"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{/* HEADER */}
|
||||
<div className="bg-gradient-to-br from-[#1F6779] to-[#0F6C75] text-white px-6 py-5 relative">
|
||||
<button
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
className="absolute top-4 right-4 text-white/80 hover:text-white text-xl"
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
|
||||
<h2 className="text-lg font-semibold">Beri Tanggapan</h2>
|
||||
|
||||
{/* Badge */}
|
||||
<div className="flex items-center gap-2 mt-3">
|
||||
<span className="bg-yellow-100 text-yellow-800 text-xs font-medium px-3 py-1 rounded-full">
|
||||
Menunggu
|
||||
</span>
|
||||
|
||||
<span className="bg-white text-[#0F6C75] text-xs font-medium px-3 py-1 rounded-full">
|
||||
Banner
|
||||
</span>
|
||||
|
||||
<span className="bg-white/20 text-white text-xs px-2 py-[2px] rounded-full">
|
||||
{promo.position}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* BODY */}
|
||||
<div className="p-6 space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-500 mb-2">
|
||||
Comment
|
||||
</label>
|
||||
<textarea
|
||||
value={commentValue}
|
||||
onChange={(e) => setCommentValue(e.target.value)}
|
||||
placeholder="Masukkan komentar"
|
||||
className="w-full min-h-[100px] border rounded-lg p-3 focus:outline-none focus:ring-2 focus:ring-[#0F6C75]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* FOOTER */}
|
||||
<div className="flex justify-between gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
|
||||
<button
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
className="flex-1 py-2 rounded-xl bg-blue-100 hover:bg-blue-200 text-gray-700 font-medium"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={handleSubmitComment}
|
||||
className="flex-1 py-2 rounded-xl bg-[#1F6779] hover:bg-[#0F6C75] text-white font-medium"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,15 @@
|
|||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { Upload, Plus, Settings, CheckCheck } from "lucide-react";
|
||||
import {
|
||||
Upload,
|
||||
Plus,
|
||||
Settings,
|
||||
CheckCheck,
|
||||
Check,
|
||||
Clock,
|
||||
X,
|
||||
} from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
|
|
@ -14,17 +22,18 @@ import {
|
|||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import { loading } from "@/config/swal";
|
||||
import { error, loading, success } from "@/config/swal";
|
||||
import { Controller, useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { useDropzone } from "react-dropzone";
|
||||
import z from "zod";
|
||||
import dynamic from "next/dynamic";
|
||||
import { useParams } from "next/navigation";
|
||||
import { useParams, useRouter } from "next/navigation";
|
||||
import Cookies from "js-cookie";
|
||||
import { getProductDataById } from "@/service/product";
|
||||
import { getAgentById } from "@/service/agent";
|
||||
import { approveAgent, getAgentById, updateAgent } from "@/service/agent";
|
||||
import { Checkbox } from "@/components/ui/checkbox";
|
||||
import { convertDateFormat } from "@/utils/global";
|
||||
|
||||
const ViewEditor = dynamic(
|
||||
() => {
|
||||
|
|
@ -85,7 +94,25 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
|
|||
const id = params?.id;
|
||||
const [data, setData] = useState<any>(null);
|
||||
const [openApproverHistory, setOpenApproverHistory] = useState(false);
|
||||
const [userLevelId, setUserLevelId] = useState<string | null>(null);
|
||||
const router = useRouter();
|
||||
|
||||
const [openCommentModal, setOpenCommentModal] = useState(false);
|
||||
const [commentValue, setCommentValue] = useState("");
|
||||
const handleSubmitComment = async () => {
|
||||
// await api.post("/banner/comment", {
|
||||
// bannerId: viewBanner.id,
|
||||
// comment: commentValue,
|
||||
// });
|
||||
|
||||
setOpenCommentModal(false);
|
||||
};
|
||||
|
||||
// 🔹 Ambil userlevelId dari cookies
|
||||
useEffect(() => {
|
||||
const ulne = Cookies.get("ulne"); // contoh: "3"
|
||||
setUserLevelId(ulne ?? null);
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
fetchData();
|
||||
}, []);
|
||||
|
|
@ -101,6 +128,41 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
|
|||
setOpenApproverHistory(true);
|
||||
};
|
||||
|
||||
// const handleRejectProduct = async (id: number) => {
|
||||
// loading();
|
||||
|
||||
// const payload = {
|
||||
// status_id: 3, // ✅ number
|
||||
// };
|
||||
|
||||
// const res = await updateAgent(payload, id);
|
||||
|
||||
// if (res?.error) {
|
||||
// error(res.message || "Gagal menolak product");
|
||||
// close();
|
||||
// return;
|
||||
// }
|
||||
|
||||
// close();
|
||||
// success("Product berhasil ditolak");
|
||||
// fetchData();
|
||||
// };
|
||||
|
||||
const handleApproveAgent = async (id: number) => {
|
||||
loading();
|
||||
const res = await approveAgent(id);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message || "Gagal menyetujui agent");
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
close();
|
||||
success("Agent berhasil disetujui");
|
||||
fetchData(); // refresh table
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Card className="w-full border-none shadow-md">
|
||||
|
|
@ -155,6 +217,60 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="text-sm font-semibold text-gray-700 mb-3">
|
||||
Status Timeline
|
||||
</h4>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="flex gap-3">
|
||||
<div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
Diupload oleh Operator
|
||||
</p>
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(data.created_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-3">
|
||||
<div
|
||||
className={`w-6 h-6 rounded-full flex items-center justify-center ${
|
||||
data?.status_id === 1
|
||||
? "bg-yellow-100"
|
||||
: data?.status_id === 2
|
||||
? "bg-green-100"
|
||||
: "bg-red-100"
|
||||
}`}
|
||||
>
|
||||
{data?.status_id === 1 ? (
|
||||
<Clock className="w-4 h-4 text-yellow-700" />
|
||||
) : data?.status_id === 2 ? (
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
) : (
|
||||
<X className="w-4 h-4 text-red-700" />
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
{data?.status_id === 1
|
||||
? "Menunggu disetujui oleh Approver"
|
||||
: data?.status_id === 2
|
||||
? "Disetujui oleh Approver"
|
||||
: "Ditolak oleh Approver"}
|
||||
</p>
|
||||
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(data?.updated_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="border rounded-lg px-3 py-3">
|
||||
<p>Comment : </p>
|
||||
<div className="flex flex-row justify-between">
|
||||
|
|
@ -167,6 +283,47 @@ export default function DetailAgentForm(props: { isDetail: boolean }) {
|
|||
<p>Jaecoo - Approver | 10/11/2026</p>
|
||||
</div>
|
||||
</div>
|
||||
{userLevelId !== "2" && data && (
|
||||
<div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA] mt-10">
|
||||
{data.status_id === 1 ? (
|
||||
<>
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="bg-blue-200 hover:bg-blue-400"
|
||||
onClick={() => setOpenCommentModal(true)}
|
||||
>
|
||||
Beri Tanggapan
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="destructive"
|
||||
className="w-[180px]"
|
||||
// onClick={() => handleRejectProduct(detailData.id)}
|
||||
>
|
||||
Reject
|
||||
</Button>
|
||||
|
||||
{userLevelId === "1" && (
|
||||
<Button
|
||||
className="bg-green-600 hover:bg-green-700 text-white w-[180px]"
|
||||
onClick={() => handleApproveAgent(data.id)}
|
||||
>
|
||||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="mx-auto"
|
||||
onClick={() => router.back()}
|
||||
>
|
||||
Tutup
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{/* <Button className=" bg-teal-800 hover:bg-teal-900 text-white py-3">
|
||||
Submit
|
||||
</Button> */}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,15 @@
|
|||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { Upload, Plus, Settings, CheckCheck } from "lucide-react";
|
||||
import {
|
||||
Upload,
|
||||
Plus,
|
||||
Settings,
|
||||
CheckCheck,
|
||||
Clock,
|
||||
Check,
|
||||
X,
|
||||
} from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Label } from "@/components/ui/label";
|
||||
|
|
@ -14,15 +22,20 @@ import {
|
|||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import { loading } from "@/config/swal";
|
||||
import { error, loading, success } from "@/config/swal";
|
||||
import { Controller, useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { useDropzone } from "react-dropzone";
|
||||
import z from "zod";
|
||||
import dynamic from "next/dynamic";
|
||||
import { useParams } from "next/navigation";
|
||||
import { useParams, useRouter } from "next/navigation";
|
||||
import Cookies from "js-cookie";
|
||||
import { getProductDataById } from "@/service/product";
|
||||
import {
|
||||
approveProduct,
|
||||
getProductDataById,
|
||||
updateProduct,
|
||||
} from "@/service/product";
|
||||
import { convertDateFormat } from "@/utils/global";
|
||||
|
||||
const ViewEditor = dynamic(
|
||||
() => {
|
||||
|
|
@ -99,6 +112,15 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
const [startDateValue, setStartDateValue] = useState<any>(null);
|
||||
const [timeValue, setTimeValue] = useState("00:00");
|
||||
const [openApproverHistory, setOpenApproverHistory] = useState(false);
|
||||
const [userLevelId, setUserLevelId] = useState<string | null>(null);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// 🔹 Ambil userlevelId dari cookies
|
||||
useEffect(() => {
|
||||
const ulne = Cookies.get("ulne"); // contoh: "3"
|
||||
setUserLevelId(ulne ?? null);
|
||||
}, []);
|
||||
|
||||
const { getRootProps, getInputProps } = useDropzone({
|
||||
onDrop: (acceptedFiles) => {
|
||||
|
|
@ -199,6 +221,17 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
};
|
||||
|
||||
const [isUploadDialogOpen, setIsUploadDialogOpen] = useState(false);
|
||||
const [openCommentModal, setOpenCommentModal] = useState(false);
|
||||
const [commentValue, setCommentValue] = useState("");
|
||||
const handleSubmitComment = async () => {
|
||||
// await api.post("/banner/comment", {
|
||||
// bannerId: viewBanner.id,
|
||||
// comment: commentValue,
|
||||
// });
|
||||
|
||||
setOpenCommentModal(false);
|
||||
};
|
||||
|
||||
const [uploadTarget, setUploadTarget] = useState<{
|
||||
type: "spec" | "color";
|
||||
index: number;
|
||||
|
|
@ -268,6 +301,41 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
}
|
||||
}
|
||||
|
||||
const handleRejectProduct = async (id: number) => {
|
||||
loading();
|
||||
|
||||
const payload = {
|
||||
status_id: 3, // ✅ number
|
||||
};
|
||||
|
||||
const res = await updateProduct(payload, id);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message || "Gagal menolak product");
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
close();
|
||||
success("Product berhasil ditolak");
|
||||
initState();
|
||||
};
|
||||
|
||||
const handleApproveProduct = async (id: number) => {
|
||||
loading();
|
||||
const res = await approveProduct(id);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message || "Gagal menyetujui product");
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
close();
|
||||
success("Product berhasil disetujui");
|
||||
initState(); // refresh table
|
||||
};
|
||||
|
||||
const handleOpenApproverHistory = () => {
|
||||
setOpenApproverHistory(true);
|
||||
};
|
||||
|
|
@ -517,21 +585,56 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
</Button> */}
|
||||
</div>
|
||||
<div>
|
||||
<p>Status Timeline</p>
|
||||
<h4 className="text-sm font-semibold text-gray-700 mb-3">
|
||||
Status Timeline
|
||||
</h4>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="flex gap-3">
|
||||
<div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<CheckCheck className="w-4 h-4 text-green-600" />
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
</div>
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">Diupload oleh</p>
|
||||
<p className="font-medium text-gray-800">
|
||||
Diupload oleh Operator
|
||||
</p>
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(detailData?.created_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-3 mt-3">
|
||||
<div className="w-6 h-6 rounded-full bg-green-100 flex items-center justify-center">
|
||||
<CheckCheck className="w-4 h-4 text-green-600" />
|
||||
</div>
|
||||
<div className="flex gap-3">
|
||||
<div
|
||||
className={`w-6 h-6 rounded-full flex items-center justify-center ${
|
||||
detailData?.status_id === 1
|
||||
? "bg-yellow-100"
|
||||
: detailData?.status_id === 2
|
||||
? "bg-green-100"
|
||||
: "bg-red-100"
|
||||
}`}
|
||||
>
|
||||
{detailData?.status_id === 1 ? (
|
||||
<Clock className="w-4 h-4 text-yellow-700" />
|
||||
) : detailData?.status_id === 2 ? (
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
) : (
|
||||
<X className="w-4 h-4 text-red-700" />
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">Disetujui oleh</p>
|
||||
<p className="font-medium text-gray-800">
|
||||
{detailData?.status_id === 1
|
||||
? "Menunggu disetujui oleh Approver"
|
||||
: detailData?.status_id === 2
|
||||
? "Disetujui oleh Approver"
|
||||
: "Ditolak oleh Approver"}
|
||||
</p>
|
||||
|
||||
<p className="text-sm text-gray-500">
|
||||
{convertDateFormat(detailData?.updated_at)} WIB
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -547,6 +650,48 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
<p>Jaecoo - Approver | 10/11/2026</p>
|
||||
</div>
|
||||
</div>
|
||||
{userLevelId !== "2" && detailData && (
|
||||
<div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA] mt-10">
|
||||
{detailData.status_id === 1 ? (
|
||||
<>
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="bg-blue-200 hover:bg-blue-400"
|
||||
onClick={() => setOpenCommentModal(true)}
|
||||
>
|
||||
Beri Tanggapan
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
variant="destructive"
|
||||
className="w-[180px]"
|
||||
onClick={() => handleRejectProduct(detailData.id)}
|
||||
>
|
||||
Reject
|
||||
</Button>
|
||||
|
||||
{userLevelId === "1" && (
|
||||
<Button
|
||||
className="bg-green-600 hover:bg-green-700 text-white w-[180px]"
|
||||
onClick={() => handleApproveProduct(detailData.id)}
|
||||
>
|
||||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<Button
|
||||
variant="secondary"
|
||||
className="mx-auto"
|
||||
onClick={() => router.back()}
|
||||
>
|
||||
Tutup
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* <Button className=" bg-teal-800 hover:bg-teal-900 text-white py-3">
|
||||
Submit
|
||||
</Button> */}
|
||||
|
|
@ -695,6 +840,76 @@ export default function DetailProductForm(props: { isDetail: boolean }) {
|
|||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
{openCommentModal && detailData && (
|
||||
<div
|
||||
className="fixed inset-0 z-[60] flex items-center justify-center bg-black/50 p-4"
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
>
|
||||
<div
|
||||
className="bg-white rounded-2xl shadow-2xl max-w-lg w-full overflow-hidden"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{/* HEADER */}
|
||||
<div className="bg-gradient-to-br from-[#1F6779] to-[#0F6C75] text-white px-6 py-5 relative">
|
||||
<button
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
className="absolute top-4 right-4 text-white/80 hover:text-white text-xl"
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
|
||||
<h2 className="text-lg font-semibold">Beri Tanggapan</h2>
|
||||
|
||||
{/* Badge */}
|
||||
<div className="flex items-center gap-2 mt-3">
|
||||
<span className="bg-yellow-100 text-yellow-800 text-xs font-medium px-3 py-1 rounded-full">
|
||||
Menunggu
|
||||
</span>
|
||||
|
||||
<span className="bg-white text-[#0F6C75] text-xs font-medium px-3 py-1 rounded-full">
|
||||
Banner
|
||||
</span>
|
||||
|
||||
<span className="bg-white/20 text-white text-xs px-2 py-[2px] rounded-full">
|
||||
{detailData.position}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* BODY */}
|
||||
<div className="p-6 space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-500 mb-2">
|
||||
Comment
|
||||
</label>
|
||||
<textarea
|
||||
value={commentValue}
|
||||
onChange={(e) => setCommentValue(e.target.value)}
|
||||
placeholder="Masukkan komentar"
|
||||
className="w-full min-h-[100px] border rounded-lg p-3 focus:outline-none focus:ring-2 focus:ring-[#0F6C75]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* FOOTER */}
|
||||
<div className="flex justify-between gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
|
||||
<button
|
||||
onClick={() => setOpenCommentModal(false)}
|
||||
className="flex-1 py-2 rounded-xl bg-blue-100 hover:bg-blue-200 text-gray-700 font-medium"
|
||||
>
|
||||
Batal
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={handleSubmitComment}
|
||||
className="flex-1 py-2 rounded-xl bg-[#1F6779] hover:bg-[#0F6C75] text-white font-medium"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -416,6 +416,10 @@ export default function AgentTable() {
|
|||
<span className="bg-green-100 text-green-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Disetujui
|
||||
</span>
|
||||
) : item.status_id === 3 ? (
|
||||
<span className="bg-red-100 text-red-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Ditolak
|
||||
</span>
|
||||
) : (
|
||||
<span className="bg-gray-100 text-gray-600 text-xs px-3 py-1 rounded-full font-medium">
|
||||
{item.status_id || "Tidak Diketahui"}
|
||||
|
|
@ -448,6 +452,7 @@ export default function AgentTable() {
|
|||
</Button>
|
||||
</Link>
|
||||
{/* Tombol Edit */}
|
||||
{userLevelId !== "1" && (
|
||||
<Link href={`/admin/agent/update/${item.id}`}>
|
||||
<Button
|
||||
className="text-[#0F6C75] hover:bg-transparent hover:underline p-0"
|
||||
|
|
@ -457,9 +462,9 @@ export default function AgentTable() {
|
|||
<CreateIconIon className="w-4 h-4 mr-1" /> Edit
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
)}
|
||||
{/* Tombol Approve - hanya untuk admin dan status pending */}
|
||||
{userLevelId === "1" && item.status_id === 1 && (
|
||||
{/* {userLevelId === "1" && item.status_id === 1 && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -469,7 +474,7 @@ export default function AgentTable() {
|
|||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
)} */}
|
||||
{/* Tombol Hapus */}
|
||||
<Button
|
||||
variant="ghost"
|
||||
|
|
|
|||
|
|
@ -46,7 +46,12 @@ import {
|
|||
} from "@/components/ui/table";
|
||||
import CustomPagination from "../layout/custom-pagination";
|
||||
import { EditBannerDialog } from "../form/banner-edit-dialog";
|
||||
import { deleteBanner, getBannerData, updateBanner, approveBanner } from "@/service/banner";
|
||||
import {
|
||||
deleteBanner,
|
||||
getBannerData,
|
||||
updateBanner,
|
||||
approveBanner,
|
||||
} from "@/service/banner";
|
||||
import { Check, CheckCheck, Clock, Eye, X } from "lucide-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
|
|
@ -219,25 +224,25 @@ export default function ArticleTable() {
|
|||
await updateBanner(formData, id);
|
||||
};
|
||||
|
||||
const handleApprove = async () => {
|
||||
if (!viewBanner) return;
|
||||
// const handleApprove = async () => {
|
||||
// if (!viewBanner) return;
|
||||
|
||||
loading();
|
||||
const formData = new FormData();
|
||||
formData.append("status", "2"); // APPROVED
|
||||
// loading();
|
||||
// const formData = new FormData();
|
||||
// formData.append("status", "2"); // APPROVED
|
||||
|
||||
const res = await updateBanner(formData, viewBanner.id);
|
||||
// const res = await updateBanner(formData, viewBanner.id);
|
||||
|
||||
if (res?.error) {
|
||||
error(res.message);
|
||||
return;
|
||||
}
|
||||
// if (res?.error) {
|
||||
// error(res.message);
|
||||
// return;
|
||||
// }
|
||||
|
||||
close();
|
||||
success("Banner berhasil disetujui");
|
||||
setOpenViewDialog(false);
|
||||
initState(); // refresh table
|
||||
};
|
||||
// close();
|
||||
// success("Banner berhasil disetujui");
|
||||
// setOpenViewDialog(false);
|
||||
// initState(); // refresh table
|
||||
// };
|
||||
|
||||
const handleApproveBanner = async (id: number) => {
|
||||
loading();
|
||||
|
|
@ -486,6 +491,10 @@ export default function ArticleTable() {
|
|||
<span className="bg-green-100 text-green-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Disetujui
|
||||
</span>
|
||||
) : item.status_id === 3 ? (
|
||||
<span className="bg-red-100 text-red-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Ditolak
|
||||
</span>
|
||||
) : (
|
||||
<span className="bg-gray-100 text-gray-600 text-xs px-3 py-1 rounded-full font-medium">
|
||||
{item.status_id || "Tidak Diketahui"}
|
||||
|
|
@ -505,7 +514,7 @@ export default function ArticleTable() {
|
|||
<Eye className="w-4 h-4 mr-1" />
|
||||
Lihat
|
||||
</Button>
|
||||
{userLevelId !== "3" && (
|
||||
{userLevelId !== "1" && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -516,7 +525,7 @@ export default function ArticleTable() {
|
|||
Edit
|
||||
</Button>
|
||||
)}
|
||||
{userLevelId === "1" && item.status_id === 1 && (
|
||||
{/* {userLevelId === "1" && item.status_id === 1 && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -526,7 +535,7 @@ export default function ArticleTable() {
|
|||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
)} */}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -669,21 +678,21 @@ export default function ArticleTable() {
|
|||
<div className="flex items-center gap-2 mt-3">
|
||||
<span
|
||||
className={`text-xs font-medium px-3 py-1 rounded-full ${
|
||||
viewBanner.status === "1"
|
||||
viewBanner.status_id === 1
|
||||
? "bg-yellow-100 text-yellow-800"
|
||||
: viewBanner.status === "2"
|
||||
: viewBanner.status_id === 2
|
||||
? "bg-green-100 text-green-800"
|
||||
: viewBanner.status === "3"
|
||||
: viewBanner.status_id === 3
|
||||
? "bg-red-100 text-red-800"
|
||||
: "bg-gray-100 text-gray-800"
|
||||
}`}
|
||||
>
|
||||
{viewBanner.status === "1"
|
||||
{viewBanner.status_id === 1
|
||||
? "Menunggu"
|
||||
: viewBanner.status === "2"
|
||||
: viewBanner.status_id === 2
|
||||
? "Disetujui"
|
||||
: viewBanner.status === "3"
|
||||
? "Reject"
|
||||
: viewBanner.status_id === 3
|
||||
? "Ditolak"
|
||||
: "Tidak Diketahui"}
|
||||
</span>
|
||||
|
||||
|
|
@ -753,16 +762,16 @@ export default function ArticleTable() {
|
|||
<div className="flex gap-3">
|
||||
<div
|
||||
className={`w-6 h-6 rounded-full flex items-center justify-center ${
|
||||
viewBanner.status === "1"
|
||||
viewBanner.status_id === 1
|
||||
? "bg-yellow-100"
|
||||
: viewBanner.status === "2"
|
||||
: viewBanner.status_id === 2
|
||||
? "bg-green-100"
|
||||
: "bg-red-100"
|
||||
}`}
|
||||
>
|
||||
{viewBanner.status === "1" ? (
|
||||
{viewBanner.status_id === 1 ? (
|
||||
<Clock className="w-4 h-4 text-yellow-700" />
|
||||
) : viewBanner.status === "2" ? (
|
||||
) : viewBanner.status_id === 2 ? (
|
||||
<Check className="w-4 h-4 text-green-600" />
|
||||
) : (
|
||||
<X className="w-4 h-4 text-red-700" />
|
||||
|
|
@ -771,9 +780,9 @@ export default function ArticleTable() {
|
|||
|
||||
<div>
|
||||
<p className="font-medium text-gray-800">
|
||||
{viewBanner.status === "1"
|
||||
{viewBanner.status_id === 1
|
||||
? "Menunggu disetujui oleh Approver"
|
||||
: viewBanner.status === "2"
|
||||
: viewBanner.status_id === 2
|
||||
? "Disetujui oleh Approver"
|
||||
: "Ditolak oleh Approver"}
|
||||
</p>
|
||||
|
|
@ -803,7 +812,7 @@ export default function ArticleTable() {
|
|||
{/* FOOTER */}
|
||||
{userLevelId !== "2" && (
|
||||
<div className="flex justify-between items-center gap-3 px-6 py-4 border-t bg-[#F2F7FA]">
|
||||
{viewBanner.status === "1" ? (
|
||||
{viewBanner.status_id === 1 ? (
|
||||
<>
|
||||
<Button
|
||||
variant="secondary"
|
||||
|
|
@ -817,8 +826,8 @@ export default function ArticleTable() {
|
|||
</Button>
|
||||
|
||||
<Button
|
||||
variant="destructive"
|
||||
className=" w-[180]"
|
||||
variant="destructive"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleReject();
|
||||
|
|
@ -827,15 +836,20 @@ export default function ArticleTable() {
|
|||
Reject
|
||||
</Button>
|
||||
|
||||
{userLevelId === "1" && (
|
||||
<Button
|
||||
// variant="ghost"
|
||||
size="sm"
|
||||
className="bg-green-600 hover:bg-green-700 text-white w-[180]"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
handleApprove();
|
||||
handleApproveBanner(viewBanner.id);
|
||||
}}
|
||||
>
|
||||
Approved
|
||||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<Button
|
||||
|
|
|
|||
|
|
@ -2,7 +2,14 @@
|
|||
|
||||
import { useEffect, useState } from "react";
|
||||
import Image from "next/image";
|
||||
import { Eye, Pencil, Trash2, Calendar, MapPin, CheckCheck } from "lucide-react";
|
||||
import {
|
||||
Eye,
|
||||
Pencil,
|
||||
Trash2,
|
||||
Calendar,
|
||||
MapPin,
|
||||
CheckCheck,
|
||||
} from "lucide-react";
|
||||
import {
|
||||
deleteGalery,
|
||||
getGaleryById,
|
||||
|
|
@ -50,7 +57,7 @@ export default function Galery() {
|
|||
|
||||
// Filter file dengan gallery_id sama dengan item.id
|
||||
const filteredImages = images?.filter(
|
||||
(img: any) => img.gallery_id === item.id
|
||||
(img: any) => img.gallery_id === item.id,
|
||||
);
|
||||
|
||||
// Ambil gambar pertama sebagai thumbnail
|
||||
|
|
@ -64,7 +71,7 @@ export default function Galery() {
|
|||
} catch (e) {
|
||||
return { ...item, image_url: null };
|
||||
}
|
||||
})
|
||||
}),
|
||||
);
|
||||
|
||||
setData(merged);
|
||||
|
|
@ -211,23 +218,23 @@ export default function Galery() {
|
|||
>
|
||||
<Eye className="h-4 w-4" /> Lihat
|
||||
</button>
|
||||
|
||||
{userLevelId !== "1" && (
|
||||
<button
|
||||
onClick={() => openEdit(item.id)}
|
||||
className="flex items-center gap-1 text-gray-700 hover:text-[#1F6779] transition"
|
||||
>
|
||||
<Pencil className="h-4 w-4" /> Edit
|
||||
</button>
|
||||
|
||||
)}
|
||||
{/* Tombol Approve - hanya untuk admin dan status pending */}
|
||||
{userLevelId === "1" && item.status_id === 1 && (
|
||||
{/* {userLevelId === "1" && item.status_id === 1 && (
|
||||
<button
|
||||
className="flex items-center gap-1 text-green-600 hover:text-green-700 transition"
|
||||
onClick={() => handleApproveGalery(item.id)}
|
||||
>
|
||||
<CheckCheck className="h-4 w-4" /> Approve
|
||||
</button>
|
||||
)}
|
||||
)} */}
|
||||
|
||||
<button
|
||||
className="flex items-center gap-1 text-red-600 hover:text-red-700 transition"
|
||||
|
|
|
|||
|
|
@ -47,7 +47,11 @@ import {
|
|||
} from "@/components/ui/table";
|
||||
import CustomPagination from "../layout/custom-pagination";
|
||||
import { EditBannerDialog } from "../form/banner-edit-dialog";
|
||||
import { deleteProduct, getProductPagination, approveProduct } from "@/service/product";
|
||||
import {
|
||||
deleteProduct,
|
||||
getProductPagination,
|
||||
approveProduct,
|
||||
} from "@/service/product";
|
||||
import { CheckCheck, Eye } from "lucide-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
|
|
@ -448,6 +452,10 @@ export default function ProductTable() {
|
|||
<span className="bg-green-100 text-green-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Disetujui
|
||||
</span>
|
||||
) : item.status_id === 3 ? (
|
||||
<span className="bg-red-100 text-red-700 text-xs px-3 py-1 rounded-full font-medium">
|
||||
Ditolak
|
||||
</span>
|
||||
) : (
|
||||
<span className="bg-gray-100 text-gray-600 text-xs px-3 py-1 rounded-full font-medium">
|
||||
{item.status_id || "Tidak Diketahui"}
|
||||
|
|
@ -468,7 +476,7 @@ export default function ProductTable() {
|
|||
Lihat
|
||||
</Button>
|
||||
</Link>
|
||||
{userLevelId !== "3" && (
|
||||
{userLevelId !== "1" && (
|
||||
<Link href={"/admin/product/update"}>
|
||||
<Button
|
||||
className="text-[#0F6C75] hover:bg-transparent hover:underline p-0"
|
||||
|
|
@ -479,7 +487,7 @@ export default function ProductTable() {
|
|||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
{userLevelId === "1" && item.status_id === 1 && (
|
||||
{/* {userLevelId === "1" && item.status_id === 1 && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -489,7 +497,7 @@ export default function ProductTable() {
|
|||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
)} */}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
|
|||
|
|
@ -50,7 +50,11 @@ import { EditBannerDialog } from "../form/banner-edit-dialog";
|
|||
import { Eye, Trash2, CheckCheck } from "lucide-react";
|
||||
import AgentDetailDialog from "../dialog/agent-dialog";
|
||||
import PromoDetailDialog from "../dialog/promo-dialog";
|
||||
import { deletePromotion, getPromotionPagination, approvePromotion } from "@/service/promotion";
|
||||
import {
|
||||
deletePromotion,
|
||||
getPromotionPagination,
|
||||
approvePromotion,
|
||||
} from "@/service/promotion";
|
||||
|
||||
const columns = [
|
||||
{ name: "No", uid: "no" },
|
||||
|
|
@ -433,7 +437,7 @@ export default function PromotionTable() {
|
|||
{/* Tombol Edit */}
|
||||
|
||||
{/* Tombol Approve - hanya untuk admin dan status pending */}
|
||||
{userLevelId === "1" && item.status_id === 1 && (
|
||||
{/* {userLevelId === "1" && item.status_id === 1 && (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
|
|
@ -443,7 +447,7 @@ export default function PromotionTable() {
|
|||
<CheckCheck className="w-4 h-4 mr-1" />
|
||||
Approve
|
||||
</Button>
|
||||
)}
|
||||
)} */}
|
||||
{/* Tombol Hapus */}
|
||||
<Button
|
||||
variant="ghost"
|
||||
|
|
|
|||
Loading…
Reference in New Issue