Skip to content

V
VCCI-News
Commit 8c3aefaa authored by Vũ Đình Nguyên's avatar Vũ Đình Nguyên
Browse files
Options

feat(layout-page): creat page layout page

parent c61429cb
Hide whitespace changes
Inline Side-by-side
Showing with 1516 additions and 65 deletions
src/app/(main)/_lib/layout/footer.tsx
View file @ 8c3aefaa
......@@ -35,7 +35,7 @@ function footer() {
return (
<div className="overflow-hidden">
<div className="p-5 bg-[#e3e3e3]">
<div className="max-w-[1200px] w-full flex m-auto flex-wrap relative">
<div className="container w-full flex m-auto flex-wrap relative">
<div className="z-10 w-full lg:w-1/3 flex flex-col gap-5 p-5">
<h2 className="text-[#063E8E] text-[20px] font-[500]">
ĐĂNG KÝ NHẬN THÔNG TIN VCCI
......
src/app/(main)/_lib/layout/header.tsx
View file @ 8c3aefaa
......@@ -57,7 +57,7 @@ function Header() {
</div>
<div className="sticky top-0 z-50 bg-[#ededed] shadow-md">
<div className="max-w-[1200px] m-auto">
<div className="container m-auto">
<div className="w-full flex justify-between items-center">
{/* Logo */}
<a href="/" className="flex items-center">
......
src/app/(main)/dai-dien-gioi-chu/chu-de/page.tsx
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import { PATHS } from "@constants/paths";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
......@@ -20,7 +21,23 @@ export default function Page() {
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory />
<ListCategory
categories={[
{
title: "Chức năng Đại diện Người sử dụng lao động",
href: `${PATHS.ownerRepresentatives}`,
},
{
title: "Sự kiện – Tập huấn NSDLĐ",
href: `${PATHS.ownerRepresentatives}/tap-huan-nsdld`,
},
{
title: "Tin liên quan",
href: `${PATHS.ownerRepresentatives}/tin-lien-quan`,
},
{ title: "Chủ đề", href: `${PATHS.ownerRepresentatives}/chu-de` },
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -36,7 +53,14 @@ export default function Page() {
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
......
src/app/(main)/dai-dien-gioi-chu/components/event-filter/index.tsx
View file @ 8c3aefaa
......@@ -81,6 +81,7 @@ export const EventFilter: React.FC<{ onFilter?: (payload: FilterPayload) => void
placeholder="Tên sự kiện ..."
value={query}
onChange={(e) => setQuery(e.target.value)}
className='text-black placeholder:text-gray-400 rounded-none py-2.5 px-2'
/>
</div>
......@@ -104,8 +105,8 @@ export const EventFilter: React.FC<{ onFilter?: (payload: FilterPayload) => void
</div>
<div className="flex items-center gap-3">
<Button onClick={handleFilter} className="flex-1">Lọc sự kiện</Button>
<Button variant="outline" onClick={handleReset} className="flex-1">Bỏ lọc</Button>
<Button onClick={handleFilter} className="flex-1 rounded-none font-medium text-lg text-white hover:bg-muted-foreground hover:outline-1 outline-primary hover:text-primary">Lọc sự kiện</Button>
<Button onClick={handleReset} className="flex-1 rounded-none font-medium text-lg text-white hover:bg-muted-foreground hover:outline-1 outline-primary hover:text-primary">Bỏ lọc</Button>
</div>
</aside>
)
......
src/app/(main)/dai-dien-gioi-chu/components/list-category/index.tsx
View file @ 8c3aefaa
......@@ -3,7 +3,6 @@
import { usePathname } from "next/navigation"
import React from "react"
import { MenuItem } from '../menu-category'
import {PATHS} from '@constants/paths'
// Local Menu shape compatible with MenuItem
type Menu = {
id: string | number
......@@ -16,15 +15,9 @@ type Category = {
href: string
}
const CATEGORIES: Category[] = [
{ title: "Chức năng Đại diện Người sử dụng lao động", href: "/dai-dien-gioi-chu" },
{ title: "Sự kiện – Tập huấn NSDLĐ", href: `${PATHS.ownerRepresentatives}/su-kien` },
{ title: "Tin liên quan", href: `${PATHS.ownerRepresentatives}/tin-lien-quan` },
{ title: "Chủ đề", href: `${PATHS.ownerRepresentatives}/chu-de` },
// Default categories removed — component now accepts `categories` via props.
]
const ListCategory: React.FC<{ categories?: Category[] }> = ({ categories = CATEGORIES }) => {
const ListCategory: React.FC<{ categories?: Category[] }> = ({ categories = [] }) => {
const pathname = usePathname() || ""
const isActive = (href: string) => {
......@@ -37,7 +30,7 @@ const ListCategory: React.FC<{ categories?: Category[] }> = ({ categories = CATE
<div className="border-t border-gray-200 bg-white p-2.5">
<div className="w-full px-4 sm:px-6 lg:px-8">
<div className="py-3">
<div className="flex flex-wrap gap-4 sm:gap-8 items-center max-w-full overflow-x-auto">
<div className="flex flex-wrap items-center max-w-full overflow-x-auto">
{categories.map((c) => {
const menu: Menu = { id: c.href, name: c.title, link: c.href }
const active = isActive(c.href)
......
src/app/(main)/dai-dien-gioi-chu/components/list-filter/index.tsx
View file @ 8c3aefaa
......@@ -11,16 +11,7 @@ const DEFAULT_CATEGORIES: Category[] = [
{ id: 'policy', title: 'Hỏi đáp về chính sách', count: 0 },
{ id: 'biz', title: 'Tin Doanh Nghiệp', count: 9 },
{ id: 'member', title: 'Tin Hội Viên', count: 17 },
{ id: 'law1', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law2', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law3', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law4', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law5', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law6', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law7', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law8', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law9', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law51', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
{ id: 'law', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
]
export const ListFilter: React.FC<{
......
src/app/(main)/dai-dien-gioi-chu/page.tsx
View file @ 8c3aefaa
......@@ -3,20 +3,35 @@
import Image from "next/image";
import ListCategory from "./components/list-category";
import ListFilter from "./components/list-filter";
import parse from 'html-react-parser'
import {SAMPLE_HTML} from './lib/sampleHtml'
import parse from "html-react-parser";
import { SAMPLE_HTML } from "./lib/sampleHtml";
import { PATHS } from "@constants/paths";
const Page: React.FC = () => {
return (
<div className="min-h-screen container mx-auto p-4">
<div className="min-h-screen w-full container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory />
<ListCategory
categories={[
{
title: "Chức năng Đại diện Người sử dụng lao động",
href: `${PATHS.ownerRepresentatives}`,
},
{
title: "Sự kiện – Tập huấn NSDLĐ",
href: `${PATHS.ownerRepresentatives}/tap-huan-nsdld`,
},
{
title: "Tin liên quan",
href: `${PATHS.ownerRepresentatives}/tin-lien-quan`,
},
{ title: "Chủ đề", href: `${PATHS.ownerRepresentatives}/chu-de` },
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-white border rounded-md p-6">
<div className="p-7.5 prose tiptap">{parse(SAMPLE_HTML)}</div>
<div className="p-7.5 prose tiptap">{parse(SAMPLE_HTML)}</div>
</main>
{/* Sidebar */}
......
src/app/(main)/dai-dien-gioi-chu/tap-huan-nsdld/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Chức năng Đại diện Người sử dụng lao động",
href: `${PATHS.ownerRepresentatives}`,
},
{
title: "Sự kiện – Tập huấn NSDLĐ",
href: `${PATHS.ownerRepresentatives}/tap-huan-nsdld`,
},
{
title: "Tin liên quan",
href: `${PATHS.ownerRepresentatives}/tin-lien-quan`,
},
{ title: "Chủ đề", href: `${PATHS.ownerRepresentatives}/chu-de` },
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/dai-dien-gioi-chu/tin-lien-quan/page.tsx
View file @ 8c3aefaa
......@@ -21,11 +21,21 @@ export default function Page() {
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
<ListCategory
categories={[
{ title: 'Tin liên quan', href: `${PATHS.ownerRepresentatives}/tin-lien-quan` },
{ title: 'Sự kiện', href: `${PATHS.ownerRepresentatives}/su-kien` },
{ title: 'Chủ đề', href: `${PATHS.ownerRepresentatives}/chu-de` },
{
title: "Chức năng Đại diện Người sử dụng lao động",
href: `${PATHS.ownerRepresentatives}`,
},
{
title: "Sự kiện – Tập huấn NSDLĐ",
href: `${PATHS.ownerRepresentatives}/tap-huan-nsdld`,
},
{
title: "Tin liên quan",
href: `${PATHS.ownerRepresentatives}/tin-lien-quan`,
},
{ title: "Chủ đề", href: `${PATHS.ownerRepresentatives}/chu-de` },
]}
/>
......
src/app/(main)/ho-so-thi-truong/components/map-region/index.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React from "react";
type Region = { id: string; name: string; image?: string };
export const DEFAULT_REGIONS: Region[] = [
{ id: "dong-nam-a", name: "Đông Nam Á", image: "/Dong-Nam-A-scaled.webp" },
{ id: "dong-bac-a", name: "Đông Bắc Á", image: "/Dong-Bac-A-scaled.webp" },
{ id: "nam-a", name: "Nam Á", image: "/Nam-a-scaled.webp" },
{ id: "tay-a", name: "Tây Á", image: "/Tay-a-scaled.webp" },
{ id: "bac-my", name: "Bắc Mỹ", image: "/Bac-My-1-scaled.webp" },
{ id: "nam-my", name: "Nam Mỹ", image: "/Nam-My-1-scaled.webp" },
{ id: "chau-au", name: "Châu Âu", image: "/Chau-Au-scaled.jpg.webp" },
{ id: "chau-uc", name: "Châu Úc", image: "/Chau-Uc-scaled.jpg.webp" },
{ id: "chau-phi", name: "Châu Phi", image: "/Chau-Phi-1-scaled.jpg.webp" },
];
type Props = {
imageSrc?: string; // relative to /public — default `images/map-se-asia.png`
regions?: Region[];
// controlled props (optional)
active?: string | null;
onSelect?: (id: string) => void;
};
export default function MapRegion({
imageSrc = "/images/map-se-asia.png",
regions = DEFAULT_REGIONS,
active: activeProp,
}: Props) {
// controlled usage: prefer activeProp; fallback to first region id
const active = activeProp ?? regions[0]?.id ?? null;
const activeRegion = regions.find((r) => r.id === active);
const displayedImage = activeRegion?.image ?? imageSrc;
return (
<div className="max-w-6xl mx-auto">
<div className="bg-white shadow-sm rounded-md overflow-hidden p-6">
<div className="flex flex-col gap-6">
<div>
<h3 className="text-2xl font-semibold text-primary mb-0">{activeRegion?.name ?? ""}</h3>
</div>
<div className="w-full flex items-center justify-center">
<div className="w-full max-w-3xl">
<div className="bg-gray-50 p-4 flex items-center justify-center">
<img
src={displayedImage}
alt={activeRegion?.name ?? "Map"}
className="w-full h-auto object-contain block mx-auto"
style={{ maxHeight: 520 }}
/>
</div>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/ho-so-thi-truong/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client"
import MapRegion, { DEFAULT_REGIONS } from "./components/map-region"
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
export default function Page() {
const [active, setActive] = useState<string | null>(DEFAULT_REGIONS[0]?.id ?? null)
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Hồ sơ thị trường",
href: `${PATHS.marketProfile}/`,
},
{
title: "Môi trường kinh doanh",
href: `${PATHS.tradePromotion}/moi-truong-kinh-doanh`,
},
{
title: "Cơ hội kinh doanh",
href: `${PATHS.tradePromotion}/co-hoi-kinh-doanh`,
},
{
title: "Hỗ trợ kinh doanh",
href: `${PATHS.tradePromotion}/ho-tro-kinh-doanh`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
<MapRegion active={active} />
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<div className="bg-white border rounded-md p-6">
<h3 className="text-2xl font-semibold text-primary mb-3">KHU VỰC</h3>
<nav aria-label="Khu vực" className="space-y-2">
{DEFAULT_REGIONS.map((r) => {
const isActive = r.id === active
return (
<button
key={r.id}
onClick={() => setActive(r.id)}
className={`w-full text-left px-3 py-2 flex items-center justify-between transition-colors duration-150 focus:outline-none focus:ring-2 focus:ring-primary-foreground ${
isActive
? "border-2 border-primary-foreground"
: "hover:bg-muted hover:text-primary-foreground"
}`}
aria-current={isActive ? "true" : undefined}
>
<span className={`text-sm ${isActive ? "text-primary-foreground font-semibold" : "text-primary"}`}>
{r.name}
</span>
</button>
)
})}
</nav>
</div>
</aside>
</div>
</div>
</div>
)
}
src/app/(main)/hoat-dong/dao-tao/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Sự kiện",
href: `${PATHS.event}/su-kien`,
},
{
title: "Đào tạo",
href: `${PATHS.event}/dao-tao`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/hoat-dong/su-kien/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Sự kiện",
href: `${PATHS.event}/su-kien`,
},
{
title: "Đào tạo",
href: `${PATHS.event}/dao-tao`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/an-pham/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/chuyen-de/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/thong-tin-chinh-sach-va-phap-luat/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/thu-vien-tai-lieu/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/tin-doanh-nghiep/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/tin-kinh-te/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/tin-vcci/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Tin VCCI",
href: `${PATHS.mediaInformation}/tin-vcci`,
},
{
title: "Tin kinh tế",
href: `${PATHS.mediaInformation}/tin-kinh-te`,
},
{
title: "Tin doanh nghiệp",
href: `${PATHS.mediaInformation}/tin-doanh-nghiep`,
},
{
title: "Chuyên đề",
href: `${PATHS.mediaInformation}/chuyen-de`,
},
{
title: "Thông tin chính sách và pháp luật",
href: `${PATHS.mediaInformation}/thong-tin-chinh-sach-va-phap-luat`,
},
{
title: "Ấn phẩm",
href: `${PATHS.mediaInformation}/an-pham`,
},
{
title: "Thư viện tài liệu",
href: `${PATHS.mediaInformation}/thu-vien-tai-lieu`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() => setPage(Math.min(Number(allData?.responseData.totalPages ?? 1), page + 1))}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/xuc-tien-thuong-mai/co-hoi-kinh-doanh/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Hồ sơ thị trường",
href: `${PATHS.marketProfile}/`,
},
{
title: "Môi trường kinh doanh",
href: `${PATHS.tradePromotion}/moi-truong-kinh-doanh`,
},
{
title: "Cơ hội kinh doanh",
href: `${PATHS.tradePromotion}/co-hoi-kinh-doanh`,
},
{
title: "Hỗ trợ kinh doanh",
href: `${PATHS.tradePromotion}/ho-tro-kinh-doanh`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/xuc-tien-thuong-mai/ho-tro-kinh-doanh/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Hồ sơ thị trường",
href: `${PATHS.marketProfile}/`,
},
{
title: "Môi trường kinh doanh",
href: `${PATHS.tradePromotion}/moi-truong-kinh-doanh`,
},
{
title: "Cơ hội kinh doanh",
href: `${PATHS.tradePromotion}/co-hoi-kinh-doanh`,
},
{
title: "Hỗ trợ kinh doanh",
href: `${PATHS.tradePromotion}/ho-tro-kinh-doanh`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/xuc-tien-thuong-mai/moi-truong-kinh-doanh/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Hồ sơ thị trường",
href: `${PATHS.marketProfile}/`,
},
{
title: "Môi trường kinh doanh",
href: `${PATHS.tradePromotion}/moi-truong-kinh-doanh`,
},
{
title: "Cơ hội kinh doanh",
href: `${PATHS.tradePromotion}/co-hoi-kinh-doanh`,
},
{
title: "Hỗ trợ kinh doanh",
href: `${PATHS.tradePromotion}/ho-tro-kinh-doanh`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/(main)/xuc-tien-thuong-mai/page.tsx 0 → 100644
View file @ 8c3aefaa
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
const [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5;
const { data: allData } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory
categories={[
{
title: "Hồ sơ thị trường",
href: `${PATHS.marketProfile}/`,
},
{
title: "Môi trường kinh doanh",
href: `${PATHS.tradePromotion}/moi-truong-kinh-doanh`,
},
{
title: "Cơ hội kinh doanh",
href: `${PATHS.tradePromotion}/co-hoi-kinh-doanh`,
},
{
title: "Hỗ trợ kinh doanh",
href: `${PATHS.tradePromotion}/ho-tro-kinh-doanh`,
},
]}
/>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-background ">
<div className="pb-5 overflow-hidden">
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
))}
<div className="w-full flex justify-center mt-4">
<Pagination
pageCount={Number(allData?.responseData.totalPages ?? 1)}
page={Number(allData?.responseData.currentPage ?? page)}
onChangePage={(p) => setPage(p)}
onGoToPreviousPage={() => setPage(Math.max(1, page - 1))}
onGoToNextPage={() =>
setPage(
Math.min(
Number(allData?.responseData.totalPages ?? 1),
page + 1
)
)
}
/>
</div>
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-cover"
/>
</div>
</div>
</aside>
</div>
</div>
</div>
);
}
src/app/layout.tsx
View file @ 8c3aefaa
......@@ -6,30 +6,30 @@ import links from "@links/index";
export const metadata: Metadata = {
title: 'VCCI',
description: 'Liên đoàn Thương mại và Công nghiệp Việt Nam - Chi nhánh TP.HCM',
metadataBase: new URL(links.siteURL),
alternates: { canonical: links.siteURL },
openGraph: {
title: 'VCCI - TP.HCM',
description: 'Tin tức và sự kiện từ Liên đoàn Thương mại và Công nghiệp Việt Nam - Chi nhánh TP.HCM',
url: links.siteURL,
siteName: 'VCCI HCM',
images: [
{
url: `${links.siteURL}/thumbnail.png`,
width: 1200,
height: 630,
alt: 'VCCI HCM'
}
],
locale: 'vi_VN',
type: 'website'
},
twitter: { card: 'summary_large_image', title: 'VCCI HCM', description: 'Tin tức và sự kiện từ VCCI HCM', creator: '@vcci_hcm' },
robots: { index: true, follow: true, googleBot: { index: true, follow: true } }
};
export const metadata: Metadata = {
title: 'Chức năng Đại diện Người sử dụng lao động - Liên đoàn Thương mại và Công nghiệp Việt Nam, CN TP.HCM',
description: 'Chức năng Đại diện Người sử dụng lao động (NSDLĐ):',
metadataBase: new URL(links.siteURL),
alternates: { canonical: links.siteURL },
openGraph: {
title: 'Liên đoàn Thương mại và Công nghiệp Việt Nam, CN TP.HCM',
description: 'Phòng Thương mại và Công nghiệp Việt Nam (VCCI) là tổ chức quốc gia tập hợp và đại diện cho cộng đồng doanh nghiệp, doanh nhân, người sử dụng lao động...',
url: links.siteURL,
siteName: 'Liên đoàn Thương mại và Công nghiệp Việt Nam, CN TP.HCM',
images: [
{
url: `${links.siteURL}/thumbnail.png`,
width: 1200,
height: 630,
alt: 'VCCI HCM'
}
],
locale: 'vi_VN',
type: 'website'
},
twitter: { card: 'summary_large_image', title: 'VCCI HCM', description: 'Tin tức và sự kiện từ VCCI HCM', creator: '@vcci_hcm' },
robots: { index: true, follow: true, googleBot: { index: true, follow: true } }
};
export default function RootLayout({
children,
......
src/constants/paths.ts
View file @ 8c3aefaa
......@@ -3,8 +3,10 @@ export const PATHS = {
general: '/gioi-thieu',
ownerRepresentatives: '/dai-dien-gioi-chu',
serviceDetail: '/dich-vu/[id]',
recruitment: '/tuyen-dung',
event:'/hoat-dong',
marketProfile: '/ho-so-thi-truong',
tradePromotion: '/xuc-tien-thuong-mai',
mediaInformation:'/thong-tin-truyen-thong',
recruitmentDetail: '/tuyen-dung/[id]',
newsPage: '/tin-tuc',
newsDetail: '/tin-tuc/[id]',
......
src/styles/_utilities.css
View file @ 8c3aefaa
......@@ -3,7 +3,7 @@
@apply mr-auto ml-auto px-4;
@media (width >= 80rem) {
@apply px-40;
@apply px-15;
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment