@extends("layout.app")

@section('style')
    <style>
        #alert {
            position: fixed;
            bottom: 10px;
            right: 10px;
        }
    </style>
    <style>
        .gift-cards-container {
            display: inline-block;
            margin-right: 5px;
        }

        .badge {
            padding: 10px;
            color: #fff;
        }

        .gift-card-button {
            font-weight: normal;
            font-size: 11px;
            cursor: pointer;
        }

        .gift-card-button:hover {

        }

        .gift-card-button {
            margin-left: 8px;
        }

        .gift-card-button i {
            margin-left: 1px;
        }
    </style>
@endsection

@section("content")
    <style>
        #alert {
            position: fixed;
            bottom: 10px;
            right: 10px;
        }
    </style>
    <style>
        .gift-cards-container {
            float: left;
        }

        .badge {
            padding: 10px;
            color: #fff;
        }

        .gift-card-button {
            font-weight: normal;
            font-size: 11px;
            cursor: pointer;
        }

        .gift-card-button:hover {

        }

        .gift-card-button {
            margin-left: 8px;
        }

        .gift-card-button i {
            margin-left: 1px;
        }
    </style>
    <section class="bg--secondary space--sm">
        <div class="alert alert-success" id="alert"
             style="display: none;position: fixed; bottom:5px;z-index:1;right:25px">
            تم تحديث الكمية المطلوبة بنجاح
        </div>
        <div class="container">
            <div class="row">
                @include("customers.aside")
                <div class="col-lg-9">
                    @if (session()->has("success"))
                        <div class="alert alert-success">
                            <ul>
                                <li>{{session()->get("success")}}</li>
                            </ul>
                        </div>
                    @endif
                    @php $laser_total =0 @endphp
                    @if(false && !in_array($order->status->code,['reserve',"return","archive","no-answer","canceled","confirm-order",'no-payment']))

                        <div class="boxed boxed--lg boxed--border">
                            <h4>تتبع الطرد</h4>
                            <ul class="process-stepper clearfix"
                                data-process-steps="{{in_array($order->status->code,["partial-delivery","partial-ship"]) ? "5" : "4"}}">
                                <li @if(in_array($order->status->code,["pending-cto","delivered","pending",'pending-payment','preparing-payment',"preparing","partial-ship","partial-delivery","shipped","shipped-b","shipped-wd","declined"])) class="active" @endif>
                                    @if($order->payment_method=="cash")<span>بإنتظار التأكيد</span>@else <span>بإنتظار الدفع</span> @endif
                                </li>
                                <li @if(in_array($order->status->code,["pending-cto","delivered","preparing","shipped",'preparing-payment',"partial-ship","partial-delivery","shipped-b","shipped-wd"])) class="active" @endif>
                                    @if($order->status->code=="pending-cto")
                                        <span> قيد الإنتظار CTO</span> @elseif($order->payment_method=="cash")<span>قيد التجهيز</span>@else
                                        <span>قيد الدفع</span> @endif
                                </li>
                                <li @if(in_array($order->status->code,["delivered","shipped","shipped-b","shipped-wd","partial-ship","partial-delivery"])) class="active" @endif>
                                    @if(in_array($order->status->code,["shipped","shipped-b","shipped-wd"]))
                                        <span>{{$order->status->title}}</span>
                                    @elseif(in_array($order->status->code,["partial-delivery","partial-ship"]))
                                        <span>شحن جزئي</span>
                                    @else
                                        <span>تم الشحن</span>
                                    @endif
                                </li>
                                @if(in_array($order->status->code,["partial-delivery","partial-ship"]))
                                    <li @if(in_array($order->status->code,["partial-delivery"])) class="active" @endif>
                                        <span>تسليم جزئي</span>
                                    </li>
                                @endif
                                <li @if(in_array($order->status->code,["delivered"])) class="active" @endif>
                                    <span>تم التسليم</span>
                                </li>
                            </ul>

                        </div>
                        @endif

                        <div class="boxed boxed--lg boxed--border">
                            <div class="head row">
                                <div class="col-8">
                                    <h4 class="mb-2"> تفاصيل الطلب {{$order->track_id}}
                                    </h4>
                                    الحالة
                                    <span style="background-color:{{$order->status->color}}; color:white;"
                                          class="badge px-3 py-2 mb-2">{{$order->status->title}}</span>

                                    @if($order->order_items()->where("preorder",1)->count()>0)
                                        <span class="badge px-3 py-2 mb-2"
                                              style="background-color:#7138c7; color:white;"><i
                                                class="fas fa-calendar-check"></i> طلب مسبق </span>
                                    @endif
                                </div>
                                <div class="col-4 text-left">
                                    @if($order->status->code=="preparing-payment" || $order->status->code=="declined")
                                        <a href="{{route("order-pay",$order->track_id)}}"
                                           class="btn btn-success">ادفع
                                            الان</a>
                                    @endif
                                </div>
                            </div>

                            <table class="border--round table--alternate-row">
                            <thead>
                            <tr>
                                <th>المنتج</th>
                                <th>السعر</th>
                                {{--                                <th>الحالة</th>--}}
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($order->order_items as $order_item)
                                <tr class="order-item">
                                    <!-- order item prices -->
                                    <td hidden>
                                        <input
                                            hidden
                                            id="none-discounted-{{$order_item->id}}"
                                            class="none-discounted-price"
                                            value="{{ $order_item->price_before ?? $order_item->price }}"
                                        >
                                        <input
                                            hidden
                                            id="discounted-{{$order_item->id}}"
                                            class="discounted-price"
                                            value="{{ $order_item->price }}">
                                        <input
                                            hidden
                                            id="laser-{{$order_item->id}}"
                                            class="laser-price"
                                            value="{{ $order_item->laser_engraving_price * $order_item->laser_quantity }}">
                                    </td>
                                    <td class="text-center w-50">
                                        @if($order_item->item)
                                            {!!
                                                \IHouse::wrapHtmlElementWithLink(
                                                    '<small class="d-block">%s</sm><br/><strong>%s</strong>',
                                                    $modelLink = \IHouse::getModelLink($order_item->item, $order_item->color, $order_item->order_item_upgrades),
                                                    $order_item->item_color->code,
                                                    $order_item->item->nickname
                                                )
                                            !!}

                                            {!!
                                                \IHouse::wrapHtmlElementWithLink(
                                                    '<img width="%s" alt="%s" src="%s" />',
                                                    $modelLink,
                                                    '140px',
                                                    $order_item->item->name,
                                                    url("https://cdn.ihouse.ps/{$order_item->item_color->image_default}")
                                                )
                                            !!}
                                            <br>
                                            <div class="modal-instance">
                                                <a class="modal-trigger" href="#">
                                                        <span class="">
                                                            المواصفات
                                                        </span>
                                                </a>
                                                <div class="modal-container">
                                                    <div class="modal-content">
                                                        <div class="boxed boxed--lg">
                                                            <h2>التفاصيل</h2>
                                                            <hr class="short">
                                                            @foreach($order_item->item->activeSpecifications()->get() as $spec)
                                                                @if($spec->title && $spec->spec_category->is_on_listing)
                                                                    <li>{!! $spec->title !!}</li>@endif
                                                            @endforeach
                                                            @foreach($order_item->order_item_upgrades as $order_item_upgrade)
                                                                <li>{!! $order_item_upgrade->upgrade->name !!}</li>
                                                            @endforeach
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        @elseif($order_item->accessory)
                                            {!!
                                                \IHouse::wrapHtmlElementWithLink(
                                                    '<small class="d-block">%s</sm><br/><strong>%s</strong>',
                                                    $modelLink = \IHouse::getModelLink($order_item->accessory, $order_item->color),
                                                    ($order_item->accessory_color ? $order_item->accessory_color->code : $order_item->accessory->code),
                                                    $order_item->accessory->name
                                                )
                                            !!}