feat:aksebilitas menu, fix:landing banner
This commit is contained in:
Rama Priyanto
parent
949b0e1924
commit
1aa7652eb4
|
|
@ -4,6 +4,7 @@ import "@/styles/globals.css";
|
||||||
import clsx from "clsx";
|
import clsx from "clsx";
|
||||||
import { Metadata } from "next";
|
import { Metadata } from "next";
|
||||||
import { Providers } from "./providers";
|
import { Providers } from "./providers";
|
||||||
|
import LoadScript from "@/utils/global";
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: {
|
title: {
|
||||||
|
|
@ -29,7 +30,19 @@ export default function RootLayout({
|
||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<html lang="en" suppressHydrationWarning className="scroll-smooth">
|
<html lang="en" suppressHydrationWarning className="scroll-smooth">
|
||||||
<head />
|
<head>
|
||||||
|
<meta
|
||||||
|
name="theme-color"
|
||||||
|
content="white"
|
||||||
|
media="(prefers-color-scheme: light)"
|
||||||
|
/>
|
||||||
|
<meta
|
||||||
|
name="theme-color"
|
||||||
|
content="black"
|
||||||
|
media="(prefers-color-scheme: dark)"
|
||||||
|
/>
|
||||||
|
<LoadScript />
|
||||||
|
</head>
|
||||||
<body
|
<body
|
||||||
className={clsx(
|
className={clsx(
|
||||||
"bg-background font-sans antialiased",
|
"bg-background font-sans antialiased",
|
||||||
|
|
@ -37,9 +50,7 @@ export default function RootLayout({
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<Providers themeProps={{ attribute: "class", defaultTheme: "dark" }}>
|
<Providers themeProps={{ attribute: "class", defaultTheme: "dark" }}>
|
||||||
<main className="">
|
<main className="">{children}</main>
|
||||||
{children}
|
|
||||||
</main>
|
|
||||||
</Providers>
|
</Providers>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -1,62 +1,93 @@
|
||||||
'use client'
|
"use client";
|
||||||
import { Card, CardFooter } from '@nextui-org/react';
|
import { Card, CardFooter } from "@nextui-org/react";
|
||||||
import Image from 'next/image';
|
import Image from "next/image";
|
||||||
import { useState } from 'react';
|
import { useEffect, useState } from "react";
|
||||||
import { ChevronLeftWhite, ChevronRightIcon } from '../icons';
|
import { ChevronLeftWhite, ChevronRightIcon, EyeIcon } from "../icons";
|
||||||
import Link from 'next/link';
|
import Link from "next/link";
|
||||||
|
import { getListArticle } from "@/service/article";
|
||||||
|
import { convertDateFormat } from "@/utils/global";
|
||||||
|
import { Autoplay, Pagination, Navigation } from "swiper/modules";
|
||||||
|
import { Swiper, SwiperSlide } from "swiper/react";
|
||||||
|
|
||||||
export default function ENewsPolri() {
|
export default function ENewsPolri() {
|
||||||
const [limitedData, setLimitedData] = useState<any>([]);
|
const [article, setArticle] = useState<any>([]);
|
||||||
|
|
||||||
const eNews = [
|
useEffect(() => {
|
||||||
{
|
async function getArticle() {
|
||||||
id: 1,
|
const response = await getListArticle();
|
||||||
title: "Tribrata News Edisi 32 /IV-VI/ENews Polri/2024",
|
console.log("res", response?.data?.data);
|
||||||
img: "/headernews.png",
|
setArticle(response?.data?.data);
|
||||||
},
|
}
|
||||||
{
|
getArticle();
|
||||||
id: 2,
|
}, []);
|
||||||
title: "Tribrata News Edisi 32 /IV-VI/ 2024",
|
|
||||||
img: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
title: "Tribrata News Edisi 32 /IV-VI/ 2024",
|
|
||||||
img: "/headernews.png",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className='bg-[#1F1A17] text-center rounded-none md:rounded-lg h-auto lg:h-[338px] flex py-4 flex-col justify-between items-center'>
|
<div className="bg-[#1F1A17] text-center rounded-none md:rounded-lg h-auto flex py-4 flex-col justify-between items-center">
|
||||||
<p className='text-white font-bold text-2xl underline underline-offset-4 decoration-red-600'>E-Majalah Polri</p>
|
<p className="text-white font-bold text-2xl underline underline-offset-4 decoration-red-600">
|
||||||
<div className='flex flex-row w-full items-center justify-around'>
|
E-Majalah Polri
|
||||||
<ChevronLeftWhite />
|
</p>
|
||||||
<div className='lg:flex space-y-2 lg:space-y-0 gap-1 md:gap-2 lg:gap-8'>
|
|
||||||
{eNews.map((data: any) => (
|
<div className="w-screen lg:w-[90%]">
|
||||||
<div key={data.id} className=' w-[274px]'>
|
<div>
|
||||||
<Link href={`/e-majalah-polri/detail/${data.id}`}>
|
<Swiper
|
||||||
<Card className='text-white'
|
centeredSlides={false}
|
||||||
isFooterBlurred
|
autoplay={{
|
||||||
|
delay: 5000,
|
||||||
|
disableOnInteraction: false,
|
||||||
|
}}
|
||||||
|
pagination={{
|
||||||
|
clickable: true,
|
||||||
|
}}
|
||||||
|
navigation={true}
|
||||||
|
modules={[Autoplay, Pagination, Navigation]}
|
||||||
|
className="mySwiper gap-3"
|
||||||
|
slidesPerView={1}
|
||||||
|
breakpoints={{
|
||||||
|
// When the window width is less than 640px
|
||||||
|
720: {
|
||||||
|
slidesPerView: 3, // Set slidesPerView to 1 on mobile
|
||||||
|
},
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
|
{article?.map((newsItem: any) => (
|
||||||
|
<SwiperSlide key={newsItem.id}>
|
||||||
|
<Card isFooterBlurred radius="lg" className="border-none">
|
||||||
<Image
|
<Image
|
||||||
alt="e-news"
|
alt="headernews"
|
||||||
className="object-cover h-full"
|
className="object-cover"
|
||||||
height={100}
|
height={660}
|
||||||
src={data.img}
|
src="/headernews.png"
|
||||||
width={100}
|
width={460}
|
||||||
layout='responsive'
|
layout="responsive"
|
||||||
/>
|
/>
|
||||||
<CardFooter className="before:bg-white/10 border-white/20 border-1 overflow-hidden py-1 md:absolute before:rounded-xl bottom-1 w-[calc(100%_-_8px)] shadow-small ml-1 z-10">
|
<CardFooter className="before:bg-white/10 border-white/20 border-1 overflow-hidden py-1 md:absolute before:rounded-xl rounded-large bottom-1 w-[calc(100%_-_8px)] shadow-small ml-1 z-10">
|
||||||
<p className='text-xs text-left'>{data.title}</p>
|
<div className="text-white">
|
||||||
|
<Link href={`news/detail/${newsItem.id}`}>
|
||||||
|
<p className="text-left font-semibold">
|
||||||
|
{newsItem.title}
|
||||||
|
</p>
|
||||||
|
</Link>
|
||||||
|
<p className="py-[2px] text-left text-sm">
|
||||||
|
{convertDateFormat(newsItem.createdAt)} WIB
|
||||||
|
</p>
|
||||||
|
<p className="flex items-center gap-1 text-sm">
|
||||||
|
<EyeIcon />
|
||||||
|
{newsItem.viewCount === null ? 0 : newsItem.viewCount}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
|
</SwiperSlide>
|
||||||
|
))}
|
||||||
|
</Swiper>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Link
|
||||||
|
className="flex items-center gap-2 text-[#DD8306]"
|
||||||
|
href="/e-majalah-polri/daftar-majalah"
|
||||||
|
>
|
||||||
|
Lihat Semua <ChevronRightIcon color="[#DD8306]" />
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
))}
|
);
|
||||||
</div>
|
|
||||||
<ChevronRightIcon color='white' />
|
|
||||||
</div>
|
|
||||||
<Link className='flex items-center gap-2 text-[#DD8306]' href='/e-majalah-polri/daftar-majalah'>Lihat Semua <ChevronRightIcon color='[#DD8306]' /></Link>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,117 +10,42 @@ import Link from "next/link";
|
||||||
import GPRKominfo from "../ui/social-media/gpr-kominfo";
|
import GPRKominfo from "../ui/social-media/gpr-kominfo";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { getListArticle } from "@/service/article";
|
import { getListArticle } from "@/service/article";
|
||||||
|
import { convertDateFormat } from "@/utils/global";
|
||||||
|
|
||||||
export default function HeaderNews() {
|
export default function HeaderNews() {
|
||||||
const [article, setArticle] = useState();
|
const [article, setArticle] = useState<any>([]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
async function getArticle() {
|
async function getArticle() {
|
||||||
const response = await getListArticle();
|
const response = await getListArticle();
|
||||||
console.log("res", response?.data?.data);
|
console.log("res", response?.data?.data);
|
||||||
|
setArticle(response?.data?.data);
|
||||||
}
|
}
|
||||||
getArticle();
|
getArticle();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
const newsData = [
|
|
||||||
{
|
|
||||||
id: 1,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 6,
|
|
||||||
title:
|
|
||||||
"Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari",
|
|
||||||
date: "21-07-2023 13:50",
|
|
||||||
views: 82,
|
|
||||||
imageUrl: "/headernews.png",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
return (
|
return (
|
||||||
<div className="lg:flex items-center bg-white gap-3 p-2">
|
<div className=" bg-[#1F1A17] gap-3 md:py-6 md:px-12 md:h-[700px]">
|
||||||
<div className="w-auto lg:w-[25%] p-2 bg-[#020101] text-white rounded-md">
|
<div className="lg:flex items-center justify-center bg-white p-1 md:p-4 rounded-lg gap-3 md:h-[654px] md:w-fit md:mx-auto">
|
||||||
|
<div className="w-auto lg:w-[25%] p-2 bg-[#020101] text-white rounded-md mb-2 md:mb-0 md:h-[636px]">
|
||||||
<p className="text-lg font-bold h-10 text-center">Berita Terkini</p>
|
<p className="text-lg font-bold h-10 text-center">Berita Terkini</p>
|
||||||
<ScrollShadow hideScrollBar className=" h-[443px]">
|
<ScrollShadow hideScrollBar className="md:h-[530px] gap-3">
|
||||||
<div className="text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md">
|
{article.map((data: any) => (
|
||||||
<p>
|
<div
|
||||||
Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi
|
className="text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md"
|
||||||
Warganya yang Masih Beraktifitas Pada Malam Hari
|
key={data.id}
|
||||||
|
>
|
||||||
|
<p>{data.title}</p>
|
||||||
|
<p className="py-[2px]">
|
||||||
|
{" "}
|
||||||
|
{convertDateFormat(data.createdAt)} WIB
|
||||||
</p>
|
</p>
|
||||||
<p className="py-[2px]">21-07-2023 13:50</p>
|
|
||||||
<p className="flex items-center gap-1">
|
<p className="flex items-center gap-1">
|
||||||
<EyeIcon />
|
<EyeIcon />
|
||||||
82
|
{data.viewCount === null ? 0 : data.viewCount}
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md">
|
|
||||||
<p>
|
|
||||||
Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi
|
|
||||||
Warganya yang Masih Beraktifitas Pada Malam Hari
|
|
||||||
</p>
|
|
||||||
<p className="py-[2px]">21-07-2023 13:50</p>
|
|
||||||
<p className="flex items-center gap-1">
|
|
||||||
<EyeIcon />
|
|
||||||
82
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md">
|
|
||||||
<p>
|
|
||||||
Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi
|
|
||||||
Warganya yang Masih Beraktifitas Pada Malam Hari
|
|
||||||
</p>
|
|
||||||
<p className="py-[2px]">21-07-2023 13:50</p>
|
|
||||||
<p className="flex items-center gap-1">
|
|
||||||
<EyeIcon />
|
|
||||||
82
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-left m-2 p-2 bg-[#1E1616] rounded-md">
|
|
||||||
<p>
|
|
||||||
Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi
|
|
||||||
Warganya yang Masih Beraktifitas Pada Malam Hari
|
|
||||||
</p>
|
|
||||||
<p className="py-[2px]">21-07-2023 13:50</p>
|
|
||||||
<p className="flex items-center gap-1">
|
|
||||||
<EyeIcon />
|
|
||||||
82
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
))}
|
||||||
</ScrollShadow>
|
</ScrollShadow>
|
||||||
<div className="m-2">
|
<div className="m-2">
|
||||||
<Link href="/news/all">
|
<Link href="/news/all">
|
||||||
|
|
@ -133,8 +58,8 @@ export default function HeaderNews() {
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="w-auto lg:w-[50%]">
|
<div className="w-auto lg:w-[910px] md:h-[636px]">
|
||||||
<div>
|
<div className="md:h-[636px]">
|
||||||
<Swiper
|
<Swiper
|
||||||
centeredSlides={true}
|
centeredSlides={true}
|
||||||
autoplay={{
|
autoplay={{
|
||||||
|
|
@ -147,15 +72,15 @@ export default function HeaderNews() {
|
||||||
navigation={true}
|
navigation={true}
|
||||||
modules={[Autoplay, Pagination, Navigation]}
|
modules={[Autoplay, Pagination, Navigation]}
|
||||||
className="mySwiper"
|
className="mySwiper"
|
||||||
|
height={636}
|
||||||
>
|
>
|
||||||
{newsData.map((newsItem) => (
|
{article?.map((newsItem: any) => (
|
||||||
<SwiperSlide key={newsItem.id}>
|
<SwiperSlide key={newsItem.id}>
|
||||||
<Card isFooterBlurred radius="lg" className="border-none">
|
<Card isFooterBlurred radius="lg" className="border-none">
|
||||||
<Image
|
<Image
|
||||||
alt="headernews"
|
alt="headernews"
|
||||||
className="object-cover"
|
height={400}
|
||||||
height={660}
|
src="/headernews.png"
|
||||||
src={newsItem.imageUrl}
|
|
||||||
width={460}
|
width={460}
|
||||||
layout="responsive"
|
layout="responsive"
|
||||||
/>
|
/>
|
||||||
|
|
@ -167,11 +92,11 @@ export default function HeaderNews() {
|
||||||
</p>
|
</p>
|
||||||
</Link>
|
</Link>
|
||||||
<p className="py-[2px] text-left text-sm">
|
<p className="py-[2px] text-left text-sm">
|
||||||
{newsItem.date}
|
{convertDateFormat(newsItem.createdAt)} WIB
|
||||||
</p>
|
</p>
|
||||||
<p className="flex items-center gap-1 text-sm">
|
<p className="flex items-center gap-1 text-sm">
|
||||||
<EyeIcon />
|
<EyeIcon />
|
||||||
{newsItem.views}
|
{newsItem.viewCount === null ? 0 : newsItem.viewCount}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
|
|
@ -180,27 +105,6 @@ export default function HeaderNews() {
|
||||||
))}
|
))}
|
||||||
</Swiper>
|
</Swiper>
|
||||||
</div>
|
</div>
|
||||||
{/* <Card
|
|
||||||
isFooterBlurred
|
|
||||||
radius="lg"
|
|
||||||
className="border-none"
|
|
||||||
>
|
|
||||||
<Image
|
|
||||||
alt="headernews"
|
|
||||||
className="object-cover"
|
|
||||||
height={660}
|
|
||||||
src="/headernews.png"
|
|
||||||
width={460}
|
|
||||||
layout="responsive"
|
|
||||||
/>
|
|
||||||
<CardFooter className="before:bg-white/10 border-white/20 border-1 overflow-hidden py-1 md:absolute before:rounded-xl rounded-large bottom-1 w-[calc(100%_-_8px)] shadow-small ml-1 z-10">
|
|
||||||
<div className='text-white'>
|
|
||||||
<p className='text-left font-semibold'>Pelihara Kondusifitas Kamtibmas, Personel Polsek Sayan Sambangi Warganya yang Masih Beraktifitas Pada Malam Hari</p>
|
|
||||||
<p className='py-[2px] text-left text-sm'>21-07-2023 13:50</p>
|
|
||||||
<p className='flex items-center gap-1 text-sm'><EyeIcon />82</p>
|
|
||||||
</div>
|
|
||||||
</CardFooter>
|
|
||||||
</Card> */}
|
|
||||||
</div>
|
</div>
|
||||||
<div className="w-auto lg:w-[25%] p-2 rounded-md text-white dark:text-black ">
|
<div className="w-auto lg:w-[25%] p-2 rounded-md text-white dark:text-black ">
|
||||||
<GPRKominfo />
|
<GPRKominfo />
|
||||||
|
|
@ -234,5 +138,6 @@ export default function HeaderNews() {
|
||||||
</div> */}
|
</div> */}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -198,45 +198,7 @@ export default function MediaSocial() {
|
||||||
Lihat Semua <ChevronRightIcon />
|
Lihat Semua <ChevronRightIcon />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="md:flex flex-wrap gap-4 justify-center">
|
<FacebookWidget />
|
||||||
{dummyData.map((data: any) => (
|
|
||||||
<div
|
|
||||||
key={data.id}
|
|
||||||
className="bg-white text-black h-[400px] w-auto md:w-[315px] border-2 rounded-md px-5 py-3"
|
|
||||||
>
|
|
||||||
<div className="h-[20%] flex items-center text-xs justify-between">
|
|
||||||
<div className="flex gap-2">
|
|
||||||
<div className="h-[50px]">
|
|
||||||
<img src={data.logo} alt="logo" className="h-[50px]" />
|
|
||||||
</div>
|
|
||||||
<div className="flex flex-col gap-1 justify-center">
|
|
||||||
<p className="flex gap-1">
|
|
||||||
{data.division} <img src={data.type} alt="" />
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="">
|
|
||||||
<div className="flex gap-1 text-blue-500">
|
|
||||||
<img src="/temp/share.svg" alt="" />
|
|
||||||
Share
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="h-[35%] text-xs">
|
|
||||||
{data.description}
|
|
||||||
<a className="text-blue-500">
|
|
||||||
<br />
|
|
||||||
Lihat Selengkapnya
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div className="h-[45%]">
|
|
||||||
<div className="flex justify-center">
|
|
||||||
<img src={data.imageUrl} alt="header" className="h-[165px]" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div className="flex items-center justify-between pb-3">
|
<div className="flex items-center justify-between pb-3">
|
||||||
|
|
|
||||||
|
|
@ -13,64 +13,58 @@ import "swiper/css";
|
||||||
import "swiper/css/navigation";
|
import "swiper/css/navigation";
|
||||||
import "swiper/css/pagination";
|
import "swiper/css/pagination";
|
||||||
import { Navigation, Pagination } from "swiper/modules";
|
import { Navigation, Pagination } from "swiper/modules";
|
||||||
import { top5NewsMediahub } from "@/service/medol-news-update";
|
import { topNewsMediahub } from "@/service/medol-news-update";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
|
import {
|
||||||
|
getImageInp,
|
||||||
|
topNewsInp,
|
||||||
|
topNewsTbn,
|
||||||
|
} from "@/service/third-party-service";
|
||||||
|
import { convertDateFormatNoTime } from "@/utils/global";
|
||||||
|
import PolriTvWidget from "../ui/social-media/polri-tv";
|
||||||
|
|
||||||
export default function MedolUpdate() {
|
export default function MedolUpdate() {
|
||||||
const [mediahubUpdate, setMediahubUpdate] = useState<any>();
|
const [selectedTab, setSelectedTab] = useState<any>("mediahub");
|
||||||
|
const [mediahubUpdate, setMediahubUpdate] = useState<any>([]);
|
||||||
|
const [tbnUpdate, setTbnUpdate] = useState([]);
|
||||||
|
const [inpUpdate, setInpUpdate] = useState([]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (selectedTab === "mediahub" && mediahubUpdate.length < 1) {
|
||||||
|
getMedihubUpdate();
|
||||||
|
}
|
||||||
|
if (selectedTab === "tbnews" && tbnUpdate.length < 1) {
|
||||||
|
getTbnUpdate();
|
||||||
|
}
|
||||||
|
if (selectedTab === "inp" && inpUpdate.length < 1) {
|
||||||
|
getInpUpdate();
|
||||||
|
}
|
||||||
|
}, [selectedTab]);
|
||||||
|
|
||||||
async function getMedihubUpdate() {
|
async function getMedihubUpdate() {
|
||||||
const res = await top5NewsMediahub();
|
const res = await topNewsMediahub();
|
||||||
setMediahubUpdate(res.data?.data?.content);
|
setMediahubUpdate(res?.data?.data?.content);
|
||||||
// console.log("List Top5News", res.data.data?.content);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
getMedihubUpdate();
|
async function getTbnUpdate() {
|
||||||
}, []);
|
const res = await topNewsTbn();
|
||||||
|
setTbnUpdate(res?.data?.data);
|
||||||
|
}
|
||||||
|
async function getInpUpdate() {
|
||||||
|
const res = await topNewsInp();
|
||||||
|
// setInpUpdate(res?.data);
|
||||||
|
getDataImage(res?.data);
|
||||||
|
}
|
||||||
|
|
||||||
const mediaHubUpdate = [
|
async function getDataImage(data: any) {
|
||||||
{
|
let temp = data;
|
||||||
id: 1,
|
for (let i = 0; i < data.length; i++) {
|
||||||
image: "/temp/mediahub1.png",
|
const res = await getImageInp(temp[i].id);
|
||||||
title:
|
const data = res?.data[0]?.guid?.rendered;
|
||||||
"Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini Tambah Wawasan dan",
|
temp[i].image = data;
|
||||||
createdDate: "12 Januari 2024",
|
}
|
||||||
time: "13:00 WITA",
|
setInpUpdate(temp);
|
||||||
},
|
}
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
image: "/temp/mediahub2.png",
|
|
||||||
title:
|
|
||||||
"Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak",
|
|
||||||
createdDate: "14 Januari 2024",
|
|
||||||
time: "13:00 WIB",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
image: "/temp/mediahub2.png",
|
|
||||||
title:
|
|
||||||
"Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak",
|
|
||||||
createdDate: "14 Januari 2024",
|
|
||||||
time: "13:00 WIB",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
image: "/temp/mediahub2.png",
|
|
||||||
title:
|
|
||||||
"Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak",
|
|
||||||
createdDate: "14 Januari 2024",
|
|
||||||
time: "13:00 WIB",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
image: "/temp/mediahub2.png",
|
|
||||||
title:
|
|
||||||
"Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga 1 Pelabuhan Merak",
|
|
||||||
createdDate: "14 Januari 2024",
|
|
||||||
time: "13:00 WIB",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="border-2 rounded-lg py-2">
|
<div className="border-2 rounded-lg py-2">
|
||||||
|
|
@ -86,6 +80,8 @@ export default function MedolUpdate() {
|
||||||
aria-label="Options"
|
aria-label="Options"
|
||||||
color="warning"
|
color="warning"
|
||||||
className="flex justify-center"
|
className="flex justify-center"
|
||||||
|
selectedKey={selectedTab}
|
||||||
|
onSelectionChange={setSelectedTab}
|
||||||
>
|
>
|
||||||
<Tab key="mediahub" title="MediaHUB Update">
|
<Tab key="mediahub" title="MediaHUB Update">
|
||||||
<Swiper
|
<Swiper
|
||||||
|
|
@ -102,7 +98,7 @@ export default function MedolUpdate() {
|
||||||
<Card
|
<Card
|
||||||
isPressable
|
isPressable
|
||||||
shadow="sm"
|
shadow="sm"
|
||||||
className=" bg-white text-black border-2"
|
className=" bg-white text-black border-2 w-full"
|
||||||
>
|
>
|
||||||
<CardBody className="overflow-visible p-0">
|
<CardBody className="overflow-visible p-0">
|
||||||
<Image
|
<Image
|
||||||
|
|
@ -114,7 +110,9 @@ export default function MedolUpdate() {
|
||||||
/>
|
/>
|
||||||
</CardBody>
|
</CardBody>
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
<CardFooter className="flex flex-col items-start text-left">
|
||||||
<p className="text-xs">02-04-2024 09:31 WITA</p>
|
<p className="text-xs">
|
||||||
|
{convertDateFormatNoTime(newsItem?.createdAt)}
|
||||||
|
</p>
|
||||||
<b className="">{newsItem?.title}</b>
|
<b className="">{newsItem?.title}</b>
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
|
|
@ -123,6 +121,7 @@ export default function MedolUpdate() {
|
||||||
))}
|
))}
|
||||||
</Swiper>
|
</Swiper>
|
||||||
<div className="text-center pt-6">
|
<div className="text-center pt-6">
|
||||||
|
<Link href="https://mediahub.polri.go.id" target="_blank">
|
||||||
<Button
|
<Button
|
||||||
className="bg-white text-[#DD8306] font-bold w-56"
|
className="bg-white text-[#DD8306] font-bold w-56"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
@ -131,60 +130,46 @@ export default function MedolUpdate() {
|
||||||
>
|
>
|
||||||
Lihat Lebih Banyak
|
Lihat Lebih Banyak
|
||||||
</Button>
|
</Button>
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key="tbnews" title="Tribrata News Update">
|
<Tab key="tbnews" title="Tribrata News Update">
|
||||||
<div className="flex gap-5 justify-center pt-3">
|
<Swiper
|
||||||
|
navigation={true}
|
||||||
|
modules={[Navigation, Pagination]}
|
||||||
|
spaceBetween={40}
|
||||||
|
slidesPerView={2}
|
||||||
|
pagination={true}
|
||||||
|
className="mySwiper"
|
||||||
|
>
|
||||||
|
{tbnUpdate?.map((newsItem: any) => (
|
||||||
|
<SwiperSlide key={newsItem.title}>
|
||||||
|
<Link href={newsItem?.source_url} target="_blank">
|
||||||
<Card
|
<Card
|
||||||
shadow="sm"
|
|
||||||
isPressable
|
isPressable
|
||||||
onPress={() => console.log("item pressed")}
|
shadow="sm"
|
||||||
className="w-[45%] bg-white text-black"
|
className=" bg-white text-black border-2 w-full"
|
||||||
>
|
>
|
||||||
<CardBody className="overflow-visible p-0">
|
<CardBody className="overflow-visible p-0">
|
||||||
<Image
|
<Image
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
radius="lg"
|
||||||
width="300%"
|
width="300%"
|
||||||
alt="tes"
|
alt="tes"
|
||||||
className="object-cover h-[270px]"
|
className="object-cover h-[270px]"
|
||||||
src="/temp/mediahub1.png"
|
src={newsItem?.image}
|
||||||
/>
|
/>
|
||||||
</CardBody>
|
</CardBody>
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
<CardFooter className="flex flex-col items-start text-left">
|
||||||
<p className="text-xs">02-04-2024 09:31 WITA</p>
|
{convertDateFormatNoTime(newsItem?.date)}
|
||||||
<b className="">
|
<b className="">{newsItem?.title}</b>
|
||||||
Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini
|
|
||||||
Tambah Wawasan dan
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
<Card
|
</Link>
|
||||||
shadow="sm"
|
</SwiperSlide>
|
||||||
isPressable
|
))}
|
||||||
onPress={() => console.log("item pressed")}
|
</Swiper>
|
||||||
className="w-[45%] bg-white text-black"
|
|
||||||
>
|
|
||||||
<CardBody className="overflow-visible p-0">
|
|
||||||
<Image
|
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
|
||||||
width="100%"
|
|
||||||
alt="tes"
|
|
||||||
className="w-full object-cover h-[270px]"
|
|
||||||
src="/temp/mediahub2.png"
|
|
||||||
/>
|
|
||||||
</CardBody>
|
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
|
||||||
<p className="text-xs">02-04-2024 09:16 WIB</p>
|
|
||||||
<b>
|
|
||||||
Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga
|
|
||||||
1 Pelabuhan Merak
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
<div className="text-center pt-6">
|
<div className="text-center pt-6">
|
||||||
|
<Link href="https://tribratanews.polri.go.id" target="_blank">
|
||||||
<Button
|
<Button
|
||||||
className="bg-white text-[#DD8306] font-bold w-56"
|
className="bg-white text-[#DD8306] font-bold w-56"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
@ -193,60 +178,46 @@ export default function MedolUpdate() {
|
||||||
>
|
>
|
||||||
Lihat Lebih Banyak
|
Lihat Lebih Banyak
|
||||||
</Button>
|
</Button>
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key="inp" title="Indonesia Nasional Police Update">
|
<Tab key="inp" title="Indonesia Nasional Police Update">
|
||||||
<div className="flex gap-5 justify-center pt-3">
|
<Swiper
|
||||||
|
navigation={true}
|
||||||
|
modules={[Navigation, Pagination]}
|
||||||
|
spaceBetween={40}
|
||||||
|
slidesPerView={2}
|
||||||
|
pagination={true}
|
||||||
|
className="mySwiper"
|
||||||
|
>
|
||||||
|
{inpUpdate?.map((newsItem: any) => (
|
||||||
|
<SwiperSlide key={newsItem?.id}>
|
||||||
|
<Link href={newsItem?.link} target="_blank">
|
||||||
<Card
|
<Card
|
||||||
shadow="sm"
|
|
||||||
isPressable
|
isPressable
|
||||||
onPress={() => console.log("item pressed")}
|
shadow="sm"
|
||||||
className="w-[45%] bg-white text-black"
|
className=" bg-white text-black border-2 w-full"
|
||||||
>
|
>
|
||||||
<CardBody className="overflow-visible p-0">
|
<CardBody className="overflow-visible p-0">
|
||||||
<Image
|
<Image
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
radius="lg"
|
||||||
width="300%"
|
width="300%"
|
||||||
alt="tes"
|
alt="tes"
|
||||||
className="object-cover h-[270px]"
|
className="object-cover h-[270px]"
|
||||||
src="/temp/mediahub1.png"
|
src={newsItem.image}
|
||||||
/>
|
/>
|
||||||
</CardBody>
|
</CardBody>
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
<CardFooter className="flex flex-col items-start text-left">
|
||||||
<p className="text-xs">02-04-2024 09:31 WITA</p>
|
{convertDateFormatNoTime(newsItem?.date)}
|
||||||
<b className="">
|
<b className="">{newsItem?.title?.rendered}</b>
|
||||||
Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini
|
|
||||||
Tambah Wawasan dan
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
<Card
|
</Link>
|
||||||
shadow="sm"
|
</SwiperSlide>
|
||||||
isPressable
|
))}
|
||||||
onPress={() => console.log("item pressed")}
|
</Swiper>
|
||||||
className="w-[45%] bg-white text-black"
|
|
||||||
>
|
|
||||||
<CardBody className="overflow-visible p-0">
|
|
||||||
<Image
|
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
|
||||||
width="100%"
|
|
||||||
alt="tes"
|
|
||||||
className="w-full object-cover h-[270px]"
|
|
||||||
src="/temp/mediahub2.png"
|
|
||||||
/>
|
|
||||||
</CardBody>
|
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
|
||||||
<p className="text-xs">02-04-2024 09:16 WIB</p>
|
|
||||||
<b>
|
|
||||||
Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga
|
|
||||||
1 Pelabuhan Merak
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
<div className="text-center pt-6">
|
<div className="text-center pt-6">
|
||||||
|
<a href="https://inp.polri.go.id/" target="_blank">
|
||||||
<Button
|
<Button
|
||||||
className="bg-white text-[#DD8306] font-bold w-56"
|
className="bg-white text-[#DD8306] font-bold w-56"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
@ -255,60 +226,20 @@ export default function MedolUpdate() {
|
||||||
>
|
>
|
||||||
Lihat Lebih Banyak
|
Lihat Lebih Banyak
|
||||||
</Button>
|
</Button>
|
||||||
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key="polritv" title="Polri TV Update">
|
<Tab key="polritv" title="Polri TV Update">
|
||||||
<div className="flex gap-5 justify-center pt-3">
|
<div className="w-full">
|
||||||
<Card
|
<div className="w-[40%] mx-auto">
|
||||||
shadow="sm"
|
<PolriTvWidget />
|
||||||
isPressable
|
</div>
|
||||||
onPress={() => console.log("item pressed")}
|
|
||||||
className="w-[45%] bg-white text-black"
|
|
||||||
>
|
|
||||||
<CardBody className="overflow-visible p-0">
|
|
||||||
<Image
|
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
|
||||||
width="300%"
|
|
||||||
alt="tes"
|
|
||||||
className="object-cover h-[270px]"
|
|
||||||
src="/temp/mediahub1.png"
|
|
||||||
/>
|
|
||||||
</CardBody>
|
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
|
||||||
<p className="text-xs">02-04-2024 09:31 WITA</p>
|
|
||||||
<b className="">
|
|
||||||
Peringatan Nuzulul Quran, Kapolda Sulbar Harap Kegiatan Ini
|
|
||||||
Tambah Wawasan dan
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
|
||||||
</Card>
|
|
||||||
<Card
|
|
||||||
shadow="sm"
|
|
||||||
isPressable
|
|
||||||
onPress={() => console.log("item pressed")}
|
|
||||||
className="w-[45%] bg-white text-black"
|
|
||||||
>
|
|
||||||
<CardBody className="overflow-visible p-0">
|
|
||||||
<Image
|
|
||||||
shadow="sm"
|
|
||||||
radius="lg"
|
|
||||||
width="100%"
|
|
||||||
alt="tes"
|
|
||||||
className="w-full object-cover h-[270px]"
|
|
||||||
src="/temp/mediahub2.png"
|
|
||||||
/>
|
|
||||||
</CardBody>
|
|
||||||
<CardFooter className="flex flex-col items-start text-left">
|
|
||||||
<p className="text-xs">02-04-2024 09:16 WIB</p>
|
|
||||||
<b>
|
|
||||||
Kapolri Tinjau Langsung Kondisi Pelayanan Pemudik di Dermaga
|
|
||||||
1 Pelabuhan Merak
|
|
||||||
</b>
|
|
||||||
</CardFooter>
|
|
||||||
</Card>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="text-center pt-6">
|
<div className="text-center pt-6">
|
||||||
|
<Link
|
||||||
|
href="https://www.youtube.com/@TvRadioPolri"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
<Button
|
<Button
|
||||||
className="bg-white text-[#DD8306] font-bold w-56"
|
className="bg-white text-[#DD8306] font-bold w-56"
|
||||||
size="sm"
|
size="sm"
|
||||||
|
|
@ -317,6 +248,7 @@ export default function MedolUpdate() {
|
||||||
>
|
>
|
||||||
Lihat Lebih Banyak
|
Lihat Lebih Banyak
|
||||||
</Button>
|
</Button>
|
||||||
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</Tab>
|
</Tab>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
|
|
|
||||||
|
|
@ -1,24 +1,40 @@
|
||||||
import React from "react";
|
"use client";
|
||||||
|
import React, { useEffect, useState } from "react";
|
||||||
import DetailNews from "../../page/detail-news";
|
import DetailNews from "../../page/detail-news";
|
||||||
import SidebarDetail from "../../page/sidebar-detail";
|
import SidebarDetail from "../../page/sidebar-detail";
|
||||||
import RelatedNews from "../../page/related-news";
|
import RelatedNews from "../../page/related-news";
|
||||||
import Comment from "./comment";
|
import Comment from "./comment";
|
||||||
|
import { getArticleById } from "@/service/article";
|
||||||
|
import { useParams } from "next/navigation";
|
||||||
|
|
||||||
export default function NewsDetailPage() {
|
export default function NewsDetailPage() {
|
||||||
|
const params = useParams();
|
||||||
|
const id = params.id;
|
||||||
|
const [detailArticle, setDetailArticle] = useState();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
initFetch();
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
const initFetch = async () => {
|
||||||
|
const res = await getArticleById(id);
|
||||||
|
const data = res?.data?.data;
|
||||||
|
setDetailArticle(data);
|
||||||
|
};
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="text-black md:flex bg-white">
|
<div className="text-black md:flex bg-white p-10">
|
||||||
<div className="w-auto md:w-[75%]">
|
<div className="w-auto md:w-[75%]">
|
||||||
<DetailNews />
|
<DetailNews data={detailArticle} />
|
||||||
</div>
|
</div>
|
||||||
<div className="w-auto md:w-[25%] hidden md:block">
|
<div className="w-auto md:w-[25%] hidden md:block">
|
||||||
<SidebarDetail />
|
<SidebarDetail />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="bg-[#eeeeee] text-black h-auto my-2 md:my-5 lg:my-10">
|
<div className="bg-[#eeeeee] text-black h-auto my-2 md:my-5 lg:my-10 px-3 md:px-36">
|
||||||
<Comment />
|
<Comment />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div className="px-36">
|
||||||
<RelatedNews />
|
<RelatedNews />
|
||||||
</div>
|
</div>
|
||||||
<div className="md:hidden text-black">
|
<div className="md:hidden text-black">
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,13 @@
|
||||||
'use client'
|
"use client";
|
||||||
import Image from 'next/image'
|
import { convertDateFormat, formatTextToHtmlTag } from "@/utils/global";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { EyeIcon, EyeIconMdi } from "../icons";
|
||||||
|
|
||||||
export default function DetailNews() {
|
export default function DetailNews(props: { data: any }) {
|
||||||
|
const { data } = props;
|
||||||
return (
|
return (
|
||||||
<div className=''>
|
<div className="px-3 md:px-36">
|
||||||
<div className='justify-center px-1 md:px-3'>
|
<div className=" px-1 md:px-3">
|
||||||
<Image
|
<Image
|
||||||
width={1100}
|
width={1100}
|
||||||
height={500}
|
height={500}
|
||||||
|
|
@ -13,41 +16,58 @@ export default function DetailNews() {
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div className='md:flex px-1 md:px-6 text-xs lg:text-medium gap-3'>
|
<div className="md:flex px-1 md:px-6 text-xs lg:text-medium gap-3">
|
||||||
<p>Oleh <b>Humas Polri</b></p>
|
<p>
|
||||||
<p className='hidden md:block'>|</p>
|
Oleh <b className="capitalize">{data?.createdByName}</b>
|
||||||
<p>Diupdate pada 24-01-2024 13:01:18 WIB</p>
|
</p>
|
||||||
<p className='hidden md:block'>|</p>
|
<p className="hidden md:block">|</p>
|
||||||
<p>1000</p>
|
<p>Diupdate pada {convertDateFormat(data?.createdAt)} WIB</p>
|
||||||
|
<p className="hidden md:block">|</p>
|
||||||
|
<p className="flex items-center gap-1">
|
||||||
|
<EyeIconMdi />
|
||||||
|
{data?.viewCount === null ? 0 : data?.viewCount}
|
||||||
|
</p>
|
||||||
<div className="flex gap-2 md:hidden">
|
<div className="flex gap-2 md:hidden">
|
||||||
<div><Image height={185} width={185} src="/fb.png" alt="medsos" /></div>
|
<div>
|
||||||
<div><Image height={185} width={185} src="/twitter.png" alt="medsos" /></div>
|
<Image height={185} width={185} src="/fb.png" alt="medsos" />
|
||||||
<div><Image height={185} width={185} src="/linkedin.png" alt="medsos" /></div>
|
|
||||||
<div><Image height={185} width={185} src="/wa.png" alt="medsos" /></div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div>
|
||||||
|
<Image height={185} width={185} src="/twitter.png" alt="medsos" />
|
||||||
</div>
|
</div>
|
||||||
<div className='px-1 md:px-5 text-sm md:text-medium space-y-3 py-2'>
|
<div>
|
||||||
<p className='font-bold text-lg'>Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke Kejagung</p>
|
<Image
|
||||||
<p>Jakarta, – Direktorat Tindak Pidana Korupsi (Dittipidkor) Bareskrim Polri melakukan pengiriman berkas perkara (tahap I), terkait dugaan korupsi pengadaan alat kesehatan Cath Lab dan belanja alat kedokteran CT Scan di RSUD dr Mohammad Soewandhie Surabaya, yang diduga dilakukan oleh tersangka drg RP.
|
height={185}
|
||||||
Kepala Biro Penerangan Masyarakat Divisi Humas Polri Brigjen Pol Trunoyudo Wisnu Andiko mengatakan, perkara dugaan korupsi ini terjadi pada tahun 2012 dimana RSUD dr Mohammad Soewandhie Surabaya telah melakukan pengadaan alat kesehatan Cath Lab dan belanja alat kedokteran CT Scan, dengan menggunakan DPA SKPD tahun anggaran 2012, yakni rinciannya alat kesehatan Cath Lab Rp 17.050.000.000 dan CT Scan Rp 14.500.000.000.
|
width={185}
|
||||||
Trunoyudo menuturkan, pengadaan alat kesehatan Cath Lab dan CT Scan itu sendiri diawali sejak tahun 2011 dimana mulai dari tahap perencanaan anggaran, perencanaan lelang, proses lelang, pelaksanaan pekerjaan dan pembayaran terdapat perbuatan melawan hukum yang terjadi dalam proses pengadaan barang dan jasa, diantaranya dengan menunjuk salah satu produk tertentu.
|
src="/linkedin.png"
|
||||||
“Pada tanggal 10 November 2022 telah dilakukan pengiriman berkas perkara tahap I atas nama tersangka RP ke Kejaksaan Agung RI,” katanya.
|
alt="medsos"
|
||||||
Pada tanggal 25 November 2022, penyidik menerima pengembalian berkas dengan disertai beberapa kekurangan baik petunjuk formil maupun materil yang harus dipenuhi penyidik.
|
/>
|
||||||
Setelah penyidik melengkapi petunjuk formil maupun materil, kemudian pada 16 Januari 2024 telah melakukan pengiriman kembali berkas perkara atas nama tersangka RP ke Kejaksaan Agung.
|
</div>
|
||||||
Tersangka RP dijerat Pasal 2 ayat (1) dan atau Pasal 3 UU Nomor 31 tahun 1999 tentang Pemberantasan Tindak Pidana Korupsi sebagaimana telah diubah dengan UU nomor 20 tahun 2001 tentang perubahaan atas UU nomor 31 tahun 1999 tentang Pemberantasan Tindak Pidana Korupsi Jo Pasal 55 ayat (1) ke-1 KUHP.
|
<div>
|
||||||
Berdasarkan hasil perhitungan kerugian keuangan negara yang dilakukan BPK RI adalah sebesar Rp 13.213.174.883.</p>
|
<Image height={185} width={185} src="/wa.png" alt="medsos" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="px-1 md:px-5 text-sm md:text-medium space-y-3 py-2">
|
||||||
|
<p className="font-bold text-lg">{data?.title}</p>
|
||||||
|
<div
|
||||||
|
dangerouslySetInnerHTML={formatTextToHtmlTag(data?.htmlDescription)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="hidden sm:grid grid-cols-5 px-1 md:px-3 pt-10">
|
<div className="hidden sm:grid grid-cols-5 px-1 md:px-3 pt-10">
|
||||||
<div><Image height={185} width={185} src="/fb.png" alt="medsos" /></div>
|
<div>
|
||||||
<div><Image height={185} width={185} src="/twitter.png" alt="medsos" /></div>
|
<Image height={185} width={185} src="/fb.png" alt="medsos" />
|
||||||
<div><Image height={185} width={185} src="/linkedin.png" alt="medsos" /></div>
|
|
||||||
<div><Image height={185} width={185} src="/wa.png" alt="medsos" /></div>
|
|
||||||
</div>
|
</div>
|
||||||
{/* <div className='h-auto lg:h-[350px]'>
|
<div>
|
||||||
|
<Image height={185} width={185} src="/twitter.png" alt="medsos" />
|
||||||
</div> */}
|
|
||||||
</div>
|
</div>
|
||||||
</div >
|
<div>
|
||||||
)
|
<Image height={185} width={185} src="/linkedin.png" alt="medsos" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Image height={185} width={185} src="/wa.png" alt="medsos" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,45 +1,59 @@
|
||||||
'use client'
|
"use client";
|
||||||
import { Card, CardBody, CardFooter, Image } from '@nextui-org/react';
|
import { Card, CardBody, CardFooter, Image } from "@nextui-org/react";
|
||||||
import React from 'react'
|
import React from "react";
|
||||||
import { UnderLine } from '../icons';
|
import { UnderLine } from "../icons";
|
||||||
|
|
||||||
export default function RelatedNews() {
|
export default function RelatedNews() {
|
||||||
const list = [
|
const list = [
|
||||||
{
|
{
|
||||||
title: "Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
title:
|
||||||
|
"Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
||||||
img: "/relatedNews.png",
|
img: "/relatedNews.png",
|
||||||
desc: "$5.50",
|
desc: "$5.50",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
title:
|
||||||
|
"Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
||||||
img: "/headernews.png",
|
img: "/headernews.png",
|
||||||
price: "$3.00",
|
price: "$3.00",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
title:
|
||||||
img: "/relatedNews.png",
|
"Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
||||||
desc: "$5.50",
|
|
||||||
}, {
|
|
||||||
title: "Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
|
||||||
img: "/relatedNews.png",
|
img: "/relatedNews.png",
|
||||||
desc: "$5.50",
|
desc: "$5.50",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
title:
|
||||||
|
"Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
||||||
|
img: "/relatedNews.png",
|
||||||
|
desc: "$5.50",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"Bareskrim Polri Kirim Berkas Kasus Korupsi Pengadaan Alat Kesehatan Cath Lab dan CT Scan ke...",
|
||||||
img: "/headernews.png",
|
img: "/headernews.png",
|
||||||
price: "$3.00",
|
price: "$3.00",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
return (
|
return (
|
||||||
<div className='text-black flex flex-col items-center space-y-10 my-10'>
|
<div className="text-black flex flex-col items-center my-10">
|
||||||
<div className='text-2xl font-bold flex flex-col items-center'>
|
<div className="text-2xl font-bold flex flex-col items-center">
|
||||||
<div>Kategori Satker</div>
|
<div>Kategori Satker</div>
|
||||||
<div><UnderLine /></div>
|
<div>
|
||||||
|
<UnderLine />
|
||||||
</div>
|
</div>
|
||||||
<div className='w-[90%] bg-white'>
|
</div>
|
||||||
<div className="gap-4 grid grid-cols-1 sm:grid-cols-5 w-full bg-white">
|
<div className="w-full bg-white rounded-lg">
|
||||||
|
<div className="gap-4 grid grid-cols-1 sm:grid-cols-5 w-full bg-white rounded-lg">
|
||||||
{list.map((item, index) => (
|
{list.map((item, index) => (
|
||||||
<Card className='bg-white text-black' shadow="sm" key={index} isPressable onPress={() => console.log("item pressed")}>
|
<Card
|
||||||
|
className="bg-white text-black"
|
||||||
|
shadow="sm"
|
||||||
|
key={index}
|
||||||
|
isPressable
|
||||||
|
onPress={() => console.log("item pressed")}
|
||||||
|
>
|
||||||
<CardBody className="overflow-visible p-2">
|
<CardBody className="overflow-visible p-2">
|
||||||
<Image
|
<Image
|
||||||
// shadow="sm"
|
// shadow="sm"
|
||||||
|
|
@ -49,16 +63,18 @@ export default function RelatedNews() {
|
||||||
className="w-full object-cover h-[260px]"
|
className="w-full object-cover h-[260px]"
|
||||||
src={item.img}
|
src={item.img}
|
||||||
/>
|
/>
|
||||||
<p className='text-xs pt-2 pl-1'>24/01/2024 14:08 WIB</p>
|
<p className="text-xs pt-2 pl-1">24/01/2024 14:08 WIB</p>
|
||||||
</CardBody>
|
</CardBody>
|
||||||
<CardFooter className="text-small text-left p-1 flex flex-col items-start">
|
<CardFooter className="text-small text-left p-1 flex flex-col items-start">
|
||||||
<b>{item.title}</b>
|
<b>{item.title}</b>
|
||||||
<p className='text-xs py-2 text-blue-700'>Lihat Selengkapnya</p>
|
<p className="text-xs py-2 text-blue-700">
|
||||||
|
Lihat Selengkapnya
|
||||||
|
</p>
|
||||||
</CardFooter>
|
</CardFooter>
|
||||||
</Card>
|
</Card>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,30 @@
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
const PolriTvWidget = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
if (typeof window !== "undefined") {
|
||||||
|
const script = document.createElement("script");
|
||||||
|
script.src = "https://embedsocial.com/cdn/ht.js";
|
||||||
|
script.id = "EmbedSocialHashtagScript";
|
||||||
|
script.async = true;
|
||||||
|
document.head.appendChild(script);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
document.head.removeChild(script);
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="h-[310px]">
|
||||||
|
<iframe
|
||||||
|
style={{ width: "100%", height: "100%" }}
|
||||||
|
className="rounded-lg"
|
||||||
|
scrolling="no"
|
||||||
|
src="https://embedsocial.com/api/pro_hashtag/e025d6147bb208952ae5db84f99e54f2388cea0d"
|
||||||
|
></iframe>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default PolriTvWidget;
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
|
|
@ -1,6 +1,6 @@
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
|
|
||||||
const baseURL = "http://103.82.242.92:8888";
|
const baseURL = "http://103.82.242.92:8802";
|
||||||
|
|
||||||
const axiosBaseInstance = axios.create({
|
const axiosBaseInstance = axios.create({
|
||||||
baseURL,
|
baseURL,
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,11 @@
|
||||||
import { mediahubGet } from "./http-config/axios-base-service";
|
import { mediahubGet } from "./http-config/axios-base-service";
|
||||||
|
|
||||||
export async function top5NewsMediahub() {
|
export async function topNewsMediahub() {
|
||||||
const headers = {
|
const headers = {
|
||||||
"content-type": "application/json",
|
"content-type": "application/json",
|
||||||
};
|
};
|
||||||
return await mediahubGet(`/media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=5&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=`, headers);
|
return await mediahubGet(
|
||||||
|
`/media/public/list?enablePage=1&sort=desc&sortBy=createdAt&size=10&page=0&typeId=1&title=&categoryId=&fileFormats=&tags=&group=&startDate=&endDate=&month=&year=`,
|
||||||
|
headers
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -0,0 +1,82 @@
|
||||||
|
import axios from "axios";
|
||||||
|
|
||||||
|
const tbnInstance = axios.create({
|
||||||
|
baseURL: "https://portal.humas.polri.go.id/v1/api",
|
||||||
|
headers: {
|
||||||
|
"content-type": "application/json",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const inpInstance = axios.create({
|
||||||
|
baseURL: "https://inp.indoplusmedia.id/wp-json/wp/v2",
|
||||||
|
headers: {
|
||||||
|
"content-type": "application/json",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function tbnGetNews(pathUrl: any, headers: any) {
|
||||||
|
const response = await tbnInstance
|
||||||
|
.get(pathUrl, { headers })
|
||||||
|
.catch(function (error: any) {
|
||||||
|
console.log(error);
|
||||||
|
return error.response;
|
||||||
|
});
|
||||||
|
console.log("Response base svc : ", response);
|
||||||
|
if (response?.status == 200 || response?.status == 201) {
|
||||||
|
return {
|
||||||
|
error: false,
|
||||||
|
message: "success",
|
||||||
|
data: response?.data,
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
error: true,
|
||||||
|
message: response?.data?.message || response?.data || null,
|
||||||
|
data: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
async function inpGetNews(pathUrl: any, headers: any) {
|
||||||
|
const response = await inpInstance
|
||||||
|
.get(pathUrl, { headers })
|
||||||
|
.catch(function (error: any) {
|
||||||
|
console.log(error);
|
||||||
|
return error.response;
|
||||||
|
});
|
||||||
|
console.log("Response base svc : ", response);
|
||||||
|
if (response?.status == 200 || response?.status == 201) {
|
||||||
|
return {
|
||||||
|
error: false,
|
||||||
|
message: "success",
|
||||||
|
data: response?.data,
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return {
|
||||||
|
error: true,
|
||||||
|
message: response?.data?.message || response?.data || null,
|
||||||
|
data: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function topNewsTbn() {
|
||||||
|
const headers = {
|
||||||
|
"content-type": "application/json",
|
||||||
|
};
|
||||||
|
return await tbnGetNews(
|
||||||
|
`/public/articles?page=1&limit=10&order_by=terkini&source=tbnews`,
|
||||||
|
headers
|
||||||
|
);
|
||||||
|
}
|
||||||
|
export async function topNewsInp() {
|
||||||
|
const headers = {
|
||||||
|
"content-type": "application/json",
|
||||||
|
};
|
||||||
|
return await inpGetNews(`/posts`, headers);
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getImageInp(id: string) {
|
||||||
|
const headers = {
|
||||||
|
"content-type": "application/json",
|
||||||
|
};
|
||||||
|
return await inpGetNews(`/media?parent=${id}`, headers);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,72 @@
|
||||||
|
"use client";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
export function convertDateFormat(dateString: string) {
|
||||||
|
var date = new Date(dateString);
|
||||||
|
|
||||||
|
var day = date.getDate();
|
||||||
|
var month = date.getMonth() + 1;
|
||||||
|
var year = date.getFullYear();
|
||||||
|
var hours = date.getHours();
|
||||||
|
var minutes = date.getMinutes();
|
||||||
|
|
||||||
|
var formattedTime =
|
||||||
|
(hours < 10 ? "0" : "") + hours + ":" + (minutes < 10 ? "0" : "") + minutes;
|
||||||
|
var formattedDate =
|
||||||
|
(day < 10 ? "0" : "") +
|
||||||
|
day +
|
||||||
|
"-" +
|
||||||
|
(month < 10 ? "0" : "") +
|
||||||
|
month +
|
||||||
|
"-" +
|
||||||
|
year +
|
||||||
|
", " +
|
||||||
|
formattedTime;
|
||||||
|
|
||||||
|
return formattedDate;
|
||||||
|
}
|
||||||
|
export function convertDateFormatNoTime(dateString: string) {
|
||||||
|
var date = new Date(dateString);
|
||||||
|
|
||||||
|
var day = date.getDate();
|
||||||
|
var month = date.getMonth() + 1;
|
||||||
|
var year = date.getFullYear();
|
||||||
|
|
||||||
|
var formattedDate =
|
||||||
|
(day < 10 ? "0" : "") +
|
||||||
|
day +
|
||||||
|
"-" +
|
||||||
|
(month < 10 ? "0" : "") +
|
||||||
|
month +
|
||||||
|
"-" +
|
||||||
|
year;
|
||||||
|
|
||||||
|
return formattedDate;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function formatTextToHtmlTag(text: string) {
|
||||||
|
if (text) {
|
||||||
|
const htmlText = text.replaceAll("\\n", "<br>").replaceAll(/"/g, "");
|
||||||
|
return { __html: htmlText };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const LoadScript = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
const script = document.createElement("script");
|
||||||
|
script.src = "https://cdn.userway.org/widget.js";
|
||||||
|
script.setAttribute("data-account", "X36s1DpjqB");
|
||||||
|
script.async = true;
|
||||||
|
|
||||||
|
document.head.appendChild(script);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
// Cleanup if needed
|
||||||
|
document.head.removeChild(script);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return null; // Tidak perlu merender apa-apa
|
||||||
|
};
|
||||||
|
|
||||||
|
export default LoadScript;
|
||||||
Loading…
Reference in New Issue