@extends('layouts.app')

@section('title', 'Detail Barang')
@section('page_title', 'Detail Barang')
@section('page_pretitle', 'Inventaris')

@section('page_actions')
  <a class="btn" href="{{ route('items.index') }}">
    <i class="ti ti-arrow-left me-1"></i>
    Data Barang
  </a>
  <a class="btn" href="{{ route('items.edit', $item) }}">
    <i class="ti ti-pencil me-1"></i>
    Edit
  </a>
  <a class="btn btn-primary" href="{{ route('items.qr.pdf', $item) }}" target="_blank" rel="noopener">
    <i class="ti ti-qrcode me-1"></i>
    Cetak QR
  </a>
@endsection

@section('content')
  @php
    $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',
    ];

    $summaryCards = [
      ['label' => 'Kategori', 'value' => $item->category->nama_kategori, 'icon' => 'ti-tags', 'tone' => 'blue'],
      ['label' => 'Ruangan', 'value' => $item->room->nama_ruangan, 'icon' => 'ti-building', 'tone' => 'mint'],
      ['label' => 'Tahun Perolehan', 'value' => $item->tahun_perolehan, 'icon' => 'ti-calendar', 'tone' => 'amber'],
      ['label' => 'Umur Pakai', 'value' => $item->umur_manfaat_tahun . ' tahun', 'icon' => 'ti-hourglass', 'tone' => 'violet'],
      ['label' => 'Pemeliharaan', 'value' => $item->tanggal_jadwal_pemeliharaan?->format('d/m/Y') ?? '-', 'icon' => 'ti-tool', 'tone' => 'green'],
      ['label' => 'Penggantian', 'value' => $item->pengajuan_penggantian ? 'Diajukan' : 'Belum diajukan', 'icon' => 'ti-refresh', 'tone' => $item->pengajuan_penggantian ? 'red' : 'slate'],
    ];
  @endphp

  <div class="asset-detail-layout">
    <section class="asset-profile-card">
      <div class="asset-photo-stage">
        @if ($item->photo_url)
          <img src="{{ $item->photo_url }}" alt="Foto {{ $item->nama_barang }}">
        @else
          <div class="asset-photo-empty">
            <i class="ti ti-photo-off"></i>
            <span>Belum ada foto barang.</span>
          </div>
        @endif
        <span class="asset-photo-label">Foto Barang</span>
      </div>

      <div class="asset-profile-content">
        <div class="asset-profile-head">
          <span class="asset-kicker">Profil Aset Inventaris</span>
          <span class="badge {{ $statusMap[$item->status_barang] ?? 'bg-secondary-lt text-secondary' }}">
            {{ $item->status_label }}
          </span>
        </div>

        <h2>{{ $item->nama_barang }}</h2>
        <p>{{ $item->kode_aset }}</p>

        <div class="asset-location-strip">
          <span>
            <i class="ti ti-building"></i>
            {{ $item->room->nama_ruangan }}
          </span>
          <span>
            <i class="ti ti-tags"></i>
            {{ $item->category->nama_kategori }}
          </span>
        </div>

        <div class="asset-action-row">
          <a class="btn btn-primary" href="{{ route('items.edit', $item) }}">
            <i class="ti ti-pencil"></i>
            Edit Barang
          </a>
          <a class="btn" href="{{ route('items.qr.pdf', $item) }}" target="_blank" rel="noopener">
            <i class="ti ti-qrcode"></i>
            Cetak QR
          </a>
        </div>
      </div>
    </section>

    <section class="asset-summary-grid" aria-label="Ringkasan detail barang">
      @foreach ($summaryCards as $card)
        <article class="asset-summary-card tone-{{ $card['tone'] }}">
          <span class="asset-summary-icon">
            <i class="ti {{ $card['icon'] }}"></i>
          </span>
          <span>
            <small>{{ $card['label'] }}</small>
            <strong>{{ $card['value'] }}</strong>
          </span>
        </article>
      @endforeach
    </section>

    <section class="asset-note-panel">
      <div>
        <span class="asset-kicker">Catatan Barang</span>
        <h3>Informasi kondisi aset</h3>
      </div>
      <p>{{ $item->catatan ?: 'Belum ada catatan tambahan untuk barang ini.' }}</p>
    </section>
  </div>
@endsection
