<div class="hero">
    <div>
        <h2 style="margin:0 0 6px;">Laporan Transaksi</h2>
        <p style="margin:0; opacity:0.95;">Lihat riwayat transaksi dan kelola data penjualan.</p>
    </div>
</div>

<div class="panel">
    <div style="display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; margin-bottom:12px;">
        <h3 style="margin:0;">Filter Laporan</h3>
        <div style="display:flex; flex-wrap:wrap; gap:8px;">
            <a class="btn-primary" href="/owner/export-reports?type=excel&date_from=<?= esc($filters['date_from']) ?>&date_to=<?= esc($filters['date_to']) ?>&barber=<?= esc($filters['barber']) ?>&payment_method=<?= esc($filters['payment_method']) ?>" style="display:inline-block; padding:10px 14px; text-decoration:none; max-width:140px; text-align:center;">Export Excel</a>
            <a class="btn-secondary" href="/owner/export-reports?type=pdf&date_from=<?= esc($filters['date_from']) ?>&date_to=<?= esc($filters['date_to']) ?>&barber=<?= esc($filters['barber']) ?>&payment_method=<?= esc($filters['payment_method']) ?>" style="display:inline-block; padding:10px 14px; text-decoration:none; max-width:140px; text-align:center;">Export PDF</a>
        </div>
    </div>
    <form method="get" action="/owner/reports" class="form-grid">
        <input type="date" name="date_from" value="<?= esc($filters['date_from']) ?>">
        <input type="date" name="date_to" value="<?= esc($filters['date_to']) ?>">
        <select name="barber">
            <option value="">Semua Barber</option>
            <?php foreach ($barbers as $barber) : ?>
                <option value="<?= esc($barber['name']) ?>" <?= ($filters['barber'] ?? '') === $barber['name'] ? 'selected' : '' ?>><?= esc($barber['name']) ?></option>
            <?php endforeach; ?>
        </select>
        <select name="payment_method">
            <option value="">Semua Metode Bayar</option>
            <option value="cash" <?= ($filters['payment_method'] ?? '') === 'cash' ? 'selected' : '' ?>>Tunai</option>
            <option value="debit" <?= ($filters['payment_method'] ?? '') === 'debit' ? 'selected' : '' ?>>Kartu Debit</option>
            <option value="qris" <?= ($filters['payment_method'] ?? '') === 'qris' ? 'selected' : '' ?>>QRIS</option>
            <option value="transfer" <?= ($filters['payment_method'] ?? '') === 'transfer' ? 'selected' : '' ?>>Transfer Bank</option>
        </select>
        <button class="btn-primary" type="submit">Terapkan</button>
    </form>
</div>

<div class="grid">
    <div class="stat-card">
        <span class="stat-icon amber"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg></span>
        <div>
            <h3>Total Poin Ditukar</h3>
            <div class="big"><?= esc(number_format($totalPointsRedeemed, 0, ',', '.')) ?> poin</div>
        </div>
    </div>
</div>

<?php
$iconDelete = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"></path><path d="M10 11v6"></path><path d="M14 11v6"></path><path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"></path></svg>';
$paymentLabels = ['cash' => 'Tunai', 'debit' => 'Kartu Debit', 'qris' => 'QRIS', 'transfer' => 'Transfer Bank'];
$paymentColors = ['cash' => '#16a34a', 'debit' => '#2563eb', 'qris' => '#7c3aed', 'transfer' => '#d97706'];
?>
<?php
$baseParams = array_filter($filters, static fn ($v) => $v !== '');
$baseParams['per_page'] = $perPage;
$pageLink = function ($page) use ($baseParams) {
    $params = $baseParams;
    $params['page'] = $page;
    return '/owner/reports?' . http_build_query($params);
};
?>
<div class="panel">
    <div style="display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:12px;">
        <h3 style="margin:0;">Daftar Transaksi</h3>
        <form method="get" action="/owner/reports" style="display:flex; align-items:center; gap:8px; margin:0;">
            <?php foreach ($filters as $key => $value) : ?>
                <?php if ($value !== '') : ?>
                    <input type="hidden" name="<?= esc($key) ?>" value="<?= esc($value) ?>">
                <?php endif; ?>
            <?php endforeach; ?>
            <label class="muted" style="font-size:13px; white-space:nowrap;" for="perPageSelect">Tampilkan</label>
            <select name="per_page" id="perPageSelect" onchange="this.form.submit()" style="min-width:90px;">
                <option value="10" <?= $perPage === 10 ? 'selected' : '' ?>>10</option>
                <option value="25" <?= $perPage === 25 ? 'selected' : '' ?>>25</option>
                <option value="50" <?= $perPage === 50 ? 'selected' : '' ?>>50</option>
                <option value="100" <?= $perPage === 100 ? 'selected' : '' ?>>100</option>
            </select>
        </form>
    </div>
    <div class="table-wrap">
        <table>
            <thead>
                <tr><th>ID</th><th>Pelanggan</th><th>Kasir</th><th>Barber</th><th>Total</th><th>Metode Bayar</th><th>Waktu</th><th>Aksi</th></tr>
            </thead>
            <tbody>
                <?php foreach ($transactions as $transaction) : ?>
                    <?php $paymentMethod = $transaction['payment_method'] ?? 'cash'; ?>
                    <tr>
                        <td><?= esc($transaction['id']) ?></td>
                        <td><?= esc($transaction['customer']) ?></td>
                        <td><?= esc($transaction['cashier']) ?></td>
                        <td><?= esc($transaction['barber']) ?></td>
                        <td>Rp <?= number_format($transaction['total'], 0, ',', '.') ?></td>
                        <td>
                            <span class="pill" style="margin:0; color:<?= esc($paymentColors[$paymentMethod] ?? '#16a34a') ?>; background:<?= esc($paymentColors[$paymentMethod] ?? '#16a34a') ?>1a;">
                                <?= esc($paymentLabels[$paymentMethod] ?? 'Tunai') ?>
                            </span>
                        </td>
                        <td><?= esc($transaction['created_at']) ?></td>
                        <td>
                            <div class="action-cell">
                                <a class="icon-btn icon-delete" href="/owner/delete-transaction/<?= esc($transaction['id']) ?>" title="Hapus" onclick="return confirm('Hapus transaksi ini?')"><?= $iconDelete ?></a>
                            </div>
                        </td>
                    </tr>
                <?php endforeach; ?>
                <?php if (empty($transactions)) : ?>
                    <tr><td colspan="8" class="muted">Tidak ada transaksi untuk filter yang dipilih.</td></tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>

    <?php if ($totalRows > 0) : ?>
        <div style="display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-top:16px;">
            <span class="muted" style="font-size:13px;">Halaman <?= esc($currentPage) ?> dari <?= esc($totalPages) ?> &middot; <?= esc($totalRows) ?> transaksi</span>
            <div style="display:flex; gap:8px;">
                <a class="btn-secondary" style="width:auto; min-height:auto; padding:8px 16px; <?= $currentPage <= 1 ? 'opacity:0.4; pointer-events:none;' : '' ?>" href="<?= esc($pageLink(max(1, $currentPage - 1))) ?>">&larr; Sebelumnya</a>
                <a class="btn-secondary" style="width:auto; min-height:auto; padding:8px 16px; <?= $currentPage >= $totalPages ? 'opacity:0.4; pointer-events:none;' : '' ?>" href="<?= esc($pageLink(min($totalPages, $currentPage + 1))) ?>">Berikutnya &rarr;</a>
            </div>
        </div>
    <?php endif; ?>
</div>
