@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>
        <i class="fa fa-circle"></i>
        <span>{{ __('Reports') }}</span>
      </li>
      <li>
        <i class="fa fa-circle"></i>
        <span> <a href="{!! route('index.sales') !!}">{{ __('Sales') }}</a> </span>
      </li>
      <i class="fa fa-circle"></i>
      <span>{{ __('Stagnant products') }}</span>
      <li>
    </li>
    </ul>
    <div class="page-toolbar">
      <div class="btn-group pull-left">
        <div class="actions">
        </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">{{ __('Stagnant products') }}</span>
            <h1 class="page-title">
              <small>  </small>
            </h1>
          </div>
          <div class="actions">
          </div>
        </div>
        <div class="portlet-body">
          <div class="row">
            <div class="col-md-12">
              <div class="portlet-title">
                <div class="caption center">
                  <span class="caption-subject font-purple-soft bold">{{ __('Stagnant products') }}</span>
                  <span class="caption-subject bold uppercase font-dark">{!! __('During the month') !!} <b>{!! Date('m-Y') !!}</b>
                  </span>
                  <br>
                </div>
              </div>
              <br>
              <table class="table table-striped custom-table"  >
                <tr>
                  <th></th>
                  <th>{!! __('Item title') !!}</th>
                  <th>{!! __('Current Balance') !!}</th>
                  <th>{!! __('Quantity sold') !!}</th>
                </tr>
                @foreach ($products as $key => $product)
                  <tr id='{{ $product->id }}'>
                    <td>
                      {{ $loop->index + 1 }}
                    </td>
                    <td>{!! $product->title !!}</td>
                    <td class="center msg-success">{!! $product->balance !!}</td>
                    <td class="center info">{!! $product->solds_count !!}</td>
                  </tr>
                @endforeach
              </table>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  {!! Form::close() !!}
  @if (count($products) > 0)
  <div class="row">
    <div class="col-12 text-center">
      <a target="_blank" href="{{ route('print.top.stagnants.orders') }}" class="btn btn-primary btn-lg ml-auto"><i class="fa fa-print"></i> {{ __('Print') }}</a>
      {{-- <a href="{{ route('invoice.pdf', $order->order_number) }}" class="btn btn-info btn-sm ml-auto"><i class="fa fa-file-pdf-o"></i> {{ __('Export PDF') }}</a> --}}
    </div>
  </div>
@endif
@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