@extends("layouts.admin.app")
@section("page-title")
    {{__("Dashboard")}}
@endSection
@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1><i class="fa fa-dashboard"></i>{{__("Replies of Special Request")}}</h1>
            <p>{{__("All Replies of Special Request")}}</p>
        </div>
        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="#">{{__("Dashboard")}}</a></li>
            <li class="breadcrumb-item"><a href="#">{{__("Replies of Special Request")}}</a></li>
        </ul>
    </div>
@endsection
@section("css-links")
    <link rel="stylesheet" href="{{asset("assets/css/" . app()->getLocale() . "/pages/orders.css")}}">
@endsection

@section("content")
    @include("includes.dialog")

    <div class="row">
        <div class="col-12">
        </div>
        <div class="row col-lg-12">
            <div class="col-lg-6 p-3">
            </div>
        </div>

        <div class="col-12">
            <div class="tile">
                <div class="tile-body">
                    <div class="table-responsive">
                        <table class="table table-hover table-bordered" id="sampleTable">
                            <thead>
                            <tr>
                                <th>#{{__("ID")}}</th>
                                <th>#{{__("Shipment Number")}}</th>
                                <th>{{__("User Information")}}</th>
                                <th>{{__("Description")}}</th>
                                <th>{{__("Image")}}</th>
                                <th>{{__("Widget Price")}}</th>
                                <th>{{__("Delivery Price")}}</th>
                                <th>{{__("VAT")}}</th>
                                <th>{{__("Total Price")}}</th>
                                <th>{{__("Warranty (days)")}}</th>
                                <th>{{__("Status")}}</th>
                                <th>{{__("Vendor Information")}}</th>
                                <th>{{__("Created At")}}</th>
                                <th>{{__("Pick-up Driver Name")}}</th>
                                <th>{{__("Pick-up Phone Number")}}</th>
                                <th>{{__("selected location Form")}}</th>
                                <th>{{__("Drop-off Driver Name")}}</th>
                                <th>{{__("Drop-off Driver Phone Number")}}</th>
                                <th>{{__("selected location To")}}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($orders as $order)
                                <tr>
                                    <td>{{$order->id}}</td>
                                    <td>{{$order->shipment_num}}</td>
                                    <td>
                                        <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample{{$order->id}}" role="button" aria-expanded="false" aria-controls="collapseExample">
                                            {{__("Show")}}
                                        </a>
                                        <div class="collapse" id="collapseExample{{$order->id}}">
                                            <div class="card card-body">
                                                <table>
                                                    <tr>
                                                        <th>{{__("Name")}}</th>
                                                        <th>{{__("Phone")}}</th>
                                                        <th>{{__("Type")}}</th>
                                                    </tr>
                                                    <tr>
                                                        <td>{{$order->specialRequest->users->full_name}}</td>
                                                        <td>{{$order->specialRequest->users->phone_number}}</td>
                                                        <td>{{$order->specialRequest->users->getTypeNameAttributes()}}</td>


                                                    </tr>
                                                </table>
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{$order->description}}</td>
                                    <td>
                                        <button type="button" class="btn btn-primary view-attachemnts" data-toggle="modal" data-target="#image{{$order->id}}">
                                            View
                                        </button>
                                        <!-- Modal -->
                                        <div class="modal fade" id="image{{$order->id}}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                            <div class="modal-dialog modal-xl">
                                                <div class="modal-content" style="height: 800px;overflow-y: auto;">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="exampleModalLabel">Attachments</h5>
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body mt-2 mb-2" >
                                                        <div class="row">
                                                            @if($order->getFirstMediaFile("specialRequestReplied_photo"))
                                                                @foreach($order->getMediaFiles("specialRequestReplied_photo") as $file)
                                                                    <div class="col-4">
                                                                        <img src="{{$file->url}}" width="100%">
                                                                    </div>
                                                                @endforeach
                                                            @endif
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{$order->widget_price}}</td>
                                    <td>{{$order->deliveryPrice->price}}</td>
                                    <td>{{$tax}}</td>
                                    <td>{{$order->total_price}}</td>
                                    <td>{{$order->warranty}}</td>
                                    <td>
                                        @switch($order->status)
                                            @case(3)
                                            <span style="color: green" >{{__('ordered')}}</span>
                                            @break;
                                            @default
                                            <span style="color: red" >{{__('not ordered')}}</span>
                                            @break;
                                        @endswitch


                                    </td>
                                    <td>
                                        <a class="btn btn-primary" data-toggle="collapse" href="#collapseExample2{{$order->id}}" role="button" aria-expanded="false" aria-controls="collapseExample2">
                                            {{__("Show")}}
                                        </a>
                                        <div class="collapse" id="collapseExample2{{$order->id}}">
                                            <div class="card card-body">
                                                <table>
                                                    <tr>
{{--                                                        <th>{{__("Owner Name")}}</th>--}}
{{--                                                        <th>{{__("Owner Phone")}}</th>--}}
                                                        <th>{{__("Market Name")}}</th>
                                                        <th>{{__("Market Phone")}}</th>
                                                    </tr>
                                                    @php
                                                        $userVendorInfo=$order->vendorSpecialRequestWithTrashed()->withTrashed()->first()->vendor;
                                                        $providedSectionInfo = \App\Models\ProvidedSection::where("user_id",$userVendorInfo["id"])->first();
                                                    @endphp
                                                            <tr>
{{--                                                                <td>{{$userVendorInfo['full_name']}}</td>--}}
{{--                                                                <td>{{$userVendorInfo["phone_number"]}}</td>--}}
                                                                <td>{{$providedSectionInfo->getNameAttribute()}}</td>
                                                                <td>{{$providedSectionInfo->phone_number}}</td>
                                                            </tr>
                                                </table>
                                            </div>
                                        </div>
                                    </td>
                                    <td>{{$order->updated_at->diffForHumans()}}</td>
                                    <td>{{$order->driver_name}}</td>
                                    <td>
                                        {{$order->driver_phone_number}}
                                    </td>
                                    <td>
                                        @php
                                        $providedSectionInfo = \App\Models\ProvidedSection::where('user_id',$userVendorInfo["id"])->first();
                                        @endphp
                                        <iframe style="height:150px; width:150px"
                                                id="map"
                                                allowfullscreen
                                                src="https://www.google.com/maps/embed/v1/place?key={{env("GOOGLE_API_KEY")}}&q={{$providedSectionInfo->lat}},{{$providedSectionInfo->lng}}">
                                        </iframe>
                                    </td>
                                    <td> {{$order->second_driver_name}}</td>
                                    <td> {{$order->second_driver_phone_number}}</td>
                                    <td>
                                        <iframe style="height:150px; width:150px"
                                                id="map"
                                                allowfullscreen
                                                src="https://www.google.com/maps/embed/v1/place?key={{env("GOOGLE_API_KEY")}}&q={{$order->lat}},{{$order->lng}}">
                                        </iframe>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section("scripts")
    <!-- Data table plugin-->
    <script type="text/javascript" src="{{asset("assets/js/plugins/jquery.dataTables.min.js")}}"></script>
    <script type="text/javascript" src="{{asset("assets/js/plugins/dataTables.bootstrap.min.js")}}"></script>
    <script type="text/javascript">$('#sampleTable').DataTable({
            "pageLength" : 100,
            "order": [[ 0, "desc" ]]
        });</script>
    <script>
        $("#FilterButton").on("click", function (){
            let  url = $(this).data("url"),
                activation = $("#Activation").val(),
                status = $("#Status").val()
            url = status ? `${url}/${status}` : url;
            url = activation ? `${url}?active=${activation}` : url;
            window.location = url
        });
    </script>
    <script type="text/javascript">
        $(".download-excel").click(function (e){
            e.preventDefault();

            let status = $("#status-filter option:selected").data("value");


            $(this).siblings("input[name='status']").val(status);


            $("#form-excel").submit();

        });
    </script>
    <script>
        $(".checked").on("click", function (){
            var id = $(this).data("id"),
                url = $(this).data("url");
            $("#from" + id).attr("disabled", "disabled");
            $("#to" + id).removeAttr("disabled");
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                type: "POST",
                url: url,
                data: {"id" : id, "status": 1},
                success: function( response ) {
                    resolve (response);
                },
                error : function (response) {
                    resolve(response);
                }
            });
        })

        $(".checked2").on("click", function (){
            var id = $(this).data("id"),
                url = $(this).data("url");
            $("#to" + id).attr("disabled", "disabled");
            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $.ajax({
                type: "POST",
                url: url,
                data: {"id" : id, "status": 2},
                success: function( response ) {
                    resolve (response);
                },
                error : function (response) {
                    resolve(response);
                }
            });
        })
    </script>


@endsection