@section Styles {
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css" />
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css" />
}


<table id="empview"   class="display nowrap" cellspacing="0" style='font-size:80%'>
                                <thead class="thead-light">
                                    <tr>
                                        <th rowspan="2">Employee</th>
                                        <th colspan="4">Monday</th>
                                        <th colspan="4">Tuesday</th>
 
                                        <th rowspan="2"> Sys<br />Holiday<br /> Per<br   </th>
</tr>
<tr>
                                        <th>In<br />Time</th>    
                                        <th>Out<br />Time</th>   
                                        <th>Break<br />Hrs</th>   
                                        <th>Net<br />Hrs</th>   

                                        <th>In<br /> Time</th>    
                                        <th>Out<br /> Time</th>   
                                        <th>Break<br /> Hrs</th>   
                                        <th>Net<br /> Hrs</th>   

                                         

                                    </tr>
                                </thead>

  <tbody>


                                    @foreach (EmployeeWorkTimeSettingsModel EmpSetting in @ViewBag.EmpviewReport)
                                    {
                                        <tr>
                                            <td style="max-width:500px;overflow:hidden; white-space:nowrap">@EmpSetting.EmployeeName </td>

                                            <td>@EmpSetting.MondayInTime </td>
                                            <td>@EmpSetting.MondayOutTime </td>
                                            <td>@EmpSetting.MondayBreakHrs </td>
                                            <td>@EmpSetting.MondayNetHrs </td>

                                            <td>@EmpSetting.TuesdayInTime </td>
                                            <td>@EmpSetting.TuesdayOutTime </td>
                                            <td>@EmpSetting.TuesdayBreakHrs </td>
                                            <td>@EmpSetting.TuesdayNetHrs </td>
   <td>@EmpSetting.SystemHoliday</td>
</tr>

                                    }



                                </tbody>


                            </table>

@section Scripts
    {
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.flash.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/pdfmake.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/buttons/1.5.2/js/buttons.print.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $("#empview").DataTable({
                scrollY: "300px",
                scrollX: true,
                scrollCollapse: false,
                paging: false,
                fixedColumns: {
                    leftColumns: 1
                },
                dom: 'Bfrtip',
                buttons: [
                    'copy', 'csv', 'excel', 'pdf', 'print'
                ]
            });
        });
    </script>