@extends('admin.layouts.app')

@section('content')
<!-- BEGIN PAGE HEADER-->
<div class="row">
    <div class="col-md-12">
        <!-- BEGIN PAGE TITLE & BREADCRUMB-->
        <h3 class="page-title">{{ $pageTitle }} <small></small></h3>
        {{ Breadcrumbs::render('admin.order.show', $data) }}
        <!-- END PAGE TITLE & BREADCRUMB-->
    </div>
</div>
<!-- END PAGE HEADER-->

<!-- BEGIN PAGE CONTENT-->
<div class="row">
    <div class="col-md-12">

        @include('admin.partials.errors')

        <!-- BEGIN SAMPLE FORM PORTLET-->
        <div class="portlet box blue">

            <div class="portlet-title">
                <div class="caption">
                    <i class="fa fa-search"></i> {{ $pageTitle }}
                </div>
            </div>

            <div class="portlet-body">

                <h4>&nbsp;</h4>

                <div class="form-horizontal" role="form">
                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Customer:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->customer->first_name }} {{ $data->customer->last_name }}</label>
                        </div>
                    </div>
                    @if($data->order_type == 'pickup')
                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Restaurant:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->restaurant->title }}</label>
                        </div>
                    </div>
                    @endif

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Address:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->address }}</label>
                        </div>
                    </div>


                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Country:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->country }}</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Order Type:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->order_type }}</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Phone:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->phone }}</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Order Status:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->order_status }}</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Grand Total:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->grand_total }}</label>
                        </div>
                    </div>


                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Paid Amount:</strong> </label>
                        <div class="col-md-8">
                            <label class="control-label">{{ $data->paid_amount }}</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-md-2 control-label"><strong>Status:</strong> </label>
                        <div class="col-md-8">
                        <select name="order_status" onchange='uppdateStatus(this,"{{ route('admin.orders.update-status',$data->id) }}");' class="status form-control"
                                data-id="{{$data->id}}">

                            <option
                                    value="pending" {{$data->order_status == 'pending'?'selected':''}} > Pending</option>
                            <option
                                    value="processing" {{$data->order_status == 'processing'?'selected':''}} >Processing</option>
                            <option
                                    value="completed" {{$data->order_status == 'completed'?'selected':''}} >Completed</option>
                            <option
                                    value="cancelled" {{$data->order_status == 'cancelled'?'selected':''}} > Cancelled</option>
                        </select>
                        </div>
                    </div>

                    <div class="col-md-8">

                        <div class="portlet box blue">

                            <div class="portlet-title">
                                <div class="caption">
                                    <i class="fa fa-th"></i> Order Items
                                </div>
                            </div>


                            <div class="portlet-body">
                                <table class="table table-striped table-bordered table-hover" id="sample_1">
                                    <thead>
                                    <tr>
                                        <th>Menu</th>
                                        <th>Qty</th>
                                        <th>Price</th>
                                        <th>Extras</th>
                                        <th>Total</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach ($data->items as $key => $item)
                                        <tr class="odd gradeX">
                                            <td>{!! $item->menu->title !!} </td>
                                            <td>{!! $item->qty !!}</td>
                                            <td>{!! $item->price !!}</td>
                                            <td> @if($item->extras)
                                                @foreach($item->extras as $extras)
                                                   {!! $extras->name !!},
                                                 @endforeach
                                                @endif
                                            </td>
                                            <td>{!! $item->total !!}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>


                    <div class="col-md-8">

                        <div class="portlet box blue">

                            <div class="portlet-title">
                                <div class="caption">
                                    <i class="fa fa-th"></i> Order Transaction
                                </div>
                            </div>


                            <div class="portlet-body">
                                <table class="table table-striped table-bordered table-hover" id="sample_1">
                                    <thead>
                                    <tr>
                                        <th>Amount</th>
                                        <th>Payment For</th>
{{--                                        <th>Payment Type</th>--}}
                                        <th>Status</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="odd gradeX">
                                            <td>{!! $transaction->amount!!} </td>
                                            <td>{!! $transaction->payment_for !!}</td>
{{--                                            <td>{!! $transaction->payment_type !!}</td>--}}
                                            <td>{!! $transaction->payment_status !!}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10"></div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-offset-2 col-md-10">
                            <button class="btn black" id="cancel" onclick="window.location.href = '{!! URL::route('admin.order.index') !!}'"> < Back..</button>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <!-- END SAMPLE FORM PORTLET-->
    </div>
</div>
<!-- END PAGE CONTENT-->
@stop

@section('footer-js')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.24.0/axios.min.js" integrity="sha512-u9akINsQsAkG9xjc1cnGF4zw5TFDwkxuc9vUp5dltDWYCSmyd0meygbvgXrlc/z7/o4a19Fb5V0OUE58J7dcyw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script type="text/javascript" src="{!! URL::to('assets/admin/plugins/select2/select2.min.js') !!}"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
    <script src="{!! URL::to('assets/admin/scripts/core/app.js') !!}"></script>
<script>
    function uppdateStatus(input,url) {
        let data2 = {
            val:$(input).val(),
            name:$(input).attr('name')
        }
        console.log(data2);
        axios.post(url,data2).then(function (response) {
            swal({
                title: "Status Updated!",
                text: "",
                icon: "success",
                button: "Ok!",
            });
            // toastr.success("Status Updated");
            // console.log('success');
        }).catch(function (error) {
            $(input).attr('disabled',false);
            $.each(error.response.data.errors, function (k, v) {
                $('input[name="' + k + '"]').addClass("has-error");
                $('input[name="' + k + '"]').after("<span class='text-danger'>" + v[0] + "</span>");
            });
        });
    }
jQuery(document).ready(function() {
   // initiate layout and plugins
   App.init();
   Admin.init();
});
</script>
@stop