@extends('layouts.app')

@section('title', $title ?? 'Order Delivered')
@section('breadcrumb', $title ?? 'Order Delivered')
@section('sub-breadcrumb')
<a href="{{$route ?? route('order.receive')}}" class="kt-subheader__breadcrumbs-link">
        List
    </a>
    <span class="kt-subheader__breadcrumbs-separator"></span>
    <a class="kt-subheader__breadcrumbs-link">
        Detail Items
    </a>
@endsection
@section('order-p', 'kt-menu__item--open kt-menu__item--here')
@section($active ?? 'order-receive', 'kt-menu__item--active')
@section('content')
    <div class="kt-portlet">
        <div class="kt-portlet__body">
            @include('layouts.notification')
            <div class="row">
                <div class="col-md-6">
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Oulet Name</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['brand_outlet']['name']}}
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Oulet Address</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['brand_outlet']['address']}}
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Order Date</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['order_date']}}
                        </div>
                    </div>
                    @if ($order['brand_outlet']['status_franchise'] == 0)
                        <div class="row mb-1">
                            <div class="col-md-4">
                                <strong>Item Transfer</strong>
                            </div>
                            <div class="col-md-8">
                                : <strong>{{$order['item_transfer_id_accurate']}}</strong>
                            </div>
                        </div>
                        <div class="row mb-1">
                            <div class="col-md-4">
                                <strong>Gudang</strong>
                            </div>
                            <div class="col-md-8">
                                : <strong>{{$order['brand_outlet']['accurate_warehouse']['name']}}</strong>
                            </div>
                        </div>
                    @else
                        <div class="row mb-1">
                            <div class="col-md-4">
                                <strong>Sales Order</strong>
                            </div>
                            <div class="col-md-8">
                                : <strong>{{$order['order_id_accurate']}}</strong>
                            </div>
                        </div>
                        <div class="row mb-1">
                            <div class="col-md-4">
                                <strong>Delivery Order</strong>
                            </div>
                            <div class="col-md-8">
                                : <strong>{{$order['delivery_order_id_accurate']}}</strong>
                            </div>
                        </div>
                    @endif
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Status Outlet</strong>
                        </div>
                        <div class="col-md-8">
                            :   @if ($order['brand_outlet']['status_franchise'] == 1)
                                    Outlet Franchise
                                @else
                                    Outlet Brand
                                @endif
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Total Items</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['item_total']}} pcs
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>User Order</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['user_order']['name']}}
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>User Email</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['user_order']['email']}}
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>User Phone</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['user_order']['phone']}}
                        </div>
                    </div>
                    <div class="row mb-1">
                        <div class="col-md-4">
                            <strong>Address</strong>
                        </div>
                        <div class="col-md-8">
                            : {{$order['address'] ?? '-'}}
                        </div>
                    </div>
                </div>
            </div>

            <div class="kt-separator kt-separator--dashed"></div>

            <div class="col-md-12 mt-2 pl-0">
                <h5><i class="flaticon2-delivery-truck"></i> Detail Barang</h5>
                <table class="table">
                        <tr>
                            <th>Item</th>
                            <th>Qty</th>
                            <th>SKU</th>
                            <th>Unit</th>
                            @if ($order['status'] == "BARANG DITERIMA - LUNAS - BERMASALAH" || $order['is_problem'] == 1)
                                <th style="width:15%;">Receive Item</th>
                            @endif
                        </tr>
                    @foreach ($order['brand_outlet_order_details'] as $item)
                        <tr>
                            <td>{{$item['name']}}</td>
                            <td>{{$item['qty']}}</td>
                            <td>{{$item['brand_item']['accurate_code']}}</td>
                            <td>{{$item['brand_item']['brand_item_unit2_order']['unit']['name']}}</td>
                            @if ($order['status'] == "BARANG DITERIMA - LUNAS - BERMASALAH" || $order['is_problem'] == 1)
                                @if ($item['qty_send'] == null)
                                    <td class="text-center">
                                        {{$item['qty']}}
                                    </td>
                                @else
                                    <td class="text-center" style="background:red; color:white;">
                                        {{$item['qty_send']}}
                                    </td>
                                @endif
                            @endif
                        </tr>
                    @endforeach
                </table>
            </div>

            <div class="kt-separator kt-separator--dashed"></div>

            <div class="col-md-12 mt-2 pl-0">
                <h5><i class="flaticon2-document"></i> Keterangan</h5>
                <div class="row">
                    <div class="col-md-6">
                        @foreach ($order['brand_outlet_order_descs'] as $item)
                            <div class="row mb-2">
                                <div class="col-md-4">
                                    <strong>{{$item['key']}}</strong>
                                </div>
                                <div class="col-md-8">
                                    : {{$item['value']}}
                                </div>
                            </div>
                        @endforeach

                        @if (isset($order['note']))
                            <div class="mt-5">
                                <h5><i class="flaticon2-document"></i> Catatan Penerimaan Order</h5>
                                <p>{{$order['note']}}</p>
                            </div>
                        @endif
                    </div>
                    <div class="col-md-6">
                        <div class="col-md-12">
                            <strong>Gambar lampiran pengiriman order:</strong><br>
                            @foreach ($order['brand_outlet_order_images'] as $item)
                                @if ($item['status'] == "ship")
                                    @if (strpos($item['image'], "pdf"))
                                        <a href="{{url('pdf-show').'?image='.$item['image']}}" target="_blank">Lihat pdf</a>

                                    @else
                                    <a class="image-link" href="{{url('image-show').'?image='.$item['image']}}">
                                        <img src="{{url('image-show').'?image='.$item['image']}}" class="img-thumbnail" width="100">
                                    </a>
                                    @endif
                                @endif
                            @endforeach
                        </div>
                        <div class="col-md-12 mt-3">
                            <strong>Gambar order diterima:</strong><br>
                            @foreach ($order['brand_outlet_order_images'] as $item)
                                @if ($item['status'] == "receive")
                                    <a class="image-link" href="{{url('image-show').'?image='.$item['image']}}">
                                        <img src="{{url('image-show').'?image='.$item['image']}}" class="img-thumbnail" width="100">
                                    </a>
                                @endif
                            @endforeach
                        </div>
                    </div>

                </div>
            </div>

            @if (isset($timeline))
                <div class="kt-separator kt-separator--dashed"></div>

                <div class="col-md-12 mt-2 pl-0">
                    <h5><i class="flaticon-app"></i> TimeLine</h5>
                    <br>
                    <div class="row">
                        <div class="col-xl-4">
                            <div class="kt-timeline-v1 kt-timeline-v1--justified">

                            @foreach ($timeline as $item)

                                <div class="kt-timeline-v1__items mb-0 p-3">
                                    <div class="kt-timeline-v1__marker"></div>

                                    <div class="kt-timeline-v1__item kt-timeline-v1__item--first">
                                        <div class="kt-timeline-v1__item-circle">
                                            <div class="kt-bg-danger"></div>
                                        </div>

                                        <span class="kt-timeline-v1__item-time kt-font-brand" style="right:0%">
                                            {{$item['created_at']}}
                                        </span>

                                        <div class="kt-timeline-v1__item-content p-4">
                                            <div class="kt-timeline-v1__item-title">
                                                {{$item['subject']}}

                                            </div>
                                            <div class="kt-timeline-v1__item-body">
                                                Email: {{$item['email']}} <br>
                                                User: {{$item['user']}}
                                            </div>
                                            {{-- <div class="kt-timeline-v1__item-actions">
                                                <a href="#" class="btn btn-sm btn-label-brand btn-bold">Show more ...</a>
                                            </div> --}}
                                        </div>
                                    </div>
                                </div>
                            @endforeach



                            </div>
                        </div>
                    </div>
                </div>
            @endif

        </div>
    </div>

    {{-- begin: modal --}}
    <div class="modal fade" id="openImage" tabindex="-1" role="dialog" aria-labelledby="openImageLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body text-center">
                <img id="gambar" src="" style="max-width:100%;">
            </div>
        </div>
        </div>
    </div>
    {{-- end: modal --}}
@endsection
@section('custom-style')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.css">
@endsection
@section('custom-script')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
    <script>
        $(document).ready(function() {
            $('.image-link').magnificPopup({type:'image'});
        });
    </script>
    <script>
        function openModal(data) {
            $('#gambar').attr("src", data);
            $('#openImage').modal('show');
        }
    </script>
@endsection