{{ View::make('layout.header') }}

<style>

    table {

        border: hidden;

    }



    a.disable {

        pointer-events: none;

    }



    /* tbody {

        text-align: center !important;

    } */



    table.dataTable thead .sorting:before,

    table.dataTable thead .sorting_asc::after,

    table.dataTable thead .sorting_desc::after,

    table.dataTable thead .sorting:after,

    table.dataTable thead .sorting_asc:before,

    table.dataTable thead .sorting_desc:before {

        display: none;

    }

</style>

<!-- BEGIN: Content-->

<div class="app-content content ">

    <div class="content-overlay"></div>

    <div class="header-navbar-shadow"></div>

    <div class="content-wrapper">

        <div class="content-header row">

            <div class="content-header-left col-md-9 col-12 mb-2">

                <div class="row breadcrumbs-top">

                    <div class="col-12">

                        <div class="breadcrumb-wrapper">

                            <ol class="breadcrumb mt-3">

                                <li class="breadcrumb-item">E-Leave

                                </li>

                                <li class="breadcrumb-item ">Settings

                                </li>

                                <li class="breadcrumb-item active"><a href="{{ route('reports.attendance-summary') }}">

                                        SQL Payroll</a>

                                </li>

                            </ol>

                        </div>

                    </div>

                </div>

            </div>

        </div>

        <div class="content-body">

            <section id="dashboard-ecommerce">

                <div class="row match-height">

                    <div class="col-md-12">

                        <div class="card">



                            <div class="card-header" style="">

                                <div class="">

                                    <button onclick="more_filter()"

                                        class="btn btn-primary waves-effect waves-float waves-light"

                                        style="">Filter</button>

                                </div>



                            </div>

                            <div class="card activity filter-container"

                                style="margin: 0px 15px; background-color:#e6e5e5; padding:10px 20px 20px 20px; display:none !important;"

                                id="empleavetoday">

                                <div class="row">

                                    <div class="col-md-12" style="padding:0px;">

                                        <button id="spanclose" onclick="more_filter()"

                                            style="float:right;border:0px;background-color:transparent;color:white;padding: 3px 8px 5px;">

                                            <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14"

                                                viewBox="0 0 24 24" fill="none" stroke="currentColor"

                                                stroke-width="2" stroke-linecap="round" stroke-linejoin="round"

                                                class="feather feather-x cursor-pointer font-large-1"

                                                data-repeater-delete="">

                                                <line x1="18" y1="6" x2="6" y2="18">

                                                </line>

                                                <line x1="6" y1="6" x2="18" y2="18">

                                                </line>

                                            </svg>

                                        </button>

                                    </div>

                                </div>

                                <div class="row">

                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Department &nbsp;:&nbsp;

                                        <select name="department" id="department" class="form-control">

                                            <option value="">Department</option>

                                            @foreach ($departments as $department)

                                                <option value="{{ $department->id }}">{{ $department->name }}</option>

                                            @endforeach

                                        </select>

                                    </div>

                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Branch &nbsp;:&nbsp;

                                        <select name="branch" id="branch" class="form-control">

                                            <option value="">Branch</option>

                                            @foreach ($branches as $branch)

                                                <option value="{{ $branch->id }}">{{ $branch->name }}</option>

                                            @endforeach

                                        </select>

                                    </div>

                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Category &nbsp;:&nbsp;

                                        <select name="category" id="category" class="form-control">

                                            <option value="">Category</option>

                                            @foreach ($categories as $category)

                                                <option value="{{ $category->id }}">{{ $category->name }}</option>

                                            @endforeach

                                        </select>

                                    </div>





                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Date From &nbsp;:

                                        <input type="date" name="sdatefrom" id="sdatefrom"

                                            class="tcal form-control flatpickr-basic" placeholder="DD-MM-YYYY"

                                            data-dateformat="dd-mm-yy">

                                    </div>

                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Date To &nbsp;:<span class="red">*</span>&nbsp;

                                        <input type="date" name="sdateto" id="sdateto"

                                            class="tcal form-control flatpickr-basic" placeholder="DD-MM-YYYY"

                                            data-dateformat="dd-mm-yy">

                                    </div>

                                    <div class="col-sm-3 filter-form-group mb-1">

                                        Schedule &nbsp;:&nbsp;

                                        <select name="schedule" id="schedule" class="form-control">

                                            <option value="">Schedule</option>

                                            @foreach ($schedules as $schedule)

                                                <option value="{{ $schedule->id }}">{{ $schedule->name }}</option>

                                            @endforeach

                                        </select>

                                    </div>



                                    <div class="col-sm-6 filter-form-group" style="margin-top:19px;">

                                        <input type="button" value="Apply" onclick="getfilterdata();"

                                            class="filter-apply btn btn-info" />

                                    </div>

                                </div>

                            </div>





                            <div class="p-2">

                                <h1>SQL Payroll</h1>

                            </div>



                            <div class="card-body" style="padding-top:0px !important; ">





                                <ul class="nav nav-tabs nav-justified mt-1" id="myTab2" role="tablist"

                                    style="border-bottom: 1px solid #ebe9f1; border-radius: 0px;display:none;">

                                    <li class="nav-item">

                                        <a class="nav-link active" id="home-tab-justified" data-toggle="tab"

                                            href="#home-just" role="tab" aria-controls="home-just"

                                            aria-selected="true">Days</a>

                                    </li>

                                    <li class="nav-item">

                                        <a class="nav-link" id="profile-tab-justified" data-toggle="tab"

                                            href="#profile-just" role="tab" aria-controls="profile-just"

                                            aria-selected="true">Tardiness</a>

                                    </li>

                                    <li class="nav-item">

                                        <a class="nav-link" id="profile-tab-justified" data-toggle="tab"

                                            href="#work-just" role="tab" aria-controls="work-just"

                                            aria-selected="true">Work Hours & OT</a>

                                    </li>

                                </ul>



                                <!-- Tab panes -->

                                <div class="tab-content pt-1">

                                    <div class="tab-pane active" id="home-just" role="tabpanel"

                                        aria-labelledby="home-tab-justified">

                                        <div class="card" style="border: 0px;">

                                            <div class="card-header " style="padding-top:0px;">

                                                <div></div>

                                                <div class="d-flex align-items-right">

                                                    <!-- <div class="btn-group btn-align-right MiniRightnav">

                                                        <a onclick="exportpdf1()" class="text-danger"><i

                                                                class="fa fa-file-pdf-o report-download-btn"

                                                                style="font-size:25px;"></i><span>Download

                                                                PDF</span></a>

                                                        &nbsp;&nbsp;

                                                        <a onclick="exportexcel()" class="text-success"><i

                                                            class="fa fa-file-excel-o report-download-btn"

                                                            style="font-size:25px;"></i><span>Download

                                                            Excel</span></a>

                                                    &nbsp;&nbsp;             -->

                                                    <a onclick="exportexcelCSV()" class="text-success">

                                                        <!-- <img height="25", width="25" src="https://cdn-icons-png.flaticon.com/512/617/617449.png"/ > -->

                                                        <span>Leave CSV</span>
                                                    </a>
                                                    &nbsp;&nbsp;
                                                    <a onclick="exportShortCSV()" class="text-success">

                                                        <!-- <img height="25", width="25" src="https://cdn-icons-png.flaticon.com/512/617/617449.png"/ > -->

                                                        <span>Short CSV</span>
                                                    </a>
                                                    &nbsp;&nbsp;
                                                    <a onclick="exportOTCSV()" class="text-success">

                                                        <!-- <img height="25", width="25" src="https://cdn-icons-png.flaticon.com/512/617/617449.png"/ > -->

                                                        <span>OT CSV</span>
                                                    </a>
                                                &nbsp;&nbsp;

                                                        {{-- hide and show --}}

                                                        <div class="dropdown">

                                                            <button class="dropbtn fa fa-gear"></button>

                                                            <div id="myDropdown1" class="dropdown-content">



                                                            </div>

                                                        </div>

                                                    </div>

                                                </div>

                                            </div>

                                            <div class="card-body" style="padding:0px; ">

                                                <div class="col-md-12" style="padding:0px;">

                                                    <div class="table-responsive" style="padding: 0 15px 15px 15px;">

                                                        <table class="table table-bordered  my-leave-summary-entitle"

                                                            id="example1" style="font-size:12px;">

                                                            <thead>

                                                                <tr>

                                                                    <th

                                                                        style="text-align: left;text-transform: capitalize; padding: 5px !important;">

                                                                        No</th>

                                                                    <th

                                                                        style="text-align:left;text-transform: capitalize;">

                                                                        User</th>

                                                                    <th id="name-data"

                                                                        style="text-align:center;text-transform: capitalize; width: 30%;">

                                                                        Name</th>

                                                                    <th

                                                                        style="text-align:left;text-transform: capitalize;">

                                                                        Total Days</th>

                                                                    <th>

                                                                        <table width="100%;">

                                                                            <tr>

                                                                                <span

                                                                                    style="margin-left: 30%;">Normal</span>

                                                                            </tr>

                                                                            <tr>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:33% !important;">

                                                                                    Work</th>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:33% !important;">

                                                                                    Leave</th>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:33% !important;">

                                                                                    Absent</th>

                                                                            </tr>

                                                                        </table>

                                                                    </th>

                                                                    <th>

                                                                        <table width="100%;">

                                                                            <tr>

                                                                                <span

                                                                                    style="margin-left: 30%;">Holiday</span>

                                                                            </tr>

                                                                            <tr>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:50% !important;">

                                                                                    Work</th>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:50% !important;">

                                                                                    Absent</th>

                                                                            <tr>

                                                                        </table>

                                                                    </th>

                                                                    <th>

                                                                        <table width="100%;">

                                                                            <tr>

                                                                                <span

                                                                                    style="margin-left: 30%;">Restday</span>

                                                                            </tr>

                                                                            <tr>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize; width:50% !important;">

                                                                                    Work</th>

                                                                                <th

                                                                                    style="text-align:left;text-transform: capitalize;  width:50% !important;">

                                                                                    Absent</th>

                                                                            <tr>

                                                                        </table>

                                                                    </th>

                                                                </tr>



                                                            </thead>

                                                            <tbody>

                                                            </tbody>

                                                        </table>

                                                    </div>

                                                </div>

                                            </div>

                                        </div>

                                    </div>

                                    





                                    

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

            </section>

        </div>

    </div>

</div>

<!-- END: Content-->

{{ View::make('layout.footer') }}

@include('E-Attendance.edit_attendance')

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script type="text/javascript"></script>

<script type="text/javascript">

    var base_url = $('body').attr('data-baseurl') + '/e-attendance';

    $(document).ready(function() {

        getfilterdata();

    });







    function getfilterdata() {



        var sdatefrom = $("#sdatefrom").val();

        var sdateto = $("#sdateto").val();

        var schedule = $("#schedule").val();

        var day_type = $("#day_type").val();

        var category = $("#category").val();

        var branch = $("#branch").val();

        var department = $("#department").val();

        var in_out_filter = $("#in_out_filter").val();

        var apploginmodel = "{{ hasEattendanceEditAccess() ? '#inlineForm' : '' }}";

        var table1 = $('#example1').DataTable({

            "lengthMenu": [

                [20, 50, 100],

                [20, 50, 100]

            ],

            "order": [],

            "processing": true,

            // "ordering": false,

            "destroy": true,

            "serverSide": true,

            "ajax": {

                "url": "{!! route('reports.attendance-summary-data') !!}",

                "type": 'GET',

                "data": {

                    "user_type": "hr",

                    "sdatefrom": sdatefrom,

                    "sdateto": sdateto,

                    "schedule": schedule,

                    "day_type": day_type,

                    "category": category,

                    "branch": branch,

                    "department": department,

                    "in_out_filter": in_out_filter

                }

            },

            "deferRender": true,

            "columns": [{

                    data: 'index',

                    name: 'No',

                },

                {

                    data: 'employee_no',

                    name: 'User',

                },

                {

                    data: 'personname',

                    name: 'personname',

                },

                {

                    data: 'total_days',

                    name: 'Total Days',

                },

                {

                    name: 'Normal',

                    "render": function(data, type, row, meta) {

                        var text =

                            `<table style="width:100% !important;"><tr><td  style="width:33% !important;">${row.wp}</td><td  style="width:33% !important;">${row.leave}</td><td  style="width:33% !important;">${row.absent_days}</td></tr></table>`;

                        return text;



                    }

                },



                {

                    name: 'Holiday',

                    "render": function(data, type, row, meta) {

                        var text =

                            `<table style="width:100% !important;"><tr><td  style="width:50% !important;">${row.hp}</td><td style="width:50% !important;">${row.ha}</td></tr></table>`;

                        return text;



                    }

                },



                {

                    name: 'Restday',

                    "render": function(data, type, row, meta) {

                        var text =

                            `<table style="width:100% !important;"><tr><td style="width:50% !important;">${row.op}</td><td  style="width:50% !important;">${row.oa}</td></tr></table>`;

                        return text;



                    }

                }





            ],

            'rowCallback': function(row, data, index) {

                // $('td:eq(2)', row).css('width', '300px');

                $('table', row).css('border', 'hidden');

            },



            'columnDefs': [{

                "targets": [],

                "orderable": false

            }],



            "language": {

                "paginate": {

                    "previous": '&nbsp;',

                    "next": '&nbsp;'

                }

            },



        });



        // var table2 = $('#example2').DataTable({

        //     "lengthMenu": [

        //         [20, 50, 100],

        //         [20, 50, 100]

        //     ],

        //     "order": [],

        //     "processing": true,

        //     // "ordering": false,

        //     "destroy": true,

        //     "serverSide": true,

        //     "ajax": {

        //         "url": "{!! route('reports.attendance-summary-data') !!}",

        //         "type": 'GET',

        //         "data": {

        //             "user_type": "hr",

        //             "sdatefrom": sdatefrom,

        //             "sdateto": sdateto,

        //             "schedule": schedule,

        //             "day_type": day_type,

        //             "category": category,

        //             "branch": branch,

        //             "department": department,

        //             "in_out_filter": in_out_filter

        //         }

        //     },

        //     "deferRender": true,

        //     "columns": [{

        //             data: 'index',

        //             name: 'No',

        //         },

        //         {

        //             data: 'employee_no',

        //             name: 'employee_no',

        //         },

        //         {

        //             data: 'personname',

        //             name: 'personname',

        //         },



        //         {

        //             data: 'li',

        //             name: 'li',

        //         },



        //         {

        //             data: 'eo',

        //             name: 'eo',

        //         },



        //         {

        //             data: 'mp',

        //             name: 'mp'

        //         },



        //         {

        //             data: 'short',

        //             name: 'short'

        //         },

        //     ],

        //     'rowCallback': function(row, data, index) {

        //         // $('td:eq(2)', row).css('width', '120');

        //         $('table', row).css('border', 'hidden');



        //     },



        //     'columnDefs': [{

        //         "targets": [],

        //         "orderable": false

        //     }],



        //     "language": {

        //         "paginate": {

        //             "previous": '&nbsp;',

        //             "next": '&nbsp;'

        //         }

        //     },







        // });



        // var table3 = $('#example3').DataTable({

        //     "lengthMenu": [

        //         [20, 50, 100],

        //         [20, 50, 100]

        //     ],

        //     "order": [],

        //     "processing": true,

        //     // "ordering": false,

        //     "destroy": true,

        //     "serverSide": true,

        //     "ajax": {

        //         "url": "{!! route('reports.attendance-summary-data') !!}",

        //         "type": 'GET',

        //         "data": {

        //             "user_type": "hr",

        //             "sdatefrom": sdatefrom,

        //             "sdateto": sdateto,

        //             "schedule": schedule,

        //             "day_type": day_type,

        //             "category": category,

        //             "branch": branch,

        //             "department": department,

        //             "in_out_filter": in_out_filter

        //         }

        //     },

        //     "deferRender": true,

        //     "columns": [{

        //             data: 'index',

        //             name: 'No',

        //         },

        //         {

        //             data: 'employee_no',

        //             name: 'employee_no',

        //         },

        //         {

        //             data: 'personname',

        //             name: 'personname',

        //         },



        //         {

        //             data: 'workday',

        //             name: 'Workday',

        //         },

        //         {

        //             data: 'workdayOvertimeHours',

        //             name: 'workdayOvertimeHours',

        //         },

        //         {

        //             data: 'holydayHours',

        //             name: 'holydayHours'

        //         },

        //         {

        //             data: 'holydayOvertimeHours',

        //             name: 'holydayOvertimeHours'

        //         },



        //         {

        //             data: 'restday',

        //             name: 'restday'

        //         },

        //         {

        //             data: 'restdayOvertimeHours',

        //             name: 'restdayOvertimeHours'

        //         },

        //         {

        //             data: 'ot_approved',

        //             name: 'ApprovedOT'

        //         }

        //     ],

        //     'rowCallback': function(row, data, index) {

        //         // $('td:eq(2)', row).css('width', '120');

        //         $('table', row).css('border', 'hidden');



        //     },



        //     'columnDefs': [{

        //         "targets": [],

        //         "orderable": false

        //     }],



        //     "language": {

        //         "paginate": {

        //             "previous": '&nbsp;',

        //             "next": '&nbsp;'

        //         }

        //     },

        // });



        var columns1 = table1.settings().init().columns;

        for (let i = 0; i < columns1.length; i++) {

            //

            var dCol1 =

                `<div class="toggle-vis custom-control mt-1 ml-1 custom-control-success custom-checkbox"><input class='inp custom-control-input' data-column="${i}" key="{!! $c_key1 !!}" id="{!! $c_key1 !!}_${i}"  type="checkbox" checked><label for="{!! $c_key1 !!}_${i}" class="custom-control-label" style="cursor: pointer">${columns1[i].name}</label></div>`;

            $("#myDropdown1").append(dCol1);

        }



        // show hide and show data

        var daraArr1 = {!! json_encode($columnHideShowData1) !!}

        hidefun(table1, '{!! $c_key1 !!}', daraArr1);

        // -----------------



        var columns2 = table2.settings().init().columns;

        for (let i = 0; i < columns2.length; i++) {

            //

            var dCol2 =

                `<div class="toggle-vis custom-control mt-1 ml-1 custom-control-success custom-checkbox"><input class='inp custom-control-input' data-column="${i}" key="{!! $c_key2 !!}" id="{!! $c_key2 !!}_${i}"  type="checkbox" checked><label for="{!! $c_key2 !!}_${i}" class="custom-control-label" style="cursor: pointer">${columns2[i].name}</label></div>`;

            $("#myDropdown2").append(dCol2);

        }



        // show hide and show data

        var daraArr2 = {!! json_encode($columnHideShowData2) !!}

        hidefun(table2, '{!! $c_key2 !!}', daraArr2);



        // ---------------



        var columns3 = table3.settings().init().columns;

        for (let i = 0; i < columns3.length; i++) {

            //

            var dCol3 =

                `<div class="toggle-vis custom-control mt-1 ml-1 custom-control-success custom-checkbox"><input class='inp custom-control-input' data-column="${i}" key="{!! $c_key3 !!}" id="{!! $c_key3 !!}_${i}"  type="checkbox" checked><label for="{!! $c_key3 !!}_${i}" class="custom-control-label" style="cursor: pointer">${columns3[i].name}</label></div>`;

            $("#myDropdown3").append(dCol3);

        }



        // show hide and show data

        var daraArr3 = {!! json_encode($columnHideShowData3) !!}

        hidefun(table3, '{!! $c_key3 !!}', daraArr3);



    }



    // excel download option



    function exportexcel() {

        var exportdata = [];

        $('.singleSelectBox').each(function() {

            if ($(this).is(":checked")) {

                exportdata.push($(this).val());

            }

        });

        exportdata = exportdata.toString();



        var branch = $("#branch").val();

        var department = $("#department").val();

        var category = $("#category").val();

        var random = Math.random();

        let url = "attendance-summary-excel?branch=" + branch + "&department=" + department + "&category=" + category +

            "&exportdata=" + exportdata + "&random="+random;



        window.location.href = url;



    }



    function exportexcelCSV() {

        var exportdata = [];

        $('.singleSelectBox').each(function() {

            if ($(this).is(":checked")) {

                exportdata.push($(this).val());

            }

        });

        exportdata = exportdata.toString();



        var branch = $("#branch").val();

        var department = $("#department").val();

        var category = $("#category").val();

        var random = Math.random();
        var sdatefrom = $("#sdatefrom").val();
        var sdateto = $("#sdateto").val();
        let url = "{{url('/e-leave/sql-payroll')}}/export-as-csv?branch=" + branch + "&department=" + department + "&category=" + category +

            "&exportdata=" + exportdata + "&random="+random+"&sdatefrom="+sdatefrom+"&sdateto="+sdateto;
        window.location.href = url;



    }

    function exportShortCSV() {
        var exportdata = [];
        $('.singleSelectBox').each(function() {
            if ($(this).is(":checked")) {
                exportdata.push($(this).val());
            }
        });
        exportdata = exportdata.toString();
        var branch = $("#branch").val();
        var department = $("#department").val();
        var category = $("#category").val();
        var random = Math.random();
        var sdatefrom = $("#sdatefrom").val();
        var sdateto = $("#sdateto").val();
        let url = "{{url('/e-leave/sql-payroll')}}/export-as-shortcsv?branch=" + branch + "&department=" + department + "&category=" + category +

            "&exportdata=" + exportdata + "&random="+random+"&sdatefrom="+sdatefrom+"&sdateto="+sdateto;
        window.location.href = url;
    }
    function exportOTCSV() {
        var exportdata = [];
        $('.singleSelectBox').each(function() {
            if ($(this).is(":checked")) {
                exportdata.push($(this).val());
            }
        });
        exportdata = exportdata.toString();
        var branch = $("#branch").val();
        var department = $("#department").val();
        var category = $("#category").val();
        var random = Math.random();
        var sdatefrom = $("#sdatefrom").val();
        var sdateto = $("#sdateto").val();
        let url = "{{url('/e-leave/sql-payroll')}}/export-as-otcsv?branch=" + branch + "&department=" + department + "&category=" + category +

            "&exportdata=" + exportdata + "&random="+random+"&sdatefrom="+sdatefrom+"&sdateto="+sdateto;
        window.location.href = url;
    }



    // excel download option



    function exportpdf1() {

        var exportdata = [];

        $('.singleSelectBox').each(function() {

            if ($(this).is(":checked")) {

                exportdata.push($(this).val());

            }

        });

        exportdata = exportdata.toString();

        var branch = $("#branch").val();

        var department = $("#department").val();

        var category = $("#category").val();

        var random = Math.random();

        let url = "attendance-summary-pdf?branch=" + branch + "&department=" + department + "&category=" + category +

            "&type=1" +

            "&exportdata=" + exportdata + "&random="+random;

        window.location.href = url;



    }



    function exportpdf2() {

        var exportdata = [];

        $('.singleSelectBox').each(function() {

            if ($(this).is(":checked")) {

                exportdata.push($(this).val());

            }

        });

        exportdata = exportdata.toString();

        var branch = $("#branch").val();

        var department = $("#department").val();

        var category = $("#category").val();

        var random = Math.random();

        let url = "attendance-summary-pdf?branch=" + branch + "&department=" + department + "&category=" + category +

            "&type=2" +

            "&exportdata=" + exportdata + "&random="+random;

        window.location.href = url;



    }



    function exportpdf3() {

        var exportdata = [];

        $('.singleSelectBox').each(function() {

            if ($(this).is(":checked")) {

                exportdata.push($(this).val());

            }

        });

        exportdata = exportdata.toString();

        var branch = $("#branch").val();

        var department = $("#department").val();

        var category = $("#category").val();

        var random = Math.random();

        let url = "attendance-summary-pdf?branch=" + branch + "&department=" + department + "&category=" + category +

            "&type=3" +

            "&exportdata=" + exportdata + "&random="+random;

        window.location.href = url;



    }



    // pdf download option







    var x = document.getElementById("empleavetoday");

    x.style.display = "none";



    function more_filter() {

        var x = document.getElementById("empleavetoday");

        if (x.style.display === "none") {

            x.style.display = "block";

        } else {

            x.style.display = "none";

        }

    }

</script>