@extends('layouts/layoutMaster')

@section('title', 'COA')

@section('page-style')
{{-- @vite('resources/assets/vendor/scss/pages/app-invoice-print.scss') --}}
@endsection

@section('page-script')
{{-- @vite('resources/js/print-invoice.js') --}}
@endsection

@section('content')
<div class="invoice-print p-2" style="background-color: white">
    <div class="d-flex justify-content-between flex-row" style="background-color: #f7f7f9; padding: 10px;border-radius: 10px;">
        <div>
            <div class="d-flex svg-illustration align-items-center gap-1 mb-4">
                <div class="d-flex svg-illustration align-items-center gap-2 mb-6">
                    <span class="mb-0 app-brand-text fw-semibold centered">Raw Material Certificate of Analysis of {{ strtoupper($bom_data->product->name) }}</span>
                </div>
            </div>
            <div>
              <p class="mb-1">Product Name.: {{ $bom_data->product->name }}</p>
              <p class="mb-1">Product Code: {{ $bom_data->product->code }}</p>
              <p class="mb-1">Batch No.: {{ $batchOrder->batch_no }}</p>
              <p class="mb-1">Batch Size: {{ $batchOrder->batch_size }}</p>
            </div>
        </div>

        <div>
          <div class="company-info" style="text-align: right;">
            <div class="user-profile">
              <div class="user-profile">
                <img src="{{ request()->user()->profile_photo_url }}" class="rounded-circle" width="50px" alt="User Profile Photo">
              </div>
            </div>
            <strong class="user-profile">{{ $company->company_name }}</strong>
            <p class="mb-1">Plot No: {{ $company->billing_address }}</p>
            <p class="mb-1">Phone No: {{ $company->phone_no }} | Email: {{ $company->email }}</p>
            <p class="mb-1">GST: {{ $company->gst }} | CIN No: {{ $company->cin_no }}</p>
          </div>
        </div>
    </div>

    <hr class="my-4" />

    <div class="card-body py-6 px-0">
        <div class="table-responsive border rounded-4 border-bottom-0">
          <div class="table-responsive border rounded-4 border-bottom-0">
            <table class="table">
              <thead style="background-color: #f2f3f4">
                  <tr>
                      <th>S.No</th>
                      <th>Test</th>
                      <th>Specification</th>
                      <th>Result</th>
                  </tr>
              </thead>
              <tbody>
                  @php
                      $itemIndex = 1;
                      // dd($BatchOrderTesting)
                  @endphp
                  @if($BatchOrderTesting->isNotEmpty())
                    @foreach ($BatchOrderTesting as $processId => $testings)
                      <tr style="background-color: white">
                        <td colspan="4" class="process-header">{{ $testings->first()->batchProcess->process_name ?? 'N/A' }}</td>
                      </tr>
                      @foreach ($testings as $index => $testing)
                        <tr style="background-color: white">
                            <td>{{ $itemIndex++ }}</td>
                            <td>{{ $testing->batchTest->test_description }}</td>
                            <td>{{ $testing->batchTest->standards }}</td>
                            <td>{{ $testing->description }}</td>
                        </tr>
                      @endforeach
                    @endforeach
                  @else
                    @foreach ($bom_testings as $processId => $testings)
                    <tr style="background-color: white">
                      <td colspan="4" class="process-header">{{ $testings->first()->bom_process->process_name ?? 'N/A' }}</td>
                    </tr>
                    @foreach ($testings as $index => $testing)
                      <tr style="background-color: white">
                          <td>{{ $itemIndex++ }}</td>
                          <td>{{ $testing->test_description }}</td>
                          <td>N/A</td>
                          <td>N/A</td>
                      </tr>
                    @endforeach
                    @endforeach
                  @endif
              </tbody>
          </table>
        </div>

        <hr class="mt-0 mb-4">
        <div class="note-section">
          <span class="fw-medium text-heading">Note:</span>
          <span>It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!</span>
      </div>

    </div>
</div>
<script>
  (function() {
    const invoiceDiv = document.querySelector('.invoice-print');
    const originalContent = document.body.innerHTML;

    // Temporarily set the body's HTML to the invoice div's content
    document.body.innerHTML = invoiceDiv.outerHTML;

    // Trigger the print dialog
    window.print();
  })();
</script>

@endsection