@extends('admin.layouts.master')
@section('content')
    <section class="section">
        <ul class="breadcrumb breadcrumb-style ">
            <li class="breadcrumb-item">Admin</li>
            <li class="breadcrumb-item">Barcode</li>
        </ul>
        <style>
            label {
                color: #fff;
            }

            .pass {
                margin: 10px 10px 10px 30px;
            }

            .text-center {
                text-align: center !important;
            }

            @media(max-width:992px) {
                .text-center {
                    text-align: left !important
                }

                .mxs {
                    margin-left: 15px;
                }
            }

            .dataTables_paginate {
                display: none !important
            }
        div.dataTables_wrapper div.dataTables_length label, div.dataTables_wrapper div.dataTables_filter label, div.dataTables_wrapper div.dataTables_info {
    color: #fff;
    display: none !important;
}

        </style>
        <div class="section-body">
            <div class="row">
                <div class="col-12">
                    <div class="container-fluid">
                        <div class="row">
                            <form class="col-sm-12 pas" style="width: 75% !important"
                                action="{{ route('admin.users.barcode') }}" method="GET">
                                <label for="">From</label>
                                <input type="date" name="from" id="" class="chek"
                                    value="{{ request()->from ? request()->from : '' }}">
                                <label for="">To</label>
                                <input type="date" name="to" id="" class="chek mxs"
                                    value="{{ request()->to ? request()->to : '' }}">
                                <label for="">Search</label>
                                <input type="text" name="search" placeholder="Search Here"
                                    value="{{ request()->search ? request()->search : '' }}">
                                <input class="btn btn-primary pass" type="submit" value="Filter">
                                <a class="btn btn-primary pass" href="{{ route('admin.users.barcode') }}">Reset</a>
                            </form>

                        </div>
                    </div>


                    <div class="card">
                        <div class="card-header">
                            <h4>Barcode</h4>
                            <a class="btn btn-primary" style="float: right">Barcode Scanned Today: {{ $barcodesCount }}</a>
                        </div>
                        <div></div>
                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-striped" id="table-1">
                                    <thead>
                                        <tr>
                                            <th>Name</th>
                                            <th>Account</th>
                                            <th>Barcode</th>
                                            <th>Collector</th>
                                            <th>Salesman</th>
                                            <th>Date Created</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @forelse ($barcodes as $barcode)
                                            {{-- @dd($barcode) --}}
                                            <tr>
                                                <td>{{ $barcode->user->fname . ' ' . $barcode->user->lname }}</td>
                                                <td>{{ $barcode->user->orgUser->organization->name }}</td>
                                                <td>{{ $barcode->barcode }}</td>
                                                <td>{{ $barcode->collector != null? $barcode->collector->fname . ' ' . $barcode->collector->lname: 'Not Added By Collector' }}
                                                </td>
                                                <td>{{ $barcode->salesman != null? $barcode->salesman->fname . ' ' . $barcode->salesman->lname: 'Not Added By Salesman' }}
                                                </td>
                                                <td>{{ $barcode->created_at->format('m-d-Y') }}</td>
                                            </tr>
                                        @empty
                                            <tr>
                                                <td>No Data Available</td>
                                                <td>No Data Available</td>
                                                <td>No Data Available</td>
                                                <td>No Data Available</td>
                                                <td>No Data Available</td>
                                            </tr>
                                        @endforelse
                                    </tbody>
                                </table>
                                <a class="btn btn-primary" style="float: right">Current Page: {{ $barcodes->currentPage() }} Showing {{ $barcodes->firstItem() }} to {{ $barcodes->lastItem() }} of {{ $barcodes->total() }} entries</a>
                                <div class="d-flex justify-content-center">
                                    {!! $barcodes->appends($data)->links('pagination::bootstrap-4') !!}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection
@push('scripts')
    <script>
        $("#table-1").dataTable().fnDestroy();
        // $("#table-1").dataTable.moment('MM/DD/YY');
        var table = $('#table-1').dataTable({
            // display everything
            "bPaginate": false,
            // "lengthChange": false
            // "iDisplayLength": 100,
            // "bInfo" : false
            // "info": false
            "ordering": true,
            'searching': false,
            // "columnDefs" : [{"targets":4, type: "bz"}],
            order: [4, 'desc'],
            // "aaSorting": [
            //     [4, "desc"]
            // ] // Sort by first column descending
        });
    </script>
@endpush