@extends('adminlte::page')

@section('title', 'Photo Documents')

@section('content_header')
    <h1>Photo Documents</h1>
@stop
@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="box-header with-border">
                <span class="float-end">
                    <a href="{{ route('photo.document.add') }}" class="btn btn-primary">Add</a>
                </span>
            </div>
            <div class="card">
                <!-- /.card-header -->
                <div class="card-body table-responsive">
                    <table class="table table-bordered">
                        <tr>
                            <th>Category</th>
                            <th>Name</th>
                            <th>Height</th>
                            <th>Width</th>
                            <th>Action</th>
                        </tr>
                        @foreach ($reasons as $reason)
                            <tr id="tr_{{$reason->id}}">
                                <td>{{$reason['category']['title'] ?? 'N/A' }}</td>
                                <td>{{$reason->name ?? 'N/A' }}</td>
                                <td>{{ $reason->mmHeight  ?? 'N/A' }}</td>
                                <td>{{ $reason->mmWidth ?? 'N/A' }}</td>
                                <td>
                                    <a href="{{route('photo.document.edit',$reason->id)}}">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <a href="{{route('photo.document.delete',$reason->id)}}">
                                        <i class="fas fa-trash text-danger"></i>
                                    </a>
                                </td>
                            </tr>
                        @endforeach
                    </table>
                    {{ $reasons->withQueryString()->links('pagination::bootstrap-4') }}
                </div>
                <!-- /.card-body -->
            </div>
        </div>
        <!-- /.col -->
    </div>
@stop