@extends('app-new')

@push('head-script')
<!-- BEGIN: Vendor CSS-->
<link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/extensions/toastr.min.css">
<!-- END: Vendor CSS-->

<!-- BEGIN: Page CSS-->
<link rel="stylesheet" type="text/css" href="/app-assets/css/style.css">
<link rel="stylesheet" type="text/css" href="../../../app-assets/css/pages/page-profile.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">ESI Report View</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{url('')}}/{!! $alias !!}/home">Home</a>
                    </li>
                    <li class="breadcrumb-item"><a href="{{url('')}}/{!! $alias !!}/esi-reports">ESI Report</a>
                    </li>
                    <li class="breadcrumb-item active">ESI Report View
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush
@section('content')
<section id="dashboard-ecommerce">
    <div class="row ">
        <div class="col-xl-12 col-md-12 col-12">
            <div class="card">
                <div class="table-responsive">
                         <table class="table mb-0" id="organization">
                            <thead>
                                <tr>
                                    <th scope="col" class="text-nowrap">IP NO</th>
                                    <th scope="col" class="text-nowrap">IP NAME</th>
                                    <th scope="col" class="text-nowrap">PAID DAYS</th>
                                    <th scope="col" class="text-nowrap">TOTAL GROSS</th>
                                    <th scope="col" class="text-nowrap"> Last Working Day</th>
                                    
                                </tr>
                            </thead>
                          <tbody>

                            @foreach($data as $value)
                                    <tr>
                                        <td class="text-nowrap">{{$value['esic_no']}}</td> 
                                        <td class="text-nowrap">{{$value['name']}}</td>
                                        <td class="text-nowrap">{{$value['total_paid_days']}}</td>
                                        <td class="text-nowrap">{{$value['net_salary']}}</td>
                                        <td class="text-nowrap">{{$value['lastdays']}}</td>
                                    </tr>
                            @endforeach
                        </tbody>
                    </table>
                    <br>
                    </div>


            </div>
        </div>
        
   
    </div>


</section>
@endsection

@push('footer-script')
   <!-- BEGIN: 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/vendors/js/pickers/flatpickr/flatpickr.min.js"></script>
    <script src="/app-assets/js/scripts/ui/ui-feather.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>
    <!-- END: Page Vendor JS-->
    <script src="/app-assets/vendors/js/extensions/toastr.min.js"></script>
    <!-- BEGIN: Page JS-->
    <script src="/app-assets/js/scripts/tables/table-datatables-basic.js"></script>
    <script src="/app-assets/js/scripts/tables/table-datatables-advanced.js"></script>
<script>
$(document).ready(function() {
    
    $('#organization').DataTable({ 
   // language: { search: "" },
    // 'aoColumnDefs': [{
    //     'bSortable': false,
    //     'aTargets': [-1],
    // }],
        dom: 'fBitp',
      buttons: [
        { 
            extend: 'excel',
            filename: '{{$organization->name}} PF Report, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
            title: '{{$organization->name}} PF Report - {{$month}} {{$year}}',
            text: '  Export to Excel',
            className: 'btn btn-primary waves-effect waves-float waves-light',
        },
        { 
            extend: 'pdf',
            filename: '{{$organization->name}} PF Report, {{Auth::user()->name}} - {{ date("d-m-Y H-i-s") }}',
            title: '{{$organization->name}} PF Report - {{$month}} {{$year}}',
            text: 'Export to pdf',
            className: 'btn btn-primary waves-effect waves-float waves-light',
            orientation : 'landscape',
            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
                    }
                }); 
            },
        }
    ],
    "language": {
        search: '', searchPlaceholder: "Search...",
    },
    'olanguage': { 'sSearch': '', 'sSearchPlaceholder': "Search" },
    "ordering": true,
    "info":     true, 
    }); 

    });
</script>
<style type="text/css">
.form-control-sm {
    display: none;
}
.dt-buttons {
    bottom-left: 28px;
    margin-left: 10px;
}
</style>

@endpush