{% extends "layouts/admin_base.html" %}
{% block title %}Laporan ANN - Inventori ANN{% endblock %}
{% block page_title %}Laporan Artificial Neural Network{% endblock %}

{% block extra_css %}
<style>
.report-header{background:linear-gradient(135deg,#14532d,#15803d);color:#fff;border-radius:14px;padding:24px;margin-bottom:22px}
.report-header h3{font-weight:700;margin-bottom:7px}.report-header p{margin:0;color:#dcfce7}
.report-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.04);height:100%}
.report-card .card-body{padding:20px}.metric-label{color:#6b7280;font-size:13px;margin-bottom:5px}
.metric-value{color:#14532d;font-size:27px;font-weight:700}.metric-note{color:#6b7280;font-size:12px;margin-top:6px}
.section-title{color:#14532d;font-size:18px;font-weight:700;margin-bottom:16px}
.info-table th{width:34%;background:#f8fafc;color:#374151}.table-report thead th{background:#166534;color:#fff;white-space:nowrap}
.table-report td,.table-report th{vertical-align:middle}.formula-box{background:#f0fdf4;border-left:4px solid #16a34a;border-radius:8px;padding:15px 18px}
.empty-model{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;border-radius:10px;padding:18px}
@media print{.no-print{display:none!important}.report-card{box-shadow:none}}
</style>
{% endblock %}

{% block content %}
<div class="report-header">
  <h3>Laporan Hasil Pengujian ANN</h3>
  <p>Evaluasi Artificial Neural Network untuk prediksi jumlah Barang Keluar pada Sistem Informasi Persediaan Toko Grosir Cucu.</p>
</div>

{% if model_info %}
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-4 no-print">
  <div class="text-muted small">Laporan menggunakan metadata model ANN hasil training yang tersimpan pada sistem.</div>
  <div class="d-flex gap-2">
    <button class="btn btn-outline-secondary btn-sm" onclick="window.print()">Cetak Halaman</button>
    <a href="/admin/laporan-ann/export" class="btn btn-success btn-sm">Export Laporan Excel</a>
    <a href="/admin/dataset-ann" class="btn btn-outline-success btn-sm">Dataset ANN</a>
    <a href="/admin/prediksi-ann" class="btn btn-success btn-sm">Prediksi ANN</a>
  </div>
</div>

<div class="row g-3 mb-4">
{% for label,value,note in [
 ('Total Dataset ANN',model_info.jumlah_data,'Record keseluruhan'),
 ('Data Training',model_info.jumlah_train,'80% bagian awal secara kronologis'),
 ('Data Testing',model_info.jumlah_test,'20% bagian akhir secara kronologis')
] %}
<div class="col-md-4"><div class="report-card"><div class="card-body">
<div class="metric-label">{{ label }}</div>
<div class="metric-value">{{ "{:,}".format(value or 0).replace(",", ".") }}</div>
<div class="metric-note">{{ note }}</div>
</div></div></div>
{% endfor %}
</div>

<div class="report-card mb-4"><div class="card-body">
<div class="section-title">Hasil Evaluasi Model</div>
<div class="row g-3">
<div class="col-md-4"><div class="border rounded-3 p-3 h-100">
<div class="metric-label">Mean Absolute Error (MAE)</div>
<div class="metric-value">{% if model_info.mae is not none %}{{ "%.4f"|format(model_info.mae) }}{% else %}-{% endif %}</div>
<div class="metric-note">Rata-rata selisih absolut antara aktual dan prediksi.</div>
</div></div>
<div class="col-md-4"><div class="border rounded-3 p-3 h-100">
<div class="metric-label">Root Mean Squared Error (RMSE)</div>
<div class="metric-value">{% if model_info.rmse is not none %}{{ "%.4f"|format(model_info.rmse) }}{% else %}-{% endif %}</div>
<div class="metric-note">Memberi penalti lebih besar pada error yang besar.</div>
</div></div>
<div class="col-md-4"><div class="border rounded-3 p-3 h-100">
<div class="metric-label">Koefisien Determinasi (R²)</div>
<div class="metric-value">{% if model_info.r2 is not none %}{{ "%.4f"|format(model_info.r2) }}{% else %}-{% endif %}</div>
<div class="metric-note">Kemampuan model menjelaskan variasi target.</div>
</div></div>
</div></div></div>

<div class="row g-4 mb-4">
<div class="col-lg-6"><div class="report-card"><div class="card-body">
<div class="section-title">Informasi Model ANN</div>
<table class="table table-bordered info-table mb-0"><tbody>
<tr><th>Metode</th><td>Artificial Neural Network / MLPRegressor</td></tr>
<tr><th>Arsitektur</th><td>7 Input → 32 Neuron → 16 Neuron → 1 Output</td></tr>
<tr><th>Aktivasi</th><td>ReLU</td></tr>
<tr><th>Optimizer / Solver</th><td>Adam</td></tr>
<tr><th>Normalisasi</th><td>StandardScaler untuk X dan Y</td></tr>
<tr><th>Pembagian Data</th><td>Kronologis 80% Training dan 20% Testing</td></tr>
<tr><th>Target</th><td>Barang Keluar pada tanggal target</td></tr>
<tr><th>Waktu Training</th><td>{% if model_info.trained_at %}{{ model_info.trained_at.strftime("%d/%m/%Y %H:%M:%S") }}{% else %}-{% endif %}</td></tr>
</tbody></table>
</div></div></div>

<div class="col-lg-6"><div class="report-card"><div class="card-body">
<div class="section-title">Periode dan Fitur Dataset</div>
<table class="table table-bordered info-table mb-3"><tbody>
<tr><th>Periode Histori</th><td>{% if model_info.tanggal_awal and model_info.tanggal_akhir %}{{ model_info.tanggal_awal.strftime("%d/%m/%Y") }} s.d. {{ model_info.tanggal_akhir.strftime("%d/%m/%Y") }}{% else %}-{% endif %}</td></tr>
<tr><th>X1</th><td>Barang Keluar Lag-1</td></tr>
<tr><th>X2</th><td>Barang Keluar Lag-2</td></tr>
<tr><th>X3</th><td>Barang Keluar Lag-3</td></tr>
<tr><th>X4</th><td>Barang Keluar Lag-7</td></tr>
<tr><th>X5</th><td>Rata-rata Barang Keluar 3 Hari</td></tr>
<tr><th>X6</th><td>Rata-rata Barang Keluar 7 Hari</td></tr>
<tr><th>X7</th><td>Hari dalam Minggu (Senin=0 s.d. Minggu=6)</td></tr>
</tbody></table>
<div class="formula-box"><strong>Catatan metodologi:</strong><br>Barang Masuk dan stok historis digunakan untuk rekonstruksi kondisi persediaan. ANN mempelajari pola Barang Keluar dan target Y adalah Barang Keluar pada tanggal target.</div>
</div></div></div>
</div>

{% if hasil_testing is defined and hasil_testing %}
<div class="report-card mb-4"><div class="card-body">
<div class="section-title">Perbandingan Data Aktual dan Prediksi ANN</div>
<div class="table-responsive"><table class="table table-bordered table-hover table-report">
<thead><tr><th>No</th><th>Tanggal</th><th>Kode</th><th>Nama Barang</th><th>Satuan</th><th>Aktual (Y)</th><th>Prediksi (Ŷ)</th><th>Absolute Error</th></tr></thead>
<tbody>
{% for item in hasil_testing %}
<tr>
<td>{{ loop.index }}</td>
<td>{% if item.tanggal %}{{ item.tanggal.strftime("%d/%m/%Y") }}{% else %}-{% endif %}</td>
<td>{{ item.kode_barang }}</td><td>{{ item.nama_barang }}</td><td>{{ item.satuan_kecil }}</td>
<td>{{ item.aktual }}</td><td>{{ "%.4f"|format(item.prediksi) }}</td><td>{{ "%.4f"|format(item.absolute_error) }}</td>
</tr>
{% endfor %}
</tbody></table></div>
</div></div>
{% endif %}

<div class="report-card mb-4"><div class="card-body">
<div class="section-title">Interpretasi Hasil Evaluasi</div>
<p><strong>MAE</strong> menunjukkan rata-rata besar kesalahan absolut prediksi. Semakin kecil nilainya, semakin dekat prediksi terhadap data aktual.</p>
<p><strong>RMSE</strong> mengukur kesalahan prediksi dengan penalti lebih besar terhadap error yang besar. Semakin kecil nilainya, semakin rendah kesalahan model.</p>
<p class="mb-0"><strong>R²</strong> menunjukkan kemampuan model menjelaskan variasi Barang Keluar. Nilai yang lebih mendekati 1 menunjukkan model lebih mampu mengikuti variasi data aktual. Ketiga metrik tetap perlu dinilai secara bersama-sama.</p>
</div></div>

{% else %}
<div class="empty-model">
<h5 class="fw-bold">Model ANN belum tersedia</h5>
<p>Training ANN terlebih dahulu agar laporan evaluasi dapat ditampilkan.</p>
<a href="/admin/prediksi-ann" class="btn btn-success">Buka Prediksi ANN</a>
</div>
{% endif %}
{% endblock %}