@extends('layout.app')

@section('content')
    <div class="row">
        <div id="" class="table-responsive" style="">

            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-2">
                        <h4 class="mb-0">Total Deleted: {{ $list->count() }}</h4>

                        {{-- Hidden rather than 403-ing, the way the close list does it. --}}
                        @if (checkSettings('enforce-download-permission') != 'enable' || auth()->user()->can('deleted-client-export'))
                            <a class="noprint btn btn-primary" href="{{ route('deletedCustomerExport') }}">
                                <i class="fa fa-file-excel-o"></i> Export
                            </a>
                        @endif
                    </div>
                    <table id="dataTable" class="table table-bordered">
                        <thead class="bg-gray-50">
                            <tr>
                                <th scope="col">Client Id </th>
                                <th scope="col">Customers Username </th>
                                <th scope="col">Deleted By </th>
                                <th scope="col">Deleted At </th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-gray-200">
                            @foreach ($list as $r)
                                <tr>
                                    <td>
                                        {{ $r->customer_id }}
                                    </td>
                                    <td>
                                        {{ $r->username }}
                                    </td>
                                    <td>
                                        {{ $r->admin->name ?? '' }}
                                    </td>
                                    <td>
                                        {{ $r->created_at }}
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>


        </div>
    </div>

    <style>
        div#processing {
            display: none;
        }

        div#processing div {
            background: rgba(0, 0, 0, .5);
            position: fixed;
            width: 100vw;
            height: 100vh;
            color: #fff;
            text-align: center;
            vertical-align: middle;
            display: flex;
            justify-content: center;
            align-items: center;
        }

    </style>
@endsection