feat: update banner and pop up

This commit is contained in:
hanif salafi 2025-07-15 01:08:27 +07:00
parent 4250c2ec78
commit ddc2484cc3
7 changed files with 141 additions and 141 deletions

View File

@ -28,7 +28,7 @@ import { useSearchParams } from "next/navigation";
import { close, loading } from "@/config/swal";
import { Link, useRouter } from "@/i18n/routing";
import columns from "./popup-column";
import { listBanner, listStaticBanner } from "@/service/settings/settings";
import { getListPopUp, listBanner, listStaticBanner } from "@/service/settings/settings";
import { listDataPopUp } from "@/service/broadcast/broadcast";
const PopUpListTable = () => {
@ -84,32 +84,21 @@ const PopUpListTable = () => {
React.useEffect(() => {
if (dataChange) {
router.push("/admin/settings/banner");
router.push("/admin/settings/popup");
}
getListBanner();
getPopUp();
}, [dataChange]);
React.useEffect(() => {
getListBanner();
getPopUp();
// getListStaticBanner();
}, [page, showData]);
async function getListBanner() {
async function getPopUp() {
loading();
let temp: any;
// const response = await listDataPopUp(
// page - 1,
// showData,
// "",
// categoryFilter?.sort().join(","),
// statusFilter?.sort().join(",")
// );
// const data = response?.data?.data?.content;
// console.log("banner", data);
// setGetData(data);
const response = await listBanner();
const response = await getListPopUp();
const data = response?.data?.data?.content;
console.log("banner", data);
setGetData(data);
@ -119,6 +108,7 @@ const PopUpListTable = () => {
return (
<>
{table &&
<Table className="overflow-hidden mt-10">
<TableHeader>
{table.getHeaderGroups().map((headerGroup) => (
@ -137,8 +127,8 @@ const PopUpListTable = () => {
))}
</TableHeader>
<TableBody>
{table.getRowModel().rows?.length ? (
table.getRowModel().rows.map((row) => (
{table?.getRowModel()?.rows?.length ? (
table?.getRowModel()?.rows.map((row) => (
<TableRow
key={row.id}
data-state={row.getIsSelected() && "selected"}
@ -160,6 +150,7 @@ const PopUpListTable = () => {
)}
</TableBody>
</Table>
}
</>
);
};

View File

@ -237,7 +237,7 @@ const ContentListPopUp = () => {
const { toast } = useToast();
const handleBanner = async (ids: number[]) => {
const handlePopUp = async (ids: number[]) => {
try {
await Promise.all(ids.map((id) => setPopUp(id, true)));
toast({
@ -413,7 +413,7 @@ const ContentListPopUp = () => {
<span>Pilih Semua</span>
</div>
{selectedItems.length > 0 && (
<Button color="primary" onClick={() => handleBanner(selectedItems)}>
<Button color="primary" onClick={() => handlePopUp(selectedItems)}>
Jadikan PopUp
</Button>
)}

View File

@ -315,11 +315,11 @@ const EventCalender = () => {
</div>
</div>
<div className="flex gap-2">
{/* <div className="flex gap-2">
<button className="px-4 py-2 bg-gray-300 dark:bg-zinc-700 text-gray-700 dark:text-gray-300 text-sm font-medium rounded-lg hover:bg-gray-400 dark:hover:bg-zinc-600 transition-colors">
{t("share", { defaultValue: "Share" })}
</button>
</div>
</div> */}
</div>
</div>
) : (

View File

@ -41,24 +41,6 @@ const HeroModal = ({
const swiperRef = useRef<SwiperClass | null>(null);
useEffect(() => {
async function fetchCategories() {
const url = "https://netidhub.com/api/csrf";
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error("Fetch error: ", error);
}
}
fetchCategories();
initFetch();
}, []);
@ -269,32 +251,39 @@ const HeroNewPolda = (props: { group?: string }) => {
}, []);
useEffect(() => {
async function fetchCategories() {
const url = "https://netidhub.com/api/csrf";
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error("Fetch error: ", error);
}
}
fetchCategories();
initFetch();
}, []);
const initFetch = async () => {
const response = await getHeroData(locale == "en");
console.log(response);
const request = {
title: "",
page: 0,
size: 5,
sortBy: "createdAt",
contentTypeId:
selectedTab == "image"
? "1"
: selectedTab == "video"
? "2"
: selectedTab == "text"
? "3"
: selectedTab == "audio"
? "4"
: "",
group:
props.group == "mabes"
? ""
: props.group == "polda" && poldaName && String(poldaName)?.length > 1
? poldaName
: props.group == "satker" &&
satkerName &&
String(satkerName)?.length > 1
? "satker-" + satkerName
: "",
isInt: locale == "en" ? true : false,
};
const response = await getListContent(request);
let data = response?.data?.data?.content;
setHeroData(data);
if (
data &&
@ -318,6 +307,7 @@ const HeroNewPolda = (props: { group?: string }) => {
useEffect(() => {
fecthNewContent();
}, [selectedTab]);
const fecthNewContent = async () => {
console.log("Satker Name : ", satkerName);
const request = {
@ -348,7 +338,6 @@ const HeroNewPolda = (props: { group?: string }) => {
isInt: locale == "en" ? true : false,
};
const response = await getListContent(request);
console.log("category", response);
setNewContent(response?.data?.data?.content);
};

View File

@ -80,6 +80,7 @@ const HeroModal = ({
: "";
useEffect(() => {
console.log("Show modal popup list");
initFetch();
}, []);
@ -103,10 +104,9 @@ const HeroModal = ({
locale == "en"
);
const banners = response?.data?.data || [];
console.log("banner Modal", banners);
setHeroData(banners);
const interstitial = response?.data?.data || [];
console.log("banner Modal", interstitial);
setHeroData(interstitial);
};
return (
@ -230,6 +230,7 @@ const HeroNew = (props: { group?: string }) => {
useEffect(() => {
fecthNewContent();
}, [selectedTab]);
const fecthNewContent = async () => {
console.log("Satker Name : ", satkerName);
const request = {
@ -315,6 +316,7 @@ const HeroNew = (props: { group?: string }) => {
// Show hero modal after 20 seconds when website is fully loaded
useEffect(() => {
const timer = setTimeout(() => {
console.log("Show modal popup");
setShowModal(true);
}, 30000); // 30 seconds
@ -322,32 +324,39 @@ const HeroNew = (props: { group?: string }) => {
}, []);
useEffect(() => {
async function fetchCategories() {
const url = "https://netidhub.com/api/csrf";
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const data = await response.json();
return data;
} catch (error) {
console.error("Fetch error: ", error);
}
}
fetchCategories();
initFetch();
}, []);
const initFetch = async () => {
const response = await getHeroData(locale == "en");
console.log(response);
const request = {
title: "",
page: 0,
size: 5,
sortBy: "createdAt",
contentTypeId:
selectedTab == "image"
? "1"
: selectedTab == "video"
? "2"
: selectedTab == "text"
? "3"
: selectedTab == "audio"
? "4"
: "",
group:
props.group == "mabes"
? ""
: props.group == "polda" && poldaName && String(poldaName)?.length > 1
? poldaName
: props.group == "satker" &&
satkerName &&
String(satkerName)?.length > 1
? "satker-" + satkerName
: "",
isInt: locale == "en" ? true : false,
};
const response = await getListContent(request);
let data = response?.data?.data?.content;
setHeroData(data);
if (data) {
const resStatic = await listStaticBanner(
@ -363,8 +372,8 @@ const HeroNew = (props: { group?: string }) => {
locale == "en"
);
for (let i = 0; i < resStatic?.data?.data?.length; i++) {
const media = resStatic?.data.data[i]?.mediaUpload;
for (let i = resStatic?.data?.data?.length; i >= 0 ; i--) {
const media = resStatic?.data?.data[i];
if (!media) continue;
media.fileTypeId = media?.fileType?.id ?? null;
data = data.filter((item: any) => item.id != media.id);
@ -399,7 +408,7 @@ const HeroNew = (props: { group?: string }) => {
<div className="flex items-start justify-center mx-auto w-auto">
<div className="relative">
{showModal && (
<HeroModal onClose={() => setShowModal(false)} group="mabes" />
<HeroModal onClose={() => setShowModal(false)} group={props.group || "mabes"} />
)}
</div>
{isLoading ? (
@ -466,7 +475,7 @@ const HeroNew = (props: { group?: string }) => {
</Carousel>
<div className="hidden lg:flex flex-col gap-3 absolute bottom-4 right-4 w-[520px] bg-black/40 p-4 rounded-lg z-10">
{content?.slice(0, 3).map((item: any) => (
{newContent?.slice(0, 3).map((item: any) => (
<li key={item?.id} className="flex gap-4 flex-row lg:w-full mx-2">
<div className="flex-shrink-0 w-32 rounded-lg">
<Image

View File

@ -37,6 +37,11 @@ export default function LocalSwitcher() {
useEffect(() => {
const storedLang = getLanguage();
if (pathname.includes("polda")){
startTransition(() => {
router.replace(pathname, { locale: "in" });
});
} else {
if (!storedLang) {
setLanguage("in");
setSelectedLang("in");
@ -50,6 +55,7 @@ export default function LocalSwitcher() {
router.replace(pathname, { locale: storedLang });
});
}
}
}, []);
const onSelectChange = (nextLocale: string) => {

View File

@ -153,6 +153,11 @@ export async function deleteAdvertisements(id: string | number) {
return httpDeleteInterceptor(url);
}
export async function getListPopUp() {
const url = `media/interstitial/pagination`;
return httpGetInterceptor(url);
}
export async function setPopUp(id: number, status: boolean) {
const url = `media/interstitial?id=${id}&status=${status}`;
return httpPostInterceptor(url);