@extends('admin.layout.index')
@section('title', '#' . $order->uniq)
@section('content')
    <section class="grid grid-cols-12 gap-5">
        <div class="col-span-9 flex flex-col gap-5">
            <div class="p-6 border border-zinc-200 rounded-lg grid grid-cols-2 gap-6">
                <div class="">
                    <h3 class="pb-5 text-gray-900 text-lg font-semibold"> Teslimat </h3>
                    <div class="flex flex-col gap-3">
                        <p class="text-gray-600">
                            Ad Soyad:<br><span class="text-emerald-600"> {{ $order->shipping_info->name }} {{ $order->shipping_info->surname }} </span>
                        </p>
                        <p class="text-gray-600">{{ $order->shipping_info->address }}</p>
                        <p class="text-gray-600">{{ db('region')->where('id', $order->shipping_info->city)->get()->first()->name }}/{{ db('region')->where('id', $order->shipping_info->country)->get()->first()->name }}</p>
                        <p class="text-gray-600">
                            E-posta Adresi: <br><span class="text-emerald-600">{{ $order->shipping_info->email }}</span>
                        </p>
                        <p class="text-gray-600">
                            Telefon:<br><span class="text-emerald-600">{{ $order->shipping_info->phone }}</span>
                        </p>
                        <p class="text-gray-600">
                            Kargo:<br><span class="text-emerald-600">{{ $order->cargo->name }}</span>
                        </p>
                    </div>
                </div>
                <div>
                    <h3 class="pb-5 text-gray-900 text-lg font-semibold"> Faturalandırma </h3>
                    <div class="flex flex-col gap-3">
                        <p class="text-gray-600">
                            Ünvan: <span class="text-emerald-600"> {{ $order->contact_info->title ?? "" }}</span>
                        </p>
                        <p class="text-gray-600">
                            Adres: <span class="text-emerald-600"> {{ $order->contact_info->bill_address ?? "" }}</span>
                        </p>
                        <p class="text-gray-600">
                            Vergi Numarası: <span class="text-emerald-600"> {{ $order->contact_info->tax_number ?? "" }}</span>
                        </p>
                        <p class="text-gray-600">
                            Vergi Dairesi: <span class="text-emerald-600"> {{ $order->contact_info->tax_office ?? "" }}  </span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="border border-zinc-200 rounded-lg">
                <section class="relative overflow-x-auto">
                    <table class="w-full text-sm text-left text-gray-500">
                        <thead class="text-xs text-gray-700 uppercase bg-gray-200/20">
                        <tr>
                            <th scope="col" class="px-6 py-3">
                                Ürün
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Miktar
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Stok Kodu
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Barkod
                            </th>
                            <th scope="col" class="px-6 py-3">
                                Tutar
                            </th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($products as $product)
                            @if($product->type == 'variant')
                                <tr class="bg-white border-b border-b-gray-100">
                                    <td class="px-6 py-4">
                                        <div class="flex items-center gap-2">
                                            <img src="{{ upload('products', json_decode($product->images)[0]) }}" alt="" class="w-10 h-10 rounded-md border border-gray-100 overflow-hidden">
                                            <span class="flex flex-col items-start">
                                                <span class="flex items-center">
                                                    <span>{{ $product->name }}</span>
                                                    <a href="{{ site('product/' . $product->slug) }}" target="_blank" style="padding-left: 8px"><i class="icon-share-04"></i></a>
                                                </span>
                                                <span class="text-xs">
                                                    @foreach($product->varaint_value_detail['name'] as $name)
                                                        {{ $name }} &nbsp;&nbsp;
                                                    @endforeach
                                                </span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="px-6 py-4">
                                        x{{ $product->total }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ $product->varaint_value_detail['stock_code'] }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ $product->varaint_value_detail['stock_barcode'] }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ CURRENCY . $product->total_fee }}
                                    </td>
                                </tr>
                            @else
                                <tr class="bg-white border-b border-b-gray-100">
                                    <td class="px-6 py-4">
                                        <div class="flex items-center gap-2">
                                            <img src="{{ upload('products', json_decode($product->images)[0]) }}" alt="" class="w-10 h-10 rounded-md border border-gray-100 overflow-hidden">
                                            <span class="flex items-center">
                                                <span>{{ $product->name }}</span>
                                                <a href="{{ site('product/' . $product->slug) }}" target="_blank" class="p-2"><i class="icon-share-04"></i></a>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="px-6 py-4">
                                        x{{ $product->total }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ $product->stock_code }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ $product->stock_barcode }}
                                    </td>
                                    <td class="px-6 py-4">
                                        {{ CURRENCY . $product->total_fee }}
                                    </td>
                                </tr>
                            @endif
                        @endforeach
                        </tbody>
                    </table>
                </section>
                <div class="p-6 flex items-end justify-end flex-col">
                    <table>
                        <tbody>
                        <tr>
                            <td class="pb-2">
                                <span class="text-gray-500">Ara Toplam:</span> &nbsp;&nbsp;&nbsp;
                            </td>
                            <td class="pb-2">
                                <span class="text-right block text-gray-600">{{ CURRENCY . $order->fees->tax }}</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="pb-2">
                                <span class="text-gray-500">Vergi (%{{ TAX }}):</span> &nbsp;&nbsp;&nbsp;
                            </td>
                            <td class="pb-2">
                                <span class="text-right block text-gray-600">{{ CURRENCY . $order->fees->total }}</span>
                            </td>
                        </tr>
                        @isset($order->fees->sale)
                            @if($order->fees->sale != "0,00")
                                <tr>
                                    <td class="pb-2">
                                        <span class="text-gray-500">Ara Toplam (Vergi Dahil):</span> &nbsp;&nbsp;&nbsp;
                                    </td>
                                    <td class="pb-2">
                                        <span class="text-right block text-gray-600">{{ CURRENCY . $order->fees->general_total }}</span>
                                    </td>
                                </tr>
                                <tr>
                                    <td class="pb-2">
                                        <span class="text-gray-500">İndirim Tutarı:</span> &nbsp;&nbsp;&nbsp;
                                    </td>
                                    <td class="pb-2">
                                        <span class="text-right block text-green-600">{{ CURRENCY . $order->fees->sale }}</span>
                                    </td>
                                </tr>
                            @endif
                        @endisset
                        @isset($order->fees->coupon)
                            <tr>
                                <td class="pb-2">
                                    <span class="text-gray-500">Kupon ({{ $order->fees->coupon->code }}):</span> &nbsp;&nbsp;&nbsp;
                                </td>
                                <td class="pb-2">
                                    <span class="text-right block text-green-600">{{ $order->fees->coupon->sale }}{{ $order->fees->coupon->type == "0" ? "%" : CURRENCY }}</span>
                                </td>
                            </tr>
                        @endisset
                        <tr>
                            <td class="pb-2">
                                <span class="text-gray-500">Kargo:</span> &nbsp;&nbsp;&nbsp;
                            </td>
                            <td class="pb-2">
                                <span class="text-right block text-gray-600">{{ CURRENCY . num_format($order->cargo_feature['fee']) }}</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="pb-2">
                                <span class="text-gray-500">Genel Toplam:</span> &nbsp;&nbsp;&nbsp;
                            </td>
                            <td class="pb-2">
                                <span class="text-right block text-gray-600">{{ CURRENCY . $order->fees->total_sale }}</span>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="col-span-3">
            <div class="flex flex-col gap-5">
                <div class="p-6 border border-zinc-200 rounded-lg flex flex-col gap-2">
                    <button id="order-detail-print-element" class="flex items-center justify-center gap-1 border border-gray-300 bg-gray-100 hover:bg-gray-300 px-4 py-2 rounded-md transition-colors duration-300">
                        <i class="icon-printer"></i>
                        Sipariş Detayını Yazdır
                    </button>
                    <button id="cargo-information-print-element" class="flex items-center justify-center gap-1 border border-gray-300 bg-gray-100 hover:bg-gray-300 px-4 py-2 rounded-md transition-colors duration-300">
                        <i class="icon-truck-02"></i>
                        Kargo Bilgisini Yazdır
                    </button>
                    @if($order->status == "2" || $order->status == "3" || $order->status == "4" || $order->status == "5" || $order->status == "0")
                        @if($invoice)
                            <a href="{{ upload('invoice', $invoice->file) }}" download="{{ $invoice->file  }}" class="flex w-full items-center justify-center gap-1 border border-gray-300 bg-gray-100 hover:bg-gray-300 px-4 py-2 rounded-md transition-colors duration-300">
                                <i class="icon-receipt"></i>
                                Fatura İndir
                            </a>
                        @endif
                    @endif
                </div>
                <form class="p-6 border border-zinc-200 rounded-lg form-container">
                    <div class="form-item">
                        <label for="order_status">Sipariş Durumu</label>
                        <select id="order_status">
                            <option value="1" {{ $order->status == "1" ? 'selected' : "" }}>Sipariş Oluşturuldu</option>
                            <option value="2" {{ $order->status == "2" ? 'selected' : "" }}>Sipariş Onaylandı</option>
                            <option value="3" {{ $order->status == "3" ? 'selected' : "" }}>Sipariş Hazırlanıyor</option>
                            <option value="4" {{ $order->status == "4" ? 'selected' : "" }}>Kargoya Verildi</option>
                            <option value="5" {{ $order->status == "5" ? 'selected' : "" }}>Teslim Edildi</option>
                            <option value="0" {{ $order->status == "0" ? 'selected' : "" }}>Sipariş İptali</option>
                        </select>
                    </div>
                    @isset($order->payment_info->status)
                        <div class="form-item">
                            <label> Ödeme Durumu </label>
                            @if($order->payment_info->status == 'Sanal pos ödemesi başarılı bir şekilde gerçekleştirildi.')
                                <span class="bg-green-100 flex py-2 border w-full border-green-300 px-3 rounded-lg text-green-600 items-center gap-2">
                                    {{ $order->payment_info->status }}
                                </span>
                            @else
                                <span class="bg-yellow-100 flex py-2 border w-full border-yellow-300 px-3 rounded-lg text-yellow-600 items-center gap-2">
                                    Ödeme Başarısız!
                                </span>
                            @endif
                        </div>
                    @endisset
                </form>
                @if($order->status == "2" || $order->status == "3" || $order->status == "4" || $order->status == "5" || $order->status == "0")
                    @if(!$invoice)
                        <form class="p-6 border border-zinc-200 rounded-lg" action="{{ site('api/v2/invoice-upload/' . $order->id) }}" method="POST" enctype="multipart/form-data" id="invoice-form">
                            {!! $csrf !!}
                            <div class="form-item">
                                <label for="invoice"> Fatura Yükle </label>
                                <input type="file" name="invoice" id="invoice">
                            </div>
                        </form>
                    @endif
                @endif
                @if($order->status == "4" || $order->status == "5")
                    <div class="p-6 border border-zinc-200 rounded-lg">
                        <form action="{{ site('api/v2/cargo-tracking-code') }}" class="form-container" method="POST">
                            {!! $csrf !!}
                            <input type="hidden" name="id" value="{{ $order->id }}">
                            <div class="form-item">
                                <label for="cargo_tracking_code">Kargo Takip Kodu</label>
                                <input type="text" id="cargo_tracking_code" name="cargo_tracking_code" value="{{ $order->shipping_info->tracking_code ?? '' }}">
                                @if(!isset($order->shipping_info->tracking_code))
                                    <span class="!text-orange-400 mt-2.5 text-sm flex items-center gap-2">
                                        <i class="icon-alert-circle"></i>
                                        Lütfen kargo takip kodunu giriniz!
                                    </span>
                                @endif
                            </div>
                            <div class="form-item flex items-end justify-end">
                                <button class="border border-gray-300 bg-gray-100 hover:bg-gray-300 px-4 py-2 rounded-md transition-colors duration-300" type="submit">
                                    Kaydet
                                </button>
                            </div>
                        </form>
                    </div>
                @endif
            </div>
        </div>
    </section>
    <div id="iframe-container" class="hidden opacity-0 invisible h-0 w-0"></div>
@endsection
@section('scripts')
    <style>.select2-search.select2-search--dropdown{display: none!important;}</style>
    <script>
        let iframe_container = document.querySelector('#iframe-container');
        let order_detail_print = "{{ site('admin/orders/print/order-detail/' . $order->id) }}";
        let order_detail_print_element = document.querySelector('#order-detail-print-element');
        let cargo_information_print = "{{ site('admin/orders/print/cargo-information/' . $order->id) }}";
        let cargo_information_print_element = document.querySelector('#cargo-information-print-element');

        order_detail_print_element.addEventListener('click', event => {
            let iframe = document.createElement('iframe');
            iframe.src = order_detail_print;
            iframe_container.append(iframe);
            iframe.contentWindow.addEventListener('afterprint', evnet => {
                iframe.remove();
            })
            event.preventDefault();
        })

        cargo_information_print_element.addEventListener('click', event => {
            let iframe = document.createElement('iframe');
            iframe.src = cargo_information_print;
            iframe_container.append(iframe);
            iframe.contentWindow.addEventListener('afterprint', evnet => {
                iframe.remove();
            })
            event.preventDefault();
        })
        @if($order->status == "2" || $order->status == "3" || $order->status == "4" || $order->status == "5" || $order->status == "0")
            @if(!$invoice)
                let invoice_file = document.querySelector('#invoice[name="invoice"]');
                let invoice_form = document.querySelector('form#invoice-form')
                invoice_file.addEventListener('input', event => {
                    console.log("dosya yüklendi");
                    console.log(event.target.value);
                    invoice_form.submit();
                })
            @endif
        @endif

        let order_status = $('#order_status');
        order_status.select2({});
        order_status.on('change.select2', (event) => {
            $.ajax({
                method: "GET",
                url: "{{ site('api/v2/change-status/' . $order->id) }}/" + event.target.value,
                data: {},
                success: function (response){
                    if(!response.error){
                        document.location = document.location
                    }
                }
            }, 'json')
        })
    </script>
@endsection