{% extends "finance/base.html" %}

{% block content %}
<div class="container-fluid py-3">
  <div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-4">
    <div>
      <h4 class="mb-1 fw-semibold">Backup Database</h4>
      <div class="text-muted small">Database maintenance · PETRO25</div>
    </div>
    <span class="badge rounded-pill text-bg-secondary px-3 py-2">
      <i class="bi bi-database me-1"></i> Supabase
    </span>
  </div>

  {% if messages %}
    {% for message in messages %}
      <div class="alert alert-{{ message.tags|default:'info' }} alert-dismissible fade show" role="alert">
        {{ message }}
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
      </div>
    {% endfor %}
  {% endif %}

  <div class="p-4 mb-4" style="background:#dee2e6; border-radius:8px;">
    <div class="d-flex align-items-start gap-3">
      <div class="rounded-3 p-3 bg-white text-dark flex-shrink-0">
        <i class="bi bi-database-down fs-3"></i>
      </div>
      <div>
        <h5 class="mb-2">Database Backup / Migration</h5>
        <p class="mb-0">
          Jalankan proses pemindahan struktur dan data tabel dari database Supabase sumber
          ke database Supabase tujuan menggunakan script <code>backup.py</code>.
        </p>
      </div>
    </div>
  </div>

  <div class="p-4 mb-4 bg-white rounded-3">
    <h6 class="fw-semibold mb-3"><i class="bi bi-info-circle me-2"></i>Informasi Proses</h6>
    <div class="row g-3">
      <div class="col-md-4">
        <div class="p-3 h-100 rounded-3" style="background:#f1f3f5;">
          <div class="small text-muted mb-1">Sumber</div>
          <div class="fw-semibold">Supabase Simenggaris (Organisasi: Texcal Energy Mahato)</div>
        </div>
      </div>
      <div class="col-md-4">
        <div class="p-3 h-100 rounded-3" style="background:#f1f3f5;">
          <div class="small text-muted mb-1">Tujuan</div>
          <div class="fw-semibold">Supabase Simenggaris Backup (Organisasi: Simenggaris)</div>
        </div>
      </div>
      <div class="col-md-4">
        <div class="p-3 h-100 rounded-3" style="background:#f1f3f5;">
          <div class="small text-muted mb-1">Cakupan</div>
          <div class="fw-semibold">Tabel yang terdaftar di backup.py</div>
        </div>
      </div>
    </div>
  </div>

  <div class="p-4 rounded-3 mb-4" style="background:#fff3f3;">
    <div class="d-flex align-items-start gap-3">
      <i class="bi bi-exclamation-triangle-fill text-danger fs-4"></i>
      <div>
        <h6 class="fw-semibold text-danger mb-2">Peringatan Penting</h6>
        <p class="mb-2">
          Script ini bukan sekadar membuat file arsip. Untuk setiap tabel yang diproses,
          data di database tujuan akan dikosongkan (<code>TRUNCATE</code>) lalu diisi ulang
          dari database sumber.
        </p>
        <p class="mb-0">Pastikan database sumber dan tujuan sudah benar sebelum menjalankan proses.</p>
      </div>
    </div>
  </div>

  <div class="d-flex flex-wrap justify-content-end gap-2">
    <a href="{% url 'finance_home' %}" class="btn btn-secondary">
      <i class="bi bi-arrow-left me-1"></i> Kembali
    </a>
    <form method="post" action="{% url 'backup' %}" class="m-0"
          onsubmit="return confirm('PERINGATAN: Proses ini akan mengosongkan data tabel di database tujuan lalu mengisinya dari database sumber. Lanjutkan hanya jika konfigurasi sudah benar. Jalankan proses sekarang?');">
      {% csrf_token %}
      <button type="submit" class="btn btn-danger">
        <i class="bi bi-database-down me-1"></i> Jalankan Backup
      </button>
    </form>
  </div>
</div>
{% endblock %}