@extends('modules.head') @section('contenido')

<div class="box-header">
    @if(Auth::user()->rol_id == 1 || Auth::user()->rol_id == 10 || Auth::user()->rol_id == 9)
    <a class="auxiliar" href="{{url('/quotes/report')}}">
        <button type="button" class="btn  pull-left btnAux">
            <i class="fa fa-file"></i>@lang('messages.inventory_report')
        </button>
    </a>
    @endif
</div><br>

<!-- <div class="box-header">
        <a class="auxiliar-black" href="{{url('/quotes/add')}}">
            <button class="btn btnAdd pull-right"><i class="fa fa-plus"></i> Create Quote</button>
        </a>
    </div> -->

<div class="box">
    <div class="box-header">
        <h3 class="box-title">Quotes</h3>
    </div>

    <!-- /.box-header -->
    <div class="box-body table-responsive hideScrollOffset">
        @include('eko_table_preferences')
        <table id="example2" class="table table-bordered table-hover dataTable ekoTable" role="grid">
            <thead>
                <tr role="row">
                    <th id="col_code" class="sorting">Code</th>
                    <th id="col_bp_code" class="sorting">BP Code</th>
                    <th id="col_company_name" class="sorting">Company Name</th>
                    <th id="col_subtotal" class="sorting">Subtotal</th>
                    <th id="col_tax" class="sorting">Tax</th>
                    <th id="col_total" class="sorting">Total</th>
                    <th id="col_date" class="sorting">Date</th>
                    <th id="col_admin" class="sorting">Admin</th>
                    <th id="col_status" class="sorting">Status</th>
                </tr>
            </thead>
        </table>
    </div>
    <!-- /.box-body -->
</div>

<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/orders.js') }}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="{{ asset('js/create_filters_for_dataTables.js') }}"></script>
<!--Columns visibility -->
<script src="{{ asset('js/column_visibility.js') }}"></script>
<!--End Columns visibility -->
<script type="text/javascript">
    $(document).ready(function() {
        $.fn.dataTable.ext.errMode = 'throw';
        $('#example2 thead tr')
            .clone(true)
            .addClass('filters')
            .prependTo('#example2 thead');
        $('#example2 thead tr:first-child > th').css('background-color', "rgb(255, 255, 255)");
        $('#example2 thead tr:nth-child(2) > th').css('background-color', "#CCC");
        _table = $('#example2').DataTable({
            orderCellsTop: true,
            // "fixedHeader": true,
            // 'paging': true,
            // 'lengthChange': true,
            // 'searching': true,
            // 'info': true,
            // 'autoWidth': true,
            // "ordering": true,
            // "scrollX": true,
            order: [
                [6, 'desc']
            ],
            // responsive: true,
            // processing: true,
            // serverSide: true,
            "language": {
                url: 'https://cdn.datatables.net/plug-ins/1.10.19/i18n/Spanish.json'
            },
            ajax: '{{ route('quotes.table') }}',
            columns: [{
                    name: 'code',
                    data: 'code',
                    render: function(data, status, raw) {
                        return `<a href="/quotes/edit/${raw.id}">${data}</a>`;
                    }
                },
                {
                    name: 'customer.document',
                    data: 'customer',
                    render(data, type, row) {
                        let prefix = 'L';
                        return data ? data.document : `${prefix}${row.pending_account.id}`;
                    }
                },

                {
                    name: 'customer.first_name',
                    data: 'customer',
                    render(data, type, row) {
                        return data ? data.first_name : row.pending_account.company_name;
                    }
                },
                {
                    name: 'subtotal',
                    data: 'subtotal',
                },
                {
                    name: 'taxes',
                    data: 'taxes',
                },
                {
                    name: 'total',
                    data: 'total',
                },
                {
                    name: 'created_at',
                    data: 'created_at',
                    render: function(data) {
                        let date = new Date(data);
                        return date.toLocaleString('en-US');
                    }
                },
                {
                    name: 'admin.first_name',
                    data: 'admin',
                    render: function(data) {
                        return `${data.first_name} ${data.last_name}`;
                    }
                },
                {
                    name: 'quote_state.name',
                    data: 'quote_state',
                    render: function(data) {
                        return data ? `<span class="badge ${data.css_class}">${data.name}</span>` : "";
                    }
                },
            ],
            initComplete: addFiltersForDataTable
        });

        handleUserColumnsPreferences('example2', 'quotes', _table); //First argument: table id, Second argument: corresponding name in eko_tables database table, Third argument: datatable instance

    });
</script>
<style>
    .bg-primary{background-color: #0d6efd}
    .bg-success{background-color: #198754}
    .bg-danger{background-color: #dc3545}
    .bg-warning{background-color: #ddaa12}
</style>

@endsection