<?php $this->start('body');
    include __DIR__ . '/_dash_header.php';
    include __DIR__ . '/_kpi_strip.php';
?>

<div class="row g-3">
  <div class="col-lg-8">
    <div class="card border-0 shadow-sm h-100"><div class="card-body">
      <div class="d-flex justify-content-between align-items-baseline mb-2">
        <h6 class="text-uppercase text-muted small mb-0">Weekly fuel spend &middot; last 12 weeks</h6>
        <a href="<?= PROOT; ?>FuelEntries" class="small text-decoration-none">Entries &rarr;</a>
      </div>
      <div id="c-spend" style="min-height: 260px;"></div>
    </div></div>
  </div>
  <div class="col-lg-4">
    <div class="card border-0 shadow-sm h-100"><div class="card-body">
      <div class="d-flex justify-content-between align-items-baseline mb-2">
        <h6 class="text-uppercase text-muted small mb-0">Payment method &middot; 30 d</h6>
      </div>
      <div id="c-pm" style="min-height: 260px;"></div>
    </div></div>
  </div>
</div>

<div class="row g-3 mt-1">
  <div class="col-lg-6">
    <div class="card border-0 shadow-sm h-100"><div class="card-body">
      <div class="d-flex justify-content-between align-items-baseline mb-2">
        <h6 class="text-uppercase text-muted small mb-0">Top trucks by litres &middot; 30 d</h6>
        <a href="<?= PROOT; ?>Trucks" class="small text-decoration-none">Trucks &rarr;</a>
      </div>
      <div id="c-l" style="min-height: 260px;"></div>
    </div></div>
  </div>
  <div class="col-lg-6">
    <?php include __DIR__ . '/_feed_fuel.php'; ?>
  </div>
</div>

<div class="row g-3 mt-1">
  <div class="col-lg-6">
    <div class="card border-0 shadow-sm h-100"><div class="card-body">
      <h6 class="text-uppercase text-muted small mb-2">Quick actions</h6>
      <div class="d-flex flex-column gap-2">
        <a href="<?= PROOT; ?>FuelEntries/add" class="btn btn-sm btn-primary text-start"><i class="fas fa-plus me-1"></i>Log fuel entry</a>
        <a href="<?= PROOT; ?>FuelEntries" class="btn btn-sm btn-outline-secondary text-start"><i class="fas fa-list me-1"></i>All entries</a>
        <a href="<?= PROOT; ?>Trucks" class="btn btn-sm btn-outline-secondary text-start"><i class="fas fa-truck me-1"></i>Truck list &middot; check tanks</a>
      </div>
      <hr>
      <div class="small text-muted">
        <strong>Reminder:</strong> reconcile fuel card statements against
        <a href="<?= PROOT; ?>BankRecon" class="text-decoration-none">bank recon</a>
        (COA 3009) monthly &mdash; use the <a href="<?= PROOT; ?>FinancialReports/pnl" class="text-decoration-none">P&amp;L</a>
        to spot outliers in the Fuel account (7009).
      </div>
    </div></div>
  </div>
</div>

<?php $this->end(); $this->start('section_js'); ?>
<script>
document.addEventListener('DOMContentLoaded', function () {
  new PacificChart('#c-spend', 'area',
    <?= json_encode(array_merge($this->data['charts']['spend'] ?? [], ['tzs' => true])); ?>);
  new PacificChart('#c-pm',    'donut',
    <?= json_encode(array_merge($this->data['charts']['pm']    ?? [], ['tzs' => true, 'colors' => 'penta'])); ?>);
  new PacificChart('#c-l',     'bar',
    <?= json_encode(array_merge($this->data['charts']['l']     ?? [], ['distributed' => true, 'colors' => 'penta'])); ?>);
});
</script>
<?php $this->end(); ?>
