@extends('layouts.nav')
@section('title')
{{$type}} Invoice
@endsection
@section('content')
<button id="download-pdf" style="float: right; margin-bottom: 100px;" class="btn btn-primary">Download PDF</button>
  <div>
    <div class="py-4">
      <div class="px-14 py-6">
        <table class="w-full border-collapse border-spacing-0">
          <tbody>
            <tr>
              <td class="w-full align-top">
              <div style="display: flex;">
                    <img style="width: 100px; height: 100px;" src="{!! asset('img/logo.png') !!}" class="h-12" />
                    <p class="whitespace-nowrap font-bold text-main text-10xl ml-4" style="margin-top: 30px; font: 30px;">{{$type}} Invoice</p>
                </div>
              </td>

              <td class="align-top">
                <div class="text-sm">
                  <table class="border-collapse border-spacing-0">
                    <tbody>
                      <tr>
                        <td class="border-r pr-4">
                          <div>
                            <p class="whitespace-nowrap text-slate-400 text-right">Date</p>
                            @php
                            use Carbon\Carbon;
                            $todayLongDate = Carbon::now()->format(' F j, Y');
                            @endphp
                            <p class="whitespace-nowrap font-bold text-main text-right">{{$todayLongDate}}</p>
                          </div>
                        </td>
                        <td class="pl-4">
                          <div>
                            <p class="whitespace-nowrap text-slate-400 text-right">Invoice #</p>
                            <p class="whitespace-nowrap font-bold text-main text-right">{{$invoice}}</p>
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>

      <div class="bg-slate-100 px-14 py-6 text-sm">
        <table class="w-full border-collapse border-spacing-0">
          <tbody>
            <tr>
              <td class="w-1/2 align-top">
                <div class="text-sm text-neutral-600">
                @foreach ($pdetails as $pdetail)
                  <p class="font-bold">{{ $pdetail->Name}}</p>
                  <p>{{ $pdetail->Address}}</p>
                  <p>{{ $pdetail->Email}}</p>
                  <p>{{ $pdetail->Phone}}</p>
                  @endforeach
                </div>
              </td>
              <td class="w-1/2 align-top text-right">
                <div class="text-sm text-neutral-600">
                @foreach ($cst as $cs)
                  <p class="font-bold">{{ $cs->Name}}</p>
                  <p>{{ $cs->Address}}</p>
                  <p>{{ $cs->Email}}</p>
                  <p>{{ $cs->Contact}}</p>
                  @endforeach
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </div>

      <div class="px-14 py-10 text-sm text-neutral-700">
        <table class="w-full border-collapse border-spacing-0">
          <thead>
            <tr>

              <td class="border-b-2 border-main pb-3 pl-2 font-bold text-main">Description</td>

              <td class="border-b-2 border-main pb-3 pl-2 text-right font-bold text-main">Qty</td>
              <td class="border-b-2 border-main pb-3 pl-2 text-right font-bold text-main">Price</td>
              <td class="border-b-2 border-main pb-3 pl-2 text-center font-bold text-main">Tax %</td>
              <td class="border-b-2 border-main pb-3 pl-2 text-center font-bold text-main">Tax Amt</td>
              <td class="border-b-2 border-main pb-3 pl-2 text-center font-bold text-main">Disc %</td>
              <td class="border-b-2 border-main pb-3 pl-2 text-center font-bold text-main">Disc Amt</td>
              <td class="border-b-2 border-main pb-3 pl-2 pr-3 text-right font-bold text-main">Total</td>
            </tr>
          </thead>
          <tbody>


          @foreach ($Jts as $Jt)
            <tr>

              @php
                $contractCode = $Jt->ContraCode;
                if (!empty($Jt->ContraSubCode)) {
                $contractCode .= '/' . $Jt->ContraSubCode;
                }
                @endphp
              <td class="border-b py-3 pl-2">{{$contractCode.' '.$Jt->Narration}}</td>
              <td class="border-b py-3 pl-2 text-right">{{ number_format($Jt->Qnty, 2) }}</td>
              <td class="border-b py-3 pl-2 text-right">{{ number_format($Jt->Price * $Jt->Rate, 2) }}</td>
              <td class="border-b py-3 pl-2 text-center">{{ number_format($Jt->Tax, 2) }}</td>
              <td class="border-b py-3 pl-2 text-center">{{ number_format((($Jt->Price - ($Jt->Price * ($Jt->Discount / 100))) * $Jt->Qnty) * ($Jt->Tax / 100) * $Jt->Rate, 2) }}</td>
              <td class="border-b py-3 pl-2 text-center">{{ number_format($Jt->Discount, 2) }}</td>
              <td class="border-b py-3 pl-2 text-center">{{ number_format((($Jt->Price * $Jt->Qnty) * ($Jt->Discount / 100)) * $Jt->Rate, 2) }}</td>
              <td class="border-b py-3 pl-2 pr-3 text-right">{{ number_format(($Jt->Price * $Jt->Qnty) * $Jt->Rate, 2) }}</td>

            </tr>
            @endforeach


            <tr>
              <td colspan="9">
                <table class="w-full border-collapse border-spacing-0">
                  <tbody>
                    <tr>
                      <td class="w-full"></td>
                      <td>
                        <table class="w-full border-collapse border-spacing-0">
                          <tbody>
                            <tr>
                              <td class="border-b p-3">
                                <div class="whitespace-nowrap text-slate-400">Total (Excl):</div>
                              </td>
                              <td class="border-b p-3 text-right">
                                <div class="whitespace-nowrap font-bold text-main">{{ $symbol.' '.number_format($totalExcludingTax, 2) }}</div>
                              </td>
                            </tr>
                            <tr>
                              <td class="p-3">
                                <div class="whitespace-nowrap text-slate-400">Tax Amount:</div>
                              </td>
                              <td class="p-3 text-right">
                                <div class="whitespace-nowrap font-bold text-main">{{ $symbol.' '.number_format($totalTaxAmount, 2) }}</div>
                              </td>
                            </tr>
                            <tr>
                              <td class="p-3">
                                <div class="whitespace-nowrap text-slate-400">Total (Disc):</div>
                              </td>
                              <td class="p-3 text-right">
                                <div class="whitespace-nowrap font-bold text-main">{{ $symbol.' '.number_format($totalDiscounts, 2) }}</div>
                              </td>
                            </tr>
                            <tr>
                              <td class="bg-main p-3">
                                <div class="whitespace-nowrap font-bold text-white">Total (Incl):</div>
                              </td>
                              <td class="bg-main p-3 text-right">
                                <div class="whitespace-nowrap font-bold text-white">{{ $symbol.' '.number_format($totalIncludingTax, 2) }}</div>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>
      </div>

      <div class="px-14 text-sm text-neutral-700">
        <p class="text-main font-bold">PAYMENT DETAILS</p>
        @foreach ($Bankaccounts as $Bankaccount)
        <p>Bank Name: {{$Bankaccount->Name}} </p>
        <p>Account Number: {{$Bankaccount->Account}} </p>

        @endforeach

      </div>

      <div class="px-14 py-10 text-sm text-neutral-700">
        <p class="text-main font-bold">Notes</p>
          @foreach ($pdetails as $pdetail)

              <p class="italic">{{'Please make all payments to '. $pdetail->Name.'. Ensure that the invoice number is included with your payment for proper allocation.'}}</p>

              @endforeach</p>
        </div>

      </div>
    </div>


    <script>
document.getElementById('download-pdf').addEventListener('click', function () {
    var element = document.querySelector('.py-4'); // Select the specific section you want to print
    var opt = {
        margin:       -0.3,
        filename:     '{{$type}}invoice.pdf',
        image:        { type: 'jpeg', quality: 0.98 },
        html2canvas:  { scale: 2 },
        jsPDF:        { unit: 'in', format: 'A4', orientation: 'portrait' }
    };
    html2pdf().from(element).set(opt).save();
});
</script>

    @endsection
