@extends('app-new')

@push('head-script')
    <!-- BEGIN: Vendor CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/forms/wizard/bs-stepper.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/pickers/flatpickr/flatpickr.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/pickers/pickadate/pickadate.css">
    <!-- END: Vendor CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/dataTables.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/responsive.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/components.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/vendors.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/extensions/toastr.min.css">
    <link rel="stylesheet" href="/assets/plugins/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.css">
    <link rel="stylesheet" href="/assets/css/daterangepicker.css">

    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-validation.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/form-wizard.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-pickadate.css">
    <!-- END: Page CSS-->
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">{{trans('bill/bill.bill_submission')}}</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/home">{{trans('common/common.home')}}</a>
                    </li>
                    <li class="breadcrumb-item"><a href="/{{$alias}}/contractual/bills">{{trans('bill/bill.bill_submission')}}</a>
                    </li>
                    <li class="breadcrumb-item active">
                    @if(isset($bill) && ($bill->id))
                    {{trans('bill/bill.edit_bill')}}
                    @else
                    {{trans('bill/bill.add_new_bill')}}
                    @endif
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush

@section('content')

 <!-- Basic multiple Column Form section start -->
 {!! Form::model($bill, ['method' => isset($bill) && $bill->id ? 'put' : 'post', 'files' => 'true']) !!}
 <section id="multiple-column-form">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <!-- <div class="card-header">
                    <h4 class="card-title">Multiple Column</h4>
                </div> -->
                <div class="card-body">
                        <div class="row">
                            <div class="col-md-6 col-12">
                                <label class="form-label">{{trans('bill/bill.month')}}</label>
                                <select class="form-select select2" name="month_id" id="month_id" onchange="showListing.call(this)">
                                    @foreach ($month as $mkey=>$monthitem)
                                        <option value="{{$mkey}}" @if(($mkey == $month_id) || (old('month_id') == $mkey)) selected @endif>{{$monthitem}}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-md-6 col-12">
                                <label class="form-label">{{trans('bill/bill.year')}}</label>
                                <select class="form-select select2" id="year_id" name="year_id" onchange="showListing.call(this)">
                                    @foreach ($year as $ykey=>$yearitem)
                                        <option value="{{$yearitem}}" @if(($yearitem == $year_id) || (old('year_id') == $yearitem)) selected @endif>{{$yearitem}}</option> 
                                    @endforeach
                                </select>    
                            </div>

                            <div class="col-md-6 col-12 mt-2">
                            @if(Auth::user()->is_contractor!=1)
                                <div class="form-group {{{ $errors->has('contractor_id') ? 'has-error' : '' }}}">
                                        <label class="form-label required">{{trans('bill/bill.contractor')}}</label> 
                                        <select class="form-select select2" name="contractor_id" id="contractor_id" onchange="getType.call(this)">
                                            <option value="">{{trans('bill/bill.select_contractor')}}</option>
                                            @foreach($contractors as $contractor)
                                                <option value="{{$contractor->id}}" @if(isset($bill) && ($bill->contractor_id == $contractor->id) || (old('contractor_id') == $contractor->id)) selected @endif>{{$contractor->name}}</option>
                                            @endforeach
                                        </select>
                                        {!! $errors->first('contractor_id','
                                        <label class="error" for="contractor_id">:message</label>')!!}
                                </div>
                            @else
                                {{-- <input type="hidden" name="contractor_id" id="contractor_id" value="{{Auth::user()->id}}"> --}}
                                <div class="form-group {{{ $errors->has('contractor_id') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.contractor')}}</label> 
                                    <select class="form-select select2" name="contractor_id" id="contractor_id" onchange="getType.call(this)">
                                        <option value="">{{trans('bill/bill.select_contractor')}}</option>
                                        <option value="{{Auth::user()->id}}" @if(isset($bill) && ($bill->contractor_id == Auth::user()->id) || (old('contractor_id') == Auth::user()->id)) selected @endif>{{ Auth::user()->name }}</option>
                                    </select>
                                    {!! $errors->first('contractor_id','
                                    <label class="error" for="contractor_id">:message</label>')!!}
                                </div>
                            @endif
                            </div>

                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('type') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.types')}}</label> 
                                    <select class="form-select select2" name="type" id="type" onchange="showListing.call(this)">
                                        <option value="">{{trans('bill/bill.select_type')}}</option>
                                        @foreach($contractorTypes as $types)
                                            <option value="{{$types->type}}" @if(isset($bill) && ($bill->type == $types->type) || (old('type') == $types->type)) selected @endif>{{ucwords($types->type)}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('bill_no') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.bill_number')}}</label> {!! Form::text('bill_no', $bill->bill_no ? $bill->bill_no: old('bill_no'), ['class' => 'form-control', 'id' => 'bill_no']) !!} {!! $errors->first('bill_no','
                                    <label class="error" for="bill_no">:message</label>')!!}
                                </div>
                            </div>
                            
                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('bill_date') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.bill_date')}}</label> {!! Form::date('bill_date', $bill->bill_date ? $bill->bill_date: old('bill_date'), ['class' => 'form-control', 'id' => 'bill_date']) !!} {!! $errors->first('bill_date',
                                    '
                                    <label class="error" for="bill_date">:message</label>')!!}
                                </div>
                            </div>
                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('po_no') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.po_number')}}</label> {!! Form::text('po_no', $bill->po_no ? $bill->po_no: old('po_no'), ['class' => 'form-control', 'id' => 'po_no']) !!} {!! $errors->first('po_no','
                                    <label class="error" for="po_no">:message</label>')!!}
                                </div>
                            </div>
                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('po_date') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.po_date')}}</label> {!! Form::date('po_date', $bill->po_date ? $bill->po_date: old('po_date'), ['class' => 'form-control', 'id' => 'po_date']) !!} {!! $errors->first('po_date','
                                    <label class="error" for="po_date">:message</label>')!!}
                                </div>
                            </div>
                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('bill_amount') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.bill_amount')}} ({{trans('bill/bill.including_gst')}})</label> {!! Form::text('bill_amount', $bill->bill_amount ? $bill->bill_amount: old('bill_amount'), ['class' => 'form-control', 'id' => 'bill_amount', 'onblur'=>'calculateVariance.call(this)']) !!} {!! $errors->first('bill_amount',
                                    '
                                    <label class="error" for="bill_amount">:message</label>')!!}
                                </div>
                            </div>
                            <div class="col-md-6 col-12 mt-2">
                                <div class="form-group {{{ $errors->has('gst_amount') ? 'has-error' : '' }}}">
                                    <label class="form-label required">{{trans('bill/bill.gst_amount')}}</label> {!! Form::text('gst_amount', $bill->gst_amount ? $bill->gst_amount: old('gst_amount'), ['class' => 'form-control', 'id' => 'gst_amount']) !!} {!! $errors->first('gst_amount','
                                    <label class="error" for="gst_amount">:message</label>')!!}
                                </div>
                            </div>
                        </div>
                        
                        <div class="row mt-2">
                            <div class="col-md-6 col-12 mt-2">
                                <label class="form-label">{{trans('bill/bill.attachment')}} <span style="color:grey">({{trans('bill/bill.can_attach_more_than_one')}})</span></label> 
                                <br><p style="font-size: 0.857rem;"><i>{{ trans('common/common.attachmentCaption') }}</i></p>
                                <div class="form-group {{{ $errors->has('attachments.*') || $errors->has('attachments') ? 'has-error' : '' }}}">
                                    {!! $errors->first('attachments', '<label class="error" for="attachments">:message</label>')!!}
                                    {!! $errors->first('attachments.*', '<label class="error" for="attachments[]">:message</label>')!!}
                                    <div class="row">
                                        <div class="col-md-6">
                                            <button type="button" id="add_more" class="btn btn-primary" style="line-height:15px;"><i class="fa fa-plus" aria-hidden="true"></i>{{trans('bill/bill.add_attachment')}}</button>
                                        </div>
                                    </div>
                                    @if($bill->attachments)
                                        @foreach($bill->getMedia('attachments') as $attachment)
                                        <div style="display:inline-block; position:relative; margin: 7px 7px 0 0;">
                                                @if($attachment->mime_type=="application/msword" || $attachment->mime_type=="appplication/docx" || $attachment->mime_type=="appplication/doc")
                                                    <a href="{{$attachment->getUrl()}}" target="_blank"><img src="/assets/img/docx-icon.jpg" alt="attachment" style="height: 200px; width:200px; object-fit: contain;"></a> 
                                                @elseif($attachment->mime_type=="application/pdf")
                                                    <a href="{{$attachment->getUrl()}}" target="_blank"><img src="/assets/img/pdf-icon.jpg" alt="attachment" style="height: 200px; width:200px; object-fit: contain;"></a> 
                                                @else
                                                    <a href="{{$attachment->getUrl()}}" target="_blank"><img src="{{$attachment->getUrl()}}" alt="attachment" style="height: 200px; width:200px; object-fit: contain;"></a> 
                                                @endif
                                                <p class="text-center">{{$attachment->file_name}}</p>
                                                <a onclick="delAttached.call(this,{{$attachment->id}})" style='cursor:pointer; color:red; position: absolute; right: 5px; top: 5px' title="Delete Image"> <i class="fa fa-times-circle" style="font-size:18px;"></i></a>
                                            </div>
                                        @endforeach
                                    @endif
                                </div>
                            </div>
                        </div>
                        
                        <div class="row" id="listingDiv">
                            <div class="col-md-12 mt-4">
                                <div class="card-datatable">
                                    <table class="dt-column-search table dataTable  table-responsive d-table" id="organization" >
                                        <thead>
                                                <th>{{trans('common/common.id')}}</th>
                                                <th>{{trans('bill/bill.employee_type')}}</th>
                                                <th>{{trans('bill/bill.employee_code')}}</th>
                                                <th>{{trans('bill/bill.name')}}</th>
                                                <th>{{trans('bill/bill.gross_amount')}}</th>
                                        </thead>
                                        <tbody></tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="row" id="varianceDiv">
                            <div class="col-md-12 d-flex justify-content-end mt-2">
                                <p style="font-size: 18px;">{{trans('bill/bill.variance')}}: <span id="variance" style="font-weight:500;">0</span></p>
                            </div>
                        </div>
                        <input type="hidden" name="total_gross" id="total_gross" value=0 />
                        <input type="hidden" name="deleted_attachemnts" id="deleted_attachemnts" value=[] />
                        
                        <div class="row float-right">
                            <div class="col-12 mt-2">
                                <button type="submit" id="save-form" class="btn btn-primary me-1">{{trans('common/common.save')}}</</button> 
                            </div>
                        </div>        
                </div>
            </div>
        </div>
    </div>
</section>
{!! Form::close() !!} 
<!-- Basic Floating Label Form section end -->

@endsection 

@push('footer-script')

<!-- BEGIN: Page Vendor JS-->
<script src="/app-assets/vendors/js/forms/wizard/bs-stepper.min.js"></script>
<script src="/app-assets/vendors/js/forms/select/select2.full.min.js"></script>
<script src="/app-assets/vendors/js/forms/validation/jquery.validate.min.js"></script>
<script src="/app-assets/vendors/js/pickers/flatpickr/flatpickr.min.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.date.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/picker.time.js"></script>
<script src="/app-assets/vendors/js/pickers/pickadate/legacy.js"></script>
<!-- END: Page Vendor JS-->
<script src="/app-assets/vendors/js/tables/datatable/jquery.dataTables.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/dataTables.bootstrap5.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/dataTables.responsive.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/responsive.bootstrap5.js"></script>
<script src="/app-assets/js/scripts/ui/ui-feather.js"></script>
<script src="/assets/js/moment.min.js"></script>
<script src="/assets/js/daterangepicker.js"></script>

<script src="/app-assets/vendors/js/tables/datatable/datatables.checkboxes.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/datatables.buttons.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/jszip.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/pdfmake.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/vfs_fonts.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/buttons.html5.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/buttons.print.min.js"></script>
<script src="/app-assets/vendors/js/tables/datatable/dataTables.rowGroup.min.js"></script>
<script src="/app-assets/vendors/js/extensions/toastr.min.js"></script>
<script src="/app-assets/js/scripts/tables/table-datatables-basic.js"></script>
<script src="/app-assets/js/scripts/tables/table-datatables-advanced.js"></script>
<!-- BEGIN: Page JS-->
<script src="/app-assets/js/scripts/forms/form-wizard.js"></script>
<script src="/app-assets/js/scripts/forms/form-validation.js"></script>
<script src="/app-assets/js/scripts/forms/pickers/form-pickers.js"></script>

<script src="/assets/plugins/bower_components/bootstrap-select/bootstrap-select.min.js"></script>

<!-- END: Page JS-->

<script>
    $(document).ready(function() {
        showListing();
        @if(Auth::user()->is_contractor==1 && !isset($bill->id))
            getType();
        @endif
        // callDt();
        calculateVariance();
    });
    var imagesPreview = function(input, placeToInsertImagePreview) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(event) {
                var extension = input.files[0].name.split('.').pop().toLowerCase();
                if(extension == "pdf"){
                    $($.parseHTML('<img src="/assets/img/pdf-icon.jpg" style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> '+feather.icons['x'].toSvg({ class: 'font-4' })+'</a><p class="text-center">'+input.files[0].name+'</p>')).appendTo(placeToInsertImagePreview);
                }
                else if(extension == "docx" || extension=="doc"){
                    $($.parseHTML('<img src="/assets/img/docx-icon.jpg" style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> '+feather.icons['x'].toSvg({ class: 'font-4' })+'</a><p class="text-center">'+input.files[0].name+'</p>')).appendTo(placeToInsertImagePreview);
                }
                else{
                    $($.parseHTML('<img style="height:200px; width:200px; object-fit: contain;"> <a onclick="deleteAttachment.call(this)" style="cursor:pointer; color:red; position: absolute; right: 5px; top: 5px" title="Delete Image"> '+feather.icons['x'].toSvg({ class: 'font-4' })+'</a><p class="text-center">'+ input.files[0].name+'</p>')).attr('src', event.target.result).appendTo(placeToInsertImagePreview);
                }
            }
            reader.readAsDataURL(input.files[0]);
        }
    };

    function delAttached(attachment){
        $(this).parent().remove();
        var val = JSON.parse($('#deleted_attachemnts').val());
        val.push(attachment);
        $('#deleted_attachemnts').val(JSON.stringify(val));
    }

    function deleteAttachment(){
        $(this).parent().remove();
    }

    function preview() {
        imagesPreview(this, $(this).closest('div'));
    }

    $('#add_more').click(function(e){
        var temp = $(this).parent().parent().parent().append("<div style='display:inline-block; position:relative; margin: 7px 7px 0 0;'><input type='file' style='display:none;' class='fileinput form-control attachments' name='attachments[]' data-filename-placement='inside' title='Browse' onchange='preview.call(this)' /></div>");
        var result = temp.find('div:last input').trigger('click');
    });

    function showListing(){
        $('#listingDiv').hide();
        if($('#type').val()=='manpower' && $('#contractor_id').val()!=''){
            $('#listingDiv').show();
            var id = $('#contractor_id').val();
            var month_id = $('#month_id').val();
            var year_id = $('#year_id').val();
            $.ajax({
                url: "/{{$alias}}/contractual/bill/list",
                type: "GET",
                method: "GET",
                data: {
                    'contractor_id': id,
                    'month_id': month_id,
                    'year_id': year_id,
                },
                success: function(dataResult){
                    if(dataResult!=null){
                        var sum=0;
                        var temp ='';
                        dataResult.forEach(function(val, index){
                            temp+='<tr><td>'+(index+1)+'</td><td>'+val.employee_type+'</td><td>'+val.employee_code+'</td><td>'+val.name+'</td><td>';
                            var gross = 0;
                            if(val.salary_slip!=null){
                                gross = val.salary_slip.total_gross;
                            }else{
                                gross = 0;
                            }
                            temp+= gross+'</td></tr>';
                            sum+=gross;
                        });
                        $('#total_gross').val(sum);
                        $("#organization").DataTable().destroy();
                        $('#listingDiv tbody').html(temp);
                        callDt();
                        calculateVariance();
                    }
                }
            });
        }
        calculateVariance();

    }
    function getType(){
        var contractor_id = $('#contractor_id').val();
        if(contractor_id!=''){
            $.ajax({
                url: "/{{$alias}}/contractual/getBillType",
                type: "GET",
                method: "GET",
                data: {
                    'contractor_id': contractor_id,
                },
                success: function(dataResult){
                    if(dataResult!=null){
                        var temp ='<option value="">Select Type</option>';
                        dataResult.forEach(function(val, index){
                            temp += ('<option value="'+val.type+'" @if(isset($bill) && ($bill->type == "'+val.type+'") || (old("type") == "'+val.type+'")) selected @endif>'+ val.type.charAt(0).toUpperCase() + val.type.slice(1) + '</option>');
                        });
                        $('#type').html(temp);
                        showListing();
                    }
                }
            });
        }
    }


    function calculateVariance(){
        $('#varianceDiv').hide();
        var billAmount = $('#bill_amount').val();
        var sum = $('#total_gross').val();
        var type = $('#type').val();
        if(billAmount!='' && billAmount!=0 && type=='manpower'){
            $('#variance').html(billAmount-sum);
            $('#varianceDiv').show();
        }
    }

    // function callDt(){

            
    //     $('#listing').DataTable({ 
    //         orderCellsTop: true,
    //             language: {
    //                 paginate: {
    //                 // remove previous & next text from pagination
    //                 previous: '&nbsp;',
    //                 next: '&nbsp;'
    //                 }
    //             },
    //         dom: '<"card-header border-bottom p-1"<"head-label"><"dt-action-buttons text-end"B>><"d-flex justify-content-between align-items-center mx-0 row"<"col-sm-12 col-md-6"l><"col-sm-12 col-md-6"f>>t<"d-flex justify-content-between mx-0 row"<"col-sm-12 col-md-6"i><"col-sm-12 col-md-6"p>>',
    //         buttons: [
    //             {
    //             extend: 'copy',
    //         },
    //         {
    //             extend: 'csv',orientation:"landscape",
    //         },
    //         {
    //             extend: 'excel',orientation:"landscape",
    //         },
    //         {
    //             extend: 'pdf',orientation:"landscape",
    //         }],
    //         "ordering": true,
    //         "info":     true, 
    //     }); 
    // }
    function callDt() {
        var dt_filter_table = $('.dt-column-search'); 

            if ($('body').attr('data-framework') === 'laravel') {
                assetPath = $('body').attr('data-asset-path');
            }
            if (dt_filter_table.length) {
        
                // Setup - add a text input to each footer cell
                $('.dt-column-search thead tr').clone(true).appendTo('.dt-column-search thead');
                $('.dt-column-search thead tr:eq(1) th').each(function (i) {
                var title = $(this).text();
                $(this).html('<input type="text" class="form-control form-control-sm" placeholder="Search ' + title + '" />');

                $('input', this).on('keyup change', function () {
                    if (dt_filter.column(i).search() !== this.value) {
                    dt_filter.column(i).search(this.value).draw();
                    }
                });
                });

                var dt_filter = dt_filter_table.DataTable({
                
                dom: '<"card-header border-bottom p-1"<"head-label"><"dt-action-buttons text-end"B>><"d-flex justify-content-between align-items-center mx-0 row"<"col-sm-12 col-md-6"l><"col-sm-12 col-md-6"f>>t<"d-flex justify-content-between mx-0 row"<"col-sm-12 col-md-6"i><"col-sm-12 col-md-6"p>>',
                orderCellsTop: true,
                language: {
                    paginate: {
                    // remove previous & next text from pagination
                    previous: '&nbsp;',
                    next: '&nbsp;'
                    }
                },
                buttons: [{
                    extend: 'collection',
                    className: 'btn btn-outline-secondary dropdown-toggle me-2',
                    text: feather.icons['share'].toSvg({ class: 'font-small-4 me-50' }) + '{{trans('common/common.export')}}',
                    buttons: [
                        {
                            extend: 'print',
                            {{--filename: '{{$organization->name}} {{$title}}, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
                            title: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',--}}
                            text: feather.icons['printer'].toSvg({ class: 'font-small-4 me-50' }) + "{{trans('common/common.export')}}",
                            className: 'dropdown-item',
                            exportOptions: { columns: Array.from(Array($("#organization th").length/2 -1).keys()) },
                        },
                        {
                            extend: 'csv',
                            {{--filename: '{{$organization->name}} {{$title}}, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
                            title: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',--}}
                            text: feather.icons['file-text'].toSvg({ class: 'font-small-4 me-50' }) + "{{trans('common/common.csv')}}",
                            className: 'dropdown-item',
                            exportOptions: { columns: Array.from(Array($("#organization th").length/2 -1).keys()) },
                        },
                        {
                            extend: 'excel',
                           {{-- filename: '{{$organization->name}} {{$title}}, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
                            title: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',--}}
                            text: feather.icons['file'].toSvg({ class: 'font-small-4 me-50' }) + "{{trans('common/common.excel')}}",
                            className: 'dropdown-item',
                            exportOptions: { columns: Array.from(Array($("#organization th").length/2 -1).keys()) },
                        },
                        {
                            extend: 'pdf',
                            {{--filename: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',
                            title: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',--}}
                            text: feather.icons['clipboard'].toSvg({ class: 'font-small-4 me-50' }) + "{{trans('common/common.pdf')}}",
                            className: 'dropdown-item',
                            exportOptions: { columns: Array.from(Array($("#organization th").length/2 -1).keys()) },
                                customize: function(doc) {
                                    doc['footer']=(function() {
                                        return {
                                            columns: [
                                                {
                                                    alignment: 'center',
                                                    text: ['Downloaded by: ', { text: '{{Auth::user()->name}}' }, ' on {{ date("d-m-Y") }} at {{ date("g:i A") }}']
                                                }
                                            ],
                                            margin: 10
                                        }
                                    }); 
                                },
                            },
                        {
                        extend: 'copy',
                        {{-- filename: '{{$organization->name}} {{$title}}, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
                        title: '{{$organization->name}} {{$title}} - {{ date("d-m-Y H-i-s") }}',--}}
                        text: feather.icons['copy'].toSvg({ class: 'font-small-4 me-50' }) + "{{trans('common/common.copy')}}",
                        className: 'dropdown-item',
                        exportOptions: { columns: Array.from(Array($("#organization th").length/2 -1).keys()) }
                    }
                    ],
                    init: function (api, node, config) {
                        $(node).removeClass('btn-secondary');
                        $(node).parent().removeClass('btn-group');
                        setTimeout(function () {
                        $(node).closest('.dt-buttons').removeClass('btn-group').addClass('d-inline-flex');
                        }, 50);
                    }
                    },
                    
                ],
            });
            }
    }
            $(window).on('load', function() {
            if (feather) {
                feather.replace({
                    width: 14,
                    height: 14
                });
            }
        });
       

</script>
@endpush