<?php
require_once "db.php";

$status = isset($_GET['status']) ? $_GET['status'] : "";
$start_date = isset($_GET['start_date']) ? $_GET['start_date'] : "";
$end_date = isset($_GET['end_date']) ? $_GET['end_date'] : "";

$where_conditions = [];

if ($status == "Absent") {
    $where_conditions[] = "a.status='Absent'";
}
else if ($status == "CheckedIn") {
    $where_conditions[] = "a.check_in_time IS NOT NULL AND a.check_out_time IS NULL";
}
else if ($status != "") {
    $where_conditions[] = "a.status='$status'";
}

if ($start_date != "") {
    $where_conditions[] = "a.att_date >= '$start_date'";
}

if ($end_date != "") {
    $where_conditions[] = "a.att_date <= '$end_date'";
}

$where = "";

if (!empty($where_conditions)) {
    $where = "WHERE " . implode(" AND ", $where_conditions);
}

// ?? ADDED face_image
$sql = "SELECT 
            e.emp_name,
            a.att_date,
            a.check_in_time,
            a.check_out_time,
            a.status,
            a.remark,
            a.location_name,
            a.face_image
        FROM attendance_log a
        JOIN employee e ON a.emp_id = e.emp_id
        $where
        ORDER BY a.att_date DESC";

$result = $conn->query($sql);
?>

<!DOCTYPE html>
<html>
<head>

<title>Attendance Logs</title>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.7/css/dataTables.bootstrap5.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.2/css/buttons.bootstrap5.min.css">

<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://cdn.datatables.net/1.13.7/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.7/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.4.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.bootstrap5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/2.4.2/js/buttons.print.min.js"></script>

</head>

<body class="bg-light">

<div class="container mt-5">

<h2 class="mb-4">Employee Attendance Logs</h2>

<form method="GET" class="row g-3 mb-4">

<div class="col-md-2">
<label class="form-label">Status</label>
<select name="status" class="form-select">

<option value="">All</option>
<option value="On Time" <?php if($status=="On Time") echo "selected"; ?>>On Time</option>
<option value="Late" <?php if($status=="Late") echo "selected"; ?>>Late</option>
<option value="Manual" <?php if($status=="Manual") echo "selected"; ?>>Manual</option>
<option value="Absent" <?php if($status=="Absent") echo "selected"; ?>>Absent</option>
<option value="CheckedIn" <?php if($status=="CheckedIn") echo "selected"; ?>>Checked In</option>

</select>
</div>

<div class="col-md-3">
<label class="form-label">Start Date</label>
<input type="date" name="start_date" value="<?php echo $start_date; ?>" class="form-control">
</div>

<div class="col-md-3">
<label class="form-label">End Date</label>
<input type="date" name="end_date" value="<?php echo $end_date; ?>" class="form-control">
</div>

<div class="col-md-4 d-flex align-items-end gap-2">
<button type="submit" class="btn btn-primary">Filter</button>
<a href="admin_logs.php" class="btn btn-secondary">Reset</a>
<a href="dashboard.php" class="btn btn-success">Dashboard</a>
</div>

</form>

<table id="attendanceTable" class="table table-striped table-bordered">

<thead class="table-dark">
<tr>
<th>Employee</th>
<th>Date</th>
<th>Check In</th>
<th>Check Out</th>
<th>Status</th>
<th>Remark</th>
<th>Location</th>
<th>Photo</th> <!-- ?? NEW -->
</tr>
</thead>

<tbody>

<?php
if($result->num_rows > 0){

while($row = $result->fetch_assoc()){

$checkIn = $row['check_in_time'] ? $row['check_in_time'] : "-";
$checkOut = $row['check_out_time'] ? $row['check_out_time'] : "-";
$remark = $row['remark'] ? $row['remark'] : "-";
$location = $row['location_name'] ? $row['location_name'] : "-";

echo "<tr>";

echo "<td>".$row['emp_name']."</td>";
echo "<td>".$row['att_date']."</td>";
echo "<td>".$checkIn."</td>";
echo "<td>".$checkOut."</td>";
echo "<td>".$row['status']."</td>";
echo "<td>".$remark."</td>";
echo "<td>".$location."</td>";

// ?? PHOTO COLUMN
echo "<td>";

if (!empty($row['face_image'])) {
    echo "<a href='".$row['face_image']."' target='_blank' class='btn btn-sm btn-primary'>
            View Photo
          </a>";
} else {
    echo "<span class='text-muted'>No Photo</span>";
}

echo "</td>";echo "</tr>";
}

}
else{
echo "<tr><td colspan='8'>No records found</td></tr>"; // ?? updated colspan
}
?>

</tbody>

</table>

</div>

<script>
$(document).ready(function () {
$('#attendanceTable').DataTable({
pageLength: 10,
order: [[1, 'desc']],
dom: 'Bfrtip',
buttons: [
{
extend: 'excel',
title: 'Employee_Attendance_Report'
},
{
extend: 'pdf',
title: 'Employee_Attendance_Report'
},
{
extend: 'print',
title: 'Employee Attendance Report'
}
]
});
});
</script>

</body>
</html>