| Server IP : 104.21.73.108 / Your IP : 216.73.216.59 Web Server : Apache/2 System : Linux cat167-197.static.lnwhostname.com 5.10.0-20-amd64 #1 SMP Debian 5.10.158-2 (2022-12-13) x86_64 User : paphayomho ( 1042) PHP Version : 5.6.40 Disable Function : exec,system,passthru,shell_exec,proc_close,proc_open,dl,popen,show_source,posix_kill,posix_mkfifo,posix_getpwuid,posix_setpgid,posix_setsid,posix_setuid,posix_setgid,posix_seteuid,posix_setegid,posix_uname MySQL : ON | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /home/paphayomho/domains/paphayomhospital.go.th/private_html/HA2569/ |
Upload File : |
<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Service Profile - โรงพยาบาลป่าพะยอม</title>
<link href="https://fonts.googleapis.com/css2?family=Sarabun:wght@300;400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<style>
:root {
--primary-color: #007f5f;
--secondary-color: #2b9348;
--bg-color: #f0f7f4;
--card-bg: #ffffff;
--text-main: #2d3436;
}
body {
font-family: 'Sarabun', sans-serif;
background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
margin: 0;
padding: 0;
color: var(--text-main);
min-height: 100vh;
}
header {
background: var(--primary-color);
color: white;
padding: 3rem 1rem;
text-align: center;
clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
margin-bottom: 2rem;
position: relative;
}
header h1 {
margin: 0;
font-size: 2.5rem;
text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
}
/* ----------------------------------------------- */
/* เพิ่มเติม: สไตล์ปุ่มเมนูทางลัด และปุ่มไฟล์ Service Profile */
/* ----------------------------------------------- */
.header-buttons {
margin-top: 20px;
display: flex;
justify-content: center;
gap: 15px;
flex-wrap: wrap;
}
.btn-custom {
display: inline-flex;
align-items: center;
gap: 8px;
background: #ffffff;
color: var(--primary-color);
border: none;
padding: 10px 20px;
font-size: 1rem;
font-weight: bold;
border-radius: 30px;
cursor: pointer;
text-decoration: none;
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
transition: all 0.3s ease;
}
.btn-custom:hover {
transform: translateY(-3px);
box-shadow: 0 6px 15px rgba(0,0,0,0.2);
background: var(--secondary-color);
color: #ffffff;
}
.btn-primary-action {
background: #ffd166;
color: #2d3436;
}
.btn-primary-action:hover {
background: #ffb703;
color: #2d3436;
}
/* Sidebar เมนูด้านข้าง */
.sidebar-menu {
position: fixed;
top: 0;
left: -350px;
width: 300px;
height: 100%;
background: #ffffff;
box-shadow: 5px 0 25px rgba(0,0,0,0.15);
transition: all 0.4s cubic-bezier(0.05, 0.74, 0.2, 1);
z-index: 1001;
padding: 25px;
box-sizing: border-box;
overflow-y: auto;
}
.sidebar-menu.active {
left: 0;
}
.sidebar-header {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 2px solid var(--bg-color);
padding-bottom: 15px;
margin-bottom: 20px;
}
.sidebar-header h2 {
margin: 0;
font-size: 1.4rem;
color: var(--primary-color);
}
.close-sidebar-btn {
background: none;
border: none;
font-size: 1.5rem;
color: #aaa;
cursor: pointer;
transition: color 0.2s;
}
.close-sidebar-btn:hover {
color: #e74c3c;
}
.sidebar-links {
list-style: none;
padding: 0;
margin: 0;
}
.sidebar-links li {
margin-bottom: 8px;
}
.sidebar-links a {
display: flex;
align-items: center;
padding: 12px 15px;
color: var(--text-main);
text-decoration: none;
border-radius: 10px;
transition: all 0.2s;
font-size: 0.95rem;
}
.sidebar-links a i {
margin-right: 12px;
width: 20px;
text-align: center;
color: var(--primary-color);
}
.sidebar-links a:hover {
background-color: var(--bg-color);
color: var(--primary-color);
padding-left: 20px;
}
/* Overlay ฉากหลังเวลาเปิดเมนู */
.menu-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.4);
z-index: 999;
display: none;
backdrop-filter: blur(2px);
}
.menu-overlay.active {
display: block;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.grid-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 25px;
}
/* ตกแต่ง Card */
.service-card {
background: var(--card-bg);
border-radius: 20px;
overflow: hidden;
box-shadow: 0 10px 20px rgba(0,0,0,0.05);
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
position: relative;
border: 1px solid rgba(255,255,255,0.3);
}
.service-card:hover {
transform: translateY(-10px);
box-shadow: 0 15px 30px rgba(0,127,95,0.2);
}
/* ส่วนหัวของ Card ที่กดได้ */
.card-header-link {
text-decoration: none;
display: block;
background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));
padding: 20px;
color: white;
transition: opacity 0.2s;
}
.card-header-link:hover {
opacity: 0.9;
}
.card-header-link h3 {
margin: 0;
display: flex;
align-items: center;
font-size: 1.25rem;
}
.card-header-link i {
margin-right: 12px;
font-size: 1.5rem;
}
/* รายการลิงก์ย่อย */
.links-body {
padding: 20px;
}
.links-list {
list-style: none;
padding: 0;
margin: 0;
}
.links-list li {
margin-bottom: 10px;
}
.links-list a {
text-decoration: none;
color: #555;
display: flex;
align-items: center;
padding: 8px 12px;
border-radius: 8px;
background: #f8f9fa;
transition: all 0.2s;
}
.links-list a:hover {
background: var(--secondary-color);
color: white;
padding-left: 20px;
}
.links-list a::before {
content: "→";
margin-right: 10px;
font-weight: bold;
}
footer {
text-align: center;
padding: 40px;
color: var(--primary-color);
font-weight: bold;
}
/* Responsive */
@media (max-width: 600px) {
header h1 { font-size: 1.8rem; }
.grid-container { grid-template-columns: 1fr; }
.header-buttons { flex-direction: column; align-items: center; width: 100%; padding: 0 20px; box-sizing: border-box; }
.btn-custom { width: 100%; justify-content: center; }
}
</style>
</head>
<body>
<header>
<h1><i class="fa-solid fa-hospital-user"></i> Service Profile</h1>
<p>โรงพยาบาลป่าพะยอม มุ่งมั่นบริการด้วยหัวใจ</p>
<div class="header-buttons">
<button class="btn-custom" id="openMenuBtn">
<i class="fa-solid fa-bars"></i> รายชื่อกลุ่มงาน
</button>
<a href="https://drive.google.com/drive/folders/1S2GMGULLqiLPBqSAo9KMF4RRchoj5oMy?usp=sharing" class="btn-custom btn-primary-action" id="mainDownloadBtn">
<i class="fa-solid fa-file-pdf"></i> ไฟล์ Service Profile
</a>
</div>
</header>
<div class="container">
<div class="grid-container">
<div class="service-card">
<a href="service_profile_medical_org_papayom.html" class="card-header-link">
<h3><i class="fa-solid fa-user-doctor"></i> 1. กลุ่มงานการแพทย์</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_medical_org_papayom.html">Service Profile กลุ่มงานการแพทย์</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-user-nurse"></i> 2. กลุ่มงานการพยาบาล</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_2569.html">Service Profile งานผู้ป่วยนอก (OPD)</a></li>
<li><a href="service-profile-ipd-pa-phayom.html">Service Profile งานผู้ป่วยใน (IPD)</a></li>
<li><a href="service-profile-er-paphayom_4.html">Service Profile งานอุบัติเหตุ-ฉุกเฉิน(ER)</a></li>
<li><a href="SP_OR_Anesthesia.html">Service Profile งานผ่าตัด-วิสัญญี (OR)</a></li>
<li><a href="service_profile_LR_ANC_paPhayom.html">Service Profile งานห้องคลอด (LR)</a></li>
<li><a href="service-profile-laundry-paphayom.html">Service Profile งานจ่ายกลาง-ซักฟอก</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="lab_service_profile.html" class="card-header-link">
<h3><i class="fa-solid fa-microscope"></i> 3. กลุ่มงานเทคนิคการแพทย์</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="lab_service_profile.html">Service Profile กลุ่มงานเทคนิคการแพทย์</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-pills"></i> 4. กลุ่มงานเภสัชกรรมและคุ้มครองผู้บริโภค</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_pharmacy_2569.html">Service Profile งานเภสัชกรรม </a></li>
<li><a href="service_profile_pharmacy_2569.html">Service Profile งานคลังยา</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="ServiceProfile_den69.html" class="card-header-link">
<h3><i class="fa-solid fa-tooth"></i> 5. กลุ่มงานทันตกรรม</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="ServiceProfile_den69.html">Service Profile กลุ่มงานทันตกรรม</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-house-chimney-medical"></i> 6. กลุ่มงานปฐมภูมิและองค์รวม</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_primary_care_2569.html">Service Profile กลุ่มงานปฐมภูมิและองค์รวม</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="service_profile_radiology_papayom.html" class="card-header-link">
<h3><i class="fa-solid fa-x-ray"></i> 7. กลุ่มงานรังสีวิทยา</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_radiology_papayom.html">Service Profile กลุ่มงานรังสีวิทยา</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="service_profile_PHI.html" class="card-header-link">
<h3><i class="fa-solid fa-wheelchair"></i> 8. กลุ่มงานเวชกรรมฟื้นฟู</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_PHI.html">Service Profile กลุ่มงานเวชกรรมฟื้นฟู</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-leaf"></i> 9. กลุ่มงานแพทย์แผนไทยและแพทย์ทางเลือก</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_ttm.html">Service Profile กลุ่มงานแพทย์แผนไทยและแพทย์ทางเลือก</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="HA2569/service_profile_nutrition.html" class="card-header-link">
<h3><i class="fa-solid fa-utensils"></i> 10. กลุ่มงานโภชนศาสตร์</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_nutrition.html">Service Profile กลุ่มงานโภชนศาสตร์</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-file-invoice"></i> 11. กลุ่มงานบริหารงานทั่วไป</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="Service_Profile_sup.html">Service Profile งานบริหารงานทั่วไป</a></li>
<li><a href="Service_Profile_sup.html">Service Profile งานพัสดุ</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="service_profile_insurance_2569.html" class="card-header-link">
<h3><i class="fa-solid fa-chart-line"></i> 12. กลุ่มประกันสุขภาพ ยุทธศาสตร์</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_insurance_2569.html">Service Profile งานประกันสุขภาพ</a></li>
<li><a href="service_profile_insurance_2569.html">Service Profile งานยุทธศาสตร์</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="#" class="card-header-link">
<h3><i class="fa-solid fa-shield-halved"></i> 13. กลุ่มงานสุขภาพดิจิทัล</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_IT_paPhayom.html">Service Profile งานเทคโนโลยีสารสนเทศ</a></li>
<li><a href="ServiceProfile_MedicalRecords_2569.html">Service Profile งานเวชระเบียน</a></li>
</ul>
</div>
</div>
<div class="service-card">
<a href="service_profile_PSY_2569.html" class="card-header-link">
<h3><i class="fa-solid fa-brain"></i> 14. กลุ่มงานจิตเวชและยาเสพติด</h3>
</a>
<div class="links-body">
<ul class="links-list">
<li><a href="service_profile_PSY_2569.html">Service Profile งานจิตเวชและยาเสพติด</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="menu-overlay" id="menuOverlay"></div>
<div class="sidebar-menu" id="sidebarMenu">
<div class="sidebar-header">
<h2><i class="fa-solid fa-folder-open"></i> เมนู Service Profile</h2>
<button class="close-sidebar-btn" id="closeSidebarBtn">×</button>
</div>
<ul class="sidebar-links">
<li><a href="service_profile_medical_org_papayom.html"><i class="fa-solid fa-user-doctor"></i> 1. กลุ่มงานการแพทย์</a></li>
<li><a href="#" onclick="toggleSidebar();"><i class="fa-solid fa-user-nurse"></i> 2. กลุ่มงานการพยาบาล</a></li>
<li><a href="lab_service_profile.html"><i class="fa-solid fa-microscope"></i> 3. กลุ่มงานเทคนิคการแพทย์</a></li>
<li><a href="service_profile_pharmacy_2569.html"><i class="fa-solid fa-pills"></i> 4. กลุ่มงานเภสัชกรรมฯ</a></li>
<li><a href="ServiceProfile_den69.html"><i class="fa-solid fa-tooth"></i> 5. กลุ่มงานทันตกรรม</a></li>
<li><a href="service_profile_primary_care_2569.html"><i class="fa-solid fa-house-chimney-medical"></i> 6. กลุ่มงานปฐมภูมิและองค์รวม</a></li>
<li><a href="service_profile_radiology_papayom.html"><i class="fa-solid fa-x-ray"></i> 7. กลุ่มงานรังสีวิทยา</a></li>
<li><a href="service_profile_PHI.html"><i class="fa-solid fa-wheelchair"></i> 8. กลุ่มงานเวชกรรมฟื้นฟู</a></li>
<li><a href="#"><i class="fa-solid fa-leaf"></i> 9. กลุ่มงานแพทย์แผนไทยฯ</a></li>
<li><a href="service_profile_nutrition.html"><i class="fa-solid fa-utensils"></i> 10. กลุ่มงานโภชนศาสตร์</a></li>
<li><a href="Service_Profile_sup.html"><i class="fa-solid fa-file-invoice"></i> 11. กลุ่มงานบริหารงานทั่วไป</a></li>
<li><a href="service_profile_insurance_2569.html"><i class="fa-solid fa-chart-line"></i> 12. กลุ่มประกันฯ ยุทธศาสตร์</a></li>
<li><a href="service_profile_IT_paPhayom.html"><i class="fa-solid fa-shield-halved"></i> 13. กลุ่มงานสุขภาพดิจิทัล</a></li>
<li><a href="service_profile_PSY_2569.html"><i class="fa-solid fa-brain"></i> 14. กลุ่มงานจิตเวชและยาเสพติด</a></li>
</ul>
</div>
<footer>
<p><i class="fa-solid fa-copyright"></i> 2026 โรงพยาบาลป่าพะยอม | Digital Service Profile</p>
</footer>
<script>
const openMenuBtn = document.getElementById('openMenuBtn');
const sidebarMenu = document.getElementById('sidebarMenu');
const menuOverlay = document.getElementById('menuOverlay');
const closeSidebarBtn = document.getElementById('closeSidebarBtn');
function toggleSidebar() {
sidebarMenu.classList.toggle('active');
menuOverlay.classList.toggle('active');
}
openMenuBtn.addEventListener('click', toggleSidebar);
closeSidebarBtn.addEventListener('click', toggleSidebar);
menuOverlay.addEventListener('click', toggleSidebar);
</script>
</body>
</html>