import React, { useState, useEffect } from 'react';
import {
Camera,
Video,
MonitorPlay,
Zap,
FileCheck,
Clock,
Menu,
X,
Phone,
Mail,
MapPin,
ChevronRight,
Star,
CheckCircle,
Play
} from 'lucide-react';
// --- DATA MOCKUP (Dữ liệu giả lập) ---
const SERVICES = [
{
id: 1,
title: "Media Sự Kiện",
desc: "Quay phim Highlight, Chụp ảnh sự kiện chuyên nghiệp. Trả file nhanh trong 24h.",
icon:
},
{
id: 2,
title: "Livestream Chuyên Nghiệp",
desc: "Cầu truyền hình trực tiếp, 1-3 máy quay, đường truyền ổn định cho Hội thảo, Talkshow.",
icon:
},
{
id: 3,
title: "Phim Doanh Nghiệp & TVC",
desc: "Sản xuất TVC quảng cáo, phim giới thiệu doanh nghiệp với kịch bản và ekip đạo diễn.",
icon:
},
{
id: 4,
title: "Flycam Sự Kiện",
desc: "Góc máy trên cao bao quát quy mô hoành tráng cho Teambuilding, Khởi công.",
icon:
}
];
const PRICING_COMBOS = [
{
name: "COMBO 1 (Standard)",
price: "7.500.000",
unit: "VNĐ/Buổi",
desc: "Phù hợp sự kiện nhỏ < 100 khách",
features: [
"01 Photographer chuyên nghiệp",
"01 Videographer (Cameraman)",
"Chỉnh sửa toàn bộ ảnh",
"01 Phim Highlight (3-5 phút)",
"Bàn giao: 3-5 ngày"
],
highlight: false
},
{
name: "COMBO 2 (Pro)",
price: "10.500.000",
unit: "VNĐ/Buổi",
desc: "Phù hợp YEP, Gala Dinner, Hội nghị",
features: [
"02 Photographer (Backdrop + Khoảnh khắc)",
"01 Videographer",
"Chỉnh sửa toàn bộ ảnh",
"01 Phim Highlight cảm xúc",
"Bàn giao: 3-5 ngày"
],
highlight: true // Best Seller
},
{
name: "COMBO VIP (All-in-one)",
price: "18.000.000",
unit: "VNĐ/Buổi",
desc: "Dành cho sự kiện lớn, hoành tráng",
features: [
"02 Photographer Senior",
"02 Videographer (Toàn/Cận)",
"01 Flycam quay toàn cảnh",
"Dựng phim hiệu ứng cao cấp",
"Ưu tiên xử lý nhanh"
],
highlight: false
}
];
const YOUTUBE_VIDEOS = [
{ id: 'video1', title: 'Highlight Year End Party TCL 2025', url: 'https://www.youtube.com/embed/dQw4w9WgXcQ' }, // Thay ID video thật vào đây
{ id: 'video2', title: 'TVC Giới thiệu Toshiko', url: 'https://www.youtube.com/embed/dQw4w9WgXcQ' },
{ id: 'video3', title: 'Livestream Lễ Tốt Nghiệp', url: 'https://www.youtube.com/embed/dQw4w9WgXcQ' },
];
const DRIVE_ALBUMS = [
{
id: 1,
title: 'Sự kiện Khai Trương Diamond Place',
date: 'Jan 2026',
cover: 'https://images.unsplash.com/photo-1511578314322-379afb476865?auto=format&fit=crop&q=80&w=400',
link: 'https://drive.google.com'
},
{
id: 2,
title: 'Teambuilding Công ty ABC',
date: 'Dec 2025',
cover: 'https://images.unsplash.com/photo-1523580494863-6f3031224c94?auto=format&fit=crop&q=80&w=400',
link: 'https://drive.google.com'
},
{
id: 3,
title: 'Hội nghị Khách hàng Vietcombank',
date: 'Nov 2025',
cover: 'https://images.unsplash.com/photo-1544161515-4ab6ce6db48e?auto=format&fit=crop&q=80&w=400',
link: 'https://drive.google.com'
},
];
// --- COMPONENTS ---
const Navigation = () => {
const [isOpen, setIsOpen] = useState(false);
const [scrolled, setScrolled] = useState(false);
useEffect(() => {
const handleScroll = () => {
setScrolled(window.scrollY > 50);
};
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);
const navLinks = [
{ name: "Trang chủ", href: "#home" },
{ name: "Dịch vụ", href: "#services" },
{ name: "Dự án", href: "#portfolio" },
{ name: "Bảng giá", href: "#pricing" },
{ name: "Liên hệ", href: "#contact" },
];
return (
);
};
const Hero = () => {
return (
{/* Background Image/Video Placeholder */}
GIẢI PHÁP HÌNH ẢNH & TRUYỀN THÔNG
TOÀN DIỆN CHO DOANH NGHIỆP
Chuyên nghiệp - Tốc độ - Minh bạch. Đối tác tin cậy của 500+ doanh nghiệp tại TP.HCM & Nha Trang.
);
};
const USP = () => {
return (
Tốc Độ Thần Tốc
Ảnh có trong 24h, Video sau 3-5 ngày.
Pháp Lý Minh Bạch
Hợp đồng rõ ràng, Xuất hoá đơn VAT đầy đủ.
Thiết Bị 4K
Hệ thống máy quay Sony Cinema Line, Flycam đời mới.
);
};
const Services = () => {
return (
{SERVICES.map((service) => (
{service.icon}
{service.title}
{service.desc}
))}
);
};
const Portfolio = () => {
return (
DỰ ÁN TIÊU BIỂU
Những khoảnh khắc "triệu đô" chúng tôi đã ghi lại
{/* Video Grid */}
Video Highlight & TVC
{YOUTUBE_VIDEOS.map((video) => (
{/* Placeholder for iframe to avoid heavy loading in preview */}
Video Embed Placeholder
{video.title}
YouTube Embed
))}
{/* Photo Album Grid */}
);
};
const Pricing = () => {
return (
BẢNG GIÁ COMBO SỰ KIỆN
Giải pháp trọn gói - Tối ưu chi phí - Đã bao gồm VAT 8%
{PRICING_COMBOS.map((combo, index) => (
{combo.highlight && (
KHUYÊN DÙNG
)}
{combo.name}
{combo.price}
{combo.unit}
{combo.desc}
{combo.features.map((feature, idx) => (
-
{feature}
))}
Đặt Lịch Ngay
))}
);
};
const Contact = () => {
return (
);
};
const Footer = () => {
return (
);
};
const FloatingButtons = () => {
return (
);
};
// --- APP COMPONENT ---
const App = () => {
return (
);
};
export default App;