/home2/mshostin/public_html/resources/views/reference/print.blade.php
<!doctype html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Outstanding Report</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<body>
<div class="container" id="print-doc" >
<div style="width:100%">
<div class="row">
<div class="col-md-2"><p style="margin-top: 35px;">S.P NAME: {{$ref->name}}</p></div>
<div class="col-md-8 text-center">
<h2>PANWARI OUTSTANDING REPORT </h2>
</div>
</div>
<table class="table table-border" id="table-print" style=" width:100%;border:1px solid black; height:100%;">
<thead style="border:1px solid black;">
<tr style="border:1px solid black;">
<th style="width: 2% border:1px solid black;">SNO</th>
<th style="width: 5% border:1px solid black;">DATE</th>
<th style="width: 20% border:1px solid black;">PARTY NAME</th>
<th style="width: 10% border:1px solid black;">BALANCE</th>
<th style="width: 2% border:1px solid black;">Days</th>
</tr>
</thead>
<tbody style="border:1px solid black;">
@php
$total = 0;
$sr = 1;
@endphp
@foreach ($trans as $key => $row)
<tr style="border:1px solid black;">
<th scope="row" style="border:1px solid #ccc; padding: 8px;
line-height: 1.42857143;
vertical-align: top;">{{$sr}}</th>
<td style="border:1px solid #ccc; padding: 8px;
line-height: 1.42857143;
vertical-align: top; text-align:center">{!! date('d/M/y', strtotime($row[0]->created_at)) !!}</td>
<td style="border:1px solid #ccc; padding: 8px;
line-height: 1.42857143;
vertical-align: top;text-align:center">{{$row[0]->client->name}}</td>
<td style="border:1px solid #ccc; text-align:center">
{{$row[0]->client->balance}}
@php
$total = $total + $row[0]->client->balance;
@endphp
</td>
<td style="border:1px solid #ccc; padding: 8px;
line-height: 1.42857143;
vertical-align: top; text-align:center">
@php
++$sr;
$interval = $row[0]->created_at->diff(Carbon\Carbon::now());
@endphp
{{$interval->format('%a')}}
</td>
</tr>
@endforeach
</tbody>
</table>
<div class="text-right" id="total-amount" >
<h4>Total Balance Amount : {{$total}} </h4>
</div>
</div>
</div>
<div class="container" id="display-none">
<button onclick="print()">Print</button>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js" integrity="sha512-GsLlZN/3F2ErC5ifS5QtgpiJtWd43JWSuIgh7mbzZ8zBps+dvLusV+eNQATqgA/HdeKFVgA5v3S/cIrLF7QnIg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script>
function print()
{
// document.getElementById("display-none").style.display = "none";
// window.print();
// var element = document.getElementById('print-doc');
// document.getElementById("table-print").style.width = "95%";
// document.getElementById("total-amount").style.margin = "5%";
// var opt = {
// margin: [22,2, 15, 2], //top, left, buttom, right
// filename: 'ledger.pdf',
// image: { type: 'jpeg', quality: 1 },
// html2canvas: { dpi: 192, letterRendering: true},
// jsPDF: { unit: 'mm', format: 'A4', orientation: 'landscape' },
// };
// element.print();
// New Promise-based usage:
// html2pdf().set(opt).from(element).save();
// Old monolithic-style usage:
// html2pdf(element, opt);
var prtContent = document.getElementById("print-doc");
var WinPrint = window.open('', '', 'left=0,top=0,width=1500,height=1000,toolbar=0,scrollbars=0,status=0');
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();
}
</script>
</body>
</html>