<div style="text-align: center">
    <button type="button" class="btn btn-app search-data">
        <i class="fa fa-search"></i> Search
    </button>
    <button type="button" class="btn btn-app print-data">
        <i class="fa fa-print"></i> Print
    </button>
    <button type="button" class="btn btn-app" id="btn-excel">
        <i class="fa fa-file-excel-o"></i> Excel
    </button>
</div>
<br>
<div class="col-md-12 show-report" style=" width: 100%; background-color: #ffffff; padding: 20px; -webkit-box-shadow: 0px 6px 26px -6px rgba(0,0,0,0.48);
-moz-box-shadow: 0px 6px 26px -6px rgba(0,0,0,0.48);
box-shadow: 0px 6px 26px -6px rgba(0,0,0,0.48); border-radius: 5px;overflow: scroll;"></div>


<style>
    li.active a{
        background-color: #222d32 !important;
    }

    .table-data
    {
        width:100%;
    }

    .table-data,.table-data  th, .table-data  td
    {
        border-collapse:collapse;
        border: 1px solid #a8a8a8;
    }

    .table-data  th
    {
        text-align: center;
        padding: 5px;
    }

    .table-data  td
    {
        padding: 5px;
    }

    .table-data  tbody > tr:nth-child(odd)
    {
        background-color: #f4f4f4;
        color: #606060;
    }
    .show-report{
        max-height: 640px;
        min-height: 640px;
        overflow: auto;
    }
</style>





<!-- when the form is submitted, the server response will appear in this iframe -->
<iframe style="width: 100%; display: none" name="my_iframe" src="" id="my_iframe_id"> </iframe>

<script>
    var report_url = '';
    $(function () {

        $('#select').on('change', function(e){
            e.preventDefault();
            var data = $('#select option:selected');

            report_url = data.val();
            //report_url = $(this).data('href');
            //alert(report_url);
        });

        $('.print-data').on('click',function () {
            printDiv();
        });
        $('.search-data').on('click', function (e) {
            e.preventDefault();

            //console.log(from_date,to_date,q,emp_id,department_id,duty_station_id,position_id,finger_print_no,emp_status);
            if(report_url != '') {

                var emp_id = $('[name="employee[]"]').val();
                var from_date = $('[name="from_date"]').val();
                var to_date = $('[name="to_date"]').val();
                var month = $('[name="month"]').val();

                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                $.ajax({
                    url: report_url,
                    type: 'POST',
                    async: false,
                    dataType: 'html',
                    data: {
                        emp_id: emp_id,
                        from_date: from_date,
                        to_date: to_date,
                        month: month

                    },
                    success: function (d) {
                        $('.show-report').html(d);
                    },
                    error: function (d) {
                        alert('Please select type first!');
                        $('.my-modal').hide();
                    }
                });

            } else {
                alert('Please click the report type');
            }


        });



    });

    function printDiv()
    {

        var divToPrint=document.getElementById('DivIdToPrint');

        var newWin=window.open('','Print-Window');

        newWin.document.open();

        newWin.document.write('<html>' +
            '<head>' +
            '<style>\n' +
            '    .table-data\n' +
            '    {\n' +
            '        width:100%;\n' +
            '    }\n' +
            '\n' +
            '    .table-data,.table-data  th, .table-data  td\n' +
            '    {\n' +
            '        border-collapse:collapse;\n' +
            '        border: 1px solid #a8a8a8;\n' +
            '    }\n' +
            '\n' +
            '    .table-data  th\n' +
            '    {\n' +
            '        text-align: center;\n' +
            '        padding: 5px;\n' +
            '    }\n' +
            '\n' +
            '    .table-data  td\n' +
            '    {\n' +
            '        padding: 5px;\n' +
            '    }\n' +
            '\n' +
            '    .table-data  tbody > tr:nth-child(odd)\n' +
            '    {\n' +
            '       background-color: #f4f4f4;\n' +
            '        color: #606060;\n' +
            '    }\n' +
            '</style>' +
            '</head>'+
            '<body onload="window.print()">'+divToPrint.innerHTML+'</body>' +
            '</html>');

        newWin.document.close();

        setTimeout(function(){newWin.close();},10);

    }

    function exportTableToExcel(tableID, filename = '')
    {

        var downloadLink;
        var dataType = 'application/vnd.ms-excel';
        var tableSelect = document.getElementById(tableID);
        var tableHTML = tableSelect.outerHTML.replace(/ /g, '%20');
        // Specify file name
        filename = filename?filename+'.xls':'excel_data.xls';

        // Create download link element
        downloadLink = document.createElement("a");

        document.body.appendChild(downloadLink);

        if(navigator.msSaveOrOpenBlob){
            var blob = new Blob(['\ufeff', tableHTML], {
                type: dataType
            });
            navigator.msSaveOrOpenBlob( blob, filename);
        }else{
            // Create a link to the file
            downloadLink.href = 'data:' + dataType + ', ' + tableHTML;

            // Setting the file name
            downloadLink.download = filename;

            //triggering the function
            downloadLink.click();
        }
    }
</script>
<script>
    $(document).ready(function () {
        $("#btn-excel").click(function (e) {

            $(".show-report").find('img').each(function () {
                $(this).remove();
            });
            var h = $(".show-report").html();

            var contents = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">' +
                '<head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>data</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->' +
                '<meta content="Content-Type:application/vnd.ms-excel; charset=utf-8"/>' +
                '</head>' +
                '<body>'+$(".show-report").html()+'</body>' +
                '</html>';
            //window.open('data:application/vnd.ms-excel;file-name=x.xls;charset=utf-8,' + encodeURIComponent(contents));
            window.open('data:application/vnd.ms-excel;file-name=x.xls;charset=utf-8,' + encodeURIComponent(contents));
            // document.getElementById("my_iframe_id").href = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(contents);
            $('.view-excel').val(contents);
            $('.view-excel').prop('value',contents);
            $('.view-iframe').submit();

            e.preventDefault();


        });

        function getFormattedTime() {
            var today = new Date();
            var y = today.getFullYear();
            var m = today.getMonth();
            var d = today.getDate();
            var h = today.getHours();
            var m = today.getMinutes();
            var s = today.getSeconds();
            return y + "-" + m + "-" + d + "-" + h + "-" + m + "-" + s;
        }
    });
</script>
<a id="dlink"  style="display:none;"></a>




<?php /**PATH /home/nsowos/public_html/shr-brand/resources/views/hr/report-hr/main-script.blade.php ENDPATH**/ ?>