<?php
/** @var array $logs */
/** @var array $parentsById */
/** @var array $filters */

helper('html');
?>

<?= $this->extend('layout/management_layout') ?>

<?= $this->section('styles') ?>
<style>
  .card { box-shadow: 0 2px 6px rgba(0,0,0,0.05); }
  .table thead th { background: #f1f3f5; }
  .badge-type { text-transform: capitalize; }
  .page-header { display:flex; align-items:center; gap:12px; }
  .page-header h1 { font-size: 1.5rem; margin: 0; }
  .page-header .hint { color:#6c757d; font-size: .95rem; }
}</style>
<?= $this->endSection() ?>

<?= $this->section('content') ?>
<div class="container-fluid py-3">
  <div class="page-header mb-3">
    <h1>Payment Notification Management</h1>
    <div class="hint">Review monthly reminder emails sent to parents.</div>
  </div>

  <?= $this->include('partials/academic_filter') ?>
  <div class="card mb-3">
    <div class="card-body">
      <form method="get" class="row g-2 align-items-end">
        <div class="col-md-3">
          <label class="form-label">From</label>
          <input id="from" type="text" name="from" value="<?= esc($filters['from'] ?? '') ?>" class="form-control" placeholder="YYYY-MM-DD HH:MM:SS">
        </div>
        <div class="col-md-3">
          <label class="form-label">To</label>
          <input id="to" type="text" name="to" value="<?= esc($filters['to'] ?? '') ?>" class="form-control" placeholder="YYYY-MM-DD HH:MM:SS">
        </div>
        <div class="col-md-2">
          <label class="form-label">Type</label>
          <select name="type" class="form-select">
            <option value="">All</option>
            <option value="no_payment" <?= ($filters['type'] ?? '')==='no_payment' ? 'selected' : '' ?>>No Payment</option>
            <option value="installment" <?= ($filters['type'] ?? '')==='installment' ? 'selected' : '' ?>>Installment</option>
          </select>
        </div>
        <div class="col-md-4 d-flex gap-2">
          <button class="btn btn-primary" type="submit">Filter</button>
          <button class="btn btn-outline-secondary" type="button" onclick="setQuickRange(30)">Last 30 days</button>
          <a class="btn btn-outline-dark" href="<?= site_url('payment/notification_management') ?>">Reset</a>
        </div>
      </form>
    </div>
  </div>

  <div class="card">
    <div class="card-body">
      <div class="table-responsive">
        <table class="table table-sm align-middle">
          <thead>
            <tr>
              <th>Sent At</th>
              <th>Parent</th>
              <th>Type</th>
              <th>To</th>
              <th>CC</th>
              <th>Balance</th>
              <th>Status</th>
              <th>Subject</th>
            </tr>
          </thead>
          <tbody>
            <?php if (empty($logs)): ?>
              <tr><td colspan="8" class="text-center text-muted py-4">No notifications found.</td></tr>
            <?php else: ?>
              <?php foreach ($logs as $r): ?>
              <tr>
                <?php
                  $sentAtRaw = $r['sent_at'] ?? $r['created_at'] ?? '';
                  $sentAtDisp = $sentAtRaw ? local_datetime($sentAtRaw, 'm-d-Y H:i') : '';
                ?>
                <td><?= esc($sentAtDisp) ?></td>
                <td><?= esc($parentsById[(int)$r['parent_id']] ?? ('#'.$r['parent_id'])) ?></td>
                <td><span class="badge bg-info text-dark badge-type"><?= esc($r['type']) ?></span></td>
                <td><?= esc($r['to_email'] ?? '') ?></td>
                <td><?= esc($r['cc_email'] ?? '') ?></td>
                <td><?= isset($r['balance_snapshot']) ? ('$'.number_format((float)$r['balance_snapshot'],2)) : '' ?></td>
                <td>
                  <?php if (($r['status'] ?? '') === 'sent'): ?>
                    <span class="badge bg-success">Sent</span>
                  <?php else: ?>
                    <span class="badge bg-danger" title="<?= esc($r['error_message'] ?? '') ?>">Failed</span>
                  <?php endif; ?>
                </td>
                <td><?= esc($r['subject'] ?? '') ?></td>
              </tr>
              <?php endforeach; ?>
            <?php endif; ?>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
<?= $this->endSection() ?>

<?= $this->section('scripts') ?>
<script>
  function setQuickRange(days) {
    const to = new Date();
    const from = new Date();
    from.setDate(to.getDate() - days);
    const fromEl = document.getElementById('from');
    const toEl = document.getElementById('to');
    if (fromEl) fromEl.value = from.toISOString().slice(0,10) + ' 00:00:00';
    if (toEl) toEl.value     = to.toISOString().slice(0,10) + ' 23:59:59';
  }
</script>
<?= $this->endSection() ?>
