@include('admin.jobs.datatable.tables.search-bar')
<table class="m-datatable__table table table-bordered table-hover customer" id="inprogress_jobs_table" width="100%">
    <thead class="m-datatable__head">
        <tr>
            <th width="200px">Job Reference</th>
            <th width="20%">Required Date</th>
            <th width="20%">Material (M)</th>
            @if(Auth::user()->hasRole('Admin'))
            <th width="10%">White</th>
            <th width="10%">Colour</th>
            {{--<th title="Field #7">Cutting Today</th>--}}
            @endif
            <th width="20%">M.Status</th>
            <th width="20%">Status</th>
            <th width="20%">C Notes</th>
            
            {{--<th title="Field #7">@lang('global.jobs.fields.order-pdf')</th>--}}
            <th>&nbsp;</th>
        </tr>
    </thead>
</table>
<!--end: Datatable -->
@push('datatable_scripts')
<script type="text/javascript">
    jQuery(function(){
        window.inprogress_jobs_table = jQuery('#inprogress_jobs_table').DataTable({
            "dom": 'frtip',
            "searching": false,
            "info": true,
            "ordering": true,
            "order": [],
            "destroy":true,
            processing: true,
            serverSide: true,
            colReorder: true,
            "pageLength": 50,
            oLanguage: {
                sProcessing: "<i class='fa fa-fw fa-spin fa-spinner' style='font-size:25px;'></i>"
            },
            ajax: {
                url : '{{url("/admin/jobs/data")}}',
                type:'get',
                data: function(d) {
                    d.filter_keyword=jQuery("#inprogressjobs .keyword-search").val(),
                    d.date_range=jQuery("#inprogressjobs #dateRange").val(),
                    d.filter_by_status=true,
                    d.status_value='1,2,3,4,5,6',
                    d.name_filter=jQuery("#inprogressjobs #searchfilter").val()
                },
                "dataSrc": function (json) {
                    return json.data;
                },
            },
            columns: [
            { data: 'job_reference', name: 'job_reference'},
            { data: 'formatted_date_required', name: 'sortable_date_required'},
            { data: 'material', name: 'material'},
            @if(Auth::user()->hasRole('Admin'))
            { data: 'white_satin', name: 'white_satin'},
            { data: 'sheets_colour', name: 'sheets_colour'},
            // { data: 'cutting_today', name: 'cutting_today'},
            @endif
            { data: 'material_status', name: 'material_status'},
            { data: 'status', name: 'status', class: 'ce'},
            { data: 'customer_notes_icon', name: 'customer_notes', class: 'ce'},
            { data: 'actions', name: 'actions', searchable: false, orderable: false},
            ]
        });
    });


    $(document).on("keyup", "#inprogressjobs .filter_inputs", function() { 
        window.inprogress_jobs_table.ajax.reload();
    });

    $(document).ready(function(){
        $('#inprogressjobs #dateRange').on('apply.daterangepicker', function(ev, picker) {
            window.inprogress_jobs_table.ajax.reload();
        });
        $('#inprogressjobs #dateRange').on('cancel.daterangepicker', function(ev, picker) {
         $('#inprogressjobs #dateRange').val('');
         window.inprogress_jobs_table.ajax.reload();
     });
    });
    </script>
    @endpush