<section class="content-header">
  <div class="container-fluid">
    <div class="row mb-2">
      <div class="col-sm-6">
        <h1><?php echo $page_title; ?></h1>
        <p class="text-muted mb-0"><?php echo html_escape($pegawai->nama_lengkap); ?></p>
      </div>
      <div class="col-sm-6 text-right">
        <ol class="breadcrumb float-sm-right">
          <li class="breadcrumb-item"><a href="<?php echo site_url('dashboard'); ?>">Dashboard</a></li>
          <li class="breadcrumb-item"><a href="<?php echo site_url('transaksi/absensi'); ?>">Manajemen Absensi</a></li>
          <li class="breadcrumb-item active">Detail</li>
        </ol>
      </div>
    </div>
  </div>
</section>

<section class="content">
  <div class="container-fluid">
    <!-- Filter Card -->
    <div class="card card-danger card-outline">
      <div class="card-header">
        <h3 class="card-title"><i class="fa fa-filter mr-1"></i> Periode</h3>
      </div>
      <div class="card-body">
        <form id="form-filter" method="get" action="">
          <div class="row">
            <div class="col-sm-3">
              <div class="form-group">
                <label>Tahun</label>
                <select name="tahun" id="tahun" class="form-control">
                  <?php 
                    $tahun_sekarang = date('Y');
                    for ($t = $tahun_sekarang - 2; $t <= $tahun_sekarang + 1; $t++):
                  ?>
                    <option value="<?php echo $t; ?>" <?php echo ($f_tahun == $t) ? 'selected' : ''; ?>>
                      <?php echo $t; ?>
                    </option>
                  <?php endfor; ?>
                </select>
              </div>
            </div>
            <div class="col-sm-3">
              <div class="form-group">
                <label>Bulan</label>
                <select name="bulan" id="bulan" class="form-control">
                  <?php 
                    $bulan_label = ['', 'Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 
                                    'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
                    for ($b = 1; $b <= 12; $b++):
                  ?>
                    <option value="<?php echo str_pad($b, 2, '0', STR_PAD_LEFT); ?>" <?php echo ($f_bulan == str_pad($b, 2, '0', STR_PAD_LEFT)) ? 'selected' : ''; ?>>
                      <?php echo $bulan_label[$b]; ?>
                    </option>
                  <?php endfor; ?>
                </select>
              </div>
            </div>
            <div class="col-sm-3">
              <div class="form-group">
                <label>&nbsp;</label>
                <button type="submit" class="btn btn-danger btn-block"><i class="fa fa-search mr-1"></i> Tampilkan</button>
              </div>
            </div>
            <div class="col-sm-3 text-right">
              <div class="form-group">
                <label>&nbsp;</label>
                <a href="<?php echo site_url('transaksi/absensi'); ?>" class="btn btn-secondary btn-block"><i class="fa fa-arrow-left mr-1"></i> Kembali</a>
              </div>
            </div>
          </div>
        </form>
      </div>
    </div>

    <!-- Attendance Detail Card -->
    <div class="card card-danger card-outline">
      <div class="card-header">
        <h3 class="card-title"><i class="fa fa-calendar mr-1"></i> Kehadiran <?php echo $bulan_label[(int)$f_bulan] . ' ' . $f_tahun; ?></h3>
      </div>
      <div class="card-body">
        <?php if (!empty($detail)): ?>
        <table id="tbl-detail" class="table table-bordered table-hover table-striped">
          <thead>
            <tr>
              <th style="width:40px;">#</th>
              <th>Tanggal</th>
              <th>Hari</th>
              <th>Jam Masuk</th>
              <th>Jam Keluar</th>
              <th>Status</th>
              <th>Keterangan</th>
              <th style="width:80px;">Aksi</th>
            </tr>
          </thead>
          <tbody>
            <?php foreach ($detail as $i => $row): 
              $status_badge = 'badge-secondary';
              if ($row->status === 'MASUK') $status_badge = 'badge-success';
              elseif ($row->status === 'ALPHA') $status_badge = 'badge-danger';
              elseif ($row->status === 'SAKIT') $status_badge = 'badge-warning';
              elseif ($row->status === 'CUTI') $status_badge = 'badge-info';
              elseif ($row->status === 'LEMBUR') $status_badge = 'badge-primary';
            ?>
            <tr>
              <td><?php echo $i + 1; ?></td>
              <td><?php echo format_tanggal_lengkap($row->tanggal); ?></td>
              <td><?php echo hari_indonesia(date('l', strtotime($row->tanggal))); ?></td>
              <td><?php echo $row->jam_masuk ? substr($row->jam_masuk, 0, 5) : '-'; ?></td>
              <td><?php echo $row->jam_keluar ? substr($row->jam_keluar, 0, 5) : '-'; ?></td>
              <td><span class="badge <?php echo $status_badge; ?>"><?php echo $row->status; ?></span></td>
              <td><?php echo html_escape($row->keterangan ?? ''); ?></td>
              <td>
                <a href="<?php echo site_url('transaksi/absensi/edit/' . $row->id_absensi); ?>" 
                   class="btn btn-xs btn-primary" title="Edit"><i class="fa fa-pencil"></i></a>
                <a href="javascript:void(0)" class="btn btn-xs btn-danger btn-confirm-delete" 
                   data-id="<?php echo $row->id_absensi; ?>" title="Hapus"><i class="fa fa-trash"></i></a>
              </td>
            </tr>
            <?php endforeach; ?>
          </tbody>
        </table>
        <?php else: ?>
        <div class="alert alert-info"><i class="fa fa-info-circle mr-1"></i> Tidak ada data kehadiran untuk periode yang dipilih.</div>
        <?php endif; ?>
      </div>
    </div>
  </div>
</section>

<script>
$(document).ready(function() {
  <?php if (!empty($detail)): ?>
  $('#tbl-detail').DataTable({
    'pageLength': 31,
    'ordering': true,
    'order': [[1, 'asc']],
    'language': {
      'url': '//cdn.datatables.net/plug-ins/1.13.8/i18n/id.json'
    }
  });
  <?php endif; ?>

  // Delete action
  $('.btn-confirm-delete').click(function() {
    var id = $(this).data('id');
    if (confirm('Hapus data kehadiran ini?')) {
      window.location.href = '<?php echo site_url('transaksi/absensi/hapus'); ?>/' + id;
    }
  });
});
</script>
