@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">
                    @can('warehouses-outBonds-edit')
                        @if ($overviewBond['bond']->status != 'full-satiated' && $overviewBond['bond']->status != 'partially-satiated')
                            <a href="{{ route('tenant.warehouses.purchase-orders.edit', ['purchase_order' => $overviewBond['bond']->id]) }}"
                                class="btn orange-btn btn-sm mx-1">
                                @lang('general.edit')
                            </a>
                        @endif
                    @endcan

                    <button id="printEntry" class="btn orange-btn btn-sm print-bond-btn mx-1"
                        data-bondId="{{ $overviewBond['bond']->id }}">
                        @lang('general.print') <i class="fas fa-print"></i>
                    </button>
                </div>

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

            <div class="printable-section">
                <input type="hidden" id="bond_employee" value="{{ json_encode($overviewBond['bond']->employee) }}">

                <div class="mb-2 bond-as-bond">
                    <div class="row border border-dark pb-3 mx-auto">
                        <b class="text-center my-0 dsip">@lang('warehouses/purchase-orders/show.purchase_request') </b>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.request_number') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->bond_number }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.supplier'): </b>
                            <p class="mx-1">{{ $overviewBond['bond']->supplier->name }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.supplier_phone') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->supplier->phone_1 }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b>@lang('warehouses/purchase-orders/show.date'): </b>
                            <p class="mx-1">{{ $overviewBond['bond']->date }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.expected_delivery_date') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->expected_delivery_date }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.branch'): </b>
                            <p class="mx-1">{{ $overviewBond['bond']->branch->name }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.address'): </b>
                            <p class="mx-1">{{ $overviewBond['bond']->branch->address }}</p>
                        </div>


                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.phone'): </b>
                            <p class="mx-1">{{ $overviewBond['bond']->branch->phone }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.shipping_condition') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->delivery_term?->name }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.payment_condition') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->payment_term?->name }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.exchange_rate') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->order_type }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b>@lang('warehouses/purchase-orders/show.purchase_request_status') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->status_as_text }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.exchange_rate') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->exchange_price }}</p>
                        </div>

                        <div class="col-4 d-flex dsip">
                            <b> @lang('warehouses/purchase-orders/show.extra_discount') : </b>
                            <p class="mx-1">{{ $overviewBond['bond']->extra_discount_amount }}</p>
                        </div>

                        <div class="col-4 d-flex">
                            <b> @lang('warehouses/purchase-orders/show.purchase_requester') : </b>
                        </div>
                    </div>

                    <div class="my-2 bond-as-bond">
                        <h4>@lang('warehouses/purchase-orders/show.items')</h4>
                        <div class="scrollable-table">
                        <table class="table table-bordered without-herotable">
                            <thead>
                                <tr>
                                    <th class="sm-td"> @lang('warehouses/purchase-orders/show.unit_code')</th>
                                    <th class="sm-td"> @lang('warehouses/purchase-orders/show.material_description')</th>
                                    <th class="sm-td">@lang('warehouses/purchase-orders/show.tax_percentage') </th>
                                    <th class="sm-td">@lang('warehouses/purchase-orders/show.unit') </th>
                                    <th class="sm-td">@lang('warehouses/purchase-orders/show.quantity') </th>
                                    <th class="sm-td dsip">@lang('warehouses/purchase-orders/show.cost') </th>
                                    <th class="sm-td">@lang('warehouses/purchase-orders/show.total') </th>
                                    <th class="xs-td dsip">@lang('warehouses/purchase-orders/show.discount')</th>
                                    <th class="xs-td dsip">@lang('warehouses/purchase-orders/show.total_after_discount')</th>
                                    <th class="sm-td dsip">@lang('warehouses/purchase-orders/show.bonus')</th>
                                    <th class="sm-td dsip">@lang('warehouses/purchase-orders/show.monthly_sales_rate')</th>
                                    <th class="sm-td dsip">@lang('warehouses/purchase-orders/show.available_quantity_in_warehouse')</th>
                                    <th class="sm-td">@lang('warehouses/purchase-orders/show.notes')</th>
                                </tr>
                            </thead>

                            <tbody>
                                @php $total = 0; @endphp
                                @foreach ($overviewBond['bond']->barcodes as $item)
                                    <tr>
                                        <td class="sm-td">{{ $item->barcode->number }}</td>
                                        <td class="sm-td">{{ $item->barcode->ar_name }}</td>
                                        <td class="sm-td">{{ $item->barcode->item->tax->value ?? '' }}</td>
                                        <td class="sm-td">{{ $item->barcode->unit->name }}</td>
                                        <td class="sm-td">{{ $item->quantity }}</td>
                                        <td class="sm-td dsip">{{ $item->cost }}</td>
                                        <td class="sm-td">
                                            {{ $item->quantity * $item->cost +
                                                (optional($item->barcode->item->tax)->value
                                                    ? ($item->quantity * $item->cost * $item->barcode->item->tax->value) / 100
                                                    : 0) }}
                                        </td>
                                        <td class="sm-td dsip">{{ $item->discount_amount }}</td>
                                        <td class="sm-td dsip">
                                            {{ $item->quantity * $item->cost +
                                                (optional($item->barcode->item->tax)->value
                                                    ? ($item->quantity * $item->cost * $item->barcode->item->tax->value) / 100
                                                    : 0) -
                                                $item->discount_amount }}
                                        </td>
                                        <td class="sm-td dsip">{{ $item->bonus }}</td>
                                        <td class="sm-td dsip"></td>
                                        <td class="sm-td dsip"></td>
                                        <td class="sm-td">{{ $item->notice }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                        </div>
                    </div>

                    <div class="border p-1 my-2">
                        <p>
                            @lang('warehouses/purchase-orders/show.notes') :
                        <p>{{ $overviewBond['bond']->notice }}</p>
                        </p>
                    </div>

                    <div class="mt-4 dsip">
                        <h4>@lang('warehouses/purchase-orders/show.purchase_request_conditions') :</h4>

                        @php $ar_purchase_order_conditions = \App\Models\Setting::whereName('ar_purchase_order_conditions')->first()->value; @endphp
                        <ul>
                            @foreach ($ar_purchase_order_conditions as $purchase_order_condition)
                                <li>{{ $purchase_order_condition }}</li>
                            @endforeach
                        </ul>
                    </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();
            let title = "طلب شراء";
            const print_data = @json(Session::get('print_data'));
            const css_link = "/tenancy/assets/css/accounting/printing/bonds.css";
            printSection.print(target, print_data, title, css_link, true, {});
            const bond_id = $(this).attr('data-bondId');
            this.increasePrintingCount(bond_id);
        });
    </script>
@endpush