@if ($overviewBond['bond'])
    <div class="{{ !$overviewBond['print'] ? 'preview-popup shadow' : '' }}">
        <div class="preview-container {{ $overviewBond['print'] ? 'd-none hidden-preview' : '' }}">
            <div class="row align-items-start justify-content-between my-1">
                <div class="col">
                    @if ($overviewBond['bond']->status == 'draft')
                        @can('warehouses-salesOrders-edit')
                            <a href="{{ route('tenant.warehouses.sales-price-offers.edit', ['sales_price_offer' => $overviewBond['bond']->id]) }}"
                                class="btn orange-btn btn-sm mx-1">
                                @lang('general.edit')
                            </a>
                        @endcan
                    @endif

                    <button class="btn orange-btn btn-sm print-bond-btn mx-1">
                        @lang('general.print') <i class="fas fa-print"></i>
                    </button>
                </div>

                <div class="col text-start">
                    <button id="closeShowPage" type="button" class="btn btn-danger btn-sm close-viewer-btn">x
                    </button>
                </div>
            </div>

            <div class="printable-section" data-withTitle="no">
                <div class="mb-2 bond-as-bond" dir="ltr">
                    <div class="row g-3">
                        <div class="col">
                            <table class="table table-bordered">
                                <thead>
                                    <tr>
                                        <td class="text-center" style="background-color: #2e72a7;">
                                            <h3 class="fw-bold">SALES OFFER</h3>
                                        </td>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr class="mx-2">
                                        <td>
                                            <div class="mb-2">
                                                <span class="strong">Offer #:</span>
                                                {{ $overviewBond['bond']->bond_number }}
                                            </div>

                                            <div class="mb-2">
                                                <span class="strong">Offer Date :</span>
                                                {{ $overviewBond['bond']->date }}
                                            </div>
                                        </td>

                                    </tr>
                                    <tr class="mx-2">
                                        <td>
                                            <div class="mb-2">
                                                <span class="strong">Customer:</span>
                                                {{ $overviewBond['bond']->client_name }}
                                            </div>

                                            @if ($overviewBond['bond']->client)
                                                <div class="mb-2">
                                                    <span class="strong">Account # :
                                                    </span>{{ $overviewBond['bond']->client->id_by_receivable_type }}
                                                </div>
                                            @endif
                                        </td>
                                    </tr>

                                    <tr class="mx-2">
                                        <td>
                                            @if ($overviewBond['bond']->client)
                                                <div class="mb-2">
                                                    <span class="strong">Customer phone:</span>
                                                    {{ $overviewBond['bond']->client->phone_1 }}
                                                </div>
                                            @endif

                                            <div class="mb-2">
                                                <span class="strong">Address :</span>
                                                @if ($overviewBond['bond']->client && is_array($overviewBond['bond']->client->address))
                                                    city:
                                                    {{ $overviewBond['bond']->client->address['city'] ?? '---' }} /

                                                    area:{{ $overviewBond['bond']->client->address['region'] ?? '---' }}
                                                    /
                                                    address:{{ $overviewBond['bond']->client->address['address'] ?? '---' }}
                                                @else
                                                    ---
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <div class="col">
                            <table class="table table-bordered" style="margin-top: 42.36px">
                                <tbody>
                                    <tr class="mx-2">
                                        <td>
                                            <div class="mb-2">
                                                <span class="strong">F.O.Payment:</span>
                                                {{ $overviewBond['bond']->client_type == 'cash' ? 'نقدي' : 'ذمة' }}
                                            </div>

                                            <div class="mb-2">
                                                <span class="strong">Payment way:</span>
                                                {{ $overviewBond['bond']->selected_payment_way ?? '---' }}
                                            </div>
                                        </td>
                                    </tr>

                                    <tr class="mx-2">
                                        <td>
                                            <div class="mb-2">
                                                <span class="strong">Sales Ex :</span> @lang('warehouses/sales-price-offers/show.sales_section')</div>
                                        </td>
                                    </tr>

                                    <tr class="mx-2">
                                        <td>
                                            <div class="mb-2">
                                                <span class="strong">Notes :</span>{{ $overviewBond['bond']->notice }}
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <table class="table table-bordered">
                        <thead>
                            <tr class="text-center">
                                <td class="sm-td" style="background-color: #2e72a7;">#</td>
                                <td class="md-td" style="background-color: #2e72a7;">Ref.</td>
                                <td class="md-td" style="background-color: #2e72a7;">Description</td>
                                <td class="sm-td" style="background-color: #2e72a7;">Qty</td>
                                <td class="sm-td" style="background-color: #2e72a7;">Price</td>
                                <td class="sm-td" style="background-color: #2e72a7;">Dis.</td>
                                <td class="sm-td" style="background-color: #2e72a7;">Gross Price</td>
                                <td class="md-td" style="background-color: #2e72a7;">Amount</td>
                            </tr>
                        </thead>

                        <tbody>
                            @php
                                $total_amount_before_normal_discounts = 0;
                                $total_extra_discounts = 0;
                                $tax_amounts_total = 0;
                                $client_discount = 0;
                                $total_items_discount = 0;
                                $total_final_price = 0;
                            @endphp

                            @foreach ($overviewBond['bond']->items as $item)
                                @php
                                    $tax_ratio = $item->barcode->item->tax?->value;
                                    $tax_amount = $tax_ratio
                                        ? $item->total_price_after_extra_discount * ($tax_ratio / 100)
                                        : 0;
                                    $total_price_after_tax = $item->total_price_after_extra_discount + $tax_amount;
                                    $tax_amounts_total += $tax_amount;
                                    $total_amount_before_normal_discounts += $item->price * $item->quantity;
                                    $total_extra_discounts += $item->extra_discount_amount
                                        ? $item->extra_discount_amount * $item->quantity
                                        : 0;
                                    $client_discount +=
                                        ($overviewBond['bond']->client_discount_ratio / 100) *
                                        $item->total_price_after_extra_discount;
                                    $total_items_discount += $item->discount_amount * $item->quantity;
                                    $total_final_price += $total_price_after_tax;
                                @endphp

                                <tr>
                                    <td>{{ $loop->iteration }}</td>
                                    <td>{{ $item->barcode->number }}</td>
                                    <td> {{ $item->barcode->ar_name }}</td>
                                    <td>{{ dn($item->quantity) }}</td>
                                    <td>{{ dn($item->price) }}</td>
                                    <td>{{ number_format(($item->discount_amount / ($item->price * $item->quantity)) * 100, 2) }}%
                                    </td>
                                    <td>{{ $item->price * $item->quantity - $item->discount_amount }}</td>
                                    <td>{{ $total_price_after_tax }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                    <hr class="mb-2">

                    <div class="row justify-content-between m-2">
                        <div class="col-6">
                            <div class="d-flex justify-content-between px-5 py-1">
                                <b># Of Items: {{ $overviewBond['bond']->items->count() }}</b>
                                <b>Total Qty: {{ $overviewBond['bond']->items->sum('quantity') }}</b>
                            </div>
                            @php
                                if (! function_exists('arabicTafqeet')) {
                                    function arabicTafqeet($value) {
                                        return \Tafqeet::inArabic(
                                            number_format((float) str_replace(',', '', $value), 3, '.', ''),
                                            'jod'
                                        );
                                    }
                                }
                            @endphp
                            <p class="text-center mt-5">
                                <b>{{ arabicTafqeet(dn($total_final_price - $client_discount)) }}</b>
                            </p>
                        </div>

                        <table class="col-4 border">
                            <tr>
                                <td>
                                    Sub Total
                                </td>
                                <td>
                                    {{ dn($total_amount_before_normal_discounts) }}
                                </td>
                            </tr>

                            <tr>
                                <td>
                                    Items Discount
                                </td>
                                <td>
                                    {{ dn($total_items_discount) }}

                                </td>
                            </tr>

                            <tr>
                                <td>
                                    Extra Discount
                                </td>
                                <td>
                                    {{ dn($total_extra_discounts) }}
                                </td>
                            </tr>

                            <tr>
                                <td>
                                    Client Discount
                                </td>
                                <td>
                                    {{ dn($client_discount) }}
                                </td>
                            </tr>

                            <tr>
                                <td>
                                    Taxes
                                </td>
                                <td>
                                    {{ dn($tax_amounts_total) }}
                                </td>
                            </tr>

                            <tr style="background-color: #2e72a7;">
                                <td class="fw-bold">
                                    Total
                                </td>
                                <td class="fw-bold">
                                    {{ dn($total_final_price - $client_discount) }}
                                </td>
                            </tr>
                        </table>
                    </div>

                    <div class="sip">
                        <div class="d-flex m-2 justify-content-around">
                            <h4>
                                @lang('warehouses/sales-price-offers/show.receipt')
                                <br>
                                <br>
                                ----------
                            </h4>
                            <h4>
                                @lang('warehouses/sales-price-offers/show.audit')
                                <br>
                                <br>
                                ----------
                            </h4>
                            <h4>
                                @lang('warehouses/sales-price-offers/show.preparation')
                                <br>
                                <br>
                                ----------
                            </h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endif

@push('script')
    <script type="module">
        import printSection from "/tenancy/assets/js/print.js";

        $('body').on('click', '.print-bond-btn', function() {
            let target = $('.printable-section').clone();
            const print_data = @json(Session::get('print_data'));
            let css_link = "/tenancy/assets/css/accounting/printing/bonds.css";
            printSection.print(target, print_data, null, css_link, true, {});
        });
    </script>
@endpush