@extends('layouts/layoutMaster')

@title('Maintenance Tickets')

@section('content')
<div class="container-xxl flex-grow-1 container-p-y">
  <div class="d-flex justify-content-between align-items-center mb-4">
    <h4 class="fw-bold py-3 mb-0">
      <span class="text-muted fw-light">Maintenance /</span> Active Tickets
    </h4>
    @if(auth()->user()->role === 'tenant')
      <a href="{{ route('maintenance.create') }}" class="btn btn-primary">
        <i class="bi bi-plus-lg me-1"></i> File Repair Request
      </a>
    @endif
  </div>

  @if(session('success'))
    <div class="alert alert-success alert-dismissible" role="alert">
      {{ session('success') }}
      <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
  @endif

  @if(session('error'))
    <div class="alert alert-danger alert-dismissible" role="alert">
      {{ session('error') }}
      <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
  @endif

  <div class="card">
    <div class="card-header border-bottom">
      <h5 class="card-title mb-0">Maintenance Requests</h5>
    </div>
    <div class="table-responsive text-nowrap">
      <table class="table table-hover">
        <thead class="table-light">
          <tr>
            <th>Ticket Details</th>
            <th>Property / Unit</th>
            <th>Category</th>
            <th>Assigned Provider</th>
            <th>Status</th>
            <th>Date Logged</th>
            <th>Actions</th>
          </tr>
        </thead>
        <tbody class="table-border-bottom-0">
          @forelse($requests as $request)
            <tr>
              <td>
                <div class="d-flex flex-column">
                  <span class="fw-semibold text-body">{{ $request->title }}</span>
                  <small class="text-muted text-truncate" style="max-width: 250px;">{{ $request->description }}</small>
                </div>
              </td>
              <td>
                <div class="d-flex flex-column">
                  <span class="fw-semibold">{{ $request->property->name }}</span>
                  <small class="text-muted">Unit: {{ $request->unit->unit_number }}</small>
                </div>
              </td>
              <td>
                <span class="badge bg-label-info text-capitalize">{{ $request->category }}</span>
              </td>
              <td>
                @if($request->provider)
                  <span class="fw-semibold">{{ $request->provider->name }}</span>
                @else
                  <span class="text-muted italic">Unassigned</span>
                @endif
              </td>
              <td>
                @if($request->status === 'pending')
                  <span class="badge bg-warning">Pending Review</span>
                @elseif($request->status === 'assigned')
                  <span class="badge bg-primary">Assigned</span>
                @else
                  <span class="badge bg-success">Resolved</span>
                @endif
              </td>
              <td>
                {{ $request->created_at->format('M d, Y') }}
              </td>
              <td>
                <a href="{{ route('maintenance.show', $request->id) }}" class="btn btn-sm btn-outline-primary">
                  <i class="bi bi-eye me-1"></i> View
                </a>
              </td>
            </tr>
          @empty
            <tr>
              <td colspan="7" class="text-center py-4">
                <i class="bi bi-tools fs-1 text-muted mb-2 d-block"></i>
                <span class="text-muted">No maintenance requests found.</span>
              </td>
            </tr>
          @endforelse
        </tbody>
      </table>
    </div>
  </div>
</div>
@endsection