File: /var/www/w230/html/behavior/dashboardv1.php
<?php
session_start();
if (!isset($_SESSION['user_id'])) {
header("Location: index.php");
exit();
}
include 'db.php';
// ดึงนักเรียนทั้งหมด
$students_result = $conn->query("SELECT id, fullname FROM students ORDER BY fullname ASC");
// กรองตามนักเรียนและวันที่
$where = "1";
$student_id = isset($_GET['student_id']) ? $_GET['student_id'] : '';
$date_start = isset($_GET['date_start']) ? $_GET['date_start'] : '';
$date_end = isset($_GET['date_end']) ? $_GET['date_end'] : '';
if ($student_id !== '') {
$where .= " AND student_id = " . intval($student_id);
}
if ($date_start !== '' && $date_end !== '') {
$where .= " AND behavior_date BETWEEN '" . $conn->real_escape_string($date_start) . "' AND '" . $conn->real_escape_string($date_end) . "'";
}
$summary_sql = "SELECT s.fullname, SUM(b.points) AS total_points FROM behavior b JOIN students s ON b.student_id = s.id WHERE $where GROUP BY b.student_id ORDER BY total_points DESC";
$summary_result = $conn->query($summary_sql);
$labels = [];
$data = [];
while ($row = $summary_result->fetch_assoc()) {
$labels[] = $row['fullname'];
$data[] = $row['total_points'];
}
?>
<!DOCTYPE html>
<html lang="th">
<head>
<meta charset="UTF-8">
<title>แดชบอร์ด กราฟคะแนนความประพฤติ</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Prompt&display=swap" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<style>
body {
font-family: 'Prompt', sans-serif;
background: #f6fff6;
}
.container {
padding: 20px;
}
.dashboard {
padding: 30px;
}
</style>
</head>
<body>
<div class="container dashboard">
<div class="d-flex justify-content-between align-items-center mb-4">
<h4>สวัสดีคุณ <?= $_SESSION['user_name']; ?></h4>
<a href="logout.php" class="btn btn-danger btn-sm">ออกจากระบบ</a>
</div>
<div class="row g-3">
<div class="col-sm-6 col-md-4">
<a href="#" class="btn btn-primary w-50 p-2">บันทึกคะแนน</a>
</div>
</div>
</div>
<div class="container">
<div class="d-flex justify-content-between align-items-center mb-3">
<h4>📊 รายงานคะแนนความประพฤติ</h4>
</div>
<form method="GET" class="row g-2 mb-4">
<div class="col-md-4">
<label>เลือกนักเรียน</label>
<select name="student_id" class="form-select">
<option value="">-- ทั้งหมด --</option>
<?php while($stu = $students_result->fetch_assoc()): ?>
<option value="<?= $stu['id'] ?>" <?= ($stu['id'] == $student_id) ? 'selected' : '' ?>><?= $stu['fullname'] ?></option>
<?php endwhile; ?>
</select>
</div>
<div class="col-md-3">
<label>จากวันที่</label>
<input type="date" name="date_start" class="form-control" value="<?= $date_start ?>">
</div>
<div class="col-md-3">
<label>ถึงวันที่</label>
<input type="date" name="date_end" class="form-control" value="<?= $date_end ?>">
</div>
<div class="col-md-2 d-grid">
<label> </label>
<button type="submit" class="btn btn-success">ค้นหา</button>
</div>
</form>
<canvas id="behaviorChart"></canvas>
<div class="text-end mt-3">
<a href="export_csv.php?student_id=<?= $student_id ?>&date_start=<?= $date_start ?>&date_end=<?= $date_end ?>" class="btn btn-outline-primary">📥 ส่งออก CSV</a>
</div>
</div>
<script>
const ctx = document.getElementById('behaviorChart').getContext('2d');
const behaviorChart = new Chart(ctx, {
type: 'bar',
data: {
labels: <?= json_encode($labels) ?>,
datasets: [{
label: 'คะแนนรวม',
data: <?= json_encode($data) ?>,
backgroundColor: 'rgba(75, 192, 192, 0.7)'
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: true
}
}
}
});
</script>
</body>
</html>