{tier.name} {tier.badge}

{tier.items.map((item,i)=>(

▸ {item}

))}

); } function SubTabs({ tabs, active, onChange }) { return (

{tabs.map(t=>( ))}

); } function TabKhachHang() { const [sub,setSub]=useState("billing"); return (

{sub==="billing"&&(

Cam kết cốt lõi

Không bao giờ
bị cúp điện nữa

Độc quyền ABBank × EVN

Hạn mức tín dụng
khẩn cấp on top

{[{icon:"🏦",title:"Hạn mức thông thường",desc:"Dùng cho chi tiêu hàng ngày như mọi thẻ tín dụng khác",color:C.tealL,hl:false},{icon:"⚡",title:"Hạn mức khẩn cấp — Lớp 2 riêng biệt",desc:"Chỉ kích hoạt tự động khi không đủ tiền thanh toán điện. Lãi suất tính riêng, minh bạch.",color:C.purpleL,hl:true}].map((item,i)=>(

{item.icon}

{item.title}

{item.desc}

))}

VÍ DỤ THỰC TẾ

Hạn mức thông thường đã dùng 72% (7,2tr / 10tr). Đến kỳ tiền điện 1,2 triệu — nếu không đủ → hạn mức khẩn cấp 2 triệu tự kích hoạt ngay. Điện không bao giờ bị cúp.

)} {sub==="bnpl"&&(

Cam kết cốt lõi

Ví không trống —
điện vẫn sáng

{[{step:"01",icon:"📲",title:"Hóa đơn về — bấm Trả góp",desc:"Chọn chia 2 hoặc 4 tuần. Xác nhận trong 10 giây.",color:C.orangeL},{step:"02",icon:"💸",title:"ABBank trả đủ cho EVN ngay",desc:"EVN nhận 100% tiền ngay lập tức. Điện không cúp.",color:C.tealL},{step:"03",icon:"📅",title:"Bạn trả ABBank từng tuần",desc:"Lịch trả cố định, lãi suất đã biết trước. Không bất ngờ.",color:C.greenL}].map((s,i)=>(

{s.icon}

BƯỚC {s.step} {s.title}

{s.desc}

))}

AI PHÙ HỢP NHẤT?

{[{who:"☀️ Hộ gia đình",case:"Tháng 6, điện lên 2 triệu vì nắng nóng → chia 4 tuần, mỗi tuần 500K"},{who:"🏪 Hộ kinh doanh nhỏ",case:"Cuối tháng hàng chưa về tiền, điện đến kỳ → trả góp khớp chu kỳ thu tiền"},{who:"🎓 Học phí + dịch vụ lớn",case:"Học phí + bảo hiểm + internet về cùng lúc → chia nhỏ bất kỳ hóa đơn lớn nào"}].map((item,i)=>(

{item.who}

{item.case}

))}

)} {sub==="legacy"&&(

TỔNG KẾT

Khách hàng mới có thể nhận tổng 80.000đ thưởng chỉ từ việc chuyển sang thanh toán điện qua ABBank và duy trì đều đặn 6 kỳ.

KHI EVN + NHÀ THẦU CÙNG TK TẠI ABBANK

{["Miễn phí 100% chuyển tiền EVN → nhà thầu","Giảm phí bảo lãnh lên đến 30%","Tặng tài khoản số đẹp cho nhà thầu"].map((item,i)=>(

✓ {item}

))}

)}

); } function TabCBCNV() { const [sub,setSub]=useState("xe"); return (

{sub==="xe"&&(

{[{val:"100%",label:"Tài trợ xe điện",color:C.greenL},{val:"0đ",label:"Vốn ban đầu",color:C.gold},{val:"8 năm",label:"Thời hạn vay",color:C.sage}].map((s,i)=>(

{s.val}

{s.label}

))}

Câu chuyện chiến lược

100.000 CBCNV EVN vận hành điện cho cả quốc gia — nhưng bao nhiêu người đang lái xe xăng mỗi ngày? ABBank biến cam kết xanh của EVN thành hành động: xe điện 0đ vốn ban đầu.

{[{icon:"💰",title:"Tiết kiệm chi phí vận hành",desc:"Chi phí nhiên liệu điện thấp hơn xăng 60–70%. CBCNV EVN được ưu đãi giá điện — tiết kiệm kép theo 2 chiều."},{icon:"🌱",title:"Thực hành ESG từ cuộc sống hàng ngày",desc:"Mỗi xe điện thay thế xe xăng = hàng tấn CO₂ giảm mỗi năm. EVN và nhân viên cùng đi trên một con đường."},{icon:"🔋",title:"Hạ tầng sạc đang mở rộng nhanh",desc:"Mạng lưới sạc điện tại Việt Nam tăng trưởng mạnh. Thời điểm chuyển đổi tốt nhất là ngay hôm nay."}].map((item,i)=>(

{item.icon}

{item.title}

{item.desc}

))}

)} {sub==="card"&&(

ƯU ĐÃI LÃI SUẤT TIỀN GỬI

{[{val:"+0,3%",label:"Quản lý cấp trung"},{val:"+0,2%",label:"Cán bộ nhân viên"}].map((s,i)=>(

{s.val}

{s.label}

))}

Tiết kiệm EVN+

Lãi suất cộng thêm trên mặt bằng thị trường — tích lũy tài sản dài hạn hiệu quả hơn. Đặc quyền dành riêng cho CBCNV EVN.

)} {sub==="nha"&&(

HỆ SINH THÁI GELEXIMCO

Geleximco là một trong những tập đoàn BĐS lớn nhất Việt Nam. CBCNV EVN được tiếp cận dự án cao cấp với ưu đãi độc quyền thông qua quan hệ đối tác chiến lược ABBank × Geleximco.

Dragon Đồ Sơn 5 sao

{[{val:"10",label:"đêm",who:"BLĐ Tập đoàn",color:C.gold},{val:"5",label:"đêm",who:"QL cấp cao",color:C.blue},{val:"1",label:"đêm",who:"QL cấp trung",color:C.sage}].map((s,i)=>(

{s.val}

{s.label}

{s.who}

))}

Golf Hiltop & Đồi Rồng — Miễn phí

{[{val:"30",who:"BLĐ Tập đoàn",color:C.gold},{val:"15",who:"QL cấp cao",color:C.blue},{val:"5",who:"QL cấp trung",color:C.sage}].map((s,i)=>(

{s.val}

lượt

{s.who}

))}

)}

); } function TabDoanhNghiep() { const [sub,setSub]=useState("tapdown"); return (

{sub==="tapdown"&&(

{[{name:"Ban lãnh đạo chủ chốt",badge:"Tier 1",color:C.gold,items:["Voucher nhà Đồi Rồng: 1 tỷ","Voucher HTL Seaside / Lumira Valley: 500 triệu","Ưu đãi xe Omoda & Jaecoo: 200 triệu","Dragon Đồ Sơn: 10 đêm","Golf Hiltop & Đồi Rồng: 30 lượt"]},{name:"Quản lý cấp cao",badge:"Tier 2",color:C.blue,items:["Voucher nhà Đồi Rồng: 500 triệu","Voucher HTL Seaside: 300 triệu","Ưu đãi xe: 100 triệu","Dragon Đồ Sơn: 5 đêm","Golf: 15 lượt"]},{name:"Quản lý cấp trung",badge:"Tier 3",color:C.sage,items:["Ưu đãi xe Omoda & Jaecoo: 50 triệu","Dragon Đồ Sơn: 1 đêm","Golf: 5 lượt"]},{name:"Cán bộ nhân viên",badge:"Tier 4",color:C.slate,items:["Không áp dụng ưu đãi Geleximco"]}].map((t,i)=>)} {[{name:"Ban lãnh đạo chủ chốt",badge:"Tier 1",color:C.gold,items:["Thẻ tín dụng: 10 tỷ","Tài khoản số đẹp phong thuỷ","Miễn phí 100% phí kiều hối","Đặc quyền khách hàng ưu tiên"]},{name:"Quản lý cấp cao",badge:"Tier 2",color:C.blue,items:["Thẻ tín dụng: 5 tỷ","Tài khoản số đẹp phong thuỷ","Miễn phí 100% phí kiều hối"]},{name:"Quản lý cấp trung",badge:"Tier 3",color:C.sage,items:["Thẻ tín dụng: 300 triệu","Tài khoản số đẹp phong thuỷ","Lãi suất tiền gửi +0,3%"]},{name:"Cán bộ nhân viên",badge:"Tier 4",color:C.slate,items:["Thẻ tín dụng: 100 triệu","Tài khoản số đẹp phong thuỷ","Lãi suất tiền gửi +0,2%","Miễn phí 100% phí kiều hối"]}].map((t,i)=>)}

)} {sub==="congtycon"&&(

{[{name:"Ban lãnh đạo chủ chốt",badge:"Tier 1",color:C.gold,items:["Voucher nhà Đồi Rồng: 500 triệu","Voucher HTL Seaside / Lumira Valley: 300 triệu","Ưu đãi xe: 100 triệu","Dragon Đồ Sơn: 5 đêm","Golf: 15 lượt"]},{name:"Quản lý cấp cao",badge:"Tier 2",color:C.blue,items:["Ưu đãi xe Omoda & Jaecoo: 50 triệu","Dragon Đồ Sơn: 1 đêm","Golf: 5 lượt"]},{name:"Quản lý cấp trung",badge:"Tier 3",color:C.sage,items:["Không áp dụng ưu đãi Geleximco"]},{name:"Cán bộ nhân viên",badge:"Tier 4",color:C.slate,items:["Không áp dụng ưu đãi Geleximco"]}].map((t,i)=>)} {[{name:"Ban lãnh đạo chủ chốt",badge:"Tier 1",color:C.gold,items:["Thẻ tín dụng: 5 tỷ","Tài khoản số đẹp phong thuỷ","Miễn phí 100% phí kiều hối","Đặc quyền khách hàng ưu tiên"]},{name:"Quản lý cấp cao",badge:"Tier 2",color:C.blue,items:["Thẻ tín dụng: 1 tỷ","Miễn phí 100% phí kiều hối","Lãi suất tiền gửi +0,3%"]},{name:"Quản lý cấp trung",badge:"Tier 3",color:C.sage,items:["Thẻ tín dụng: 100 triệu + hoàn tiền 2tr/tháng","Tài khoản số đẹp (trị giá 80 triệu)","Miễn phí quản lý TK số dư tối thiểu","Lãi suất tiền gửi +0,3%"]},{name:"Cán bộ nhân viên",badge:"Tier 4",color:C.slate,items:["Thẻ tín dụng: 50 triệu + hoàn tiền 2tr/tháng","Tài khoản số đẹp (trị giá 80 triệu)","Miễn phí quản lý TK số dư tối thiểu","Lãi suất tiền gửi +0,2%"]}].map((t,i)=>)}

)} {sub==="nhathau"&&(

2 kỳ

Hạn mức thấu chi tối đa

Ưu đãi khi EVN + Nhà thầu cùng TK tại ABBank

{["Miễn phí 100% chuyển tiền thanh toán EVN → nhà thầu","Giảm phí bảo lãnh lên đến 30%","Tặng tài khoản số đẹp cho nhà thầu"].map((item,i)=>(

✓ {item}

))}

)}

); } const TABS=[ {id:"khachhang",num:"01",icon:"💳",label:"Khách hàng",sublabel:"Hộ gia đình & Doanh nghiệp SME",tagline:"2 sản phẩm mới — Trả tiền điện thông minh hơn. Thoải mái hơn.",story:"Thẻ Billing với AI dự báo hóa đơn + hạn mức khẩn cấp ON TOP độc quyền, và BNPL chia nhỏ hóa đơn lớn theo tuần. Lần đầu tiên tại Việt Nam — tài chính thiết yếu được thiết kế thực sự cho người dùng điện EVN.",accent:C.tealL,bgGrad:"linear-gradient(135deg,#004D5A 0%,#006978 60%,#0097A7 100%)",stats:[{label:"Dự báo hóa đơn trước",value:"3 tuần"},{label:"Hạn mức khẩn cấp",value:"On top"},{label:"BNPL linh hoạt",value:"2–4 kỳ"}],render:()=>}, {id:"cbcnv",num:"02",icon:"🌿",label:"Cán bộ nhân viên EVN",sublabel:"~100.000 CBCNV toàn quốc",tagline:"Người EVN tiên phong sống xanh — ABBank đồng hành tài chính",story:"Xe điện 100% tài trợ, 0đ vốn ban đầu, 8 năm thời hạn vay. Cùng EVN Power Card, Tiết kiệm EVN+, Vay nhà Geleximco và nghỉ dưỡng cao cấp — tất cả với lãi suất đặc quyền EVN.",accent:C.greenL,bgGrad:"linear-gradient(135deg,#1B4420 0%,#2E6B28 60%,#388E3C 100%)",stats:[{label:"Tài trợ xe điện",value:"100%"},{label:"Vốn ban đầu",value:"0đ"},{label:"Thời hạn vay",value:"8 năm"}],render:()=>}, {id:"doanhnghiep",num:"03",icon:"🏗️",label:"Doanh nghiệp",sublabel:"EVN · Công ty con · Nhà thầu",tagline:"Giải pháp tài chính theo từng cấp — từ Tập đoàn đến chuỗi cung ứng",story:"Chính sách phân cấp rõ ràng từ Ban lãnh đạo Tập đoàn (thẻ 10 tỷ, voucher nhà 1 tỷ) đến chuỗi nhà thầu (tài trợ 85% HĐ, ký quỹ từ 0%). ABBank bao phủ toàn bộ hệ sinh thái EVN.",accent:C.corpL,bgGrad:"linear-gradient(135deg,#003D33 0%,#004D40 60%,#00695C 100%)",stats:[{label:"Thẻ TD tối đa",value:"10 tỷ"},{label:"Tài trợ HĐ nhà thầu",value:"85%"},{label:"Ký quỹ từ",value:"0%"}],render:()=>}, ]; export default function App() { const [active,setActive]=useState("khachhang"); const tab=TABS.find(t=>t.id===active); return (

{/* NAV */}

AB Bank × EVN

Giải pháp tài chính đặc quyền · 2026

TÀI LIỆU CHIẾN LƯỢC NỘI BỘ · BẢO MẬT

{/* MAIN TABS */}

{TABS.map(t=>( ))}

{/* HERO */}

Nhóm {tab.num} — {tab.sublabel}

{tab.tagline}

{tab.story}

{tab.stats.map((s,i)=>)}

{/* CONTENT */}

{tab.render()}

{/* FOOTER */}

); }

{title}

{tab.tagline}