@php ($headerOption = [
'title' => $module,
'header_buttons' => [
  '<a class="'. \Config::get('view.buttons.secondary') .'" href="'. route('export.faqs', Request::input()) .'" data-toggle="tooltip" data-original-title="Export FAQs to PDF"><i class="bx bx-download"></i></a>',
  ($permission['create'] ? '<a class="'. \Config::get('view.buttons.primary') .'" href="'. route($routePrefix . '.create') .'" data-toggle="tooltip" data-original-title="Add New FAQ">'. \Config::get('settings.icon_add') .' <span>Add New</span></a>' : ''),
],
'filters' => isset($filters) ? $filters : [],
'data' => isset($data) ? $data : []
])
@extends('admin.layouts.layout', $headerOption)

@section('content')
<div class="table-responsive">
  <table class="{!! \Config::get('view.table.table_class') !!}">
    <thead class="{!! \Config::get('view.table.table_head_class') !!}">
      <tr>
        <th width="40%">Question </th>
        <th width="35%">Answer</th>
        <th width="10%">Status {!! \App\Helpers\Helper::sort($routePrefix . '.index', 'status', $orderBy) !!}</th>
        <th width="10%">Created Date </th>
        @if($permission['edit'] || $permission['destroy'])
        <th width="5%" style="text-align: right;">Action</th>
        @endif
      </tr>
    </thead>
    <tbody>
    @if(count($data))
        @foreach ($data as $key => $val)
        <tr>          
          <td>
            <a href="{{ route($routePrefix . '.show', $val->id) }}" class="show-modal-lg" data-toggle="tooltip" title="View FAQ Details">
              {{ \Str::limit($val->question, 80) }}
            </a>
          </td>
          <td>{{ \Str::limit(strip_tags($val->answer), 100) }}</td>
          <td><span class="badge badge-pill badge-soft-{{ $val->statuses[$val->status]['badge'] }} font-size-12">{!! $val->statuses[$val->status]['name'] !!}</span></td>
          <td>{{ \App\Helpers\Helper::showDate($val->created_at, false) }}</td>
          
          @if($permission['edit'] || $permission['destroy'])
          <td style="text-align: right;">
            <div class="btn-group" role="group">
              @if($permission['edit'])
                <a data-toggle="tooltip" title="Edit" href="{{ route($routePrefix . '.edit', $val->id) }}">{!! \Config::get('settings.icon_edit') !!}</a>
                
              @endif
              @if($permission['destroy'])
              <a data-toggle="tooltip" title="Delete" data-confirm="Are You Sure?|This action can not be undone. Do you want to continue?" data-confirm-yes="event.preventDefault();
                    document.getElementById('delete-form-{{$val->id}}').submit();" data-original-title="Delete">{!! \Config::get('settings.icon_delete') !!}</a>
                    {!! html()->form('DELETE', route(
                        $routePrefix . '.destroy',
                        $val->id
                        ))->attributes([
                        'style' => 'display:inline',
                        'id'    => 'delete-form-' . $val->id
                        ])->open() !!}
                    {!! html()->form()->close() !!}
              @endif
            </div>
          </td>
          @endif
        </tr>
        @endforeach
    @else
        <tr>
          <td colspan="{{ $permission['edit'] || $permission['destroy'] ? '6' : '5' }}" class="text-center">
            <div class="py-4">
              <i class="bx bx-help-circle display-4 text-muted"></i>
              <p class="text-muted mt-2">No FAQs found</p>
              @if($permission['create'])
              <a href="{{ route($routePrefix . '.create') }}" class="btn btn-primary btn-sm">
                <i class="bx bx-plus"></i> Add First FAQ
              </a>
              @endif
            </div>
          </td>
        </tr>
    @endif
    </tbody>
  </table>
</div>

@include('admin.components.pagination')


@push('page_script')
    <script>
    function toggleStatus(id) {
        if (confirm('Are you sure you want to change the status of this FAQ?')) {
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            $.ajax({
                url: '{{ route("faqs.toggle-status", ":id") }}'.replace(':id', id),
                type: 'POST',
                dataType: 'json',
                success: function(response) {
                    if (response.status === 200) {
                        toastr.success(response.message);
                        location.reload();
                    } else {
                        toastr.error(response.message || 'Something went wrong');
                    }
                },
                error: function(xhr) {
                    const response = xhr.responseJSON;
                    toastr.error(response?.message || 'Something went wrong');
                }
            });
        }
    }

    </script>
@endpush
@endsection