@extends('layouts.app')

@section('title', 'NataAset')
@section('page_title', 'Dashboard')
@section('page_pretitle', 'Tertata, Tersimpan, Terpantau')

@section('content')
  @php
    $statCollection = collect($stats);
    $metricIcons = ['ti-package', 'ti-alert-circle', 'ti-tool', 'ti-refresh-dot'];
    $statusMap = [
      'good' => 'bg-success-lt text-success',
      'maintenance' => 'bg-warning-lt text-warning',
      'broken' => 'bg-danger-lt text-danger',
      'replace' => 'bg-purple-lt text-purple',
    ];
    $conditionRows = collect($conditionChart);
    $conditionTotal = (int) $conditionRows->sum('count');
    $conditionColors = [
      'good' => '#1f7a4d',
      'maintenance' => '#b7791f',
      'broken' => '#b42318',
      'replace' => '#315a8c',
    ];
    $donutStops = [];
    $donutCursor = 0;
    $visibleConditionRows = $conditionRows->filter(fn ($condition) => ($condition['count'] ?? 0) > 0)->values();

    foreach ($visibleConditionRows as $index => $condition) {
      $conditionClass = $condition['class'] ?? 'good';
      $conditionPercentage = $conditionTotal > 0 ? (($condition['count'] ?? 0) / $conditionTotal) * 100 : 0;
      $donutStart = $donutCursor;
      $donutEnd = $index === $visibleConditionRows->count() - 1 ? 100 : min(100, $donutCursor + $conditionPercentage);
      $donutStops[] = sprintf(
        '%s %.2f%% %.2f%%',
        $conditionColors[$conditionClass] ?? '#1d7ff5',
        $donutStart,
        $donutEnd
      );
      $donutCursor = $donutEnd;
    }

    $donutBackground = count($donutStops)
      ? 'background: conic-gradient(' . implode(', ', $donutStops) . ');'
      : 'background: conic-gradient(rgba(148, 163, 184, .32) 0% 100%);';
  @endphp

  <div class="dashboard-soft-layout">
    <section class="metric-soft-grid" aria-label="Ringkasan inventaris">
        @foreach ($statCollection->take(4) as $index => $stat)
          <article class="metric-soft-card tone-{{ $stat['tone'] ?? 'navy' }}">
            <span class="metric-soft-icon">
              <i class="ti {{ $metricIcons[$index] ?? 'ti-chart-bar' }}"></i>
            </span>
            <span class="metric-soft-copy">
              <small>{{ $stat['label'] }}</small>
              <strong>{{ $stat['value'] }}</strong>
              <em>{{ $stat['description'] }}</em>
            </span>
          </article>
        @endforeach
    </section>

    <section class="dashboard-insight-grid">
      <article class="insight-card insight-card-wide">
        <div class="insight-head">
          <div>
            <span class="insight-kicker">Data Terbaru</span>
            <h3>Inventaris Terbaru</h3>
            <p>Barang terakhir yang tercatat di sistem.</p>
          </div>
          <a class="btn btn-sm" href="{{ route('items.index') }}">Lihat semua</a>
        </div>

        <div class="table-responsive">
          <table class="table compact-table card-table soft-table">
            <thead>
              <tr>
                <th>#</th>
                <th>Nama Barang</th>
                <th>Ruangan</th>
                <th>Kategori</th>
                <th>Status</th>
              </tr>
            </thead>
            <tbody>
              @forelse ($inventoryItems->take(5) as $item)
                <tr>
                  <td data-label="#">{{ str_pad($loop->iteration, 2, '0', STR_PAD_LEFT) }}</td>
                  <td data-label="Nama Barang">
                    <div class="inventory-name-cell">
                      <span class="inventory-row-icon"><i class="ti ti-package"></i></span>
                      <span>
                        <strong>{{ $item->nama_barang }}</strong>
                        <small>{{ $item->kode_aset }}</small>
                      </span>
                    </div>
                  </td>
                  <td data-label="Ruangan">{{ $item->room?->nama_ruangan ?? '-' }}</td>
                  <td data-label="Kategori">{{ $item->category?->nama_kategori ?? '-' }}</td>
                  <td data-label="Status">
                    <span class="badge {{ $statusMap[$item->status_barang] ?? 'bg-secondary-lt text-secondary' }}">{{ $item->status_label }}</span>
                  </td>
                </tr>
              @empty
                <tr>
                  <td colspan="5" class="text-center text-secondary py-5">Belum ada data barang.</td>
                </tr>
              @endforelse
            </tbody>
          </table>
        </div>
      </article>

      <article class="insight-card">
        <div class="insight-head compact">
          <div>
            <span class="insight-kicker">Kondisi</span>
            <h3>Status Inventaris</h3>
            <p>Komposisi kondisi barang.</p>
          </div>
        </div>
        <div class="inventory-status-chart">
          <div class="inventory-status-donut" data-dashboard-status-donut aria-label="Komposisi status inventaris">
            <span class="inventory-status-wheel" style="{{ $donutBackground }}" aria-hidden="true"></span>
            <div class="inventory-status-center">
              <span>Total Barang</span>
              <strong>{{ number_format($conditionTotal, 0, ',', '.') }}</strong>
              <small>100%</small>
            </div>
          </div>

          <div class="inventory-status-legend">
            @foreach ($conditionRows as $condition)
              <div class="inventory-status-row {{ $condition['class'] }}">
                <span class="inventory-status-marker" aria-hidden="true"></span>
                <div>
                  <span>{{ $condition['label'] }}</span>
                  <strong>{{ number_format($condition['count'], 0, ',', '.') }}</strong>
                </div>
                <small>{{ $condition['value'] }}%</small>
              </div>
            @endforeach
          </div>
        </div>
      </article>
    </section>
  </div>
@endsection
