kunthawat/dealplustech-astro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Initial commit - Deal Plus Tech Astro Website

Browse Source 
✅ 53 pages (34 products + corporate)
✅ All logo images
✅ Nginx Dockerfile (production-ready)
✅ PDPA compliant (cookie consent)
✅ Modern design with Kanit font
✅ Line + Phone buttons on products

Built: 2026-03-13
This commit is contained in:
Kunthawat Greethong
2026-03-13 10:38:49 +07:00
commit 5f9673aac4
65 changed files with 4803 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

225
src/layouts/BaseLayout.astro Normal file
View File

@@ -0,0 +1,225 @@
---
import '../styles/global.css';
interface Props {
title: string;
description?: string;
image?: string;
canonicalURL?: string;
}
const { title, description = 'ผู้เชี่ยวชาญระบบน้ำ ให้คำแนะนำและจำหน่ายท่อ PPR ตราช้าง ท่อพีพีอาร์ ท่อ PPR ท่อ HDPE Thai PPR รั้วตาข่าย คุณภาพสูง ราคาถูก', image = '/images/logo/logox2.png', canonicalURL = Astro.url } = Astro.props;
const siteName = 'Deal Plus Tech';
const siteUrl = 'https://dealplustech.co.th';
---
<!doctype html>
<html lang="th">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="generator" content={Astro.generator} />
<!-- SEO Meta Tags -->
<title>{title} | {siteName}</title>
<meta name="title" content={`${title} | ${siteName}`} />
<meta name="description" content={description} />
<meta name="keywords" content="ท่อ PPR, ท่อ HDPE, ท่อ PVC, ระบบน้ำ, รั้วตาข่าย, อุปกรณ์ท่อ, วาล์ว, ปั๊มน้ำ" />
<link rel="canonical" href={canonicalURL} />
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:url" content={canonicalURL} />
<meta property="og:title" content={`${title} | ${siteName}`} />
<meta property="og:description" content={description} />
<meta property="og:image" content={new URL(image, siteUrl)} />
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:url" content={canonicalURL} />
<meta property="twitter:title" content={`${title} | ${siteName}`} />
<meta property="twitter:description" content={description} />
<meta property="twitter:image" content={new URL(image, siteUrl)} />
<!-- Favicon -->
<link rel="icon" type="image/png" href="/favicon.ico" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<!-- Preconnect to Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
</head>
<body class="flex flex-col min-h-screen">
<slot name="header" />
<main class="flex-grow">
<slot />
</main>
<slot name="footer" />
<!-- Cookie Consent Banner -->
<div id="cookie-consent" class="fixed bottom-0 left-0 right-0 z-50 bg-secondary-900 text-white p-6 shadow-2xl transform translate-y-full transition-transform duration-500">
<div class="container-custom max-w-6xl">
<div class="flex flex-col md:flex-row items-center justify-between gap-6">
<div class="flex-1">
<h3 class="text-xl font-bold mb-2">เราใช้คุกกี้เพื่อประสบการณ์ที่ดีที่สุด</h3>
<p class="text-secondary-300 text-base">
เว็บไซต์ของเราใช้คุกกี้เพื่อเพิ่มประสิทธิภาพการใช้งาน วิเคราะห์การจราจร และแสดงเนื้อหาที่เหมาะสม
คุณสามารถยอมรับหรือปฏิเสธคุกกี้บางประเภทได้
</p>
</div>
<div class="flex flex-wrap gap-4">
<button id="consent-reject" class="btn-secondary px-6 py-3 text-sm">
ปฏิเสธทั้งหมด
</button>
<button id="consent-accept" class="btn-primary px-6 py-3 text-sm">
ยอมรับทั้งหมด
</button>
</div>
</div>
</div>
</div>
<!-- Consent Preferences Modal -->
<div id="consent-modal" class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm hidden">
<div class="flex items-center justify-center min-h-screen p-4">
<div class="bg-white rounded-2xl shadow-2xl max-w-2xl w-full max-h-[90vh] overflow-y-auto">
<div class="p-6 md:p-8">
<div class="flex justify-between items-center mb-6">
<h2 class="text-2xl font-bold text-secondary-900">การตั้งค่าคุกกี้</h2>
<button id="modal-close" class="text-secondary-500 hover:text-secondary-700 text-2xl">&times;</button>
</div>
<div class="space-y-6">
<div class="border border-secondary-200 rounded-xl p-4">
<div class="flex justify-between items-start mb-2">
<div>
<h3 class="font-semibold text-lg text-secondary-900">คุกกี้ที่จำเป็น</h3>
<p class="text-secondary-600 text-base">จำเป็นสำหรับการทำงานของเว็บไซต์ ไม่สามารถปิดได้</p>
</div>
<label class="relative inline-flex items-center cursor-not-allowed">
<input type="checkbox" checked disabled class="sr-only peer" />
<div class="w-11 h-6 bg-primary-500 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-primary-100 rounded-full peer"></div>
</label>
</div>
</div>
<div class="border border-secondary-200 rounded-xl p-4">
<div class="flex justify-between items-start mb-2">
<div>
<h3 class="font-semibold text-lg text-secondary-900">คุกกี้ประสิทธิภาพ</h3>
<p class="text-secondary-600 text-base">ช่วยเราวิเคราะห์การใช้งานเว็บไซต์</p>
</div>
<label class="relative inline-flex items-center cursor-pointer">
<input type="checkbox" id="consent-analytics" class="sr-only peer" />
<div class="w-11 h-6 bg-secondary-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-primary-100 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary-500"></div>
</label>
</div>
</div>
<div class="border border-secondary-200 rounded-xl p-4">
<div class="flex justify-between items-start mb-2">
<div>
<h3 class="font-semibold text-lg text-secondary-900">คุกกี้การตลาด</h3>
<p class="text-secondary-600 text-base">ใช้สำหรับแสดงโฆษณาที่เกี่ยวข้อง</p>
</div>
<label class="relative inline-flex items-center cursor-pointer">
<input type="checkbox" id="consent-marketing" class="sr-only peer" />
<div class="w-11 h-6 bg-secondary-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-primary-100 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary-500"></div>
</label>
</div>
</div>
</div>
<div class="flex gap-4 mt-8">
<button id="consent-save" class="btn-primary flex-1 py-3">
บันทึกการตั้งค่า
</button>
</div>
<p class="text-secondary-500 text-sm mt-6 text-center">
คุณสามารถเปลี่ยนการตั้งค่าคุกกี้ได้ตลอดเวลา การใช้บริการนี้ถือว่าคุณยอมรับ
<a href="/privacy-policy" class="text-primary-500 hover:underline">นโยบายความเป็นส่วนตัว</a> ของเรา
</p>
</div>
</div>
</div>
</div>
<!-- Umami Analytics (conditionally loaded) -->
<script is:inline>
const consent = JSON.parse(localStorage.getItem('consent-preferences') || '{}');
if (consent.analytics) {
const script = document.createElement('script');
script.defer = true;
script.src = 'https://analytics.dealplustech.co.th/script.js';
script.setAttribute('data-website-id', import.meta.env.UMAMI_WEBSITE_ID || '');
document.head.appendChild(script);
}
</script>
<!-- Consent Management Script -->
<script>
(function() {
const consent = JSON.parse(localStorage.getItem('consent-preferences') || '{}');
const hasConsent = consent.timestamp !== undefined;
if (!hasConsent) {
setTimeout(() => {
document.getElementById('cookie-consent').classList.remove('translate-y-full');
}, 1000);
}
document.getElementById('consent-accept')?.addEventListener('click', () => {
saveConsent({ essential: true, analytics: true, marketing: true });
});
document.getElementById('consent-reject')?.addEventListener('click', () => {
saveConsent({ essential: true, analytics: false, marketing: false });
});
document.getElementById('modal-close')?.addEventListener('click', () => {
document.getElementById('consent-modal').classList.add('hidden');
});
document.getElementById('consent-save')?.addEventListener('click', () => {
const analytics = document.getElementById('consent-analytics')?.checked || false;
const marketing = document.getElementById('consent-marketing')?.checked || false;
saveConsent({ essential: true, analytics, marketing });
});
function saveConsent(preferences) {
const consentData = {
...preferences,
timestamp: Date.now(),
policyVersion: '1.0'
};
localStorage.setItem('consent-preferences', JSON.stringify(consentData));
fetch('/api/consent', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(consentData)
}).catch(console.error);
document.getElementById('cookie-consent').classList.add('translate-y-full');
document.getElementById('consent-modal').classList.add('hidden');
if (preferences.analytics && !window.umami) {
const script = document.createElement('script');
script.defer = true;
script.src = 'https://analytics.dealplustech.co.th/script.js';
script.setAttribute('data-website-id', import.meta.env.UMAMI_WEBSITE_ID || '');
document.head.appendChild(script);
}
}
window.openConsentPreferences = function() {
document.getElementById('consent-modal').classList.remove('hidden');
};
})();
</script>
</body>
</html>