{% extends 'base.html' %}
{% block title %}Rekening Bank{% endblock %}
{% block content %}
<div class="flex items-end justify-between gap-3 mb-4"><div><h1 class="page-title">Rekening Bank</h1><p class="page-sub">Ditampilkan ke pembeli online saat pembayaran.</p></div>
<button onclick="openModal('mForm')" class="btn btn-accent"><i class="fas fa-plus"></i> Tambah Rekening</button></div>
<div class="card overflow-hidden"><table class="tbl">
<thead><tr><th>Bank</th><th>Nomor</th><th>Atas Nama</th><th>Keterangan</th><th class="num">Urutan</th><th>Status</th><th></th></tr></thead>
<tbody>{% for r in rekening_list %}
<tr><td class="font-bold">{{ r.nama_bank }}</td><td class="font-mono">{{ r.nomor_rekening }}</td><td>{{ r.nama_pemilik }}</td><td class="text-xs text-neutral-500">{{ r.keterangan|default:"-" }}</td><td class="num">{{ r.urutan }}</td>
<td><form method="post" class="inline">{% csrf_token %}<input type="hidden" name="action" value="toggle"><input type="hidden" name="id" value="{{ r.id }}"><button class="badge {% if r.aktif %}badge-green{% else %}badge-gray{% endif %} cursor-pointer">{% if r.aktif %}Aktif{% else %}Nonaktif{% endif %}</button></form></td>
<td class="text-right"><form method="post" class="inline" onsubmit="return confirm('Hapus rekening ini?')">{% csrf_token %}<input type="hidden" name="action" value="hapus"><input type="hidden" name="id" value="{{ r.id }}"><button class="btn btn-danger btn-xs"><i class="fas fa-trash"></i></button></form></td></tr>
{% empty %}<tr><td colspan="7" class="text-center text-neutral-400 py-8">Belum ada rekening. Pembeli online tidak bisa melihat tujuan transfer.</td></tr>{% endfor %}</tbody></table></div>

<div class="modal-bg" id="mForm"><div class="modal">
<div class="flex items-center justify-between mb-4"><h3 class="font-bold">Tambah Rekening</h3><button onclick="closeModal('mForm')" class="text-neutral-400"><i class="fas fa-times"></i></button></div>
<form method="post" class="space-y-3">{% csrf_token %}<input type="hidden" name="action" value="tambah">
<div class="grid grid-cols-2 gap-3"><div><label class="form-label">Bank *</label><input name="nama_bank" class="form-input" placeholder="BCA" required></div><div><label class="form-label">Urutan</label><input name="urutan" class="form-input" inputmode="numeric" value="0"></div></div>
<div><label class="form-label">Nomor rekening *</label><input name="nomor_rekening" class="form-input" required></div>
<div><label class="form-label">Atas nama *</label><input name="nama_pemilik" class="form-input" required></div>
<div><label class="form-label">Keterangan</label><input name="keterangan" class="form-input" placeholder="mis. Rekening utama"></div>
<button class="btn btn-accent w-full justify-center">Simpan</button></form></div></div>
{% endblock %}