Skip to content

V
VCCI-News
Commit e0c56a2e authored by Phạm Quang Bảo's avatar Phạm Quang Bảo
Browse files
Options

update/responsive home page and members page

parent 5dc31199
Expand all Show whitespace changes
Inline Side-by-side
Showing with 359 additions and 329 deletions
src/app/(main)/(home)/components/news-content/NewsContent.tsx → src/app/(main)/(home)/components/card-news/index.tsx
View file @ e0c56a2e
......@@ -3,16 +3,16 @@ import BASE_URL from '@/links'
import dayjs from 'dayjs';
import AppEditorContent from '@/components/shared/editor-content';
function NewsContent({ news }: { news: NewsAdminItem }) {
function CardNews({ news }: { news: NewsAdminItem }) {
return (
<a
href={`${news.id}`}
className='flex flex-col sm:flex-row gap-3 mb-3 border border-gray-200 bg-white rounded-md p-3'
className='flex flex-row gap-3 mb-3 border border-gray-200 bg-white rounded-md p-3'
>
<img
src={`${BASE_URL.imageEndpoint}${news.thumbnail}`}
alt={news.title}
className='w-full sm:w-[120px] h-20 object-cover rounded-sm'
className='w-[120px] h-20 object-cover rounded-sm'
/>
<div className='flex-1'>
<p className='text-[#0056b3] font-bold text-sm line-clamp-2'>
......@@ -27,4 +27,4 @@ function NewsContent({ news }: { news: NewsAdminItem }) {
);
}
export default NewsContent;
\ No newline at end of file
export default CardNews;
\ No newline at end of file
src/app/(main)/(home)/components/news-content/index.tsx deleted 100644 → 0
View file @ 5dc31199
export { default } from './NewsContent';
\ No newline at end of file
src/app/(main)/(home)/page.tsx
View file @ e0c56a2e
This diff is collapsed.
src/app/(main)/hoi-vien/components/card-news/index.tsx
View file @ e0c56a2e
import { NewsItem } from '@app/dai-dien-gioi-chu/lib/types/NewsPage.type';
import Links from '@links/index'
import { NewsAdminItem } from '@/api/types/news'
import BASE_URL from '@/links'
import dayjs from 'dayjs';
import AppEditorContent from '@/components/shared/editor-content';
import parse from 'html-react-parser'
function NewsContent({ news }: { news: NewsItem }) {
function CardNews({ news }: { news: NewsAdminItem }) {
return (
<a
href={`/tin-tuc/${news.id}`}
className="flex flex-col hover:no-underline sm:flex-row gap-2 mb-6 bg-white rounded-lg shadow-sm p-4 border items-start min-w-0"
href={`${news.id}`}
className="flex flex-col sm:flex-row gap-3 mb-3 border border-gray-200 bg-white rounded-md p-3 hover:shadow-md transition"
>
<img
src={`${Links.imageEndpoint}${news.thumbnail}`}
src={`${BASE_URL.imageEndpoint}${news.thumbnail}`}
alt={news.title}
className="w-full sm:w-56 md:w-64 h-40 md:h-36 object-cover shrink-0"
className="w-full sm:w-40 h-40 sm:h-28 object-cover rounded-md"
/>
<div className="flex-1 min-w-0 pl-0 sm:pl-4">
<p className="text-primary font-semibold text-base md:text-lg hover:underline line-clamp-2 wrap-break-word hover:no-underline">
<div className="flex-1">
<p className="text-[#0056b3] font-bold text-sm sm:text-base line-clamp-2">
{news.title}
</p>
<div className="text-sm my-2 text-[#00AED5]">{dayjs(news.release_at).format('DD/MM/YYYY')}</div>
<div className="text-sm text-[#777] line-clamp-3">
<div className="text-sm prose tiptap">{parse(news.description)}</div>
<p className="text-gray-500 text-xs sm:text-sm my-1">
{dayjs(news.release_at).format('DD/MM/YYYY')}
</p>
<div className="text-xs sm:text-sm text-[#777] line-clamp-3 prose tiptap">
{parse(news.description)}
</div>
</div>
</a>
)
);
}
export default NewsContent;
\ No newline at end of file
export default CardNews;
\ No newline at end of file
src/app/(main)/hoi-vien/components/list-category/index.tsx
View file @ e0c56a2e
"use client"
import Link from "next/link"
import { usePathname } from "next/navigation"
import { usePathname, useRouter } from "next/navigation"
import React from "react"
type Category = {
......@@ -18,17 +18,23 @@ const CATEGORIES: Category[] = [
const ListCategory: React.FC = () => {
const pathname = usePathname() || ""
const router = useRouter()
const isActive = (href: string) => {
if (href === "/hoi-vien") return pathname === "/hoi-vien"
return pathname === href
}
const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
router.push(e.target.value)
}
return (
<div className="border-t border-gray-200 bg-white p-2.5">
<div className="max-w-7xl mx-auto">
<nav aria-label="Danh mục" className="py-3">
<ul className="flex items-center">
{/* --- Desktop view --- */}
<ul className="hidden sm:flex items-center">
{CATEGORIES.map((c) => {
const active = isActive(c.href)
return (
......@@ -38,8 +44,8 @@ const ListCategory: React.FC = () => {
className={
"text-sm font-bold py-3.5 px-5 transition-colors duration-150 " +
(active
? "text-yellow-500 font-semibold decoration-yellow-300 "
: "text-gray-600 hover:text-yellow-500 ")
? "text-yellow-500 font-semibold decoration-yellow-300"
: "text-gray-600 hover:text-yellow-500")
}
>
{c.title}
......@@ -48,6 +54,21 @@ const ListCategory: React.FC = () => {
)
})}
</ul>
{/* --- Mobile view (Dropdown) --- */}
<div className="sm:hidden">
<select
value={pathname}
onChange={handleChange}
className="w-full border border-gray-300 rounded-md px-3 py-2 text-sm text-gray-700 focus:outline-none focus:ring-2 focus:ring-yellow-400"
>
{CATEGORIES.map((c) => (
<option key={c.href} value={c.href}>
{c.title}
</option>
))}
</select>
</div>
</nav>
</div>
</div>
......
src/app/(main)/hoi-vien/dang-ky-hoi-vien/page.tsx
View file @ e0c56a2e
'use client'
import React from "react";
import ListCategory from "./../components/list-category";
const Page = () => {
return (
<div className="min-h-screen container mx-auto pb-4">
<div className="w-full flex flex-col gap-5">
<div className="min-h-screen container mx-auto px-4 sm:px-6 lg:px-8 pb-6">
<div className="flex flex-col gap-5">
<ListCategory />
<div className="gap-6">
{/* Main content */}
<main className="lg:col-span-2 bg-white border rounded-md p-7 px-40">
<div>
<h1 className="text-center mb-4 text-2xl font-bold text-[#153e8e]">THỦ TỤC GIA NHẬP HỘI VIÊN CHÍNH THỨC</h1>
<p className="text-justify leading-7 mb3">
<main className="bg-white border rounded-md p-5 sm:p-7 lg:py-10 lg:px-40">
<h1 className="text-center mb-4 text-xl sm:text-2xl font-bold text-[#153e8e]">
THỦ TỤC GIA NHẬP HỘI VIÊN CHÍNH THỨC
</h1>
<p className="text-justify leading-7 mb-3">
Điều lệ sửa đổi của Liên đoàn Thương mại và Công nghiệp Việt Nam (VCCI) được Đại hội đại biểu toàn quốc VCCI lần thứ VII thông qua và được Thủ tướng Chính phủ Phê duyệt tại Quyết định số 1496/QĐ-TTg ngày 30/11/2022 đã quy định tất cả các doanh nghiệp, các tổ chức sản xuất, kinh doanh, người sử dụng lao động, các hiệp hội doanh nghiệp có đăng ký và hoạt động hợp pháp ở Việt Nam đều có thể trở thành hội viên của VCCI.
</p>
<p className="text-justify leading-7 mb-3">
Để trở thành hội viên chính thức, tổ chức quan tâm cần gởi VCCI tại Hà Nội hoặc các Chi nhánh, Văn phòng đại diện của VCCI hồ sơ gia nhập gồm:
Để trở thành hội viên chính thức, tổ chức quan tâm cần gửi VCCI tại Hà Nội hoặc các Chi nhánh, Văn phòng đại diện của VCCI hồ sơ gia nhập gồm:
</p>
<ul className="list-disc pl-10 space-y-1 font-bold">
<li className="text-justify leading-7">Đơn xin gia nhập làm hội viên chính thức VCCI (2 bản theo mẫu của VCCI)</li>
<li className="text-justify leading-7">Giấy phép đăng ký kinh doanh, hoặc giấy phép thành lập hoặc quyết định thành lập (2 bản sao).</li>
<ul className="list-disc pl-6 sm:pl-10 space-y-1 font-bold">
<li className="text-justify leading-7">
Đơn xin gia nhập làm hội viên chính thức VCCI (2 bản theo mẫu của VCCI)
</li>
<li className="text-justify leading-7">
Giấy phép đăng ký kinh doanh, hoặc giấy phép thành lập hoặc quyết định thành lập (2 bản sao).
</li>
</ul>
<p className="text-justify leading-7 my-3">
Khi nhận được đơn, Ban Thường trực sẽ xét và thông báo cho tổ chức liên quan về quyết định kết nạp. Trong vòng 1 tháng kể từ ngày nhận thông báo, tổ chức phải thực hiện đóng lệ phí gia nhập. Chỉ khi nào tổ chức đóng lệ phí gia nhập mới được coi là hội viên chính thức. Theo quyết định của Ban chấp hành VCCI, lệ phí hiện hành được tính như sau:
Khi nhận được đơn, Ban Thường trực sẽ xét và thông báo cho tổ chức liên quan về quyết định kết nạp. Trong vòng 1 tháng kể từ ngày nhận thông báo, tổ chức phải thực hiện đóng lệ phí gia nhập. Chỉ khi nào tổ chức đóng lệ phí gia nhập mới được coi là hội viên chính thức.
</p>
<p className="text-justify leading-7 my-3">
Mức lệ phí gia nhập bằng mức hội phí hàng năm, được tính căn cứ vào doanh số của tổ chức trong năm trước theo các mức:
</p>
<ul className="list-disc pl-10 space-y-1 font-bold">
<li className="text-justify leading-7">Doanh số dưới 10 tỉ đồng đóng 3 triệu đồng/năm</li>
<li className="text-justify leading-7">Doanh số từ 10 {`-`} 50 tỉ đồng đóng 7 triệu đồng/năm</li>
<li className="text-justify leading-7">Doanh số trên 50 tỉ đồng đóng 15 triệu đồng/năm</li>
<ul className="list-disc pl-6 sm:pl-10 space-y-1 font-bold">
<li className="text-justify leading-7">
Doanh số dưới 10 tỉ đồng đóng 3 triệu đồng/năm
</li>
<li className="text-justify leading-7">
Doanh số từ 10 - 50 tỉ đồng đóng 7 triệu đồng/năm
</li>
<li className="text-justify leading-7">
Doanh số trên 50 tỉ đồng đóng 15 triệu đồng/năm
</li>
</ul>
<p className="text-justify leading-7 my-3">
Mức lệ phí gia nhập và hội phí trên có thể được điều chỉnh bởi quyết định của Ban chấp hành VCCI trong từng thời gian cụ thể.
</p>
<div>
<div className="my-4">
<p className="text-[#063e8e] mb-3">
Để biết thêm thông tin chi tiết, vui lòng liên hệ:
</p>
<p className="text-[#063e8e]">
<b>Phòng Hội viên Đào tạo và Truyền thông</b>
<br />
<b>C. Thúy {`-`} DĐ: 0903 909 756</b>
<b>C. Thúy - ĐĐ: 0903 909 756</b>
<span className="block">
Email: luuthanhthuy72@yahoo.com; hoivien@vcci-hcm.org.vn;
</span>
<span className="block">
Điện thoại: 028.3932.0611 {`-`} Fax: 028.3932.5472
Điện thoại: 028.3932.0611 - Fax: 028.3932.5472
</span>
<span className="block">
Địa chỉ: P. 306, Lầu 3, Tòa nhà VCCI, 171 Võ Thị Sáu, Phường Xuân Hoà, TP. Hồ Chí Minh </span>
Địa chỉ: P. 306, Lầu 3, Tòa nhà VCCI, 171 Võ Thị Sáu, Phường Xuân Hoà, TP. Hồ Chí Minh
</span>
</p>
</div>
<p className="text-justify leading-7 my-3">
Biểu mẫu đính kèm
<p className="text-justify leading-7 my-3 font-semibold">
Biểu mẫu đính kèm:
</p>
<ul className="list-disc pl-10 space-y-1">
<li className="text-justify leading-7 ">
<a href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Don-dang-ky-tham-gia-nhap-hoi-vien-VCCI_Mau-Doanh-nghiep-1.docx" className="text-[#063e8e] hover:text-yellow-500 italic" download>
Đơn đăng ký tham gia nhập hội viên VCCI (Mẫu Doanh nghiệp)
<ul className="list-disc pl-6 sm:pl-10 space-y-1">
<li className="text-justify leading-7">
<a
href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Don-dang-ky-tham-gia-nhap-hoi-vien-VCCI_Mau-Doanh-nghiep-1.docx"
className="text-[#063e8e] hover:text-yellow-500 italic"
download
>
Đơn đăng ký tham gia nhập hội viên VCCI (Mẫu Doanh nghiệp)
</a>
</li>
<li className="text-justify leading-7">
<a href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Don-dang-ky-tham-gia-nhap-hoi-vien-VCCI_Mau-Hiep-hoi.docx" className="text-[#063e8e] hover:text-yellow-500 italic" download>
Đơn đăng ký tham gia nhập hội viên VCCI (Mẫu Hiệp hội)
<a
href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Don-dang-ky-tham-gia-nhap-hoi-vien-VCCI_Mau-Hiep-hoi.docx"
className="text-[#063e8e] hover:text-yellow-500 italic"
download
>
Đơn đăng ký tham gia nhập hội viên VCCI (Mẫu Hiệp hội)
</a>
</li>
<li className="text-justify leading-7">
<a href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Huong-dan-ho-so-dang-ky-Hoi-vien-VCCI.docx" className="text-[#063e8e] hover:text-yellow-500 italic" download>
Hướng dẫn hồ sơ đăng ký Hội viên VCCI
<a
href="https://vcci-hcm.org.vn/wp-content/uploads/2025/08/Huong-dan-ho-so-dang-ky-Hoi-vien-VCCI.docx"
className="text-[#063e8e] hover:text-yellow-500 italic"
download
>
Hướng dẫn hồ sơ đăng ký Hội viên VCCI
</a>
</li>
</ul>
</div >
</main>
</div >
</div >
</div >
</div>
</div>
);
};
......
src/app/(main)/hoi-vien/ket-noi-hoi-vien/page.tsx
View file @ e0c56a2e
......@@ -2,7 +2,7 @@
import React, { useState } from "react";
import ListCategory from "./../components/list-category";
import ListFilter from "./../components/list-filter";
import NewsContent from "./../components/card-news";
import CardNews from "./../components/card-news";
import { Pagination } from '@components/base/pagination'
import Image from "next/image";
import { useGetNews } from '@api/endpoints/news'
......@@ -27,7 +27,7 @@ export default function Page() {
<main className="lg:col-span-2 bg-background">
<div className='pb-5 overflow-hidden'>
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
<CardNews key={news.id} news={news} />
))}
<div className='w-full flex justify-center mt-4'>
......
src/app/(main)/hoi-vien/tin-hoi-vien/page.tsx
View file @ e0c56a2e
......@@ -2,7 +2,7 @@
import React, { useState } from "react";
import ListCategory from "./../components/list-category";
import ListFilter from "./../components/list-filter";
import NewsContent from "./../components/card-news";
import CardNews from "./../components/card-news";
import { Pagination } from '@components/base/pagination'
import Image from "next/image";
import { useGetNews } from '@api/endpoints/news'
......@@ -27,7 +27,7 @@ export default function Page() {
<main className="lg:col-span-2 bg-background">
<div className='pb-5 overflow-hidden'>
{allData?.responseData.rows.map((news) => (
<NewsContent key={news.id} news={news} />
<CardNews key={news.id} news={news} />
))}
<div className='w-full flex justify-center mt-4'>
......
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