@extends(backpack_view('layouts.top_left'))

@yield('before_scripts')

@php
  $defaultBreadcrumbs = [
    $crud->entity_name_plural => url($crud->route),
    trans('backpack::crud.list') => false,
  ];

  // if breadcrumbs aren't defined in the CrudController, use the default breadcrumbs
  $breadcrumbs = $breadcrumbs ?? $defaultBreadcrumbs;
@endphp

@section('header_left')
    <h2 class="d-inline-block">
        <span class="text-capitalize">{!! $crud->getHeading() ?? $crud->entity_name_plural !!}</span>
    </h2>
@endsection
@section('header_right')
    @if ( $crud->buttons()->where('stack', 'top')->count() ||  $crud->exportButtons())
        <div class="hidden-print {{ $crud->hasAccess('create')?'with-border':'' }} float-sm-right">
            @include('crud::inc.button_stack', ['stack' => 'top'])
        </div>
    @endif
@endsection

@section('search_stack')
    @php
    $filter_count = count(request()->all());
    @endphp

  <div id="datatable_search_stack" class="float-right"></div><div class="btn btn-normal-cancel" id="filter-toggle">{{trans('backpack::crud.adv_search')}} <span class="filter_count"></span></div>
    <a href="#" class="remove_filters_button"
       class="float-right mr-1" style="display: none;">
        <div class="btn btn-normal-reset">
            {{ trans('backpack::crud.remove_filters') }}
        </div>
    </a>
@endsection


@section('content')
    <!-- Default box -->
    @if ($crud->filtersEnabled())
        @include('crud::inc.filters_navbar')
    @endif

    @if (isset($crud->data['export_filters']))
        @include('crud::inc.filters_navbar_for_report')
    @endif

    @yield('before_list_content')

  <div class="row">

    <!-- THE ACTUAL CONTENT -->
    <div class="{{ $crud->getListContentClass() }}">
      {{-- Backpack List Filters --}}
      <div class="">

          <div class="row">
              <div class="col-12">
                  <div id="datatable_button_stack" class="float-right text-right hidden-xs"></div>
                  <div class="d-inline-block float-right mr-3 mt-2">
                      <small id="datatable_info_stack">{!! $crud->getSubheading() ?? '' !!}</small>
                  </div>
              </div>
          </div>
        <div class="overflow-hidden mt-2">

        <table id="crudTable" class="bg-white table table-striped table-hover nowrap rounded shadow-xs" cellspacing="0">
            <thead>
              <tr>

                {{-- Table columns --}}
                @foreach ($crud->columns() as $column)
                  <th
                    data-orderable="{{ var_export($column['orderable'], true) }}"
                    data-priority="{{ $column['priority'] }}"
                    data-visible="{{ var_export($column['visibleInTable'] ?? true) }}"
                    data-visible-in-modal="{{ var_export($column['visibleInModal'] ?? true) }}"
                    data-visible-in-export="{{ var_export($column['visibleInExport'] ?? true) }}"
                    >
                    {!! $column['label'] !!}
                  </th>
                @endforeach

                @if ( $crud->buttons()->where('stack', 'line')->count() )
                  <th data-orderable="false" data-priority="{{ $crud->getActionsColumnPriority() }}" data-visible-in-export="false">{{ trans('backpack::crud.actions') }}</th>
                @endif
              </tr>
            </thead>
            <tbody>
            </tbody>
          </table>

          @if ( $crud->buttons()->where('stack', 'bottom')->count() )
          <div id="bottom_buttons" class="hidden-print">
            @include('crud::inc.button_stack', ['stack' => 'bottom'])

          </div>
          @endif

        </div><!-- /.box-body -->

      </div><!-- /.box -->
    </div>

  </div>

@endsection

@section('after_styles')
  <!-- DATA TABLES -->
  <link rel="stylesheet" type="text/css" href="{{ asset('packages/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}">
  <link rel="stylesheet" type="text/css" href="{{ asset('packages/datatables.net-fixedheader-bs4/css/fixedHeader.bootstrap4.min.css') }}">
  <link rel="stylesheet" type="text/css" href="{{ asset('packages/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css') }}">

  <link rel="stylesheet" href="{{ asset(mix('packages/backpack/crud/css/crud.css')) }}">
  <link rel="stylesheet" href="{{ asset(mix('packages/backpack/crud/css/form.css')) }}">
  <link rel="stylesheet" href="{{ asset(mix('packages/backpack/crud/css/list.css')) }}">

  <!-- CRUD LIST CONTENT - crud_list_styles stack -->
  @stack('crud_list_styles')
@endsection

@section('after_scripts')
	@include('crud::inc.datatables_logic')

    <script>
        $(document).ready(function () {
            var html_text = $('#datatable_search_stack label span').html();
            $('#datatable_search_stack label span').html('');
            $('#datatable_search_stack label input[type="search"]').attr("placeholder", html_text);
        });

        $('#crudTable').on( 'draw.dt',   function () {
            var filter_count = 0;
            var paramsString = window.location.href.split('?');
            if(paramsString[1]){
                var searchParams = new URLSearchParams(paramsString[1]);
                for (var pair of searchParams.entries()) {
                    let regex = /^.[^\[\]]+/g;
                    let filter_name = pair[0].match(regex);

                    if ($('.filter-slise-in [filter-name='+filter_name[0]+']').length >= 1) {
                        filter_count++;
                    }
                }
            }

            // $('.dtr-control').removeClass('dtr-control').re

            if(filter_count > 0){
                $('#filter-toggle').removeClass('btn-normal-cancel').addClass('btn-normal-copy');
                $('.navbar-nav .remove_filters_button').show();
                $('.filter_count').html('(' + filter_count + ')');
            }else{
                $('#filter-toggle').removeClass('btn-normal-copy').addClass('btn-normal-cancel');
                $('.navbar-nav .remove_filters_button').hide();
                $('.filter_count').html('');
            }

        });
    </script>

    @yield('after_scripts')

  <script src="{{ asset('packages/backpack/crud/js/crud.js') }}"></script>
  <script src="{{ asset('packages/backpack/crud/js/form.js') }}"></script>
  <script src="{{ asset('packages/backpack/crud/js/list.js') }}"></script>

  <!-- CRUD LIST CONTENT - crud_list_scripts stack -->
  @stack('crud_list_scripts')
@endsection