Skip to content

V
VCCI-News
Commit b9ca187b authored by Văn Hoàng's avatar Văn Hoàng
Browse files
Options

Merge branch 'develop' into 'feat/home_page' 

# Conflicts:
#   src/app/(main)/hoi-vien/ket-noi-hoi-vien/page.tsx
#   src/app/(main)/hoi-vien/tin-hoi-vien/page.tsx
parents ba2bcf3b fc8def4e
Hide whitespace changes
Inline Side-by-side
Showing with 2225 additions and 545 deletions
src/app/(main)/dai-dien-gioi-chu/chu-de/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import { PATHS } from "@constants/paths";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { OWNER_REPRESENTATIVES_CATEGORIES } from "@constants/categories";
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";
......@@ -21,23 +21,7 @@ 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
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` },
]}
/>
<ListCategory categories={OWNER_REPRESENTATIVES_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/dai-dien-gioi-chu/chuc-nang-dai-dien-nguoi-su-dung-lao-dong/page.tsx 0 → 100644
View file @ b9ca187b
// Core
import Image from "next/image";
import ListCategory from "../components/list-category";
import { OWNER_REPRESENTATIVES_CATEGORIES } from "@constants/categories";
import ListFilter from "../components/list-filter";
import parse from "html-react-parser";
import { SAMPLE_HTML } from "../lib/sampleHtml";
// ...existing code...
const Page: React.FC = () => {
return (
<div className="min-h-screen w-full container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory categories={OWNER_REPRESENTATIVES_CATEGORIES} />
<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>
</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>
);
};
export default Page;
src/app/(main)/dai-dien-gioi-chu/components/card-news/index.tsx
View file @ b9ca187b
......@@ -14,6 +14,10 @@ function NewsContent({ news }: { news: NewsItem }) {
src={`${Links.imageEndpoint}${news.thumbnail}`}
alt={news.title}
className="w-full sm:w-56 md:w-64 h-40 md:h-36 object-cover shrink-0"
onError={(e) => {
e.currentTarget.src = "/img-error.png"
}}
/>
<div className="flex-1 min-w-0 pl-0 sm:pl-4">
......
src/app/(main)/dai-dien-gioi-chu/components/list-filter/index.tsx
View file @ b9ca187b
"use client"
import React, { useState } from 'react'
import React, { useState, useEffect } from 'react'
import { Checkbox } from '@/components/ui/checkbox'
import { Input } from '@/components/ui/input'
import { Button } from '@/components/ui/button'
type Category = { id: string; title: string; count: number }
const DEFAULT_CATEGORIES: Category[] = [
{ id: 'ceo', title: 'CEO', count: 4 },
{ 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: 'law', title: 'Văn bản Pháp luật sắp có hiệu lực', count: 30 },
]
export const ListFilter: React.FC<{
categories?: Category[]
onSearch?: (q: string) => void
onReset?: () => void
}> = ({ categories = DEFAULT_CATEGORIES, onSearch, onReset }) => {
}> = ({ categories, onSearch, onReset }) => {
const [query, setQuery] = useState('')
const [visibleCount, setVisibleCount] = useState(5)
const [selected, setSelected] = useState<Record<string, boolean>>(() => {
const map: Record<string, boolean> = {}
categories.forEach((c) => (map[c.id] = false))
if (categories && categories.length) {
categories.forEach((c: Category) => (map[c.id] = false))
}
return map
})
// Keep selected map in sync when categories prop changes.
// Defer setSelected to avoid calling setState synchronously inside the effect.
useEffect(() => {
const timer = setTimeout(() => {
setSelected((prev) => {
const map: Record<string, boolean> = {}
if (categories && categories.length) {
categories.forEach((c: Category) => (map[c.id] = !!prev[c.id]))
}
return map
})
}, 0)
return () => clearTimeout(timer)
}, [categories])
const toggle = (id: string) => setSelected((s) => ({ ...s, [id]: !s[id] }))
return (
......@@ -47,18 +56,20 @@ export const ListFilter: React.FC<{
/>
</div>
<div className="flex flex-col gap-3 mb-6">
{categories.slice(0, visibleCount).map((c) => (
<label key={c.id} className="flex items-center gap-3">
<Checkbox checked={!!selected[c.id]} onCheckedChange={() => toggle(c.id)} />
<div className="flex justify-between w-full items-center">
<span className="text-sm">{c.title}</span>
<span className="text-sm text-gray-400">({c.count})</span>
</div>
</label>
))}
<div className="flex flex-col gap-3">
{categories && categories.length > 0 ? (
categories.slice(0, visibleCount).map((c) => (
<label key={c.id} className="flex items-center gap-3">
<Checkbox checked={!!selected[c.id]} onCheckedChange={() => toggle(c.id)} />
<div className="flex justify-between w-full items-center">
<span className="text-sm">{c.title}</span>
<span className="text-sm text-gray-400">({c.count})</span>
</div>
</label>
))
) : null}
<div className="mt-2 flex items-center gap-3">
{categories.length > visibleCount && (
{(categories?.length ?? 0) > visibleCount && (
<button
className="text-sm text-primary self-start"
onClick={() => setVisibleCount((v) => v + 5)}
......@@ -84,15 +95,17 @@ export const ListFilter: React.FC<{
</Button>
<Button
className="flex-1 rounded-none font-medium text-lg text-white hover:bg-muted-foreground hover:outline-1 outline-primary hover:text-primary"
onClick={() => {
setQuery('')
// restore initial map
const map: Record<string, boolean> = {}
categories.forEach((c) => (map[c.id] = false))
setSelected(map)
setVisibleCount(5)
onReset?.()
}}
onClick={() => {
setQuery('')
// restore initial map
const map: Record<string, boolean> = {}
if (categories && categories.length) {
categories.forEach((c) => (map[c.id] = false))
}
setSelected(map)
setVisibleCount(5)
onReset?.()
}}
>
Bỏ tìm
</Button>
......
src/app/(main)/dai-dien-gioi-chu/page.tsx
View file @ b9ca187b
"use client"
// Core
import Image from "next/image";
import React, { useEffect } from 'react'
import { useRouter } from 'next/navigation'
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 { PATHS } from "@constants/paths";
const Page: React.FC = () => {
return (
<div className="min-h-screen w-full 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` },
]}
/>
import { OWNER_REPRESENTATIVES_CATEGORIES } from "@constants/categories";
<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>
</main>
const Page = () => {
const router = useRouter()
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
useEffect(() => {
const firstHref = `${PATHS.ownerRepresentatives}/chuc-nang-dai-dien-nguoi-su-dung-lao-dong`
router.push(firstHref)
}, [router])
<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>
return (
<div className="min-h-screen w-full container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory categories={OWNER_REPRESENTATIVES_CATEGORIES} />
</div>
</div>
);
......
src/app/(main)/dai-dien-gioi-chu/tap-huan-nsdld/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import { OWNER_REPRESENTATIVES_CATEGORIES } from "@constants/categories";
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";
......@@ -21,23 +21,7 @@ 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
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` },
]}
/>
<ListCategory categories={OWNER_REPRESENTATIVES_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/dai-dien-gioi-chu/tin-lien-quan/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import { OWNER_REPRESENTATIVES_CATEGORIES } from "@constants/categories";
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";
......@@ -21,23 +21,7 @@ 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
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` },
]}
/>
<ListCategory categories={OWNER_REPRESENTATIVES_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -60,10 +44,10 @@ export default function Page() {
</main>
{/* Sidebar */}
<aside className="space-y-6">
<aside className="space-y-6 order-first lg:order-last">
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="bg-white border rounded-md overflow-hidden hidden lg:block">
<div className="w-full h-56 relative bg-gray-100">
<Image
src="/banner.webp"
......
src/app/(main)/ho-so-thi-truong/page.tsx
View file @ b9ca187b
......@@ -2,11 +2,8 @@
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";
import { TRADE_PROMOTION_CATEGORIES } from "@constants/categories";
// ...existing code...
export default function Page() {
const [active, setActive] = useState<string | null>(DEFAULT_REGIONS[0]?.id ?? null)
......@@ -14,26 +11,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={TRADE_PROMOTION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/hoat-dong/dao-tao/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import { EVENT_CATEGORIES } from "@constants/categories";
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";
......@@ -21,18 +21,7 @@ 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
categories={[
{
title: "Sự kiện",
href: `${PATHS.event}/su-kien`,
},
{
title: "Đào tạo",
href: `${PATHS.event}/dao-tao`,
},
]}
/>
<ListCategory categories={EVENT_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/hoat-dong/page.tsx 0 → 100644
View file @ b9ca187b
"use client";
import React, { useEffect } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import { EVENT_CATEGORIES } from "@constants/categories";
import { useRouter } from "next/navigation";
// ...existing code...
export default function Page() {
const router = useRouter();
useEffect(() => {
const firstHref = `${PATHS.event}/su-kien`;
router.push(firstHref);
}, [router]);
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory categories={EVENT_CATEGORIES} />
</div>
</div>
);
}
src/app/(main)/hoat-dong/su-kien/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import { EVENT_CATEGORIES } from "@constants/categories";
import EventFilter from "@app/dai-dien-gioi-chu/components/event-filter";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
// ...existing code...
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);
......@@ -21,18 +23,7 @@ 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
categories={[
{
title: "Sự kiện",
href: `${PATHS.event}/su-kien`,
},
{
title: "Đào tạo",
href: `${PATHS.event}/dao-tao`,
},
]}
/>
<ListCategory categories={EVENT_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/hoi-vien/ket-noi-hoi-vien/page.tsx
View file @ b9ca187b
......@@ -3,32 +3,32 @@ import React, { useState } from "react";
import ListCategory from "./../components/list-category";
import ListFilter from "./../components/list-filter";
import CardNews from "./../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'
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 [submitSearch] = useState("");
const [page, setPage] = useState(1);
const pageSize = 5
const { data: allData, isLoading } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
})
return (
<div className="min-h-screen container mx-auto pb-4">
<div className="w-full flex flex-col gap-5">
<ListCategory />
<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) => (
<CardNews key={news.id} news={news} />
))}
const pageSize = 5;
const { data: allData, isLoading } = useGetNews<GetNewsResponseType>({
pageSize: String(pageSize),
currentPage: String(page),
filters: submitSearch ? `title @=${submitSearch}` : undefined,
});
return (
<div className="min-h-screen container mx-auto pb-4">
<div className="w-full flex flex-col gap-5">
<ListCategory />
<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) => (
<CardNews key={news.id} news={news} />
))}
<div className='w-full flex justify-center mt-4'>
<Pagination
......@@ -49,12 +49,12 @@ export default function Page() {
</div>
</main>
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
</aside>
</div>
</div>
</div>
);
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
</aside>
</div>
</div>
</div>
);
}
\ No newline at end of file
src/app/(main)/thong-tin-truyen-thong/an-pham/page.tsx
View file @ b9ca187b
"use client";
import React, { useState } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from '@constants/paths'
import { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
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";
......@@ -21,38 +21,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......
src/app/(main)/thong-tin-truyen-thong/chuyen-de/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
......@@ -21,38 +22,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,7 +46,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/thong-tin-truyen-thong/page.tsx
View file @ b9ca187b
"use client";
import React, { useEffect } from "react";
import ListCategory from "@app/dai-dien-gioi-chu/components/list-category";
import { PATHS } from "@constants/paths";
import { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
import { useRouter } from 'next/navigation'
// ...existing code...
export default function Page() {
const router = useRouter()
useEffect(() => {
const firstHref = `${PATHS.mediaInformation}/tin-vcci`
router.push(firstHref)
}, [router])
return (
<div className="min-h-screen container mx-auto p-4">
<div className="w-full flex flex-col gap-5">
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
</div>
</div>
);
}
src/app/(main)/thong-tin-truyen-thong/thong-tin-chinh-sach-va-phap-luat/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
......@@ -21,38 +22,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,7 +46,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/thong-tin-truyen-thong/thu-vien-tai-lieu/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
......@@ -21,38 +22,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,7 +46,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/thong-tin-truyen-thong/tin-doanh-nghiep/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
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";
......@@ -21,38 +22,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,7 +46,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<ListFilter />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/thong-tin-truyen-thong/tin-kinh-te/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
......@@ -21,38 +21,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,7 +45,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
{/* <EventFilter /> */}
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/thong-tin-truyen-thong/tin-vcci/page.tsx
View file @ b9ca187b
"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 { MEDIA_INFORMATION_CATEGORIES } from "@constants/categories";
// ...existing code...
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import ListFilter from "@app/dai-dien-gioi-chu/components/list-filter";
import EventCalendar from "@app/dai-dien-gioi-chu/components/event-calendar";
import { Pagination} from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
......@@ -21,38 +23,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={MEDIA_INFORMATION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -76,8 +47,8 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<EventFilter />
<ListFilter />
<EventCalendar/>
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
<Image
......
src/app/(main)/xuat-xu-hang-hoa/bieu-mau-c-o-va-cach-khai/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Biểu mẫu C/O và cách khai
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<ol className="list-decimal pl-6 space-y-6 text-[16px]">
{/* 1. Đăng ký hồ sơ thương nhân */}
<li className="leading-relaxed">
<strong>Đăng ký hồ sơ thương nhân:</strong>
<br />
<strong>Đăng ký Hồ sơ thương nhân</strong> (
<em>
áp dụng đối với thương nhân đề nghị cấp C/O lần đầu hoặc
bổ sung khi có thay đổi thông tin của thương nhân hoặc cập
nhật 2 năm/lần theo quy định
</em>
).
</li>
{/* 2. Biểu mẫu về C/O */}
<li className="leading-relaxed">
<strong>Biểu mẫu về C/O:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Đơn đề nghị cấp C/O</strong>;
</li>
<li>
<strong>C/O mẫu A</strong> (
<em>
C/O ưu đãi thuế quan phổ cập (GSP) theo quy định của
nước nhập khẩu
</em>
);
</li>
<li>
<strong>C/O mẫu B</strong> (
<em>
C/O không ưu đãi theo quy định tại Thông tư
05/2018/TT-BCT ngày 3/4/2018
</em>
);
</li>
<li>
<strong>C/O mẫu ICO</strong> (
<em>
Cấp cho hàng cà phê theo quy định của Tổ chức Cà phê
Quốc tế
</em>
);
</li>
<li>
<strong>C/O mẫu Turkey</strong> (
<em>Thổ Nhĩ Kỳ – Tương đương C/O mẫu B</em>);
</li>
<li>
<strong>C/O mẫu DA59</strong> (
<em>Nam Phi – Tương đương C/O mẫu B</em>);
</li>
<li>
<strong>C/O mẫu Peru</strong> (
<em>Peru – Tương đương C/O mẫu B</em>);
</li>
<li>
<strong>
Giấy chứng nhận hàng hóa không thay đổi xuất xứ (CNM)
</strong>
;
</li>
<li>
<strong>
Mẫu các bảng kê khai nguyên vật liệu sử dụng trong sản
xuất hàng hóa xuất khẩu
</strong>{" "}
khi đề nghị cấp C/O;
</li>
<li>
<strong>
Mẫu đơn đề nghị xét giảm chứng từ nguyên vật liệu
</strong>{" "}
trong hồ sơ đề nghị cấp C/O;
</li>
<li>
<strong>Mẫu đơn đề nghị cấp mã số REX</strong>.
</li>
</ul>
</li>
{/* 3. Mẫu khác */}
<li className="leading-relaxed">
<strong>Mẫu khác:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Mẫu GCN</strong> (
<em>
Giấy chứng nhận cho hàng hóa không đáp ứng quy định về
xuất xứ
</em>
);
</li>
<li>
<strong>Mẫu đề nghị thay đổi nơi cấp C/O</strong>.
</li>
</ul>
</li>
</ol>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/components/Calendar/index.tsx 0 → 100644
View file @ b9ca187b
"use client";
import React, { useState, useMemo } from "react";
import {
format,
startOfMonth,
endOfMonth,
eachDayOfInterval,
isSameMonth,
isSameDay,
addMonths,
subMonths,
} from "date-fns";
import { ArrowLeft, ArrowRight, ChevronLeft, ChevronRight } from "lucide-react";
import { vi } from "date-fns/locale";
interface Event {
date: Date;
title: string;
type: "event" | "training";
description?: string;
}
export default function Calendar() {
const [currentMonth, setCurrentMonth] = useState(new Date());
const today = new Date();
// Dữ liệu mẫu
const events: Event[] = [
{
date: new Date(2025, 10, 1),
title: "Đào tạo nội bộ",
type: "training",
description: "Khóa học kỹ năng mềm",
},
{
date: new Date(2025, 10, 3),
title: "Họp cổ đông",
type: "event",
description: "Báo cáo Q3",
},
{
date: new Date(2025, 10, 13),
title: "Đào tạo kỹ thuật",
type: "training",
description: "React Advanced",
},
{
date: new Date(2025, 10, 14),
title: "Đào tạo an toàn",
type: "training",
description: "An toàn lao động",
},
{
date: new Date(2025, 10, 20),
title: "Hội thảo thuế",
type: "event",
description:
"Cập nhật luật thuế thu nhập doanh nghiệp số 67/2025/QH15...",
},
{
date: new Date(2025, 10, 28),
title: "Sự kiện nội bộ",
type: "event",
description: "Team building",
},
];
const monthStart = startOfMonth(currentMonth);
const monthEnd = endOfMonth(currentMonth);
const monthDays = eachDayOfInterval({ start: monthStart, end: monthEnd });
const firstDayOfWeek = monthStart.getDay(); // 0 = CN, 1 = T2...
const startDate = new Date(monthStart);
startDate.setDate(startDate.getDate() - firstDayOfWeek);
const days = [];
for (let i = 0; i < 42; i++) {
const day = new Date(startDate);
day.setDate(startDate.getDate() + i);
days.push(day);
}
const getEventForDay = (date: Date) =>
events.filter((e) => isSameDay(e.date, date));
const formatMonthTitle = () => {
return `THÁNG ${format(currentMonth, "M/yyyy")}`.toUpperCase();
};
return (
<>
<div className="w-full mx-auto bg-white rounded-lg p-4 ">
{/* Header */}
<div className="flex items-center justify-between mb-4 px-3">
<h2 className="text-[15px] font-bold text-[#063E8E]">
{formatMonthTitle()}
</h2>
<div className="flex gap-3">
<button
onClick={() => setCurrentMonth(subMonths(currentMonth, 1))}
className="p-2 cursor-pointer rounded-full group border-3 border-[#363636] hover:border-[#063e8e] transition"
>
<ArrowLeft className="group-hover:text-[#e8c518] text-[#363636] w-5 h-5" />
</button>
<button
onClick={() => setCurrentMonth(addMonths(currentMonth, 1))}
className="p-2 cursor-pointer rounded-full group border-3 border-[#363636] hover:border-[#063e8e] transition"
>
<ArrowRight className="group-hover:text-[#e8c518] text-[#363636] w-5 h-5" />
</button>
</div>
</div>
{/* Days of week */}
<div className="grid grid-cols-7 text-center text-sm font-medium text-gray-600 mb-1">
{["CN", "T2", "T3", "T4", "T5", "T6", "T7"].map((day) => (
<div key={day} className="py-2 text-[15px] text-[#063E8E]">
{day}
</div>
))}
</div>
{/* Calendar grid */}
<div className="grid grid-cols-7 gap-1 text-sm">
{days.map((day, idx) => {
const dayEvents = getEventForDay(day);
const isCurrentMonth = isSameMonth(day, currentMonth);
const isToday = isSameDay(day, today);
const hasEvent = dayEvents.some((e) => e.type === "event");
const hasTraining = dayEvents.some((e) => e.type === "training");
return (
<div
key={idx}
className={`
relative group aspect-square flex items-center justify-center rounded-full
${!isCurrentMonth ? "text-[#A4A4A4]" : "text-[#333333]"}
${hasEvent || hasTraining ? "text-white" : "text-[#333333]"}
${isToday ? "text-red-600 font-bold" : ""}
hover:bg-gray-50 transition
`}
>
<span className="relative z-10">{format(day, "d")}</span>
{/* Event/Training dots */}
{(hasEvent || hasTraining) && (
<div className="absolute inset-0 flex items-center justify-center pointer-events-none">
<div className="flex">
{hasEvent && (
<div className="w-10 h-10 bg-blue-600 rounded-full"></div>
)}
{hasTraining && (
<div className="w-10 h-10 bg-yellow-500 rounded-full"></div>
)}
</div>
</div>
)}
{/* Tooltip on hover */}
{dayEvents.length > 0 && (
<div
className="absolute top-full left-1/2 -translate-x-1/2 mt-2
w-64 p-3 bg-gray-900 text-white text-xs rounded-lg
shadow-xl opacity-0 pointer-events-none
group-hover:opacity-90 transition-opacity z-50"
>
<div className="space-y-2">
{dayEvents.map((event, i) => (
<div
key={i}
className="border-b border-gray-700 border-opacity-20 last:border-0 pb-2 last:pb-0"
>
<div className="flex items-center gap-2">
<div
className={`w-3 h-3 rounded-full ${
event.type === "event"
? "bg-blue-400"
: "bg-yellow-400"
}`}
></div>
<span className="font-medium">{event.title}</span>
</div>
{event.description && (
<p className="text-gray-300 mt-1 text-xs">
{event.description}
</p>
)}
</div>
))}
</div>
{/* Mũi tên nhọn HƯỚNG LÊN (chỉ vào ngày) */}
<div
className="absolute bottom-full left-1/2 -translate-x-1/2 -mb-1
w-0 h-0
border-l-8 border-l-transparent
border-r-8 border-r-transparent
border-b-8 border-b-gray-900"
></div>
</div>
)}
</div>
);
})}
</div>
{/* Legend */}
<div className="flex justify-center gap-6 mt-4 text-xs">
<div className="flex items-center gap-2">
<div className="w-3 h-3 bg-blue-600 rounded-full"></div>
<span>Sự kiện</span>
</div>
<div className="flex items-center gap-2">
<div className="w-3 h-3 bg-yellow-500 rounded-full"></div>
<span>Đào tạo</span>
</div>
</div>
</div>
</>
);
}
src/app/(main)/xuat-xu-hang-hoa/components/list-category/index.tsx 0 → 100644
View file @ b9ca187b
"use client";
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;
name: string;
link?: string;
};
type Category = {
title: string;
href: string;
};
const CATEGORIES: Category[] = [
{ title: "Xuất Xứ Hàng Hóa (C/O)", href: "/xuat-xu-hang-hoa" },
{
title: "Mục đích của C/O",
href: `${PATHS.originOfGoods}/muc-dich`,
},
{
title: "Luật áp dụng về C/O",
href: `${PATHS.originOfGoods}/luat-ap-dung`,
},
{ title: "Thủ tục cấp C/O", href: `${PATHS.originOfGoods}/thu-tuc-cap` },
{
title: "Biểu mẫu C/O và cách khai",
href: `${PATHS.originOfGoods}/bieu-mau-c-o-va-cach-khai`,
},
{
title: "Phí và Lệ phí cấp C/O",
href: `${PATHS.originOfGoods}/phi-va-le-phi-cap`,
},
{
title: "Điểm cấp và Thời gian cấp C/O",
href: `${PATHS.originOfGoods}/diem-cap-va-thoi-gian-cap`,
},
{
title: "Thông tin liên hệ",
href: `${PATHS.originOfGoods}/thong-tin-lien-he`,
},
];
const ListCategory: React.FC<{ categories?: Category[] }> = ({
categories = CATEGORIES,
}) => {
const pathname = usePathname() || "";
const isActive = (href: string) => {
// treat the base path as active for nested routes as well
if (href === "/gioi-thieu")
return pathname === href || pathname.startsWith(href + "/");
return pathname === href;
};
return (
<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 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);
return (
<div key={c.href} className="shrink-0">
<MenuItem menu={menu} active={active} />
</div>
);
})}
</div>
</div>
</div>
</div>
);
};
export default ListCategory;
src/app/(main)/xuat-xu-hang-hoa/components/menu-category/index.tsx 0 → 100644
View file @ b9ca187b
'use client'
type Menu = {
id: string | number
name: string
link?: string
children?: Array<{ id: string | number; name: string; link?: string }>
}
import { buttonVariants } from '@components/ui/button'
import { cn } from '@lib/utils'
import { useCallback, useMemo } from 'react'
import { HoverCard, HoverCardTrigger, HoverCardContent } from '@components/ui/hover-card'
import { cva } from 'class-variance-authority'
import { usePathname } from 'next/navigation'
import Link from 'next/link'
export function MenuItem(props: { variant?: 'main' | 'secondary' ; menu: Menu; active?: boolean }) {
const { menu, variant = 'main', active } = props
const pathname = usePathname()
const linkId = useMemo(() => `trigger_${menu.id}`, [menu.id])
const hoverCardRef = useCallback(
(element: HTMLDivElement) => {
if (!element) return
element.style.minWidth = `${document.getElementById(linkId)?.offsetWidth ?? 0}px`
},
[linkId]
)
return (
<HoverCard openDelay={0} closeDelay={0}>
<HoverCardTrigger asChild>
<Link
aria-selected={active || pathname == menu.link}
id={linkId}
target={(menu.link ?? '').startsWith('/') ? '_self' : '_blank'}
href={menu.link ?? '/'}
className={menuItemTriggerVariant({ variant })}
>
{menu.name}
</Link>
</HoverCardTrigger>
{menu.children && (
<HoverCardContent ref={hoverCardRef} className={menuItemHoverBoxVariant({ variant })}>
{menu.children.map((subMenu) => (
<Link key={subMenu.id} href={subMenu.link ?? '/'} className={menuItemChildVariant({ variant })}>
{subMenu.name}
</Link>
))}
</HoverCardContent>
)}
</HoverCard>
)
}
const menuItemTriggerVariant = cva(
cn(buttonVariants({ variant: 'ghost' }), 'font-semibold focus-visible:ring-0 focus-visible:ring-offset-0 py-'),
{
variants: {
variant: {
main: cn(
'font-semibold text-[#363636] text-2xl hover:text-muted-foreground hover:bg-white py-3.5 px-5',
'aria-selected:text-muted-foreground'
),
secondary: cn(
'font-boldtext-primary border-t-2 border-t-transparent rounded-none',
'hover:text-primary/90',
'aria-selected:border-t-secondary aria-selected:bg-accent',
'aria-selected:bg-[#E9C826]'
)
}
},
defaultVariants: {
variant: 'main'
}
}
)
const menuItemHoverBoxVariant = cva('flex w-full flex-col gap-2 p-0', {
variants: {
variant: {
main: 'bg-secondary',
secondary: 'bg-muted '
}
},
defaultVariants: {
variant: 'main'
}
})
const menuItemChildVariant = cva(cn(buttonVariants({ variant: 'ghost' }), 'justify-start'), {
variants: {
variant: {
main: 'text-secondary-foreground hover:text-muted-foreground hover:bg-secondary',
secondary: 'text-accent-foreground hover:text-primary/90 '
}
},
defaultVariants: {
variant: 'main'
}
})
src/app/(main)/xuat-xu-hang-hoa/diem-cap-va-thoi-gian-cap/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Điểm cấp và Thời gian cấp C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<ol className="list-decimal pl-6 space-y-6 text-[16px]">
{/* 1. CÁC TỔ CẤP C/O THUỘC CHI NHÁNH VCCI TẠI TP. HCM */}
<li className="leading-relaxed">
<strong>
CÁC TỔ CẤP C/O THUỘC CHI NHÁNH PHÒNG THƯƠNG MẠI & CÔNG
NGHIỆP TẠI TP. HCM
</strong>
<sup className="text-[10px] align-super ml-0.5">1</sup>:
<ol className="list-decimal pl-6 mt-3 space-y-2">
<li>
<strong>Tổ cấp C/O tại TP. HCM:</strong>
<br />
<strong>
Lầu 1, Tòa nhà VCCI HCM, 171 Võ Thị Sáu, Q. 3, Tp. HCM
</strong>
<br />
<strong>Điện thoại:</strong> 028-3932 6498 / 3932 2806
</li>
<li>
<strong>
Tổ cấp C/O tại Bình Dương (DN tại Tỉnh Bình Dương):
</strong>
<br />
<strong>
Lầu 3, Tòa nhà Công ty CP ICD Tân Cảng Sóng Thần, Số
7/20, Đường ĐT 743, KP. Bình Đáng, P. Bình Hòa, TX.
Thuận An, T. Bình Dương
</strong>
<br />
<strong>Điện thoại:</strong> 0274-380 0048
</li>
<li>
<strong>
Tổ cấp C/O tại Đồng Nai (DN tại Tỉnh Đồng Nai):
</strong>
<br />
<strong>
Tòa nhà Sonadezi, số 1 đường 3A, KCN Biên Hòa 2, T.
Đồng Nai
</strong>
<br />
<strong>Điện thoại:</strong> 0251-383 1383
</li>
</ol>
</li>
{/* 2. GIỜ TIẾP NHẬN HỒ SƠ */}
<li className="leading-relaxed">
<strong>GIỜ TIẾP NHẬN HỒ SƠ:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Từ thứ Hai đến thứ Sáu:</strong>
<br />
<strong>Buổi sáng:</strong> 7h30 – 11h30
<br />
<strong>Buổi chiều:</strong> 13h30 – 16h30
</li>
<li>
<strong>Thứ Bảy:</strong> 7h30 – 11h30 (
<em>
Riêng Tổ cấp C/O tại Đồng Nai không làm việc sáng thứ
7
</em>
)
</li>
</ul>
<p className="mt-2 font-medium text-[#363636]">
* Từ <strong>28/11/2020</strong> các Tổ cấp C/O thuộc VCCI
tại <strong>Tp.HCM, Bình Dương và Đồng Nai</strong>{" "}
<strong>tạm nghỉ làm việc sáng thứ 7</strong>. Đề nghị đại
diện Doanh nghiệp thu xếp thời gian đến liên hệ cấp C/O
phù hợp.
</p>
</li>
{/* 3. THỜI GIAN CẤP C/O */}
<li className="leading-relaxed">
<strong>THỜI GIAN CẤP C/O</strong>
<sup className="text-[10px] align-super ml-0.5">2</sup>:
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Tổ cấp C/O tại TP. HCM:</strong>{" "}
<strong>Không quá 08 giờ làm việc</strong>
</li>
<li>
<strong>Tổ cấp C/O tại Bình Dương:</strong>{" "}
<strong>Không quá 08 giờ làm việc</strong>
</li>
<li>
<strong>Tổ cấp C/O tại Đồng Nai:</strong>{" "}
<strong>Không quá 08 giờ làm việc</strong>
</li>
</ul>
</li>
</ol>
{/* Chú thích cuối trang */}
<div className="mt-6 pt-4 text-sm text-gray-700">
<div className="h-[1px] w-[170px] bg-black mb-3"></div>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">1</sup> Doanh
nghiệp thuộc tỉnh Bình Dương hoặc Đồng Nai có quyền lựa chọn
điểm cấp C/O tại địa phương hoặc tại TP. HCM theo đề nghị
của doanh nghiệp. Lưu ý một doanh nghiệp chỉ được quyền đề
nghị cấp C/O tại một điểm cấp theo đề nghị của doanh nghiệp,
không áp dụng cùng lúc cho một doanh nghiệp đề nghị cấp C/O
tại nhiều điểm cấp.
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">2</sup> Tại tất cả
các tổ cấp C/O, khi doanh nghiệp cần C/O gấp có thể đề nghị,
đăng ký ký gấp. Thời gian xét cấp gấp không quá 01 giờ làm
việc.
</p>
</div>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/luat-ap-dung/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Luật áp dụng về C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<p className="mb-6 leading-relaxed text-[16px]">
<strong>Xuất xứ hàng hóa</strong> là các quy tắc và yêu cầu
liên quan để xác định hàng hóa có nguồn gốc tại một nước hoặc
vùng lãnh thổ cụ thể theo từng{" "}
<strong>quy tắc xuất xứ cụ thể</strong>. Các quy tắc xuất xứ
chỉ áp dụng đối với <strong>hàng hóa hữu hình</strong> được
phân loại trong <strong>danh mục mã HS</strong> hàng hóa của{" "}
<strong>Tổ chức Hải quan Thế giới (WCO)</strong>,{" "}
<strong>không áp dụng</strong> để xác định hàng hóa như{" "}
<em>
dịch vụ, quyền sở hữu trí tuệ, và nguồn gốc của con người
</em>
.
</p>
<ol className="list-decimal pl-6 space-y-4 text-[16px]">
<li className="leading-relaxed">
<strong>Quy định chung:</strong>
<br />
<strong>Nghị định số 31/2018/NĐ-CP</strong> ngày 08 tháng 3
năm 2018 quy định chi tiết{" "}
<strong>Luật Quản lý ngoại thương</strong> về xuất xứ hàng
hóa.
</li>
<li className="leading-relaxed">
<strong>
Quy tắc xuất xứ không ưu đãi của Việt Nam (C/O mẫu B, mẫu
DA59, mẫu Peru, Turkey, …):
</strong>
<br />
<strong>Thông tư 05/2018/TT-BCT</strong> ngày 03 tháng 4 năm
2018 của <strong>Bộ Công Thương</strong> (Quy định về xuất
xứ hàng hóa).
</li>
<li className="leading-relaxed">
<strong>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập – GSP (C/O mẫu
A):
</strong>
<br />
<strong>Hệ thống Ưu đãi Thuế quan Phổ cập</strong> hay gọi
tắt là{" "}
<strong>GSP (Generalized System of Preferences)</strong> là
hệ thống ưu đãi thuế quan được các nước giàu hay còn gọi là{" "}
<strong>các nước phát triển</strong> dành cho{" "}
<strong>
các nước đang phát triển và các nước kém phát triển (nước
thụ hưởng)
</strong>{" "}
hưởng ưu đãi về <strong>miễn hoặc giảm thuế</strong>. Hàng
hóa xuất khẩu từ các nước thụ hưởng phải đáp ứng đầy đủ các
yêu cầu về <strong>quy tắc xuất xứ ưu đãi</strong> theo quy
định của nước cho hưởng (EU, Thụy Sỹ, Canada, Nhật Bản, …).
<ul className="list-disc pl-6 mt-2 space-y-1 text-[16px]">
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Liên minh châu Âu
</em>{" "}
(
<strong>
Handbook on The Scheme of European Union
</strong>
);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của Na
Uy
</em>{" "}
(<strong>Handbook on The Scheme of Norway</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Thụy Sỹ
</em>{" "}
(<strong>Handbook on The Scheme of Switzerland</strong>
);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Nhật Bản
</em>{" "}
(<strong>Handbook on The Scheme of Japan</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Canada
</em>{" "}
(<strong>Handbook on The Scheme of Canada</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của New
Zealand
</em>{" "}
(<strong>Handbook on The Scheme of New Zealand</strong>
);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Australia
</em>{" "}
(<strong>Handbook on The Scheme of Australia</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của Hoa
Kỳ
</em>{" "}
(<strong>Handbook on The Scheme of US</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của Thổ
Nhĩ Kỳ
</em>{" "}
(<strong>Handbook on The Scheme of Turkey</strong>);
</li>
<li>
<em>
Quy tắc xuất xứ ưu đãi thuế quan phổ cập (GSP) của
Nga, Belarus, Kazakhstan
</em>{" "}
(
<strong>
Handbook on The Scheme of Russia-Belarus-Kazakhstan
</strong>
).
</li>
</ul>
</li>
<li className="leading-relaxed">
<strong>
Quy tắc xuất xứ trong các Hiệp định thương mại tự do
(FTA):
</strong>
<br />
<a
href="https://ecosys.gov.vn/Homepage/DocumentView.aspx"
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 underline hover:text-blue-800"
>
https://ecosys.gov.vn/Homepage/DocumentView.aspx
</a>
</li>
<li className="leading-relaxed">
<strong>Quy định khác liên quan:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1 text-[16px]">
<li>
<em>
Danh mục hàng hóa xuất, nhập khẩu có hiệu lực từ ngày
01/01/2018 – Phân loại HS
</em>{" "}
(<strong>Thông tư 65/2017/TT-BTC</strong> ngày 26/6/2017
của <strong>Bộ Tài Chính</strong>);
</li>
<li>
<em>
Quy định về xử phạt vi phạm hành chính trong hoạt động
thương mại
</em>{" "}
(<strong>Nghị định 98/2020/NĐ-CP</strong> ngày 26/8/2020
của <strong>Chính phủ</strong>);
</li>
<li>
<em>Kiểm dịch động vật, sản phẩm động vật trên cạn</em>{" "}
(<strong>Thông tư 25/2016/TT-BNNPTNT</strong> ngày 30
tháng 6 năm 2016);
</li>
<li>
<em>Quy định về kinh doanh xuất khẩu gạo</em> (
<strong>Nghị định số 107/2018/ND-CP</strong> ngày
15/8/2018 của <strong>Chính phủ</strong>);
</li>
<li>
<em>
Quy định Giấy chứng nhận lưu hành tự do (CFS) đối với
sản phẩm, hàng hóa xuất khẩu và nhập khẩu
</em>{" "}
(<strong>Nghị định số 69/2018/NĐ-CP</strong> ngày
15/5/2018 của <strong>Chính phủ</strong>);
</li>
<li>
<em>
Sửa đổi, bổ sung Thông tư số 28/2015/TT-BCT ngày 20
tháng 8 năm 2015 của Bộ trưởng Bộ Công Thương quy định
việc thực hiện thí điểm tự chứng nhận xuất xứ hàng hóa
trong Hiệp định thương mại hàng hóa ASEAN
</em>{" "}
(<strong>Thông tư 19/2020/TT-BCT</strong> ngày 14 tháng
8 năm 2020);
</li>
<li>
<em>
Hướng dẫn chung (Annex II-B) về khai Giấy chứng nhận
xuất xứ ICO
</em>{" "}
(<strong>Quy định số EB 3775/01</strong> ngày 12/4/2001
của <strong>Tổ chức Cà phê Quốc tế ICO</strong>);
<br />
<em>Mã quốc gia xuất khẩu và nhập khẩu cà phê</em> (
<strong>Quy định số ICC 102-9</strong> ngày 27/4/2009
của ICO);
<br />
<em>Mã cảng xuất khẩu cà phê</em> (
<strong>Quy định số WP Council 174/08 Rev. 1</strong>{" "}
ngày 9/9/2009 của ICO);
<br />
<em>
Quy định liên quan khác đối với mặt hàng cà phê
</em>{" "}
(<strong>Quy định số ED 1918/04</strong> ngày
24/5/2004);
</li>
<li>
<em>
Giấy chứng nhận cấp cho hàng hóa không đáp ứng quy
định xuất xứ
</em>{" "}
(
<strong>
Quy định về nội dung xác nhận trên mẫu Giấy chứng
nhận-GCN
</strong>
).
</li>
</ul>
</li>
</ol>
{/* Lưu ý – chỉ phần này dùng text-sm */}
<div className="mt-6 pt-4 text-sm text-gray-700 italic">
<p className="font-medium text-[#363636]">
*Lưu ý: Cập nhật thường xuyên các quy định có thể được thay
đổi bởi cơ quan chức năng.
</p>
</div>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/muc-dich/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Mục đích của C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
{/* I. MỤC ĐÍCH CỦA GIẤY CHỨNG NHẬN XUẤT XỨ (C/O) */}
<section className="mb-10">
<h2 className="text-[16px] font-[600] text-[#363636] uppercase mb-4 pb-1">
1. MỤC ĐÍCH CỦA GIẤY CHỨNG NHẬN XUẤT XỨ (C/O)
<sup className="text-[10px] align-super ml-0.5">1</sup>:
</h2>
<ol className="list-decimal pl-6 space-y-3">
<li>
Để thiết lập biện pháp và là{" "}
<strong>công cụ của chính sách thương mại</strong>;
</li>
<li>
Để xác định sản phẩm nhập khẩu{" "}
<strong>
được hưởng quy chế tối huệ quốc (MFN) hoặc ưu đãi khác hay
không
</strong>
;
</li>
<li>
<strong>Mục đích thống kê thương mại</strong> của một quốc
gia;
</li>
<li>
Áp dụng quy định về{" "}
<strong>yêu cầu gắn nhãn, mác đối với hàng hóa</strong>; và
</li>
<li>
Dùng cho việc <strong>mua bán của chính phủ</strong>.
</li>
</ol>
</section>
{/* II. VAI TRÒ CỦA QUY TẮC XUẤT XỨ (ROO) */}
<section>
<h2 className="text-[16px] font-[600] text-[#363636] uppercase mb-4 pb-1">
2. VAI TRÒ CỦA QUY TẮC XUẤT XỨ (ROO)
<sup className="text-[10px] align-super ml-0.5">2</sup>:
</h2>
<p className="mb-4 leading-relaxed">
Vai trò cơ bản của <strong>Quy tắc Xuất xứ</strong> là việc
xác định <strong>quốc gia xuất xứ</strong> của một mặt hàng cụ
thể. Các yêu cầu pháp lý hoặc hành chính{" "}
<strong>bắt buộc phải tuân thủ</strong> khi hàng hóa được giao
dịch trên thị trường quốc tế. Điều này là cần thiết cho việc
thực hiện các công cụ chính sách thương mại khác nhau như áp
đặt thuế nhập khẩu, phân bổ hạn ngạch hoặc thống kê thương
mại.
</p>
<p className="leading-relaxed">
Các bước đầu tiên là <strong>phân loại hàng hóa</strong> và{" "}
<strong>xác định trị giá</strong> của hàng hóa, bước tiếp theo
và cuối cùng là việc xác định <strong>nước xuất xứ</strong>{" "}
của một sản phẩm cụ thể. Việc phân loại hàng hóa và xác định
trị giá là rất quan trọng trong công việc làm thủ tục hải
quan, nhưng đây là những công cụ cơ bản để xác định nước xuất
xứ của hàng hóa theo nghĩa các{" "}
<strong>quy tắc xuất xứ</strong> là những quy tắc áp dụng cụ
thể cho một sản phẩm nhất định liên quan đến các{" "}
<strong>mã HS cụ thể</strong>, và nếu quy tắc xuất xứ áp dụng
theo trị giá gia tăng thì cần phải xác định{" "}
<strong>
trị giá hải quan của các thành phần cấu thành sản phẩm
</strong>
.
</p>
{/* Phần chú thích */}
<div className="mt-6 pt-4 text-sm text-gray-700">
<div className="h-[1px] w-[170px] bg-black mb-3"></div>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">1</sup> Theo WTO
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">2</sup> Theo WCO
</p>
</div>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import ListCategory from "./components/list-category";
import Calendar from "./components/Calendar";
import Image from "next/image";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Xuất Xứ Hàng Hóa (C/O)
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
{/* I. ĐỊNH NGHĨA CHUNG */}
<section className="mb-10">
<h2 className="text-[16px] font-[600] text-[#363636] uppercase mb-4 pb-1">
I. ĐỊNH NGHĨA CHUNG
<sup className="text-[10px] align-super ml-0.5">1</sup>:
</h2>
<ol className="list-decimal pl-6 space-y-3">
<li>
<strong>Xuất xứ hàng hóa</strong> là nước, nhóm nước, hoặc
vùng lãnh thổ nơi sản xuất ra toàn bộ hàng hóa hoặc nơi thực
hiện công đoạn chế biến cơ bản cuối cùng đối với hàng hóa
trong trường hợp có nhiều nước, nhóm nước, hoặc vùng lãnh
thổ tham gia vào quá trình sản xuất ra hàng hóa đó.
</li>
<li>
<strong>Quy tắc xuất xứ ưu đãi</strong> là các quy định về
xuất xứ áp dụng cho hàng hóa có cam kết hoặc thỏa thuận ưu
đãi về thuế quan và ưu đãi về phi thuế quan.
</li>
<li>
<strong>Quy tắc xuất xứ không ưu đãi</strong> là các quy
định về xuất xứ áp dụng cho hàng hóa ngoài quy định tại
Khoản 2 Điều này và trong các trường hợp áp dụng các biện
pháp thương mại không ưu đãi về đối xử tối huệ quốc, chống
bán phá giá, chống trợ cấp, tự vệ, hạn chế số lượng hay hạn
ngạch thuế quan, mua sắm chính phủ và thống kê thương mại.
</li>
<li>
<strong>Giấy chứng nhận xuất xứ hàng hóa</strong> là văn bản
hoặc các hình thức có giá trị pháp lý tương đương do cơ
quan, tổ chức thuộc nước, nhóm nước, hoặc vùng lãnh thổ xuất
khẩu hàng hóa cấp dựa trên quy định và yêu cầu liên quan về
xuất xứ, chỉ rõ nguồn gốc xuất xứ của hàng hóa đó.
</li>
<li>
<strong>Giấy chứng nhận xuất xứ hàng hóa giáp lưng</strong>{" "}
là Giấy chứng nhận xuất xứ hàng hóa theo quy định tại Điều
ước quốc tế mà Việt Nam ký kết hoặc gia nhập, được cấp bởi
nước thành viên xuất khẩu trung gian dựa trên Giấy chứng
nhận xuất xứ hàng hóa của nước thành viên xuất khẩu đầu
tiên.
</li>
<li>
<strong>
{" "}
Giấy chứng nhận hàng hóa không thay đổi xuất xứ
</strong>{" "}
là Giấy chứng nhận cấp cho hàng hóa nước ngoài được đưa vào
kho ngoại quan của Việt Nam, sau đó xuất khẩu đi nước khác,
đưa vào nội địa trên cơ sở Giấy chứng nhận xuất xứ hàng hóa
đã được cấp đầu tiên.
</li>
<li>
<strong>Tự chứng nhận xuất xứ hàng hóa</strong> là hình thức
thương nhân tự khai báo và cam kết về xuất xứ của hàng hóa
theo quy định của pháp luật.
</li>
<li>
<strong>Chứng từ tự chứng nhận xuất xứ hàng hóa</strong> là
văn bản hoặc các hình thức có giá trị pháp lý tương đương do
thương nhân tự phát hành theo quy định tại Khoản 7 Điều này.
</li>
<li>
<strong>Chuyển đổi mã số hàng hóa</strong> là sự thay đổi về
mã số HS (trong Biểu thuế xuất khẩu, Biểu thuế nhập khẩu)
của hàng hóa được tạo ra ở một nước, nhóm nước, hoặc vùng
lãnh thổ trong quá trình sản xuất từ nguyên liệu không có
xuất xứ của nước, nhóm nước, hoặc vùng lãnh thổ này.
</li>
<li>
<strong>Tỷ lệ Phần trăm giá trị</strong> là hàm lượng giá
trị có được đủ để coi là có xuất xứ tại một nước, nhóm nước,
hoặc vùng lãnh thổ nơi diễn ra công đoạn sản xuất, gia công,
chế biến cuối cùng. Tỷ lệ này được xác định là Phần giá trị
gia tăng có được tính trên tổng giá trị của hàng hóa được
sản xuất, gia công, chế biến tại một nước, nhóm nước, hoặc
vùng lãnh thổ sau khi trừ đi giá nguyên liệu đầu vào nhập
khẩu không thuộc nước, nhóm nước, hoặc vùng lãnh thổ đó hoặc
giá trị nguyên liệu đầu vào không xác định được xuất xứ dùng
để sản xuất ra hàng hóa.
</li>
<li>
<strong>Công đoạn gia công, chế biến hàng hóa</strong> là
quá trình sản xuất chính tạo ra đặc điểm cơ bản của hàng
hóa.
</li>
<li>
<strong>Thay đổi cơ bản</strong> là việc hàng hóa được biến
đổi qua quá trình sản xuất, để hình thành vật phẩm thương
mại mới, khác biệt về hình dạng, tính năng, đặc điểm cơ bản,
hoặc mục đích sử dụng so với hàng hóa ban đầu.
</li>
<li>
<strong>Đơn giản</strong> là hoạt động không cần sử dụng các
kỹ năng đặc biệt, máy móc, dây chuyền hoặc các thiết bị
chuyên dụng.
</li>
<li>
<strong>Sản xuất</strong> là các phương thức để tạo ra hàng
hóa bao gồm trồng trọt, khai thác, thu hoạch, chăn nuôi, gây
giống, chiết xuất, thu lượm, thu nhặt, săn bắt, đánh bắt,
đánh bẫy, săn bắn, chế tạo, chế biến, gia công hay lắp ráp.
</li>
<li>
<strong>Nguyên liệu</strong> là bất cứ vật liệu hay chất
liệu nào được sử dụng hoặc tiêu tốn trong quá trình sản xuất
ra hàng hóa, hoặc kết hợp tự nhiên thành một hàng hóa khác,
hoặc tham gia vào quy trình sản xuất ra một hàng hóa khác.
</li>
<li>
<strong>
Hàng hóa có xuất xứ hoặc nguyên liệu có xuất xứ
</strong>{" "}
là hàng hóa hoặc nguyên liệu đáp ứng quy tắc xuất xứ ưu đãi
theo quy định tại Chương II hoặc quy tắc xuất xứ không ưu
đãi theo quy định tại Chương III Nghị định này.
</li>
<li>
<strong>
Thương nhân đề nghị cấp Giấy chứng nhận xuất xứ hàng hóa
</strong>{" "}
là người xuất khẩu, nhà sản xuất, người đại diện hợp pháp
của người xuất khẩu hoặc nhà sản xuất.
</li>
</ol>
</section>
{/* II. ĐỊNH NGHĨA LIÊN QUAN KHÁC */}
<section>
<h2 className="text-[16px] font-[600] text-[#363636] uppercase mb-4 pb-1">
II. ĐỊNH NGHĨA LIÊN QUAN KHÁC:
</h2>
<ol className="list-decimal pl-6 space-y-3">
<li>
<strong>Giấy chứng nhận xuất xứ</strong> thường được viết
tắt là <strong>C/O</strong> (Certificate of Origin) là chứng
từ quan trọng trong thương mại quốc tế chứng nhận lô hàng cụ
thể được xuất khẩu có xuất xứ thuần túy, hoặc được sản xuất
hoặc được chế biến tại một quốc gia cụ thể.
<sup className="text-[10px] align-super ml-0.5">2</sup>
</li>
<li>
<strong>Giấy chứng nhận xuất xứ</strong> là văn bản nêu cụ
thể quốc gia mà tại đó hàng hóa được trồng, được sản xuất,
được chế biến hay lắp ráp.
<sup className="text-[10px] align-super ml-0.5">3</sup>
</li>
<li>
<strong>Hệ thống hài hòa hóa</strong> hay gọi đơn giản là{" "}
<strong>HS</strong> (Harmonized System) là một danh pháp
thuế quan toàn cầu, một hệ thống được tiêu chuẩn hóa quốc tế
về tên gọi (mô tả) và mã số (mã HS) được sử dụng để phân
loại mọi mặt hàng thương mại trên toàn thế giới bao gồm cả
hàng hóa xuất khẩu và nhập khẩu. Hệ thống này có hiệu lực
năm 1988 và được quản lý bởi Tổ chức Hải quan Quốc tế (WCO).
Danh mục này bao gồm khoảng 5.000 nhóm hàng, được xác định
bằng 6 chữ số, được sắp xếp theo một cấu trúc pháp lý và hợp
lý và chúng được giải thích bằng những quy tắc được định
nghĩa rõ ràng để đảm bảo việc phân loại hàng hóa theo 1 cách
thống nhất.
<sup className="text-[10px] align-super ml-0.5">4</sup>
</li>
</ol>
{/* Phần chú thích */}
<div className="mt-6 pt-4 text-sm text-gray-700">
<div className="h-[1px] w-[170px] bg-black mb-3"></div>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">1</sup> Theo điều
3, Nghị định 31/2018/NĐ-CP ngày 08 tháng 3 năm 2018
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">2</sup> Theo ICC
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">3</sup> Theo USAID
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">4</sup> Theo WCO
</p>
</div>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/phi-va-le-phi-cap/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Phí và Lệ phí cấp C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<ol className="list-decimal pl-6 space-y-6 text-[16px]">
{/* 1. Lệ phí cấp C/O */}
<li className="leading-relaxed">
<strong>Lệ phí cấp C/O:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Phí cấp C/O:</strong>{" "}
<strong>60.000 VND/bộ cấp mới</strong> và{" "}
<strong>30.000 VND/bộ cấp lại</strong> (
<em>
TT36/2023/TT-BTC ngày 06/6/2023 của Bộ Tài chính quy
định mức thu, chế độ thu, nộp, quản lý và sử dụng phí
chứng nhận xuất xứ hàng hóa - C/O
</em>
).
</li>
</ul>
</li>
{/* 2. Phí cấp chứng từ thương mại */}
<li className="leading-relaxed">
<strong>Phí cấp chứng từ thương mại:</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>100.000 VND/bộ/4 trang</strong> theo{" "}
<strong>
Quy định số 2706/2009/PTM-TT ngày 9 tháng 9 năm 2010
của Phòng Thương mại và Công nghiệp Việt Nam về việc
Ban hành phí xác nhận chứng từ thương mại
</strong>
.
</li>
</ul>
</li>
</ol>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/thong-tin-lien-he/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Điểm cấp và Thời gian cấp C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<div className="space-y-6 text-[16px] leading-relaxed">
<div>
<p className="font-bold text-[#363636]">PHÒNG PHÁP CHẾ</p>
<p>
<strong>
Chi nhánh Phòng Thương mại và Công nghiệp Việt Nam tại
Tp. HCM (VCCI HCM)
</strong>
<br />
<strong>
Lầu 1, Tòa nhà VCCI HCM, 171 Võ Thị Sáu, P. 7, Quận 3,
TP. HCM
</strong>
<br />
<strong>Điện thoại:</strong> 028-3932 6498 / 3932 2806
<br />
<strong>Email:</strong>{" "}
<a
href="mailto:co@vcci-hcm.org.vn"
className="text-blue-600 underline hover:text-blue-800"
>
co@vcci-hcm.org.vn
</a>
</p>
</div>
{/* Xử lý vướng mắc, phản ánh, góp ý */}
<div>
<p className="font-bold text-[#363636]">
XỬ LÝ VƯỚNG MẮC, PHẢN ÁNH, GÓP Ý TRONG QUÁ TRÌNH LÀM THỦ
TỤC CẤP C/O:
</p>
<ul className="list-disc pl-6 mt-2 space-y-3">
<li>
<strong>Tổ cấp C/O tại Tp. HCM:</strong>
<br />
<strong>Điện thoại:</strong> 028-3232 5176
<br />
<strong>Email:</strong>{" "}
<a
href="mailto:co@vcci-hcm.org.vn"
className="text-blue-600 underline hover:text-blue-800"
>
co@vcci-hcm.org.vn
</a>
</li>
<li>
<strong>Điểm cấp C/O tại Bình Dương:</strong>
<br />
<strong>Phó trưởng phòng Pháp chế:</strong> Nguyễn Văn
Đức
<br />
<strong>Mobile:</strong> 090 949 7155
<br />
<strong>Email:</strong>{" "}
<a
href="mailto:nvduc1980@gmail.com"
className="text-blue-600 underline hover:text-blue-800"
>
nvduc1980@gmail.com
</a>
</li>
<li>
<strong>Tổ cấp C/O tại Đồng Nai:</strong>
<br />
<strong>Phó trưởng phòng Pháp chế:</strong> Ông Bùi Mạnh
Hùng
<br />
<strong>Mobile:</strong> 087 789 2442
<br />
<strong>Email:</strong>{" "}
<a
href="mailto:hungbui@vcci-hcm.org.vn"
className="text-blue-600 underline hover:text-blue-800"
>
hungbui@vcci-hcm.org.vn
</a>
</li>
<li>
<strong>
HƯỚNG DẪN KHAI HỒ SƠ THƯƠNG NHÂN, CHỮ KÝ SỐ VÀ IT;
GIẢI ĐÁP VỀ REX:
</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Tổ cấp C/O tại Tp.HCM:</strong> 028-3932
6498 / 3932 2806
</li>
<li>
<strong>Tổ cấp C/O tại Bình Dương:</strong> 0274-380
0048
</li>
<li>
<strong>Tổ cấp C/O tại Đồng Nai:</strong> 0251-383
1383
</li>
</ul>
</li>
<li>
<strong>
TIẾP THU, GIẢI QUYẾT PHẢN ÁNH, KHIẾU NẠI, GÓP Ý:
</strong>
<br />
<strong>Trưởng phòng Pháp chế:</strong> Ông Vũ Xuân Hưng
<br />
<strong>Điện thoại:</strong> 028-3932 6929 hoặc{" "}
<strong>Mobile:</strong> 0909 170 171{" "}
<em>(Đường dây nóng)</em>
<br />
<strong>Email:</strong>{" "}
<a
href="mailto:vuxuanhung@vcci-hcm.org.vn"
className="text-blue-600 underline hover:text-blue-800"
>
vuxuanhung@vcci-hcm.org.vn
</a>
</li>
</ul>
</div>
</div>
</section>
</div>
<div className="relative w-full mt-4 h-[185px] aspect-video rounded-lg overflow-hidden">
<Image
src="/VCCI-thongTinLienHeBanner.jpg.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuat-xu-hang-hoa/thu-tuc-cap/page.tsx 0 → 100644
View file @ b9ca187b
import React from "react";
import Image from "next/image";
import ListCategory from "../components/list-category";
import Calendar from "../components/Calendar";
export default function page() {
return (
<div className="bg-[#f6f6f6]">
<div className="max-w-[1200px] m-auto flex flex-col gap-5 mb-[50px]">
<div className="border-[#e5e7f2] border-[1px]">
<ListCategory />
</div>
<div className="w-full flex gap-5 flex-wrap">
<div className="lg:w-[calc(65%-10px)] w-full border-[#e5e7f2] border-[1px] bg-white p-[30px] flex flex-col gap-[15px]">
<h1 className="text-[#063e8e] text-[25px] font-semibold">
Thủ tục cấp C/O
</h1>
<div className="w-full h-[1px] bg-[#eeeeee]"></div>
<div className="text-[#363636]">
<section className="mb-10">
<ol className="list-decimal pl-6 space-y-6 text-[16px]">
{/* 1. Các bước cần thiết trước khi đề nghị cấp C/O */}
<li className="leading-relaxed">
<strong>
Các bước cần thiết thực hiện trước khi đề nghị cấp C/O:
</strong>
<ol className="list-decimal pl-6 mt-3 space-y-2">
<li>
<strong>Bước 1:</strong> Kiểm tra xem sản phẩm có{" "}
<strong>xuất xứ thuần túy (xuất xứ toàn bộ)</strong>{" "}
theo quy định phù hợp hay không. Nếu không, chuyển sang
bước 2;
</li>
<li>
<strong>Bước 2:</strong> Xác định chính xác{" "}
<strong>mã số HS của sản phẩm xuất khẩu</strong> (
<strong>4 hoặc 6 số H.S đầu</strong> là cơ sở để xác
định xuất xứ hàng hóa theo quy định)
<sup className="text-[10px] align-super ml-0.5">1</sup>;
</li>
<li>
<strong>Bước 3:</strong> Xác định nước nhập khẩu hàng
hóa mà quốc gia đó đã ký{" "}
<strong>Hiệp định thương mại tự do (FTA)</strong> với
Việt Nam/ASEAN và/hoặc cho Việt Nam hưởng{" "}
<strong>ưu đãi thuế quan GSP</strong> hay không. Nếu có,
chuyển sang bước 4;
</li>
<li>
<strong>Bước 4:</strong> Kiểm tra xem sản phẩm xuất khẩu
có thuộc{" "}
<strong>
danh mục các công đoạn chế biến đơn giản (không đầy
đủ)
</strong>{" "}
theo quy định phù hợp hay không. Nếu có, sản phẩm đó{" "}
<strong>sẽ không có xuất xứ</strong> theo quy định. Nếu
không, chuyển tiếp sang bước 5.
</li>
<li>
<strong>Bước 5:</strong> So sánh{" "}
<strong>thuế suất</strong> để chọn{" "}
<strong>mẫu C/O (nếu có)</strong> để đề nghị cấp nhằm
đảm bảo hàng hóa xuất khẩu được hưởng{" "}
<strong>mức ưu đãi thuế nhập khẩu thấp nhất</strong>;
</li>
<li>
<strong>Bước 6:</strong> Kiểm tra xem sản phẩm xuất khẩu{" "}
<strong>đáp ứng quy định xuất xứ phù hợp</strong> hay
không.
<br />
<em>VD:</em> C/O mẫu A XK sang EU –{" "}
<strong>Annex 22-03</strong>, Thụy Sỹ –{" "}
<strong>Annex 4</strong>, Japan –{" "}
<strong>Annex 5</strong>, … hoặc C/O mẫu B –{" "}
<strong>Phụ lục I – Thông tư 05/2018/TT-BCT</strong>
</li>
<li>
<strong>Bước 7:</strong> Nếu sản phẩm{" "}
<strong>
chưa đáp ứng quy định phù hợp tại bước 6
</strong>
, vận dụng các{" "}
<strong>điều khoản ngoại lệ/đặc biệt</strong> sau:
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>
Quy định vi phạm cho phép (Derogation/Tolerance/De
Minimis)
</strong>{" "}
đối với các nguyên vật liệu hoặc bộ phận không có
xuất xứ áp dụng theo tiêu chí “
<strong>Chuyển đổi mã số hàng hóa</strong>”;
</li>
<li>
<strong>Quy định cộng gộp song phương</strong>;
</li>
<li>
<strong>Quy định cộng gộp khu vực</strong>;
</li>
<li>
<strong>Quy định cộng gộp khác</strong> và/hoặc các
quy định mở rộng liên quan khác.
</li>
</ul>
</li>
</ol>
</li>
{/* 2. Đăng ký hồ sơ thương nhân */}
<li className="leading-relaxed">
<strong>
Đăng ký hồ sơ thương nhân (Điều 13 của NĐ 31/2018/NĐ-CP)
</strong>
<sup className="text-[10px] align-super ml-0.5">2</sup>:
<br />
Lập, nộp <strong>1 bộ hồ sơ thương nhân</strong> cho{" "}
<strong>Tổ chức cấp C/O</strong> đối với thương nhân đề nghị
cấp C/O lần đầu. Hồ sơ thương nhân bao gồm:
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Thông tin của thương nhân</strong> (
<em>Mẫu VCCI HCM</em>);
</li>
<li>
<strong>
Đăng ký mẫu chữ ký của người được ủy quyền ký đơn đề
nghị cấp C/O và mẫu dấu
</strong>{" "}
(<em>Mẫu số 01 của NĐ 31/2018/NĐ-CP</em>);
</li>
<li>
<strong>
Danh mục các cơ sở sản xuất của thương nhân
</strong>{" "}
(<em>Mẫu số 02 của NĐ 31/2018/NĐ-CP</em>);
</li>
<li>
<strong>
Bản sao Giấy chứng nhận đăng ký doanh nghiệp
</strong>{" "}
(<em>Ký, đóng dấu sao y bản chính của thương nhân</em>);
</li>
<li>
<strong>
Giấy chứng nhận đã đăng ký mẫu dấu với cơ quan công an
</strong>{" "}
(<em>nếu có</em>).
</li>
</ul>
</li>
{/* 3. Hồ sơ đề nghị cấp C/O mới */}
<li className="leading-relaxed">
<strong>
Hồ sơ đề nghị cấp C/O mới (Điều 15, NĐ 31/2018/NĐ-CP):
</strong>
<div className="mt-2">
<strong>Chứng từ xuất khẩu:</strong>
<ul className="list-disc pl-6 mt-1 space-y-1">
<li>
<strong>Đơn đề nghị cấp C/O</strong> (
<em>Mẫu số 4 của NĐ 31/2018/NĐ-CP</em>);
</li>
<li>
<strong>Phiếu ghi chép</strong> (<em>Mẫu VCCI HCM</em>
);
</li>
<li>
<strong>
Mẫu C/O tương ứng đã được khai hoàn chỉnh
</strong>{" "}
(<em>thông thường là 1 bản chính và 3 bản copy</em>);
</li>
<li>
<strong>Bản in tờ khai hải quan xuất khẩu</strong> (
<em>Có xác nhận của thương nhân</em>);
</li>
<li>
<strong>Bản sao hóa đơn thương mại</strong> (
<em>Ký, đóng dấu sao y bản chính của thương nhân</em>
);
</li>
<li>
<strong>
Bản sao B/L hoặc AWB hoặc chứng từ vận tải tương
đương
</strong>{" "}
(<em>Ký, đóng dấu sao y bản chính của thương nhân</em>
).
</li>
</ul>
</div>
<div className="mt-3">
<strong>Chứng từ chứng minh nguồn gốc:</strong>
<ul className="list-disc pl-6 mt-1 space-y-1">
<li>
<strong>
Bảng kê khai chi tiết hàng hóa xuất khẩu đạt tiêu
chí xuất xứ ưu đãi hoặc xuất xứ không ưu đãi
</strong>{" "}
(
<em>
Chọn mẫu Bảng kê khai NVL phù hợp: 8 mẫu khác nhau
</em>
);
</li>
<li>
<strong>
Bản khai báo xuất xứ của nhà sản xuất hoặc nhà cung
cấp nguyên liệu có xuất xứ hoặc hàng hóa có xuất xứ
</strong>{" "}
(<em>Phụ lục X của TT 05/2018/TT-BCT</em>);
</li>
<li>
<strong>
Tờ khai hải quan nhập khẩu nguyên liệu, phụ liệu
dùng để sản xuất ra hàng hóa xuất khẩu
</strong>{" "}
(
<em>
trong trường hợp có sử dụng nguyên liệu, phụ liệu
nhập khẩu trong quá trình sản xuất
</em>
); hợp đồng mua bán hoặc hóa đơn giá trị gia tăng mua
bán nguyên liệu, phụ liệu trong nước (
<em>
trong trường hợp có sử dụng nguyên liệu, phụ liệu
mua trong nước trong quá trình sản xuất
</em>
); giấy phép xuất khẩu (<em>nếu có</em>); chứng từ,
tài liệu cần thiết khác.
</li>
</ul>
</div>
</li>
{/* 4. Hồ sơ đề nghị cấp lại C/O */}
<li className="leading-relaxed">
<strong>
Hồ sơ đề nghị cấp lại C/O (Điều 18, NĐ 31/2018/NĐ-CP):
</strong>
<ul className="list-disc pl-6 mt-2 space-y-1">
<li>
<strong>Đơn đề nghị cấp C/O</strong> (
<em>Mẫu số 4 của NĐ 31/2018/NĐ-CP</em>);
</li>
<li>
<strong>Phiếu ghi chép</strong> (<em>Mẫu VCCI HCM</em>);
</li>
<li>
<strong>
Mẫu C/O tương ứng đã được khai hoàn chỉnh
</strong>{" "}
(<em>thông thường là 1 bản chính và 3 bản copy</em>);
</li>
</ul>
<p className="mt-2">
Các trường hợp cấp lại C/O căn cứ vào{" "}
<strong>Điều 18 của NĐ 31/2018/NĐ-CP</strong>.
</p>
</li>
{/* 5. Khai C/O qua mạng */}
<li className="leading-relaxed">
<strong>Khai C/O qua mạng:</strong>
<br />
Doanh nghiệp khai C/O trên website:{" "}
<a
href="http://comis.covcci.com.vn"
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 underline hover:text-blue-800"
>
http://comis.covcci.com.vn
</a>{" "}
và thực hiện theo từng bước theo yêu cầu/hướng dẫn tại
website.
<br />
<strong>Lưu ý:</strong> Trước khi khai C/O qua mạng, doanh
nghiệp cần{" "}
<strong>
đăng ký hồ sơ thương nhân với chữ ký số được kích hoạt
</strong>{" "}
trên trang web:{" "}
<a
href="http://comis.covcci.com.vn"
target="_blank"
rel="noopener noreferrer"
className="text-blue-600 underline hover:text-blue-800"
>
http://comis.covcci.com.vn
</a>
</li>
</ol>
{/* Chú thích cuối trang */}
<div className="mt-6 pt-4 text-sm text-gray-700">
<div className="h-[1px] w-[170px] bg-black mb-3"></div>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">1</sup> Việc khai
báo thiếu chính xác mã HS của sản phẩm sẽ dẫn đến khả năng
từ chối cấp C/O tại Việt Nam hoặc bị từ chối tiếp nhận C/O
của hải quan nước nhập khẩu.
</p>
<p className="text-[16px] italic">
<sup className="text-[10px] align-super">2</sup> Doanh
nghiệp đề nghị cấp C/O lần đầu hoặc thông tin của doanh
nghiệp được thay đổi hoặc cập nhật 2 năm/lần theo quy định.
</p>
</div>
</section>
</div>
</div>
<div className="lg:w-[calc(35%-10px)] w-full ">
<Calendar />
<div className="relative w-full mt-4 h-[300px] aspect-video rounded-lg overflow-hidden">
<Image
src="/banner.webp"
alt="Quảng cáo"
fill
className="object-contain"
/>
</div>
</div>
</div>
</div>
</div>
);
}
src/app/(main)/xuc-tien-thuong-mai/co-hoi-kinh-doanh/page.tsx
View file @ b9ca187b
"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 { TRADE_PROMOTION_CATEGORIES } from "@constants/categories";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import EventCalendar from "@app/dai-dien-gioi-chu/components/event-calendar";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import { useGetNews } from "@api/endpoints/news";
......@@ -21,26 +21,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={TRADE_PROMOTION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -71,7 +52,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<EventCalendar />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/xuc-tien-thuong-mai/ho-tro-kinh-doanh/page.tsx
View file @ b9ca187b
"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 { TRADE_PROMOTION_CATEGORIES } from "@constants/categories";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
......@@ -21,26 +20,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={TRADE_PROMOTION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -71,7 +51,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
{/* <ListFilter /> */}
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/xuc-tien-thuong-mai/moi-truong-kinh-doanh/page.tsx
View file @ b9ca187b
"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 { TRADE_PROMOTION_CATEGORIES } from "@constants/categories";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
import EventCalendar from "@app/dai-dien-gioi-chu/components/event-calendar";
import { useGetNews } from "@api/endpoints/news";
import { GetNewsResponseType } from "@api/types/NewsPage.type";
export default function Page() {
......@@ -21,26 +21,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={TRADE_PROMOTION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -71,7 +52,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
<EventCalendar />
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/app/(main)/xuc-tien-thuong-mai/page.tsx
View file @ b9ca187b
"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 { TRADE_PROMOTION_CATEGORIES } from "@constants/categories";
import NewsContent from "@app/dai-dien-gioi-chu/components/card-news";
import { Pagination } from "@components/base/pagination";
import Image from "next/image";
......@@ -21,26 +20,7 @@ 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
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`,
},
]}
/>
<ListCategory categories={TRADE_PROMOTION_CATEGORIES} />
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Main content */}
......@@ -71,7 +51,7 @@ export default function Page() {
{/* Sidebar */}
<aside className="space-y-6">
<ListFilter />
{/* <ListFilter /> */}
<div className="bg-white border rounded-md overflow-hidden">
<div className="w-full h-56 relative bg-gray-100">
......
src/constants/categories.ts 0 → 100644
View file @ b9ca187b
import { PATHS } from "@constants/paths";
export const TRADE_PROMOTION_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`,
},
];
export const OWNER_REPRESENTATIVES_CATEGORIES = [
{
title: "Chức năng Đại diện Người sử dụng lao động",
href: `${PATHS.ownerRepresentatives}/chuc-nang-dai-dien-nguoi-su-dung-lao-dong`,
},
{
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`,
},
];
export const EVENT_CATEGORIES = [
{
title: "Sự kiện",
href: `${PATHS.event}/su-kien`,
},
{
title: "Đào tạo",
href: `${PATHS.event}/dao-tao`,
},
];
export const MEDIA_INFORMATION_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`,
},
];
export type CategoryItem = {
title: string;
href: string;
};
src/constants/paths.ts
View file @ b9ca187b
......@@ -18,6 +18,7 @@ export const PATHS = {
students: '/sinh-vien',
studentLife: '/cuoc-song-sinh-vien',
search: '/tim-kiem',
originOfGoods: '/xuat-xu-hang-hoa',
// With slugs
post: '/bai-viet',
......
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