@extends('dashboard.layout')
@section('title','المنتجات')
@section('container','container-fluid')

@section('content')
<div class="card card-dark p-3">
  <div class="d-flex flex-wrap gap-2 align-items-center justify-content-between mb-3">
    <h2 class="h6 m-0">جميع المنتجات</h2>
    <div class="d-flex flex-wrap gap-2">
      <form action="{{ route('dashboard.products.index') }}" method="GET" class="d-flex gap-2">
        <input type="text" name="q" class="form-control form-control-sm" placeholder="ابحث بالاسم أو الكود" value="{{ request('q') }}">
        <button class="btn btn-outline-secondary btn-sm">ابحث</button>
      </form>
      <a href="{{ route('dashboard.products.create') }}" class="btn btn-primary btn-sm"><i class="fas fa-plus ms-1"></i> منتج جديد</a>
    </div>
  </div>

  <div class="table-responsive-stack">
    <table class="table align-middle mb-0">
      <thead><tr><th>#</th><th>الصورة</th><th>الاسم</th><th>الفئة</th><th>السعر</th><th>الحالة</th><th>الإجراءات</th></tr></thead>
      <tbody>
      @forelse($products as $p)
        <tr>
          <td>{{ $p->id }}</td>
          <td><img src="{{ $p->image ? asset('storage/'.$p->image) : 'https://ui-avatars.com/api/?name='.urlencode($p->name) }}" style="width:46px;height:46px;object-fit:cover;border-radius:8px;"></td>
          <td class="fw-bold">{{ $p->name }}</td>
          <td>{{ $p->catalog?->name ?? '—' }}</td>
          <td>{{ number_format($p->price ?? 0, 2) }}</td>
          <td><span class="badge bg-{{ ($p->status ?? 'inactive')==='active'?'success':'secondary' }}">{{ $p->status ?? 'inactive' }}</span></td>
          <td class="d-flex flex-wrap gap-1">
            <a href="{{ route('dashboard.products.edit',$p) }}" class="btn btn-sm btn-primary">تعديل</a>
            <form action="{{ route('dashboard.products.destroy',$p) }}" method="POST" onsubmit="return confirm('حذف المنتج؟')">
              @csrf @method('DELETE')
              <button class="btn btn-sm btn-danger">حذف</button>
            </form>
          </td>
        </tr>
      @empty
        <tr><td colspan="7" class="text-muted">لا توجد منتجات.</td></tr>
      @endforelse
      </tbody>
    </table>
  </div>

  <div class="mt-3">{{ $products->withQueryString()->links() }}</div>
</div>
@endsection