Skip to content

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

Merge branch 'feature/product_origin_page' into 'develop' 

feature/product_origin_page

See merge request !4
parents 7081e8df 5589d1b5
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1894 additions and 0 deletions
src/app/(main)/xuat-xu-hang-hoa/bieu-mau-c-o-va-cach-khai/page.tsx 0 → 100644
View file @ fc8def4e
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 @ fc8def4e
"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 @ fc8def4e
"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 @ fc8def4e
'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 @ fc8def4e
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 @ fc8def4e
This diff is collapsed.
src/app/(main)/xuat-xu-hang-hoa/muc-dich/page.tsx 0 → 100644
View file @ fc8def4e
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 @ fc8def4e
This diff is collapsed.
src/app/(main)/xuat-xu-hang-hoa/phi-va-le-phi-cap/page.tsx 0 → 100644
View file @ fc8def4e
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 @ fc8def4e
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 @ fc8def4e
This diff is collapsed.
src/constants/paths.ts
View file @ fc8def4e
......@@ -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