@extends(get_view('pages.user.index'))
@section('user.sidebar-my-orders')
    active
@endsection
@section('user.content')

    <div class="py-6 p-md-6 p-lg-10">
        <!-- heading -->
        <h2 class="mb-6">{{ __('Siparişlerim') }}</h2>

        @if ($orders->total() > 0)
            <div class="table-responsive-xxl border-0">
                <!-- Table -->
                <table class="table mb-0 table-centered">
                    <!-- Table Head -->
                    <thead class="bg-light">
                        <tr>
                            <th>Sipariş Numarası</th>
                            <th>Tarih</th>
                            <th>Ürün Sayısı</th>
                            <th>Durum</th>
                            <th>Toplam Tutar</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>

                        @foreach ($orders as $key => $order)
                            <!-- Table body -->
                            <tr>
                                <td class="align-middle border-top-0">
                                    <a href="#" class="text-inherit">{{ $order->order_number }}</a>
                                </td>
                                <td class="align-middle border-top-0">
                                    {{ $order->created_at->format('d M, Y') }}
                                </td>
                                <td class="align-middle border-top-0">
                                    {{ $order->order_products->count() }}
                                </td>
                                <td class="align-middle border-top-0">
                                    @if ($order->status == 0)
                                        <span class="badge bg-warning">{{ __('Onay Bekliyor') }}</span><br>
                                    @elseif ($order->status == 1)
                                        <span class="badge bg-success">{{ __('Sipariş Onaylandı') }}</span><br>
                                    @elseif ($order->status == 2)
                                        <span class="badge bg-danger">{{ __('Sipariş İptal Edildi') }}</span><br>
                                    @endif
                                </td>
                                <td class="align-middle border-top-0">
                                    {{ $order->get_price(false) }}
                                </td>
                                <td class="text-muted align-middle border-top-0">
                                    <a href="#" class="text-inherit" data-bs-toggle="collapse"
                                        data-bs-target="#order_{{ $order->order_number }}">
                                        <i class="feather-icon icon-eye"></i>
                                    </a>
                                </td>
                            </tr>
                            <tr class="collapse position-relative" id="order_{{ $order->order_number }}">
                                <td colspan="10" class="bg-light">

                                    @if ($order->invoice_filename != null)
                                        <div class="text-right">
                                            <a href="{{ Common::get_order_invoice($order->id, $order->invoice_filename) }}"
                                                target="_blank" class="btn btn-outline-dark btn-sm"><i
                                                    class="bi bi-receipt"></i> Faturayı Görüntüle</a>
                                        </div>
                                    @endif

                                    @foreach ($order->order_products as $order_product)
                                        <div class="border-bottom p-2 mb-2">

                                            <div class="pl-3 pr-3 mb-4">
                                                @if ($order_product->order_status >= 0 && $order_product->order_status <= 3)
                                                    @include('admin.components.order.steps.inprogress')
                                                @elseif($order_product->order_status > 3 && $order_product->order_status <= 5)
                                                    @include('admin.components.order.steps.return')
                                                @endif
                                            </div>

                                            <div class="row">
                                                <div class="col-md-6 col-12">
                                                    <div class="media d-flex align-items-center">
                                                        <a
                                                            href="{{ route('product.detail', ['permalink' => $order_product->product->content->permalink]) }}">
                                                            @if ($order_product->product->first_image != null)
                                                                <img src="{{ Common::get_product_small_image($order_product->product_id, $order_product->product->first_image->name) }}"
                                                                    class="img-thumbnail mr-3"
                                                                    alt="{{ $order_product->product->content->name }}"
                                                                    width="150">
                                                            @else
                                                                <div class="bg-white shadow-sm border mr-3 d-flex align-items-center justify-content-center text-center text-secondary mb-2"
                                                                    style="width: 100px; height: 100px; font-size: 10px;">
                                                                    {{ __('Ürün Fotoğrafı Bulunamadı') }}
                                                                </div>
                                                            @endif
                                                        </a>
                                                        <div class="media-body ms-2">
                                                            <div>
                                                                <h6 class="mt-1">
                                                                    {{ $order_product->product->content->name ?? '-' }}
                                                                </h6>
                                                                <p class="m-0 mb-2 p-0 text-success fw-bold">
                                                                    {{ $order_product->get_price(false) }} <small
                                                                        class="text-muted">({{ $order_product->quantity }}x)</small>
                                                                </p>
                                                                <p class="m-0 p-0">
                                                                    {{-- <a href="#" class="text-primary"><i class="bi bi-star"></i> Ürünü Değerlendir</a> --}}
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-md-6 col-12">
                                                    <div class="row">

                                                        @if ($order_product->order_status >= 2)
                                                            @if ($order_product->cargo_company_name != null && $order_product->cargo_number != null)
                                                                <div class="col-6">
                                                                    <p class="m-0 mb-2 p-0 fs-11">
                                                                        <b>{{ __('Kargo Firması') }}:</b><br>
                                                                        {{ $order_product->cargo_company_name }}</p>
                                                                    <p class="m-0 p-0 fs-11">
                                                                        <b>{{ __('Kargo Numarası') }}:</b><br>
                                                                        {{ $order_product->cargo_number }}</p>
                                                                </div>
                                                            @endif
                                                        @endif

                                                        @if ($order_product->can_review())
                                                            <div class="col-6">
                                                                    <a href="#"
                                                                    class="btn btn-outline-primary w-100 mb-2 fs-12"
                                                                    data-order-product-id="{{ $order_product->id }}"
                                                                    data-bs-toggle="modal"
                                                                    data-bs-target="#reviewModal">
                                                                    {{ __('Ürünü Değerlendir') }}</a>

                                                            </div>
                                                        @endif

                                                        <div class="col-6">
                                                            @if ($order_product->invoice_filename != null)
                                                                <a href="#"
                                                                    class="btn btn-outline-primary w-100 mb-2 fs-12">{{ __('Faturayı Gör') }}</a>
                                                            @endif

                                                            @if ($order_product->can_return())
                                                                <a href="#"
                                                                    class="btn btn-outline-danger btn-sm w-100 mb-2 fs-12"
                                                                    data-order-product-id="{{ $order_product->id }}"
                                                                    data-bs-toggle="modal"
                                                                    data-bs-target="#returnRequestModal">{{ __('İade Talebi Oluştur') }}</a>
                                                            @elseif($order_product->return_request())
                                                                <div class="text-danger py-2">
                                                                    <p class="text-danger">
                                                                        <i class="fa fa-info-circle"
                                                                            style="width: 15px; height: 15px; text-align: center;"
                                                                            data-toggle="tooltip"
                                                                            title="Ürünü koşullarına uygun şekilde kargo ile geri gönderdiğinizde veya iade işleminiz satıcı tarafından onaylandığında işlemler tamamlanacaktır."></i>
                                                                        {{ __('İade Talebi Oluşturuldu') }}
                                                                    </p>
                                                                </div>
                                                            @endif
                                                        </div>

                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach

                                    <div class="p-3">
                                        <div class="row">
                                            <div class="col-sm-6 col-12">
                                                <h6>{{ __('Teslimat Adresi') }}</h6>
                                                <p class="m-0 p-0"><b>{{ $order->delivery_address->fullname }}</b></p>
                                                <p class="m-0 p-0">{{ $order->delivery_address->phone }}</p>
                                                <p class="m-0 p-0">
                                                    {{ $order->delivery_address->country->name }}/{{ $order->delivery_address->city }}/{{ $order->delivery_address->district }}
                                                    - {{ $order->delivery_address->postcode }}</p>
                                                <p class="m-0 p-0">{{ $order->delivery_address->address }}</p>
                                            </div>
                                            <div class="col-sm-6 col-12">
                                                <h6>{{ __('Fatura Adresi') }}</h6>
                                                <p class="m-0 p-0"><b>{{ $order->invoice_address->fullname }}</b></p>
                                                <p class="m-0 p-0">{{ $order->invoice_address->phone }}</p>
                                                <p class="m-0 p-0">
                                                    {{ $order->invoice_address->country->name }}/{{ $order->invoice_address->city }}/{{ $order->invoice_address->district }}
                                                    - {{ $order->invoice_address->postcode }}</p>
                                                <p class="m-0 p-0">{{ $order->invoice_address->address }}</p>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        @endforeach

                    </tbody>
                </table>

                <div class="col-12 pt-4">
                    {{ $orders->links() }}
                </div>

            </div>
        @else
            <div class="col-12 text-center py-5">
                <h4>{{ __('Sipariş Bulunamadı') }}</h4>
                <p>{{ __('Sepetinize ürünler ekleyerek alışveriş yapabilirsiniz.') }}</p>
                <p>
                    <a href="/" class="btn btn-primary btn-sm">
                        {{ __('Alışverişe Başla') }}
                    </a>
                </p>
            </div>
        @endif

    </div>

    <!-- Modal -->

    <div class="modal fade" id="reviewModal" tabindex="-1" aria-labelledby="reviewModalLabel"
        aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <form action="{{ route('front.user.order-product.review.store') }}" method="POST">
                    @csrf
                    <input type="hidden" name="order_product_id" value="" required>
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="reviewModalLabel">{{ __('Ürünü Değerlendir') }}</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <!-- star -->
                        <div class="form-group">
                            <label for="">{{ __('Ürünü değerlendiriniz:') }}</label>
                            <div class="rating fs-1 cursor-pointer">
                                <input type="radio" name="rate" id="star1" value="1" required hidden>
                                <label for="star1"><i class="bi bi-star"></i></label>
                                <input type="radio" name="rate" id="star2" value="2" required hidden>
                                <label for="star2"><i class="bi bi-star"></i></label>
                                <input type="radio" name="rate" id="star3" value="3" required hidden>
                                <label for="star3"><i class="bi bi-star"></i></label>
                                <input type="radio" name="rate" id="star4" value="4" required hidden>
                                <label for="star4"><i class="bi bi-star"></i></label>
                                <input type="radio" name="rate" id="star5" value="5" required hidden>
                                <label for="star5"><i class="bi bi-star"></i></label>
                            </div>
                        </div>
                        <!-- comment -->
                        <div class="form-group">
                            <label for="">{{ __('Yorumunuzu giriniz:') }}</label>
                            <textarea name="comment" id="comment" rows="3" class="form-control"
                                placeholder="Ürün hakkındaki yorumunuzu giriniz..."></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary"
                            data-bs-dismiss="modal">{{ __('İptal') }}</button>
                        <button type="submit" class="btn btn-primary">{{ __('Gönder') }}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="modal fade" id="returnRequestModal" tabindex="-1" aria-labelledby="returnRequestModalLabel"
        aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <form action="{{ route('front.user.order-product.return.store') }}" method="POST">
                    @csrf
                    <input type="hidden" name="order_product_id" value="" required>
                    <div class="modal-header">
                        <h1 class="modal-title fs-5" id="returnRequestModalLabel">{{ __('İade Talebi Oluştur') }}</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label for="">{{ __('İade nedenini giriniz:') }}</label>
                            <textarea name="reason" id="reason" rows="3" class="form-control"
                                placeholder="Ürünü iade etme sebebini giriniz..."></textarea>
                            <small>{{ __('Bu ürünün iade koşullarını doğru bir şekilde karşıladığınız taktirde 14 gün içinde teslim edebilirsiniz.') }}</small>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary"
                            data-bs-dismiss="modal">{{ __('İptal') }}</button>
                        <button type="submit" class="btn btn-primary">{{ __('Oluştur') }}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

@endsection
@section('user.footer')
    <script>
        $(document).ready(function() {
            const myModalEl = document.getElementById('returnRequestModal')
            myModalEl.addEventListener('show.bs.modal', event => {
                var order_product_id = $('a[data-bs-target="#returnRequestModal"]').data(
                'order-product-id');
                $('#returnRequestModal input[name="order_product_id"]').val(order_product_id);
            })
            const myModalEl2 = document.getElementById('reviewModal')
            myModalEl2.addEventListener('show.bs.modal', event => {
                var order_product_id = $('a[data-bs-target="#reviewModal"]').data(
                'order-product-id');
                $('#reviewModal input[name="order_product_id"]').val(order_product_id);
            })
            //.rating input onclik fill star
            $('.rating input').on('click', function() {
                var star = $(this).val();
                $(this).parent().children('label').removeClass('text-warning');
                $(this).parent().children('label').removeClass('text-secondary');
                $(this).parent().children('label').each(function(index) {
                    if (index < star) {
                        $(this).removeClass('text-secondary');
                        $(this).children('i').removeClass('bi-star');
                        $(this).children('i').addClass('bi-star-fill');
                        $(this).addClass('text-warning');
                    } else {
                        $(this).children('i').removeClass('bi-star-fill');
                        $(this).children('i').addClass('bi-star');
                        $(this).addClass('text-secondary');
                    }
                });
            });

        })
    </script>
@endsection