<div class="hero">
    <div>
        <h2 style="margin:0 0 6px;">Riwayat Poin Member</h2>
        <p style="margin:0; opacity:0.95;">Pantau poin yang didapat maupun ditukar setiap member.</p>
    </div>
</div>

<div class="panel">
    <h3 style="margin-top:0;">Filter</h3>
    <form method="get" action="/owner/member-points" class="form-grid">
        <select name="member_id">
            <option value="">Semua Member</option>
            <?php foreach ($members as $member) : ?>
                <option value="<?= esc($member['id']) ?>" <?= (string) ($filters['member_id'] ?? '') === (string) $member['id'] ? 'selected' : '' ?>><?= esc($member['name']) ?></option>
            <?php endforeach; ?>
        </select>
        <button class="btn-primary" type="submit">Terapkan</button>
    </form>
</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>';
?>
<div class="panel">
    <h3>Daftar Riwayat Poin</h3>
    <div class="table-wrap">
        <table>
            <thead>
                <tr><th>Waktu</th><th>Member</th><th>Tipe</th><th>Poin</th><th>Catatan</th><th>Aksi</th></tr>
            </thead>
            <tbody>
                <?php foreach ($pointHistory as $entry) : ?>
                    <tr>
                        <td><?= esc($entry['created_at']) ?></td>
                        <td><?= esc($entry['member_name']) ?></td>
                        <td>
                            <?php if ($entry['type'] === 'earn') : ?>
                                <span class="pill" style="margin:0; color:#16a34a; background:#16a34a1a;">Dapat Poin</span>
                            <?php else : ?>
                                <span class="pill" style="margin:0; color:#dc2626; background:#dc26261a;">Tukar Poin</span>
                            <?php endif; ?>
                        </td>
                        <td style="font-weight:700; color:<?= $entry['type'] === 'earn' ? '#16a34a' : '#dc2626' ?>;"><?= $entry['type'] === 'earn' ? '+' : '-' ?><?= esc(number_format((int) $entry['points'], 0, ',', '.')) ?></td>
                        <td><?= esc($entry['note'] ?? '-') ?></td>
                        <td>
                            <div class="action-cell">
                                <a class="icon-btn icon-delete" href="#" title="Hapus" onclick="confirmDelete('/owner/delete-point-entry/<?= esc($entry['id']) ?>'); return false;"><?= $iconDelete ?></a>
                            </div>
                        </td>
                    </tr>
                <?php endforeach; ?>
                <?php if (empty($pointHistory)) : ?>
                    <tr><td colspan="6" class="muted">Belum ada riwayat poin.</td></tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<style>
.swal2-container { z-index: 10050 !important; }
</style>
<script>
function confirmDelete(url) {
    Swal.fire({ title: 'Apakah Anda yakin?', text: 'Entri riwayat poin ini akan dihapus dan saldo poin member akan disesuaikan kembali.', icon: 'warning', showCancelButton: true, confirmButtonText: 'Ya, hapus', cancelButtonText: 'Batal' }).then((result) => {
        if (result.isConfirmed) {
            fetch(url, { headers: { 'X-Requested-With': 'XMLHttpRequest' } }).then(r => r.json()).then(() => { Swal.fire('Berhasil', 'Data Berhasil Dihapus', 'success').then(() => location.reload()); });
        }
    });
}
</script>
