@extends('Front.templates.master')
    <!-- jQuery -->
    <script src="{{asset('vendors/jquery/dist/jquery.min.js')}}"></script>
     <script src="{{asset('chart/dist/Chart.min.js')}}" ></script>
    <script src="{{asset('chart/chartjs_demo.js')}}"></script>
            <!-- menu profile quick info -->
            
            <!-- /menu profile quick info -->

            

            <!-- sidebar menu -->
            
            <!-- /sidebar menu -->

            <!-- /menu footer buttons -->
            <!--<div class="sidebar-footer hidden-small">
              <a data-toggle="tooltip" data-placement="top" title="Settings">
                <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="FullScreen">
                <span class="glyphicon glyphicon-fullscreen" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="Lock">
                <span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="Logout" href="login.html">
                <span class="glyphicon glyphicon-off" aria-hidden="true"></span>
              </a>
            </div>-->
            <!-- /menu footer buttons -->
          

        <!-- top navigation -->
        
        <!-- /top navigation -->

        <!-- page content -->
        @section('content')
          <div class="">
            <div class="page-title">
              <div class="title_left" style="margin-bottom: 25px">
                <h1><i class="fa fa-dashboard"></i>Tableau de bord</h1>
                <p>Otracking, les clients savent ou se touvent leur colis</p>
              </div>

              
            </div>
            <div class="clearfix"></div>
	    <div class="row">

               <div class="col-sm-12">
                        <div class="form-group">

                                        <div class="col-md-12" style="text-align:left;padding-top:20px">

                                         @if (session('error'))
                                    <div class="alert alert-danger">
                     {{ session('error') }}
                                    </div>
                      @endif

                      @if(!$errors->isEmpty())
                        <div class="alert alert-danger">
                        @foreach($errors->all() as $error)
                          {{$error}}<br/>
                        @endforeach
                        </div>
                      @endif

                      @if (session('message'))
                                    <div class="alert alert-success">
                     {{ session('message') }}
                                    </div>
                      @endif


                      @if (session('dependencie'))
                                    <div class="alert alert-info">
                     {{ session('dependencie') }}
                                    </div>
                      @endif


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

            <div class="row">
              <div class="col-md-12">
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <div class="row">
                      <a href="{{route('commande.en.cours')}}"><div class="animated flipInY col-md-6 col-sm-6">
                        <div class="tile-stats">
                          <div class="icon"><i class="fa fa-shopping-cart fa-3x"></i>
                          </div>
                          <div class="count">{{ $nb_cmd_en_cours }}</div>

                          <h3>COMMANDES EN ATTENTE</h3>
                          
                        </div>
                      </div></a>
                      <a href="{{route('commande.transitaire')}}"><div class="animated flipInY col-md-6">
                        <div class="tile-stats">
                          <div class="icon"><i class="fa fa-user fa-3x"></i>
                          </div>
                          <div class="count">{{ $nb_cmd_transitaire }}</div>

                          <h3>CHEZ LE TRANSITAIRE</h3>
                        </div>
                      </div></a>
                    </div>
                    <div class="row">
                      <a href="{{route('commande.en.livraison')}}"><div class="animated flipInY col-md-6 col-sm-6">
                        <div class="tile-stats">
                          <div class="icon"><i class="fa fa-truck fa-3x"></i>
                          </div>
                          <div class="count">{{ $nb_cmd_en_livraison }}</div>

                          <h3>EN COURS DE LIVRAISON</h3>
                          
                        </div>
                      </div></a>
                      <a href="{{route('commande.livree')}}"><div class="animated flipInY col-md-6">
                        <div class="tile-stats">
                          <div class="icon"><i class="fa fa-thumbs-o-up fa-3x"></i>
                          </div>
                          <div class="count">{{ $nb_cmd_livree }}</div>

                          <h3>COMMANDES LIVRÉES</h3>
                        </div>
                      </div></a>
                    </div><br/>
                    
                    
                    <div class="row">
                    <div class="animated flipInY col-md-6 col-sm-5">
                        <div class="tile-stats">
                            <div class="ibox-head">
                                <div class="ibox-title"><h3>GRAPHE MENSUEL DES COMMANDES</h3></div>
                            </div>
                            <div class="ibox-body">
                                <div>
                                    <canvas id="line_chart" style="height:200px;"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="animated flipInY col-md-6 col-sm-5 ">
                        <div class="tile-stats">
                            <div class="ibox-head">
                                <div class="ibox-title"><h3>GRAPHE DES COMMANDES EN COURS</h3></div>
                            </div>
                            <div class="ibox-body">
                                <div>
                                    <canvas id="bar_chart" style="height:200px;"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>
                </div><br/>
                
                
                   <div class="row">
                    <div class="animated flipInY col-md-12 col-sm-12">
                        <div class="tile-stats">
                            <div class="ibox-head">
                                <div class="ibox-title"><h3>GRAPHE DU CHIFFRE D'AFFAIRE</h3></div>
                            </div>
                            <div class="ibox-body">
                                <div>
                                    <canvas id="bar_charts" style="height:200px;"></canvas>
                                </div>
                            </div>
                        </div>
                    </div>
                </div><br/>
                         
            
                    
        </div>
      </div>
    </div>
  </div>

            
        @endsection('content')
        <!-- /page content -->

        <!-- footer content -->
        <!--<footer>
          <div class="pull-right">
            Gentelella - Bootstrap Admin Template by <a href="https://colorlib.com">Colorlib</a>
          </div>
          <div class="clearfix"></div>
        </footer>-->
        <!-- /footer content -->