| 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/public_html/PolicyPaphayom/ |
Upload File : |
<?php
require_once('db.php');
$limit = 6;
$page = isset($_GET['page']) ? (int)$_GET['page'] : 1;
$search = isset($_GET['q']) ? $conn->real_escape_string($_GET['q']) : '';
$offset = ($page - 1) * $limit;
$where = $search != "" ? " WHERE title LIKE '%$search%' OR description LIKE '%$search%' " : "";
$total_items = $conn->query("SELECT COUNT(*) as total FROM announcements $where")->fetch_assoc()['total'];
$total_pages = ceil($total_items / $limit);
$result = $conn->query("SELECT * FROM announcements $where ORDER BY id DESC LIMIT $limit OFFSET $offset");
?>
<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>ประกาศและนโยบาย | โรงพยาบาลป่าพะยอม</title>
<link href="https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
<style>
:root { --moph-green: #2d7a6e; --light-green: #f0f9f7; }
body { font-family: 'Prompt', sans-serif; background-color: #fcfdfd; }
/* ปรับปรุง Header */
.page-header {
background: linear-gradient(135deg, #1d5b51 0%, var(--moph-green) 100%);
color: white;
padding: 50px 0 70px 0; /* เพิ่ม padding ล่างเผื่อแถบค้นหา */
}
.logo-img {
max-width: 120px; /* ปรับขนาดโลโก้ตามต้องการ */
height: auto;
margin-bottom: 15px;
filter: drop-shadow(0px 4px 8px rgba(0,0,0,0.2));
}
.search-box { border-radius: 50px; padding: 12px 25px; border: none; box-shadow: 0 5px 15px rgba(0,0,0,0.1); width: 100%; }
/* Card Style */
.policy-card {
background: white;
border-radius: 20px;
border: 1px solid #eee;
height: 100%;
display: flex;
flex-direction: column;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.policy-card:hover { transform: translateY(-8px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); }
/* Image Display */
.img-container {
width: 100%;
aspect-ratio: 16/9;
overflow: hidden;
cursor: pointer;
background: #f8f9fa;
border-radius: 12px;
margin-bottom: 15px;
}
.img-container img { width: 100%; height: 100%; object-fit: cover; }
.btn-action {
padding: 15px;
text-align: center;
background: var(--light-green);
color: var(--moph-green);
text-decoration: none;
font-weight: 600;
border-top: 1px solid #eee;
border-radius: 0 0 20px 20px;
}
.btn-action:hover { background: var(--moph-green); color: white; }
.modal { z-index: 2000 !important; }
.modal-backdrop { z-index: 1050 !important; }
.modal-content { background: transparent !important; border: none !important; }
.full-img { max-height: 85vh; width: auto; max-width: 100%; object-fit: contain; box-shadow: 0 10px 40px rgba(0,0,0,0.5); }
.card-title-limit {
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
overflow: hidden; min-height: 2.8em; line-height: 1.4;
}
</style>
</head>
<body>
<header class="page-header text-center">
<div class="container">
<img src="../images/pp.png" alt="โลโก้โรงพยาบาลป่าพะยอม" class="logo-img">
<h1 class="fw-bold">ประกาศและนโยบาย</h1>
<p class="mb-0 opacity-75">โรงพยาบาลป่าพะยอม</p>
</div>
</header>
<div class="container" style="margin-top:-30px; position: relative; z-index: 100;">
<div class="row justify-content-center">
<div class="col-11 col-md-6">
<form action="index.php" method="GET">
<input type="text" name="q" class="form-control search-box" placeholder="ค้นหาชื่อประกาศหรือเนื้อหา..." value="<?php echo htmlspecialchars($search); ?>">
</form>
</div>
</div>
</div>
<div class="container mt-5 mb-5">
<div class="row g-4">
<?php while($row = $result->fetch_assoc()): ?>
<div class="col-12 col-sm-6 col-lg-4">
<div class="policy-card">
<div class="p-4 flex-grow-1">
<span class="badge bg-success mb-2" style="background-color: var(--moph-green) !important;">
<?php echo htmlspecialchars($row['tag']); ?>
</span>
<h5 class="fw-bold card-title-limit"><?php echo htmlspecialchars($row['title']); ?></h5>
<?php if($row['image_path']): ?>
<div class="img-container" data-bs-toggle="modal" data-bs-target="#modal_<?php echo $row['id']; ?>">
<img src="<?php echo $row['image_path']; ?>" alt="thumbnail">
</div>
<?php endif; ?>
<p class="text-muted small"><?php echo mb_strimwidth(htmlspecialchars($row['description']), 0, 100, "..."); ?></p>
</div>
<a href="<?php echo $row['file_path']; ?>" target="_blank" class="btn-action">
<i class="fa-solid fa-file-pdf me-2"></i>ดาวน์โหลด PDF
</a>
</div>
</div>
<?php if($row['image_path']): ?>
<div class="modal fade" id="modal_<?php echo $row['id']; ?>" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="text-end mb-2">
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-0 text-center">
<img src="<?php echo $row['image_path']; ?>" class="rounded full-img">
</div>
</div>
</div>
</div>
<?php endif; ?>
<?php endwhile; ?>
</div>
<?php if($total_pages > 1): ?>
<nav class="mt-5">
<ul class="pagination justify-content-center">
<?php for($i=1; $i<=$total_pages; $i++): ?>
<li class="page-item <?php if($page==$i) echo 'active'; ?>">
<a class="page-link" href="?page=<?php echo $i; ?>&q=<?php echo urlencode($search); ?>"><?php echo $i; ?></a>
</li>
<?php endfor; ?>
</ul>
</nav>
<?php endif; ?>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>