@extends('home')
@section('title')
  @lang('site.site_name')
@endsection
@section('styles')
  {!! Html::style(Theme::current()->assetPath.'/pages/css/profile.min.css') !!}
  {!! Html::style(Theme::current()->assetPath.'/global/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css') !!}


  {!! Html::style(Theme::current()->assetPath.'/global/plugins/bootstrap-fileinput/bootstrap-fileinput.css') !!}
  {!! Html::style(Theme::current()->assetPath.'/global/plugins/bootstrap-switch/css/bootstrap-switch.min.css') !!}
  {!! Html::style(theme_url('css/bootstrap-datepicker.min.css')) !!}
  <style media="screen">
  .datepicker {
    direction: rtl;
  }
  .datepicker.dropdown-menu {
    right: initial;
  }
  .table td.pd-20 ,
  .table th.pd-20 {
    padding: 20px 0;
    font-weight: bold;
    font-size: 16px;
  }
  </style>
@endsection
@section('content')
  <div class="page-bar">
    <ul class="page-breadcrumb">
      <li>
        <a href="{{ route('dashboard.home.page') }}">{{ __('Home') }}</a>
        <i class="fa fa-circle"></i>
      </li>
      <li>
        {{ __('Reports') }}
        <i class="fa fa-circle"></i>
      </li>
      <li>
        <span>{{ __('Orders') }}</span>
      </li>
    </ul>
    <div class="page-toolbar">
      <div class="btn-group pull-left">
        <div class="actions">
          <a href="{!! URL::route('admin.product.index') !!}" class="btn btn-sm green">
            <i class="fa fa-newspaper-o"></i> {{ __('All Products') }}
          </a>
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <div class="portlet light bordered">
        <div class="portlet-title">
          <div class="caption">
            <i class="fa fa-edit font-purple-soft"></i>
            <span class="caption-subject font-purple-soft bold">{{ __('Orders') }}</span>
            <h1 class="page-title">
              <small>  </small>
            </h1>
          </div>
          <div class="actions">
            <a href="{{ route('dashboard.home.page') }}" class="btn btn-xs grey-cascade"> {{ __('Home') }}
              <i class="fa fa-home"></i>
            </a>
          </div>
        </div>
        <div class="portlet-body">
          <table class="table table-striped custom-table"  >
            <tr role="row" class="filter">
              <td>
                <div class="margin-bottom-5">
                  <button class="btn btn-sm btn-success filter-submit margin-bottom">
                    <i class="fa fa-search"></i> {!! __('Search') !!}</button>
                  </div>
                </td>
              <td>
                <input type="text" class="form-control form-filter input-sm" name="order_id" value="{!! old('order_id',request('order_id')) !!}">
              </td>
            <td>
              <input type="text" class="form-control form-filter input-sm" name="search" value="{!! old('search',request('search')) !!}">
            </td>
            <td>
            </td>
              <td>
              </td>
              <td>
              </td>
              <td>
                <select name="order_status" style="width: 100%;min-width:100%" onchange="this.form.submit()" class="form-control form-filter input-sm">
                  <option value="">{!! __('Select') !!}</option>
                  <option value="2" @if (old('order_status',request('order_status')) ==2) selected @endif >{!! __('Pending') !!}</option>
                  <option value="1" @if (old('order_status',request('order_status')) == 1) selected @endif>{!! __('Done') !!}</option>
                  <option value="-1" @if (old('order_status',request('order_status')) == -1) selected @endif>{!! __('Canceled') !!}</option>
                </select>
              </td>

              <td>
                <div class="input-group date date-picker margin-bottom-5" data->
                  <input type="text" class="form-control form-filter input-sm" readonly name="date_from" placeholder="{!! __('From') !!}" value="{!! old('date_from',request('date_from')) !!}">
                  <span class="input-group-btn">
                    <button class="btn btn-sm default" type="button">
                      <i class="fa fa-calendar"></i>
                    </button>
                  </span>
                </div>
                <div class="input-group date date-picker">
                  <input type="text" class="form-control form-filter input-sm" readonly name="date_to" placeholder="{!! __('To') !!}"  value="{!! old('date_to',request('date_to')) !!}">
                  <span class="input-group-btn">
                    <button class="btn btn-sm default" type="button">
                      <i class="fa fa-calendar"></i>
                    </button>
                  </span>
                </div>
              </td>

                </tr>

                <thead>
                  <tr>
                    <th width="1%"></th>
                    <th width="15%">{!! __('Invoice number') !!}</th>
                    <th>{!! __('Customer') !!}</th>
                    <th>{!! __('Sales') !!}</th>
                    <th>{!! __('Delivery') !!}</th>
                    <th>{!! __('Region') !!}</th>
                    <th>{!! __('Status') !!}</th>
                    <th width="15%">{!! __('Date') !!}</th>
                  </tr>
                </thead>
                <tbody>
                  @foreach ($orders as $index => $order)
                    <tr id='{{ $order->id }}'>
                      <td>
                        {{ $loop->index + $orders->firstItem() }}
                      </td>
                      <td class="text-right"> <a href="{!! URL::route('admin.order.show', [$order->id]) !!}">{!! $order->order_number !!}</a>
                      </td>
                      <td>{!! @$order->user->name !!}
                      </td>
                      <td class="center info">{!! $order->price !!} {!! __('EGP') !!}
                      </td>
                      <td class="center ">{!! $order->delivery !!} {!! __('EGP') !!}
                      </td>
                      <td class="center ">{!! @$order->destination->title !!}
                      </td>
                      <td class="center msg-{!! $order->statuss !!}">{!! __($order->status) !!}
                      </td>
                      <td class="center">{{ $order->created_at->format('Y/m/d - h:i') }} {{ __($order->created_at->format('a')) }}
                      </td>
                    </tr>
                  @endforeach
                </tbody>
              </table>

              <div class="pagination pagination-centered"> {{ $orders->appends(request()->except('_token'))->links() }} </div>

            </div>
          </div>
        </div>
      </div>

      {!! Form::open(array('route' => 'index.orders','method' => 'POST',  'class' => 'form-inline margin-bottom-0','id' => 'myform')) !!}

    {!! Form::close() !!}

    @endsection
    @section('scripts')


      {!! Html::script(Theme::current()->assetPath.'/global/plugins/bootstrap-fileinput/bootstrap-fileinput.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/bootstrap-markdown/lib/markdown.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/bootstrap-markdown/js/bootstrap-markdown.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/jquery-validation/js/jquery.validate.min.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/jquery-validation/js/additional-methods.min.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/pages/scripts/form-validation.js') !!}
      {!! Html::script(Theme::current()->assetPath.'/global/plugins/jquery-ui/jquery-ui.min.js') !!}

      {!! Html::script(theme_url('js/bootstrap-datepicker.min.js')) !!}
      {!! Html::script(theme_url('js/bootstrap-datepicker.ar.min.js')) !!}
      <script type="text/javascript">
        $( function() {
          $("select").select2();
          $('.date-picker').datepicker({
            language: 'ar',
            format: 'yyyy-mm-dd',
            rtl: 0,
            autoclose: true,
            clearBtn: true,
            changeMonth: true,
            changeYear: true
          });
          $.ajaxSetup({
            headers: {
              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
          });
        } );
      </script>
    @endsection