{!! Form::open(['route' => 'admin::categories::toggleShowCategories', 'class' => 'form-horizontal']) !!}
<table class="table table-hover">
    <colgroup>
        <col>
        <col>
        <col width="75">
    </colgroup>
    <thead>
    <tr>
        <th> {{ trans('admin/warehouse/category/mapped/lists/list.header.storeCategoryName') }} </th>
        <th> {{ trans('admin/warehouse/category/mapped/lists/list.header.warehouseCategoryName') }} </th>
        <th class="text-center hidden-print"> {{ trans('global.options') }} </th>
    </tr>
    </thead>
    <tbody>
        @forelse ($categoriesList as $category)
            <tr data-list-id="{{ $category->id }}">
                <td> {{ optional($category->category)->c('categoryFullName') ?? trans('admin/warehouse/category/mapped/lists/list.empty.position') }} </td>
                <td> {{ optional($category->warehouse)->c('getFullName') ?? trans('admin/warehouse/category/mapped/lists/list.empty.position') }} </td>
                <td class="text-center hidden-print">
                    <a href="#"
                       class="btn btn-transparent btn-xs tooltips delete-relation" data-placement="top"
                       data-toggle="tooltip"
                       data-original-title="{{ trans('global.delete') }}"
                       data-id="{{ $category->id }}">
                        <i class="fa fa-success fa-times"></i>
                    </a>
                </td>
            </tr>
        @empty
            <tr>
                <td colspan="3"class="text-center">
                    {{ trans('admin/warehouse/category/mapped/lists/list.empty.list') }}
                </td>
            </tr>
        @endforelse
    </tbody>
</table>
@if ($categoriesList->isNotEmpty())
    <div class="text-center">
        @include('admin.layouts.includes.pagination', ['paginator' => $categoriesList])
    </div>
@endif
{!! Form::close() !!}

@push('footScripts')
<script>
    $(document).ready(function () {
        $(".delete-relation").on("click", function(e) {
            var id = $(this).data('id');
            swal({
                title: "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.title') }}",
                text: "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.text') }}",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.confirmButtonText') }}",
                cancelButtonText: "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.cancelButtonText') }}",
                closeOnConfirm: false,
                closeOnCancel: true
            }, function (isConfirm) {
                if (isConfirm) {
                    var url = '{{ route('admin::warehouse::category::mapped::delete', '%s') }}';
                    url = url.replace('%s', id);

                    $.getJSON(url, function (data) {
                        swal(
                            "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.result.deleted.title') }}",
                            "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.result.deleted.text') }}",
                            "success"
                        );
                        $("[data-list-id=" + id + "]").remove();

                        if ($("[data-list-id]").length == 0) {
                            $("#data-list-body").html('<tr><td colspan="3" class="text-center">{{ trans('admin/warehouse/category/mapped/lists/list.empty.list') }}</td></tr>');
                        }
                    }).fail(function (data) {
                        swal(
                            "{{ trans('admin/warehouse/category/mapped/lists/list.options.delete.sweet-alert.result.error.title') }}",
                            "",
                            "error"
                        );
                    });
                }
            });

            e.preventDefault();
        });
    });
</script>
@endpush