<?php $this->start('body'); ?>
<?php $f = $this->data['filters']; $c = $this->data['counts']; ?>

<div class="d-flex align-items-center justify-content-between mb-3 flex-wrap gap-2">
  <h5 class="mb-0 fw-semibold"><i class="fas fa-exclamation-triangle me-2 text-muted"></i>Alerts
      <span class="text-muted fw-normal fs-6">· <?= (int)$this->data['total']; ?></span>
  </h5>
  <a href="<?= PROOT; ?>AlertRules" class="btn btn-sm btn-outline-secondary"><i class="fas fa-cog me-1"></i> Manage rules</a>
</div>

<?= flashHtml(); ?>

<ul class="nav nav-tabs mb-3 small">
  <?php $tabs = ['open'=>['Open','danger'], 'acknowledged'=>['Acknowledged','warning'], 'resolved'=>['Resolved','success'], 'dismissed'=>['Dismissed','secondary'], ''=>['All','light']];
        foreach ($tabs as $st => [$label,$bg]): ?>
    <li class="nav-item">
      <a class="nav-link <?= $f['status']===$st ? 'active' : ''; ?>"
         href="<?= PROOT; ?>Alerts<?= $st !== '' ? '?status=' . $st : ''; ?>">
        <?= htmlspecialchars($label); ?>
        <?php if ($st !== '' && ($c[$st] ?? 0) > 0): ?><span class="badge bg-<?= $bg; ?> ms-1"><?= (int)$c[$st]; ?></span><?php endif; ?>
      </a>
    </li>
  <?php endforeach; ?>
</ul>

<form method="GET" action="<?= PROOT; ?>Alerts/index/1" class="card border-0 shadow-sm mb-3">
  <input type="hidden" name="status" value="<?= htmlspecialchars($f['status']); ?>">
  <div class="card-body py-2">
    <div class="row g-2 align-items-end">
      <div class="col-md-3"><label class="form-label small text-muted mb-1">Kind</label>
        <select name="kind" class="form-select form-select-sm"><option value="">All</option>
          <?php foreach (['over_speed','fuel_drop','ignition_after_hours','device_offline','geofence_enter','geofence_exit','idle_too_long'] as $k): ?>
            <option value="<?= $k; ?>" <?= $f['kind']===$k?'selected':''; ?>><?= $k; ?></option>
          <?php endforeach; ?>
        </select></div>
      <div class="col-md-2"><label class="form-label small text-muted mb-1">Severity</label>
        <select name="severity" class="form-select form-select-sm"><option value="">All</option>
          <?php foreach (['info','low','medium','high','critical'] as $s): ?>
            <option value="<?= $s; ?>" <?= $f['severity']===$s?'selected':''; ?>><?= $s; ?></option>
          <?php endforeach; ?>
        </select></div>
      <div class="col-md-2"><label class="form-label small text-muted mb-1">From</label>
        <input type="date" name="from_date" class="form-control form-control-sm" value="<?= htmlspecialchars($f['from_date']); ?>"></div>
      <div class="col-md-2"><label class="form-label small text-muted mb-1">To</label>
        <input type="date" name="to_date" class="form-control form-control-sm" value="<?= htmlspecialchars($f['to_date']); ?>"></div>
      <div class="col-md-3 d-flex gap-1">
        <button class="btn btn-sm btn-primary flex-grow-1"><i class="fas fa-filter"></i></button>
        <a href="<?= PROOT; ?>Alerts?status=<?= htmlspecialchars($f['status']); ?>" class="btn btn-sm btn-outline-secondary"><i class="fas fa-times"></i></a>
      </div>
    </div>
  </div>
</form>

<div class="card border-0 shadow-sm">
  <div class="table-responsive">
    <table class="table table-sm mb-0 align-middle">
      <thead class="table-light">
        <tr><th>When</th><th>Alert</th><th>Truck</th><th>Kind · Severity</th><th>Notified</th><th>Status</th><th class="text-end"></th></tr>
      </thead>
      <tbody>
        <?php foreach ($this->data['rows'] as $r):
          $sev = ['info'=>'secondary','low'=>'info','medium'=>'warning','high'=>'danger','critical'=>'danger'][$r['severity']] ?? 'secondary';
          $st  = ['open'=>'danger','acknowledged'=>'warning','resolved'=>'success','dismissed'=>'secondary'][$r['status']] ?? 'secondary';
        ?>
          <tr>
            <td class="small text-muted"><?= humanDateTime($r['ts']); ?></td>
            <td class="small"><a href="<?= PROOT; ?>Alerts/view/<?= (int)$r['c0d']; ?>" class="fw-semibold text-decoration-none"><?= htmlspecialchars($r['title']); ?></a><?php if ($r['rule_name']): ?><div class="text-muted"><?= htmlspecialchars($r['rule_name']); ?></div><?php endif; ?></td>
            <td class="small"><?php if ($r['truck_id']): ?><a href="<?= PROOT; ?>Trucks/view/<?= (int)$r['truck_id']; ?>" class="fw-semibold"><?= htmlspecialchars($r['truck_reg']); ?></a><?php else: ?><span class="text-muted">—</span><?php endif; ?><?php if ($r['device_code']): ?><div class="text-muted font-monospace small"><?= htmlspecialchars($r['device_code']); ?></div><?php endif; ?></td>
            <td class="small"><code><?= htmlspecialchars($r['kind']); ?></code><br><span class="badge bg-<?= $sev; ?>"><?= htmlspecialchars($r['severity']); ?></span></td>
            <td class="small">
              <?php if ($r['sms_sent']):   ?><i class="fas fa-sms text-success" title="SMS sent"></i><?php endif; ?>
              <?php if ($r['email_sent']): ?><i class="fas fa-envelope text-success ms-1" title="Email sent"></i><?php endif; ?>
              <?php if (!$r['sms_sent'] && !$r['email_sent']): ?><span class="text-muted">—</span><?php endif; ?>
            </td>
            <td><span class="badge bg-<?= $st; ?>" style="text-transform:capitalize;"><?= htmlspecialchars($r['status']); ?></span></td>
            <td class="text-end"><a href="<?= PROOT; ?>Alerts/view/<?= (int)$r['c0d']; ?>" class="btn btn-sm btn-outline-secondary"><i class="fas fa-eye"></i></a></td>
          </tr>
        <?php endforeach; ?>
        <?php if (empty($this->data['rows'])): ?>
          <tr><td colspan="7" class="text-center text-muted py-5">No alerts match. <?= $f['status']==='open'?'All clear! 🚚':''; ?></td></tr>
        <?php endif; ?>
      </tbody>
    </table>
  </div>
  <?php if (!empty($this->data['pg_html'])): ?>
    <div class="card-footer bg-white d-flex justify-content-between py-2"><span class="small text-muted">Page <?= (int)$this->data['page']; ?> · <?= (int)$this->data['total']; ?> total</span><?= $this->data['pg_html']; ?></div>
  <?php endif; ?>
</div>

<?php $this->end(); ?>
