Files
Backend-Api/ServiceHost/Areas/Admin/Pages/Company/InsuranceList/PrintTest.cshtml
2024-07-19 17:09:45 +03:30

574 lines
16 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@page
@using _0_Framework.Application
@model ServiceHost.Areas.Admin.Pages.Company.InsuranceList.Index1Model
@{
}
<style>
.modal .modal-dialog .modal-content {
background-color: white;
}
.modal-header {
padding: 1rem 0rem !important;
}
.modal .modal-dialog .modal-content .modal-body {
padding: 0 !important;
}
.modal-dialog {
width: 1000px !important;
}
#printThis .modal-content {
background-clip: padding-box;
background: black !important;
}
#printThis h1, h2, h3, h4, h5, h6 {
color: black;
margin: 1rem 0;
}
.top-title{
text-align: center;
}
.list-no {
display: flex;
justify-content: center;
align-items: center;
margin: 1rem 0;
}
.list-no h4 {
margin: 0 9rem;
}
#printThis .table-container {
border: 1px solid black;
border-radius: 9px;
}
#printThis span {
margin: 0 3rem;
}
.table-title {
display: flex;
justify-content: space-between;
padding: 0 1rem;
border: 1px solid black;
border-radius: 9px;
margin-bottom: 2rem;
background: #80808057;
}
.table-title h4{
font-size: 1.4rem;
}
#printThis span {
margin: 0 1rem;
}
#printThis table{
direction: ltr;
width: 100%;
}
#printThis .table-bordered {
border: hidden;
margin-bottom: 0;
table-layout: fixed;
width: 100%;
}
#printThis .table-bordered > thead > tr > th {
border: 1px solid #383838;
font-size: 1.3rem;
color: black;
text-align: center;
background: #80808033;
vertical-align: middle;
padding: 0;
}
#printThis .table-bordered > tbody > tr > td {
padding: 8px 0px;
text-align: center;
border: 1px solid #383838;
font-size: 1.2rem;
}
.printBtns .btn-rounded {
margin-left: 0.5rem;
padding: 5px 18px;
}
#printThis .colgp-1 {
width: 20px;
}
#printThis .colgp-2 {
width: 35px;
}
#printThis .colgp-3 {
width: 50px;
}
#printThis .colgp-4 {
width: 33px;
}
#printThis .colgp-5 {
width: 28px;
}
#printThis .colgp-6 {
width: 15px;
}
#printThis .colgp-7 {
width: 35px;
}
#printThis .colgp-8 {
width: 35px;
}
#printThis .colgp-9 {
width: 30px;
}
#printThis .colgp-10 {
width: 30px;
}
#printThis .colgp-11 {
width: 25px;
}
.data-summary {
border: 1px solid black;
border-radius: 7px;
margin-top: 5rem;
}
.data-summary h4{
font-size: 1.4rem;
}
.titleSection {
display: flex;
align-items: center;
}
.titles {
margin-left: auto;
margin-right: auto;
border: 1px solid #999191;
border-radius: 9px;
background: #d3d3d3;
padding: 0rem 1rem;
margin-bottom: 2rem;
}
.table-name {
text-align: right !important;
white-space: nowrap !important;
max-width: 100%;
width: 80px;
overflow-x: hidden;
direction: rtl;
}
.asignment-field {
display: none;
}
@@media screen {
#printSection {
display: none;
}
}
.print:last-child {
page-break-after: auto !important;
}
@@media (max-width: 1550px){
.modal-dialog {
width: 1000px !important;
}
.table-title h4 {
font-size: 1.3rem;
}
.top-title h1 {
font-size: 2.5rem;
}
.top-title h4 {
font-size: 1.5rem;
}
#printThis .table-bordered > thead > tr > th {
font-size: 1.1rem;
}
#printThis .table-bordered > tbody > tr > td {
font-size: 1rem;
}
#printThis .colgp-3 {
width: 95px;
}
#printThis .colgp-4 {
width: 40px;
}
#printThis .colgp-5 {
width: 32px;
}
#printThis .colgp-6 {
width: 18px;
}
#printThis .colgp-8 {
width: 40px;
}
#printThis .colgp-9 {
width: 40px;
}
#printThis .colgp-12 {
width: 60px;
}
#printThis .colgp-13 {
width: 60px;
}
#printThis .colgp-14 {
width: 60px;
}
#printThis .colgp-15 {
width: 65px;
}
#printThis .colgp-16 {
width: 60px;
}
}
@@page {
@@bottom-left {
content: "Page " counter(page) " of " counter(pages);
}
}
@@media print {
@@page {
size: A4 landscape;
@@bottom-right{
content: "1234";
}
}
body * {
visibility: hidden;
page-break-after: auto;
}
html, body {
height: 100%;
margin: 0 !important;
padding: 0 !important;
overflow: hidden;
}
.modal-dialog {
max-width: 100%;
/*width: 100%;*/
width: 60cm;
}
#printSection, #printSection * {
visibility: visible;
page-break-after: auto;
}
#printSection {
width: 27.5cm;
position: absolute;
left: 0;
page-break-after: auto;
top: 0;
}
#printThis .table-container {
border: 1px solid black !important;
border-radius: 9px;
}
#printThis .table-bordered {
border-radius: 9px;
border-right: hidden;
border-left: hidden;
}
#printThis .table-bordered > thead > tr > th {
border: 1px solid #000000 !important;
}
#printThis .table-bordered > tbody > tr > td {
border: 1px solid #000000 !important;
padding: 0.6rem;
}
.titles {
margin-left: auto;
margin-right: auto;
border: 1px solid #999191;
border-radius: 9px;
background: #d3d3d3;
padding: 0rem 1rem;
margin-bottom: 2rem;
}
.summary {
display: flex;
justify-content: flex-end;
}
#printThis .table-bordered {
/*border: 1px solid #000000 !important;*/
border-radius: 9px;
margin-bottom: 0;
}
#printThis .table-bordered > thead > tr > th {
background: #80808033;
}
.titles {
background: #d3d3d3;
}
.table-title {
background: #80808057;
}
.asignment-field {
display: block;
position: fixed;
bottom: 0;
left: 0;
right: 0;
display: flex;
justify-content: flex-end;
}
.asignment {
text-align: center;
font-size: 12px;
padding: 20px 10px;
border: 1px solid #ccc;
border-radius: 9px;
}
}
</style>
<div class="modal-header" style="border-bottom: unset">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<div class="printBtns" style="padding: 1px 12px 10px; border-top: unset;">
<button type="button" class="btn btn-warning btn-rounded waves-effect waves-light m-b-10" data-dismiss="modal" style="float: left">بستن</button>
<button id="btnPrint2" type="button" class="btn btn-success btn-rounded waves-effect waves-light" style="float: left">پرینت </button>
</div>
</div>
<div class="modal-body print" id="printThis">
<div class="row">
<div class="col-md-12">
<fieldset class="top-title">
<div class="titleSection">
<img src="/AdminTheme/LogoAndProfile/logo.png" class="img-circle" style="width:55px;">
<div class="titles" style="background: #d3d3d3;">
<h3 style="margin-left: auto;font-size: large;"> مشخصات و تایید کارفرما جهت تنظیم لیست بیمه پرسنل </h3>
<h4>لیست ماه <span>@Model.insurance.Month</span> سال <span>@Model.insurance.Year</span></h4>
</div>
</div>
</fieldset>
</div>
<div class="table-title" style="background: #80808057;">
<h4> نام کارفرما : <span>@Model.insurance.InsuranceWorkshopInfo.EmployerName</span></h4>
<h4> نام کارگاه : <span>@Model.insurance.InsuranceWorkshopInfo.WorkshopName </span></h4>
<h4> کد کارگاه : <span>@Model.insurance.InsuranceWorkshopInfo.InsuranceCode</span></h4>
</div>
<div class="table-container col-md-12" style="padding: 0; border-radius:9px;">
@if (Model.insurance.EmployeeDetailsForInsuranceList != null)
{
var index = 1;
var q = Model.insurance.EmployeeDetailsForInsuranceList.Count / 15 + (Model.insurance.EmployeeDetailsForInsuranceList.Count % 15 == 0 ? 0 : 1);
var r = Model.insurance.EmployeeDetailsForInsuranceList.Count % 15;
@for (var i = 0; i < q; i++)
{
<table class="table table-bordered" style="border-radius:9px;">
<colgroup>
<col class="colgp-11">
<col class="colgp-10">
<col class="colgp-9">
<col class="colgp-8">
<col class="colgp-7">
<col class="colgp-6">
<col class="colgp-5">
<col class="colgp-4">
<col class="colgp-3">
<col class="colgp-2">
<col class="colgp-1" style="border-top-right-radius:9px;">
</colgroup>
<thead>
<tr>
<th class="header-pad" style="border-top-left-radius:9px;background: #80808033 !important;border-top-left-radius: 9px!important;"> توضیحات </th>
<th class="header-pad2" style="background: #80808033 !important;"> مجموع حقوق و مزایای ماهیانه </th>
<th class="header-pad2" style="background: #80808033 !important;"> مجموع مزایای ماهیانه </th>
<th class="header-pad2" style="background: #80808033 !important;"> حقوق ماهیانه </th>
<th class="header-pad2" style="background: #80808033 !important;"> دستمزد روزانه </th>
<th class="header-pad" style="background: #80808033 !important;"> روز کارکرد </th>
<th class="header-pad" style="background: #80808033 !important;"> سمت</th>
<th class="header-pad" style="background: #80808033 !important;"> کدملی </th>
<th class="header-pad" style="background: #80808033 !important;"> نام و نام خانوادگی </th>
<th class="header-pad" style="background: #80808033 !important;"> شماره بیمه </th>
<th class="header-pad" style="border-top-right-radius:9px;background: #80808033 !important;border-top-right-radius: 9px !important;">ردیف</th>
</tr>
</thead>
<tbody>
@{
var count_j = Model.insurance.EmployeeDetailsForInsuranceList.Count < 15 || i == q - 1 ? r : 15;
if (i == q - 1)
count_j = i * 15 + count_j;
else
{
count_j = (i + 1) * count_j;
}
}
@for (var j = i * 15; j < count_j; j++)
{
<tr style="@(Model.insurance.EmployeeDetailsForInsuranceList[j].HasLeftWorkInMonth ? "background: #000;color:#fff" : Model.insurance.EmployeeDetailsForInsuranceList[j].HasStartWorkInMonth ? "background: #ccc;" : "")">
<td @(j == (i + 1) * count_j - 1 ? "style='border-bottom-left-radius:9px'" : "") >
@if (!string.IsNullOrEmpty(Model.insurance.EmployeeDetailsForInsuranceList[j].LeftWorkDate))
{
<p>@Model.insurance.EmployeeDetailsForInsuranceList[j].LeftWorkDate</p>
}
@if (Model.insurance.EmployeeDetailsForInsuranceList[j].HasStartWorkInMonth)
{
<p>@Model.insurance.EmployeeDetailsForInsuranceList[j].StartWorkDate</p>
}
</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].BenefitsIncludedContinuous.ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].MonthlyBenefits.ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].MonthlySalary.ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].DailyWage.ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].WorkingDays</td>
<td class="table-name">@Model.insurance.EmployeeDetailsForInsuranceList[j].JobName</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].NationalCode</td>
<td class="table-name">@(Model.insurance.EmployeeDetailsForInsuranceList[j].FName + " " + Model.insurance.EmployeeDetailsForInsuranceList[j].LName)</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList[j].InsuranceCode</td>
<td @(j == (i + 1) * count_j - 1 ? "style='border-bottom-right-radius:9px; border-left: hidden !important'" : "") > @index</td>
</tr>
index = index + 1;
}
@if (i == q - 1)
{
<tr style="background: #e6e6e6;">
<td style="border-bottom-left-radius:9px"></td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList.Sum(x => x.BenefitsIncludedContinuous).ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList.Sum(x => x.MonthlyBenefits).ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList.Sum(x => x.MonthlySalary).ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList.Sum(x => x.DailyWage).ToMoney()</td>
<td>@Model.insurance.EmployeeDetailsForInsuranceList.Sum(x => x.WorkingDays)</td>
<td>جمع کل</td>
<td></td>
<td style=" border-left: hidden !important"></td>
<td style=" border-left: hidden !important"></td>
<td style="border-bottom-right-radius:9px; border-left: hidden !important"></td>
</tr>
}
</tbody>
</table>
<br/>
}
}
</div>
</div>
<div class="row asignment-field">
<div class="col-md-9 col-sm-9 col-lg-9"></div>
<div class="col-md-3 col-sm-3 col-lg-3 asignment">
<h4> امضا و تایید کارفرما </h4>
</div>
</div>
</div>
<div class="modal-footer" style="border-top: unset; padding: 30px 15px 10px;">
<button type="button" class="btn btn-warning btn-rounded waves-effect waves-light m-b-10" data-dismiss="modal" style="float: left">بستن</button>
<button id="btnPrint" onclick="printElement()" type="button" class="btn btn-success btn-rounded waves-effect waves-light" style="float: left">پرینت </button>
</div>
<script>
document.getElementById("btnPrint").onclick = function() {
printElement(document.getElementById("printThis"));
};
document.getElementById("btnPrint2").onclick = function() {
printElement(document.getElementById("printThis"));
};
function printElement(elem) {
const domClone = elem.cloneNode(true);
// create a new stylesheet to hide everything except the modal
const style = document.createElement("style");
style.innerHTML = `
@@media print {
body * {
visibility: hidden;
}
#printSection, #printSection * {
visibility: visible;
}
#printSection {
position: absolute;
left: 0;
top: 0;
}
}
`;
document.head.appendChild(style);
// create a new section to hold the modal for printing
var $printSection = document.getElementById("printSection");
if (!$printSection) {
$printSection = document.createElement("div");
$printSection.id = "printSection";
document.body.appendChild($printSection);
}
$printSection.innerHTML = "";
$printSection.appendChild(domClone);
window.print();
// remove the new stylesheet after printing
document.head.removeChild(style);
}
</script>