Notes

@model List<SMXServicesConsulting.DataModel.Models.CostosCompanyGroupModel>
<style>
table thead tr#header th {
z-index: 2 !important;
}

table thead tr th {
vertical-align: middle;
}

table#getEmployeetbl thead tr th:nth-child(2) {
z-index: 3;
}

tfoot td {
background-color: lightgrey;
font-weight: bold;
}
</style>

<div class="table-responsive">
<table id="getEmployeetbl" class="table table-striped position-relative" style="width:100%">
<thead>
<tr>
<th>Company</th>
<th>Full Name</th>
<th>Email</th>
<th>Region</th>
<th>Status</th>
<th>Last Name</th>
<th>First Name</th>
<th>Position</th>
<th>Start Date</th>
<th>Actual Hours</th>
<th>Pay Rate</th>
<th>Pay 160/hras</th>
<th>Impuestos 17.5%</th>
<th>Impuestos 8%</th>
<th>Impuestos 2.50%</th>
<th>Auto</th>
<th>Apt</th>
<th>Visa</th>
<th>Tickets + Others</th>
<th>Laptop</th>
<th>Insurance</th>
<th>Comm. 3rd Party</th>
<th>Total de Costo</th>
<th>Costo / Hora</th>
<th>Actual Hours</th>
<th>Bill Rate</th>
<th>Bill 160/Hras</th>
<th>Relacion 70/30</th>
<th>Profit</th>
<th>Coeficiente</th>
<th>Termina</th>
<th hidden>TableId</th>
<th hidden>EmployeeId</th>
</tr>
</thead>
<tbody>
@foreach (var companyGroup in Model)
{
@if (companyGroup.CostosModels != null)
{
@foreach (var item in companyGroup.CostosModels)
{
<tr>
<td>@item.Company</td>
<td>@item.FullName</td>
<td>@item.Email</td>
<td>@item.Region</td>
<td>@item.Status</td>
<td>@item.LastName</td>
<td>@item.FirstName</td>
<td>@item.Position</td>
<td>@item.StartDate</td>
<td>@item.ActualHours</td>
<td>@item.PayRate</td>
<td>@item.Pay160hras</td>
<td>@item.Impuestos175</td>
<td>@item.Impuestos8</td>
<td>@item.Impuestos250</td>
<td>@item.Auto</td>
<td>@item.Apt</td>
<td>@item.Visa</td>
<td>@item.TicketOther</td>
<td>@item.Laptop</td>
<td>@item.Insurance</td>
<td>@item.Comm3rdParty</td>
<td>@item.TotalDeCosto</td>
<td>@item.CostoHora</td>
<td>@item.ActualHours</td>
<td>@item.BillRate</td>
<td>@item.Bill160Hras</td>
<td>@item.Relacion7030</td>
<td>@item.Profit</td>
<td>@item.Coeficiente</td>
<td>@item.Termina</td>
<td hidden>@item.EmployeeTableId</td>
<td hidden>@item.EmployeeId</td>
</tr>
}
<tr class="company-footer">
<td>@companyGroup.CompanyCount</td>
<td></td>
<td></td>
<td>@companyGroup.RegionCount</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td>@companyGroup.TotalActualHours.ToString("C")</td>
<td>@companyGroup.TotalPayRate.ToString("C")</td>
<td>@companyGroup.TotalPay160Hours.ToString("C")</td>
<td>@companyGroup.TotalImpuestos175.ToString("C")</td>
<td>@companyGroup.TotalImpuestos8.ToString("C")</td>
<td>@companyGroup.TotalImpuestos250.ToString("C")</td>
<td>@companyGroup.TotalAuto.ToString("C")</td>
<td>@companyGroup.TotalApt.ToString("C")</td>
<td>@companyGroup.TotalVisa.ToString("C")</td>
<td>@companyGroup.TotalTicketOther.ToString("C")</td>
<td>@companyGroup.TotalLaptop.ToString("C")</td>
<td>@companyGroup.TotalInsurance.ToString("C")</td>
<td>@companyGroup.TotalComm3rdParty.ToString("C")</td>
<td>@companyGroup.TotalDeCosto.ToString("C")</td>
<td>@companyGroup.TotalCostHours.ToString("C")</td>
<td>@companyGroup.TotalActualHours.ToString("C")</td>
<td>@companyGroup.TotalBillRate.ToString("C")</td>
<td>@companyGroup.TotalBill160Hras.ToString("C")</td>
<td>@companyGroup.TotalRelacion7030.ToString("F2")%</td>
<td>@companyGroup.TotalProfit.ToString("C")</td>
<td>@companyGroup.TotalCoeficiente.ToString("C")</td>
<td></td>
<td hidden></td>
<td hidden></td>
</tr>
}
}
</tbody>
</table>
</div>

<link rel="stylesheet" href="https://cdn.datatables.net/2.0.8/css/dataTables.dataTables.css">
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="https://cdn.datatables.net/2.0.8/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/2.0.8/js/dataTables.fixedColumns.min.js"></script>
<script src="https://cdn.datatables.net/2.0.8/js/dataTables.bootstrap5.min.js"></script>

<script>
$(document).ready(function() {
$('#getEmployeetbl').DataTable({
fixedColumns: {
left: 2
},
paging: true,
pageLength: 50,
order: [],
searching: true,
responsive: true,
rowGroup: {
dataSrc: 0 // Group by the first column (Company)
},
drawCallback: function(settings) {
// Remove the second row of each group (footer row) from the DataTable's internal data
$('#getEmployeetbl tbody').find('tr.company-footer').each(function() {
$(this).detach().appendTo('#getEmployeetbl tbody');
});
}
});
});
</script>