@extends('layouts.app')
@section('title') Orders @endsection


@section('css')
    <link href="{{asset('assets/vendors/custom/datatables/datatables.bundle.css')}}" rel="stylesheet" type="text/css"/>
@endsection

@section('content')

    <!-- begin:: Subheader -->
    <div class="kt-subheader   kt-grid__item" id="kt_subheader">
        <div class="kt-subheader__main">
            <h3 class="kt-subheader__title">
                Orders</h3>
            <span class="kt-subheader__separator kt-hidden"></span>
        </div>
    </div>

    <!-- end:: Subheader -->

    <!-- begin:: Content -->
    <div class="kt-content  kt-grid__item kt-grid__item--fluid" id="kt_content">

        <div class="kt-portlet kt-portlet--mobile">
            <div class="kt-portlet__head kt-portlet__head--lg">
                <div class="kt-portlet__head-label">
										<span class="kt-portlet__head-icon">
											<i class="kt-font-brand flaticon2-user red"></i>
										</span>
                    <h3 class="kt-portlet__head-title">
                        Orders Table
                    </h3>
                    <a href="javascript:;" class="btn red-btn" id="export_excel">
                        <i class="kt-nav__link-icon la la-file-excel-o"></i>
                        <span class="kt-nav__link-text">Excel</span>
                    </a>
                </div>


            </div>
            <div class="kt-portlet__body table-responsive">


                <table class="table table-striped- table-bordered table-hover table-checkable table_1" id="">
                    <thead>
                    <tr>
                        <th class="text-center">#</th>
                        <th class="text-center">User</th>
                        <th class="text-center">Phone</th>
                        <th class="text-center">City</th>
                        <th class="text-center">District</th>


                        <th class="text-center">Total</th>
                        <th class="text-center">Payment</th>

                        <th class="text-center">Status</th>
                        <th class="text-center">Products</th>

                    </tr>
                    </thead>
                    <tbody>
                    @foreach($orders as $order)
                        <tr>

                            <td class="text-center">
                                <a href="{{route('orders.products',$order->id)}}">{{$order->id}}</a>
                            </td>
                            <td class="text-center">
                                {{$order->name}}
                            </td>
                            <td class="text-center">
                                {{$order->phone}}
                            </td>
                            <td class="text-center">
                                {{$order->city}}
                            </td>
                            <td class="text-center">
                                {{$order->district}}
                            </td>

                            <td class="text-center">
                                @if($order->status == "Canceled")
                                    0
                                @else
                                    {{$order->total}}
                                @endif
                                JD
                            </td>
                            <td class="text-center @if(strtolower($order->payment_type) == 'visa') kt-font-success @elseif(strtolower($order->payment_type) == 'master') red @endif">
                                {{$order->payment_type}}
                            </td>


                            <td class="text-center">
                                {{$order->status}}


                            </td>
                            <td class="text-center">
                                @foreach($order->getProducts as $product)
                                    {{$product->productCarts->name. ' ('.$product->quantity.')'.',' }} <br/>
                                @endforeach
                            </td>


                        </tr>
                    @endforeach
                    </tbody>
                </table>
                <!--end: Datatable -->
            </div>
        </div>

    </div>
@endsection
@section('js')
    <script src="{{asset('assets/js/demo1/pages/crud/forms/widgets/select2.js')}}" type="text/javascript"></script>
    <script src="{{asset('assets/js/demo1/pages/crud/forms/widgets/bootstrap-datepicker.js')}}"></script>
    <script src="{{asset('assets/js/demo1/pages/crud/forms/widgets/bootstrap-timepicker.js')}}" type="text/javascript"></script>
    <script src="{{asset('assets/vendors/custom/datatables/datatables.bundle.js')}}" type="text/javascript"></script>
    <script src="{{asset('assets/js/demo1/pages/crud/datatables/extensions/buttons.js')}}" type="text/javascript"></script>
@endsection