<?php
error_reporting(0);

$total_testing        = 0;
$total_training       = 0;
$total_kriteria       = 0;
$total_kriteria_nilai = 0;

try {
    include_once "./class/beranda.php";
    $beranda = new beranda();
    $r1 = $beranda->jmlTesting();
    $r2 = $beranda->jmlTraining();
    $r3 = $beranda->jmlKriteria();
    $r4 = $beranda->jmlKriteriaNilai();
    $total_testing        = isset($r1[0]['jml']) ? (int)$r1[0]['jml'] : 0;
    $total_training       = isset($r2[0]['jml']) ? (int)$r2[0]['jml'] : 0;
    $total_kriteria       = isset($r3[0]['jml']) ? (int)$r3[0]['jml'] : 0;
    $total_kriteria_nilai = isset($r4[0]['jml']) ? (int)$r4[0]['jml'] : 0;
} catch (Exception $e) { /* tetap tampilkan dashboard */ }

$nama_admin = htmlspecialchars(@$_SESSION['ses_knn_admin_nama'] ?: 'Administrator');
$jam = (int)date('H');
if ($jam >= 5  && $jam < 12) $sapa = 'Selamat Pagi';
elseif ($jam >= 12 && $jam < 15) $sapa = 'Selamat Siang';
elseif ($jam >= 15 && $jam < 18) $sapa = 'Selamat Sore';
else $sapa = 'Selamat Malam';
?>
<style>
.dash-welcome{background:linear-gradient(135deg,#5e72e4 0%,#825ee4 100%);border-radius:16px;padding:28px 32px;color:#fff;position:relative;overflow:hidden;margin-bottom:24px}
.dash-welcome::after{content:'';position:absolute;right:-40px;top:-40px;width:220px;height:220px;background:rgba(255,255,255,.08);border-radius:50%}
.dash-welcome::before{content:'';position:absolute;right:60px;top:60px;width:120px;height:120px;background:rgba(255,255,255,.06);border-radius:50%}
.dash-welcome h3{font-size:1.45rem;font-weight:700;margin-bottom:4px}
.dash-welcome p{opacity:.85;margin-bottom:0;font-size:.9rem}
.badge-time{display:inline-block;background:rgba(255,255,255,.2);border-radius:20px;padding:4px 14px;font-size:.78rem;margin-bottom:10px}
.stat-card{border-radius:14px;border:none;box-shadow:0 4px 20px rgba(0,0,0,.07);transition:transform .2s,box-shadow .2s}
.stat-card:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(0,0,0,.13)}
.stat-card .card-body{padding:20px 22px}
.stat-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.4rem}
.stat-label{font-size:.7rem;text-transform:uppercase;font-weight:700;letter-spacing:.06em;color:#8898aa}
.stat-value{font-size:2rem;font-weight:800;line-height:1.1;color:#32325d;margin:3px 0 6px}
.stat-link{font-size:.78rem;color:#5e72e4;text-decoration:none;font-weight:600}
.stat-link:hover{text-decoration:underline}
.info-card{border-radius:14px;border:none;box-shadow:0 4px 20px rgba(0,0,0,.07)}
.info-card .card-header{background:transparent;border-bottom:1px solid #f0f0f5;padding:16px 22px 12px;font-weight:700;font-size:.92rem;color:#32325d}
.info-card .card-body{padding:18px 22px}
.knn-step{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.knn-step:last-child{margin-bottom:0}
.knn-step-num{min-width:34px;height:34px;background:linear-gradient(135deg,#5e72e4,#825ee4);border-radius:50%;color:#fff;font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.knn-step-text h6{font-size:.84rem;font-weight:700;color:#32325d;margin-bottom:2px}
.knn-step-text p{font-size:.78rem;color:#8898aa;margin:0;line-height:1.4}
.quick-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:18px 8px;border-radius:14px;border:2px solid transparent;background:#f7f8fc;cursor:pointer;transition:all .2s;text-decoration:none;color:#32325d}
.quick-btn:hover{background:#5e72e4;color:#fff;border-color:#5e72e4;transform:translateY(-2px);text-decoration:none}
.quick-btn i{font-size:1.5rem}
.quick-btn span{font-size:.72rem;font-weight:600;text-align:center}
.progress-label{display:flex;justify-content:space-between;font-size:.76rem;margin-bottom:4px}
.progress-label span:first-child{color:#32325d;font-weight:600}
.progress-label span:last-child{color:#8898aa}
.progress{height:8px;border-radius:20px;background:#f0f0f5}
</style>

<!-- Welcome Banner -->
<div class="dash-welcome">
  <div class="badge-time"><i class="fa fa-clock-o me-1"></i><?= date('l, d F Y  |  H:i') ?> WIB</div>
  <h3><?= $sapa ?>, <?= $nama_admin ?>! 👋</h3>
  <p>Selamat datang di panel admin <strong>Aplikasi Metode K-Nearest Neighbor (KNN)</strong>.<br>
     Pantau data, lakukan klasifikasi, dan kelola sistem melalui menu di samping.</p>
</div>

<!-- Stat Cards -->
<div class="row g-3 mb-4">
<?php
$stats = [
  ['label'=>'Data Testing',    'val'=>$total_testing,        'link'=>'?p=testing',       'color'=>'linear-gradient(135deg,#f5365c,#f56036)', 'icon'=>'ni ni-folder-17'],
  ['label'=>'Data Training',   'val'=>$total_training,       'link'=>'?p=training',      'color'=>'linear-gradient(135deg,#2dce89,#2dcecc)', 'icon'=>'ni ni-credit-card'],
  ['label'=>'Kriteria',        'val'=>$total_kriteria,       'link'=>'?p=kriteria',      'color'=>'linear-gradient(135deg,#5e72e4,#825ee4)', 'icon'=>'ni ni-box-2'],
  ['label'=>'Kriteria Nilai',  'val'=>$total_kriteria_nilai, 'link'=>'?p=kriteria-nilai','color'=>'linear-gradient(135deg,#fb6340,#fbb140)', 'icon'=>'ni ni-single-copy-04'],
];
foreach ($stats as $s): ?>
  <div class="col-xl-3 col-sm-6">
    <div class="card stat-card">
      <div class="card-body">
        <div class="d-flex justify-content-between align-items-start">
          <div>
            <p class="stat-label"><?= $s['label'] ?></p>
            <div class="stat-value"><?= number_format($s['val']) ?></div>
            <a href="<?= $s['link'] ?>" class="stat-link"><i class="fa fa-arrow-right me-1"></i>Lihat Data</a>
          </div>
          <div class="stat-icon" style="background:<?= $s['color'] ?>">
            <i class="<?= $s['icon'] ?> text-white"></i>
          </div>
        </div>
      </div>
    </div>
  </div>
<?php endforeach; ?>
</div>

<!-- Row 2 -->
<div class="row g-3 mb-4">
  <!-- Cara Kerja KNN -->
  <div class="col-lg-5">
    <div class="card info-card h-100">
      <div class="card-header"><i class="fa fa-sitemap text-primary me-2"></i>Cara Kerja Algoritma KNN</div>
      <div class="card-body">
        <?php $steps = [
          ['Siapkan Data Training',    'Masukkan data training yang sudah memiliki label kelas sebagai referensi klasifikasi.'],
          ['Input Data Testing',       'Masukkan data baru (testing) yang akan diprediksi kelasnya.'],
          ['Hitung Jarak Euclidean',   'Sistem menghitung jarak antara data testing dengan seluruh data training.'],
          ['Pilih K Tetangga Terdekat','Ambil K data training dengan jarak terkecil sebagai tetangga terdekat.'],
          ['Voting Mayoritas',         'Kelas yang paling banyak muncul di antara K tetangga menjadi hasil prediksi.'],
        ];
        foreach ($steps as $i => $step): ?>
        <div class="knn-step">
          <div class="knn-step-num"><?= $i+1 ?></div>
          <div class="knn-step-text">
            <h6><?= $step[0] ?></h6>
            <p><?= $step[1] ?></p>
          </div>
        </div>
        <?php endforeach; ?>
      </div>
    </div>
  </div>

  <!-- Akses Cepat + Ringkasan -->
  <div class="col-lg-7">
    <div class="row g-3">
      <div class="col-12">
        <div class="card info-card">
          <div class="card-header"><i class="fa fa-bolt text-warning me-2"></i>Akses Cepat</div>
          <div class="card-body">
            <div class="row g-2">
              <?php $qtns = [
                ['?p=testing-input',  'ni ni-fat-add',      'Tambah Testing'],
                ['?p=training-input', 'ni ni-fat-add',      'Tambah Training'],
                ['?p=perhitungan',    'ni ni-chart-bar-32', 'Lihat Perhitungan'],
                ['?p=kriteria-input', 'ni ni-settings',     'Tambah Kriteria'],
              ];
              foreach ($qtns as $q): ?>
              <div class="col-6 col-md-3">
                <a href="<?= $q[0] ?>" class="quick-btn">
                  <i class="<?= $q[1] ?>"></i>
                  <span><?= $q[2] ?></span>
                </a>
              </div>
              <?php endforeach; ?>
            </div>
          </div>
        </div>
      </div>
      <div class="col-12">
        <div class="card info-card">
          <div class="card-header"><i class="fa fa-bar-chart text-success me-2"></i>Ringkasan Proporsi Data</div>
          <div class="card-body">
            <?php
            $tot = max(1, $total_testing + $total_training + $total_kriteria + $total_kriteria_nilai);
            $bars = [
              ['Data Testing',   $total_testing,        '#f5365c'],
              ['Data Training',  $total_training,       '#2dce89'],
              ['Kriteria',       $total_kriteria,       '#5e72e4'],
              ['Kriteria Nilai', $total_kriteria_nilai, '#fb6340'],
            ];
            foreach ($bars as $b):
              $pct = $tot > 0 ? round($b[1]/$tot*100) : 0;
            ?>
            <div class="mb-3">
              <div class="progress-label">
                <span><?= $b[0] ?></span>
                <span><?= $b[1] ?> data (<?= $pct ?>%)</span>
              </div>
              <div class="progress">
                <div class="progress-bar" style="width:<?= max(4,$pct) ?>%;background:<?= $b[2] ?>;border-radius:20px;" role="progressbar"></div>
              </div>
            </div>
            <?php endforeach; ?>
            <div style="background:#f7f8fc;border-radius:10px;padding:10px 14px;font-size:.78rem;color:#8898aa;margin-top:4px;">
              <i class="fa fa-refresh me-1"></i> Diperbarui: <strong style="color:#32325d;"><?= date('d F Y, H:i:s') ?> WIB</strong>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- About Banner -->
<div class="row g-3">
  <div class="col-12">
    <div class="card" style="background:linear-gradient(135deg,#1a1a2e 0%,#16213e 50%,#0f3460 100%);color:#fff;border:none;border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.15);">
      <div class="card-body p-4">
        <div class="row align-items-center">
          <div class="col-md-8">
            <p style="font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;opacity:.55;margin-bottom:4px;">Tentang Aplikasi</p>
            <h4 style="font-weight:800;margin-bottom:8px;">Aplikasi Metode K-Nearest Neighbor</h4>
            <p style="opacity:.72;font-size:.86rem;margin-bottom:16px;">Sistem klasifikasi berbasis algoritma KNN yang menggunakan pendekatan jarak Euclidean untuk memprediksi kelas dari data baru berdasarkan kemiripan dengan data training yang tersedia.</p>
            <div class="d-flex gap-2 flex-wrap">
              <a href="?p=training" class="btn btn-sm btn-light" style="border-radius:8px;font-weight:600;">
                <i class="fa fa-database me-1"></i>Data Training
              </a>
              <a href="?p=testing-input" class="btn btn-sm" style="border-radius:8px;font-weight:600;background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.3);">
                <i class="fa fa-flask me-1"></i>Mulai Testing
              </a>
            </div>
          </div>
          <div class="col-md-4 text-center mt-3 mt-md-0">
            <div style="font-size:5rem;opacity:.18;line-height:1;">🧠</div>
            <div style="opacity:.45;font-size:.8rem;margin-top:-8px;">K-Nearest Neighbor</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>