@extends('layout.main')

@section('content')

<div class="container-fluid">
    <div class="row justify-content-center">
      <div class="col-12">
        <h2 class="h3 mb-3 page-title">{{ __('nav.legal_query')}}</h2>
        <div class="row mb-4 items-align-center">
          <div class="col-md">
            <ul class="nav nav-pills justify-content-start">
              <li class="nav-item">
                <a class="nav-link @if($status === 'all') active bg-transparent pr-2 pl-0 text-primary @else text-muted px-2 @endif " href="{{ route('queries.status','all')}}">{{__('nav.all')}} <span class="badge badge-pill bg-primary text-white ml-2"></span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link @if($status === 'pending') active bg-transparent pr-2 pl-0 text-primary @else text-muted px-2 @endif  " href="{{route('queries.status','pending')}}">{{__('nav.pending')}} <span class="badge badge-pill bg-white border text-muted ml-2"></span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link @if($status == 'in_progress')  active bg-transparent pr-2 pl-0 text-primary @else text-muted px-2 @endif  " href="{{route('queries.status','in_progress')}}">{{__('nav.processing')}} <span class="badge badge-pill bg-white border text-muted ml-2"></span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link @if($status == 'completed')  active bg-transparent pr-2 pl-0 text-primary @else text-muted px-2 @endif  " href="{{route('queries.status','completed')}}">{{__('nav.completed')}} <span class="badge badge-pill bg-white border text-muted ml-2"></span></a>
              </li>
            </ul>
          </div>
          <div class="col-md-auto ml-auto text-right">
            
          </div>
        </div>
        <table class="table border table-hover bg-white datatables" id="dataTable-1" >
          <thead>
            <tr role="row">
              
                <th>{{__('nav.query_id')}}</th>
                <th>{{__('nav.title')}}</th>
              <th>{{__('nav.description')}}</th>
              <th> {{__('nav.client')}} </th>
              <th> {{__('nav.assigned_to')}} </th>
              <th> {{__('nav.action')}} </th>
            </tr>
          </thead>
          <tbody>
            @forelse($data as $result)
            <tr>
              <td>{{ $result->issue_id }}</td>
              <td>{{ $result->title }}</td>
              <td>{{ $result->description}}</td>
              <td>
                <p>{{$result->client->name}} </p></td>
                <td>
                @if($result->status != 'pending')<p>Assigne: {{$result->expert->name}} </p>@endif</td>
              <td>
                <div class="hstack gap-2 fs-15">
                    @if( Auth::user()->can('legal-queries-view'))<a aria-label="anchor" href="{{route('queries.show', $result->id)}}" title="View Query" class="btn btn-sm btn-success"><i class="fe fe-eye fe-16"></i></a>@endif
                    @if(Auth::user()->can('legal-queries-delete'))
                    <button  type="button" class="btn btn-sm btn-danger"  data-toggle="modal" data-target="#modal-delete{{$result->id}}"><i class="fe fe-trash-2 fe-16"></i></button>
                    <div class="modal fade"  id="modal-delete{{$result->id}}" tabindex="-1" aria-labelledby="modal-new-address" aria-hidden="true">
                        <div class="modal-dialog  modal-dialog-centered">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h6 class="modal-title" id="staticBackdropLabel">
                                    </h6>
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                      <span aria-hidden="true">×</span>
                                    </button>
                                    
                                </div>
                                <div class="modal-body">
                                    <form action="{{route('queries.destroy',$result->id)}}" method="post">
                                        @csrf
                                        @method('DELETE')
                                    <div class="row gy-3">
                                        <div class="col-xl-6">
                                            <H2>Are you Sure ?</H2>
                                            <p>You won't be able to revert this!</p> 
                                        </div>                                       
                                    </div>
                                
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-light" data-dismiss="modal">Close</button>
                                    <button type="submit" class="btn btn-danger">Yes, Delete It</button>
                                </div>
                            </form>
                            
                            </div>
                        </div>
                    </div>
                    @endif
                </div>
               
              </td>
              
            </tr>
            @empty  
            @endforelse
          </tbody>
        </table>
      </div>
    </div> <!-- .row -->
  </div> <!-- .container-fluid -->
@endsection

@push('scripts')
    {{-- <script src='{{ asset('dashboard/js/jquery.dataTables.min.js')}}'></script> --}}
    <script src='{{ asset('dashboard/js/dataTables.js')}}'></script>
    {{-- <script src='{{asset('dashboard/js/dataTables.bootstrap4.min.js')}}'></script> --}}
    <script src='{{asset('dashboard/js/dataTables.buttons.js')}}'></script>
    <script src='{{asset('dashboard/js/buttons.dataTables.js')}}'></script>
    <script src='{{asset('dashboard/js/pdfmake.min.js')}}'></script>
    <script src='{{asset('dashboard/js/vfs_fonts.js')}}'></script>
    <script src='{{asset('dashboard/js/buttons.html5.min.js')}}'></script>
    <script src='{{asset('dashboard/js/buttons.print.min.js')}}'></script>
    <script>
      $('#dataTable-1').DataTable({
        layout: {
        topStart: {
            buttons: [ 
              {
                        extend: 'csv',
                        exportOptions: {
                            columns: ':not(:last-child)'  // Excludes the last column from the export
                        }
                    },
                    {
                        extend: 'pdf',
                        orientation: 'portrait',
                        exportOptions: {
                            columns: ':not(:last-child)'
                        }
                    }
            ]
        }
    }
      });
    </script>
@endpush('scripts')