File Manager

✏️ Edit File: /home/u625410797/public_html/public_html/views/pages/solutions/smart-hotel.php

<?php
$pageTitle = 'Smart Hotel - Mono Electric Thailand';
$pageDescription = 'ระบบโรงแรมอัจฉริยะ จัดการห้องพักและประหยัดพลังงาน';
?>

<section class="relative h-screen">
    <img src="<?= ASSETS_URL ?>img/solutions/smart-hotel/home-hotel-1.png"
         alt="Smart Hotel"
         class="w-full h-full object-cover">
    <div class="absolute inset-0 bg-gradient-to-r from-black/70 to-transparent">
        <div class="p-12 text-white">
            <h1 class="text-5xl font-bold mb-4">Smart Hotel Solutions</h1>
            <p class="text-xl">Intelligent hospitality management</p>
            <a href="<?= BASE_URL ?>contact" class="inline-flex items-center gap-2 bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold hover:bg-dark-50 transition mt-6">
                <i data-lucide="phone" class="w-5 h-5"></i>
                ติดต่อสอบถาม
            </a>
        </div>
    </div>
</section>

<div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-6 gap-6 my-12">
    <?php for ($i = 1; $i <= 11; $i++): ?>
    <div class="text-center p-4 bg-white rounded-lg shadow hover:shadow-lg transition">
        <img src="<?= ASSETS_URL ?>img/solutions/smart-hotel/p-<?= $i ?>.png"
             alt="Step <?= $i ?>"
             class="w-16 h-16 mx-auto mb-3 cursor-pointer hover:scale-110 transition"
             onclick="openLightbox('<?= ASSETS_URL ?>img/solutions/smart-hotel/p-<?= $i ?>.png')">
        <p class="text-sm font-medium">Step <?= $i ?></p>
    </div>
    <?php endfor; ?>
</div>

<div class="grid md:grid-cols-5 gap-4">
    <?php for ($i = 1; $i <= 5; $i++): ?>
    <img src="<?= ASSETS_URL ?>img/solutions/smart-hotel/sl-sh-<?= $i ?>.png"
         alt="Feature <?= $i ?>"
         class="rounded-lg hover:scale-105 transition cursor-pointer"
         onclick="openLightbox('<?= ASSETS_URL ?>img/solutions/smart-hotel/sl-sh-<?= $i ?>.png')">
    <?php endfor; ?>
</div>

<div id="lightbox" class="fixed inset-0 bg-black/90 z-50 hidden items-center justify-center p-4" onclick="closeLightbox()">
    <button class="absolute top-4 right-4 text-white text-4xl hover:text-gray-300">&times;</button>
    <img id="lightbox-img" src="" alt="Enlarged view" class="max-w-full max-h-full object-contain">
</div>

function closeLightbox() {
    document.getElementById('lightbox').classList.add('hidden');
    document.getElementById('lightbox').classList.remove('flex');
    document.body.style.overflow = 'auto';
}

// Close on Escape key
document.addEventListener('keydown', function(e) {
    if (e.key === 'Escape') closeLightbox();
});
</script>

<section class="max-w-7xl mx-auto px-4 py-16">
    <div class="text-center mb-12">
        <h2 class="text-3xl font-bold text-dark-900 mb-4">คุณสมบัติของ Smart Hotel</h2>
        <p class="text-dark-600 max-w-2xl mx-auto">เทคโนโลยีที่ช่วยให้การบริหารจัดการโรงแรมเป็นไปอย่างมีประสิทธิภาพ</p>
    </div>

<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
        
        <div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-blue-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="door-open" class="w-7 h-7 text-blue-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">ควบคุมห้องพัก</h3>
            <p class="text-dark-600 text-sm">ควบคุมไฟ อุณหภูมิ และอุปกรณ์ในห้องผ่านแอปหรือคีย์การ์ด</p>
        </div>

<div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-green-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="leaf" class="w-7 h-7 text-green-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">ประหยัดพลังงาน</h3>
            <p class="text-dark-600 text-sm">ระบบปิดไฟอัตโนมัติเมื่อไม่มีผู้เข้าพัก ลดค่าไฟได้ถึง 30%</p>
        </div>

<div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-purple-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="smile" class="w-7 h-7 text-purple-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">ประสบการณ์ผู้เข้าพัก</h3>
            <p class="text-dark-600 text-sm">เพิ่มความสะดวกสบายด้วยระบบจองและเช็คอินอัตโนมัติ</p>
        </div>

<div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-red-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="shield-check" class="w-7 h-7 text-red-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">ความปลอดภัย</h3>
            <p class="text-dark-600 text-sm">ระบบกล้องวงจรปิดและเซนเซอร์ตรวจจับทั่วโรงแรม</p>
        </div>

<div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-orange-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="pie-chart" class="w-7 h-7 text-orange-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">วิเคราะห์ข้อมูล</h3>
            <p class="text-dark-600 text-sm">รายงานการใช้งานและสถิติเพื่อการวางแผนที่ดีขึ้น</p>
        </div>

<div class="bg-white rounded-2xl border border-dark-200 p-6 hover:shadow-lg transition">
            <div class="w-14 h-14 bg-teal-100 rounded-xl flex items-center justify-center mb-4">
                <i data-lucide="link" class="w-7 h-7 text-teal-600"></i>
            </div>
            <h3 class="text-xl font-bold text-dark-900 mb-2">เชื่อมต่อระบบ</h3>
            <p class="text-dark-600 text-sm">เชื่อมต่อกับระบบ PMS และระบบอื่นๆ ได้อย่างราบรื่น</p>
        </div>
    </div>
</section>

<section class="bg-dark-50 py-16">
    <div class="max-w-7xl mx-auto px-4">
        <div class="text-center mb-12">
            <h2 class="text-3xl font-bold text-dark-900 mb-4">ประโยชน์ของ Smart Hotel</h2>
            <p class="text-dark-600 max-w-2xl mx-auto">เพิ่มประสิทธิภาพและลดต้นทุนด้วยเทคโนโลยีอัจฉริยะ</p>
        </div>

<div class="grid md:grid-cols-2 gap-8">
            <div class="flex items-start gap-4">
                <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center flex-shrink-0">
                    <i data-lucide="check-circle" class="w-6 h-6 text-blue-600"></i>
                </div>
                <div>
                    <h3 class="text-lg font-bold text-dark-900 mb-2">ลดค่าไฟ 20-30%</h3>
                    <p class="text-dark-600 text-sm">ระบบจัดการพลังงานอัจฉริยะช่วยลดค่าไฟอย่างมีนัยสำคัญ</p>
                </div>
            </div>

<div class="flex items-start gap-4">
                <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center flex-shrink-0">
                    <i data-lucide="check-circle" class="w-6 h-6 text-blue-600"></i>
                </div>
                <div>
                    <h3 class="text-lg font-bold text-dark-900 mb-2">เพิ่มความพึงพอใจ</h3>
                    <p class="text-dark-600 text-sm">ประสบการณ์ที่ดีขึ้นช่วยเพิ่มความพึงพอใจของผู้เข้าพัก</p>
                </div>
            </div>

<div class="flex items-start gap-4">
                <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center flex-shrink-0">
                    <i data-lucide="check-circle" class="w-6 h-6 text-blue-600"></i>
                </div>
                <div>
                    <h3 class="text-lg font-bold text-dark-900 mb-2">ลดแรงงาน</h3>
                    <p class="text-dark-600 text-sm">ออโตเมชันช่วยลดการใช้แรงงานและเวลา</p>
                </div>
            </div>

<div class="flex items-start gap-4">
                <div class="w-12 h-12 bg-blue-100 rounded-xl flex items-center justify-center flex-shrink-0">
                    <i data-lucide="check-circle" class="w-6 h-6 text-blue-600"></i>
                </div>
                <div>
                    <h3 class="text-lg font-bold text-dark-900 mb-2">ติดตามได้ทุกที่</h3>
                    <p class="text-dark-600 text-sm">แอปพลิเคชันมือถือช่วยให้ติดตามได้จากทุกที่</p>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="bg-blue-600 py-16">
    <div class="max-w-7xl mx-auto px-4 text-center">
        <h2 class="text-3xl font-bold text-white mb-4">พร้อมเปลี่ยนโรงแรมของคุณให้เป็น Smart Hotel?</h2>
        <p class="text-blue-100 mb-8 max-w-2xl mx-auto">ติดต่อเราเพื่อรับคำปรึกษาฟรีและใบเสนอราคา</p>
        <a href="<?= BASE_URL ?>contact" class="inline-flex items-center gap-2 bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold hover:bg-dark-50 transition">
            <i data-lucide="phone" class="w-5 h-5"></i>
            ติดต่อเรา
        </a>
    </div>
</section>

Batal

⬅ Naik ke pages 5 item

Nama	Tipe	Ukuran	Diubah	Aksi
🐘smart-farm.php	php	11.5 KB	2026-05-31 16:45	✏️ Edit 👁️ View
🐘smart-home.php	php	6.9 KB	2026-05-31 16:45	✏️ Edit 👁️ View
🐘smart-hotel.php	php	11 KB	2026-05-31 16:45	✏️ Edit 👁️ View
🐘smart-micro-grid.php	php	12.6 KB	2026-05-31 16:45	✏️ Edit 👁️ View
🐘smart.php	php	5.8 KB	2026-05-31 16:45	✏️ Edit 👁️ View