@extends('admin.admin')

@section('content')
    <div class="container" style="margin-top: 100px;">
        <div class="invoice">
            <div class="printContent invoice-print">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="invoice-title" style="display: flex; justify-content: space-between">
                            <img src="{{ asset('/apricot.jpg') }}" alt="" style="width: 120px; height: 100px;">
                            <div class="invoice-number my-2">#{{ $order->invoice_no }}</div>
                        </div>
                        <hr>
                        <div class="row" style="display: flex; justify-content: space-between;">
                            <div class="col-md-6">
                                <address>
                                    <strong>Billed To:</strong><br>
                                    {{ $order->billingInfo->name }}<br>
                                    {{ $order->billingInfo->phone }}<br>
                                </address>
                            </div>

                            <div class="col-md-6 text-md-right">
                                <address>
                                    <strong>Shipped To:</strong><br>
                                    {{ Auth::guard('admin')->user()->name }}<br>
                                    {{ Auth::guard('admin')->user()->email }}<br>
                                </address>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <address>
                                    <p><b>Payment Method: </b> <span
                                            class="badge bg-primary text-white">{{ $order->payment_method }}</span></p><br>
                                </address>
                            </div>
                            <div class="col-md-6 text-md-right">
                                <address>
                                    <strong>Order Date:</strong><br>
                                    {{ date('d-M-Y', strtotime($order->created_at)) }}<br><br>
                                </address>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row mt-4">
                    <div class="col-md-12">
                        <div class="section-title">Order Summary</div>
                        <div class="table-responsive">
                            <table class="table table-striped table-hover table-md">
                                <tr>
                                    <th data-width="40">#</th>
                                    <th>Item</th>
                                    <th class="text-center">Price</th>
                                    <th class="text-center">Quantity</th>
                                    <th class="text-right">Totals</th>
                                </tr>

                                @php
                                    $subtotal = 0;
                                @endphp

                                @foreach ($order->orderItem as $sl => $item)
                                    <tr>
                                        <td>{{ $sl + 1 }}</td>
                                        <td>
                                            <span>{{ $item->product->name }}</span>
                                            <br>
                                            @if ($item->size_id != '')
                                                <span>Size: {{ $item->size->name }}</span>
                                            @else
                                                <span>Size: NA</span>
                                            @endif

                                            @if ($item->color_id != '')
                                                <span class="mx-2">Color: {{ $item->color->name }}</span>
                                            @else
                                                <span class="mx-2">Color: NA</span>
                                            @endif
                                        </td>

                                        <td class="text-center">
                                            <span>{{ $item->price }}</span>
                                        </td>

                                        <td class="text-center">{{ $item->quantity }}</td>

                                        @php
                                            $price = $item->price;
                                            $quantity = $item->quantity;
                                            $productPrice = $price * $quantity;
                                            $subtotal += $productPrice;
                                        @endphp

                                        <td class="text-right">{{ $productPrice }}</td>
                                    </tr>
                                @endforeach
                            </table>
                        </div>

                        <div class="row mt-4 d-print-none">
                            {{-- <div class="col-lg-8">
                                <form action="{{ route('admin.order.status.update', $order->id) }}" method="POST">
                                    @csrf

                                    <div class="row">
                                        <div class="col-lg-12 my-2">
                                            <label>Payment Status</label>
                                            <select name="payment_status" class="form-control">
                                                <option>Payment Status</option>
                                                <option value="pending" @selected($order->payment_status == 'pending')>pending
                                                </option>
                                                <option value="completed" @selected($order->payment_status == 'completed')>completed
                                                </option>
                                            </select>
                                        </div>

                                        <div class="col-lg-12 my-2">
                                            <label>Order Status</label>
                                            <select name="order_status" class="form-control">
                                                <option>Order Status</option>
                                                <option value="pending" @selected($order->order_status == 'pending')>pending
                                                </option>
                                                <option value="processed" @selected($order->order_status == 'processed')>processed
                                                </option>

                                                <option value="on_the_way" @selected($order->order_status == 'on_the_way')>on the way
                                                </option>

                                                <option value="delivered" @selected($order->order_status == 'delivered')>delivered
                                                </option>

                                                <option value="canceled" @selected($order->order_status == 'canceled')>canceled
                                                </option>
                                            </select>
                                        </div>

                                        <div class="modal-footer">
                                            <button type="submit" class="btn btn-primary">Submit</button>
                                        </div>

                                    </div>
                                </form>
                            </div> --}}

                            <div class="col-lg-12"
                                style="display: flex; flex-direction: column; justify-content: end; width: 100%; text-align: end;">
                                <div class="invoice-detail-item">
                                    <div class="invoice-detail-name">Subtotal</div>
                                    <div class="invoice-detail-value"
                                        style="font-weight: bold; font-size: 20px; color: black;">{{ $subtotal }}</div>
                                </div>

                                @php
                                    $discount = $order->discount ?? 0;
                                    $deliveryCharge = $order->delivery_charge;
                                    $totalAmount = $subtotal + $deliveryCharge - $discount;
                                @endphp

                                <div class="invoice-detail-item" style="margin-top: 10px;">
                                    <div class="invoice-detail-name">Delivery Charge</div>
                                    <div class="invoice-detail-value"
                                        style="font-weight: bold; font-size: 20px; color: black;">{{ $deliveryCharge }}
                                    </div>
                                </div>

                                <div class="invoice-detail-item" style="margin-top: 10px;">
                                    <div class="invoice-detail-name">Discount</div>
                                    <div class="invoice-detail-value"
                                        style="font-weight: bold; font-size: 20px; color: black;">{{ $discount ?? 0 }}
                                    </div>
                                </div>

                                <hr class="mt-2 mb-2">
                                <div class="invoice-detail-item" style="margin-top: 10px;">
                                    <div class="invoice-detail-name">Total</div>
                                    <div class="invoice-detail-value  style="font-weight: bold; font-size: 20px; color:
                                        black;"invoice-detail-value-
                                        style="font-weight: bold; font-size: 20px; color: black;"lg">{{ $totalAmount }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <hr>
            <div class="text-md-right">
                <button class="btn btn-warning btn-icon icon-left printBtn d-print-none"><i class="fas fa-print"></i>
                    Print</button>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $('.printBtn').on('click', function() {
            let printContent = $('.printContent').html();
            let printWindow = window.open('', '', 'width=1000, height=800');

            printWindow.document.open();

            printWindow.document.write('<html>');
            printWindow.document.write('<body>');

            printWindow.document.write(printContent);

            printWindow.document.write(
                '<link href="{{ asset('/admin_assets/css/style.css') }}" rel="stylesheet" type="text/css" id="app-style" /><link href="{{ asset('/admin_assets/css/components.css') }}" rel="stylesheet" type="text/css" id="app-style" />'
            );

            printWindow.document.write(
                '<link href="{{ asset('/admin_assets/modules/bootstrap/css/bootstrap.min.css') }}" />'
            );

            printWindow.document.write('</body>');
            printWindow.document.write('</html>');

            printWindow.document.close();
            printWindow.print();
        });
    </script>
@endpush