@extends('layouts.app')
@section('title', 'Barang Keluar — ' . $project->nama_proyek)
@section('content')

@include('admin.projects.tabs', ['activeTab' => 'usages'])

<div class="d-flex justify-content-end mb-4">
    <a href="{{ route('admin.usages.create', $project) }}" class="btn btn-primary"><i class="bx bx-plus me-1"></i>Tambah Transaksi Keluar</a>
</div>

<div class="card">
  <div class="card-body">
    <table id="usageTable" class="table table-hover">
      <thead><tr><th>No.</th><th>Tgl Keluar</th><th>Items</th><th>Total Qty Keluar</th><th>Keterangan</th><th class="text-center">Aksi</th></tr></thead>
      <tbody>
        @foreach($usages as $u)
        <tr>
          <td>{{ $loop->iteration }}</td>
          <td>{{ \Carbon\Carbon::parse($u->tanggal_keluar)->format('d/m/Y') }}</td>
          <td><span class="badge bg-label-warning">{{ $u->usageDetails->count() }} item</span></td>
          <td>{{ (floor((float)$u->usageDetails->sum('qty')) == (float)$u->usageDetails->sum('qty')) ? number_format($u->usageDetails->sum('qty'), 0, ',', '.') : rtrim(rtrim(number_format($u->usageDetails->sum('qty'), 2, ',', '.'), '0'), ',') }}</td>
          <td>{{ $u->keterangan ?? '-' }}</td>
          <td class="text-center">
            <a href="{{ route('admin.usages.show', [$project, $u]) }}" class="btn btn-sm btn-outline-primary me-1"><i class="bx bx-show"></i></a>
            <a href="{{ route('admin.usages.edit', [$project, $u]) }}" class="btn btn-sm btn-outline-warning me-1"><i class="bx bx-edit-alt"></i></a>
            <form action="{{ route('admin.usages.destroy', [$project, $u]) }}" method="POST" class="d-inline" onsubmit="return confirm('Hapus transaksi ini?')">
              @csrf @method('DELETE')
              <button type="submit" class="btn btn-sm btn-outline-danger"><i class="bx bx-trash"></i></button>
            </form>
          </td>
        </tr>
        @endforeach
      </tbody>
    </table>
  </div>
</div>
@endsection
@section('page-script')
<script>$(document).ready(function(){ $('#usageTable').DataTable(); });</script>
@endsection