@extends('layouts.admin')
@section('title', 'Dashboard')
@section('content')

<div class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1 class="m-0">Dashboard</h1>
            <br>
            @if (Session::has('message'))
                    <div class="alert alert-danger">{{ Session::get('message') }}</div>
                @endif
          </div><!-- /.col -->
          
        </div><!-- /.row -->
      </div><!-- /.container-fluid -->
    </div>
<div class="container-fluid">
        <!-- Small boxes (Stat box) -->
        <div class="row">
          <div class="col-lg-3 col-6">
            <!-- small box -->
            <div class="small-box bg-info">
              <div class="inner">
                <h3>12</h3>

                <p>Order Booking</p>
              </div>
              <div class="icon">
                <!-- <i class="ion ion-bag"></i> -->
              </div>
              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
            </div>
          </div>
          <!-- ./col -->
          <div class="col-lg-3 col-6">
            <!-- small box -->
            <div class="small-box bg-success">
              <div class="inner">
                <h3>9</h3>

                <p>Categories</p>
              </div>
              <div class="icon">
              </div>
              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
            </div>
          </div>
          <!-- ./col -->
          <div class="col-lg-3 col-6">
            <!-- small box -->
            <div class="small-box bg-warning">
              <div class="inner">
                <h3>18</h3>

                <p>User Registrations</p>
              </div>
              <div class="icon">
                
              </div>
              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
            </div>
          </div>
          <!-- ./col -->
          <div class="col-lg-3 col-6">
            <!-- small box -->
            <div class="small-box bg-danger">
              <div class="inner">
                <h3>9</h3>

                <p>Items</p>
              </div>
              <div class="icon">
              </div>
              <a href="#" class="small-box-footer">More info <i class="fas fa-arrow-circle-right"></i></a>
            </div>
          </div>
          <!-- ./col -->
          
          <!-- ./col -->
          
          <!-- ./col -->
        </div>
        
        <!-- Main row -->
        <div class="row">
          <!-- Left col -->
          <section class="col-lg-6 connectedSortable">
            <!-- Custom tabs (Charts with tabs)-->
            
            <!-- DIRECT CHAT -->
            <div class="card">
              <div class="card-header border-0">
                <h3 class="card-title"><b>Latest Members</b></h3>
                
              </div>
              <div class="card-body table-responsive p-0">
                <table class="table table-striped table-valign-middle">
                  <thead>
                  <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Status</th>
                    <th>Date</th>
                  </tr>
                  </thead>
                  <tbody>
                   
                  <tr>
                    <td>1</td>
                    <td>Sahil</td>
                    <td>Active</td>
                    <td>31-01-2022</td>
                  </tr>
                
                  </tbody>
                </table>
              </div>
            </div>
            <!--/.direct-chat -->
          </section>
          <!-- /.Left col -->
          <!-- right col (We are only adding the ID to make the widgets sortable)-->
          <section class="col-lg-6 connectedSortable">

            <!-- DIRECT CHAT -->
            <div class="card">
              <div class="card-header border-0">
                <h3 class="card-title"><b>Latest Booking</b></h3>
              </div>
              <div class="card-body table-responsive p-0">
                <table class="table table-striped table-valign-middle">
                  <thead>
                  <tr>
                    <th>Order ID</th>
                    <th>Invoice Date</th>
                    <th>Status</th>
                    <th>Payment Type</th>
                  </tr>
                  </thead>
                  <tbody> 
                  <tr>
                    <td>10001</td>
                    <td>31-01-2022</td>
                    <td>Active</td>
                    <td>CARD</td>
                  </tr>
                  </tbody>
                </table>
              </div>
            </div>
            <!--/.direct-chat -->
          </section>
          <!-- right col -->
        </div>
        <!-- /.row (main row) -->
        <div class="row">
            <div class="col-md-3 col-sm-6 col-xs-12">
              <div class="info-box">
                <span class="info-box-icon bg-blue"><i class="fa fa-check-circle"></i></span>
                <div class="info-box-content">
                  <span class="info-box-text">Order Delivered</span>
                  <span class="info-box-number">4</span>
                </div><!-- /.info-box-content -->
              </div><!-- /.info-box -->
            </div><!-- /.col -->
            <div class="col-md-3 col-sm-6 col-xs-12">
              <div class="info-box">
                <span class="info-box-icon bg-green"><i class="fas fa-external-link-square-alt"></i></span>
                <div class="info-box-content">
                  <span class="info-box-text">Orders To Deliver</span>
                  <span class="info-box-number">8</span>
                </div><!-- /.info-box-content -->
              </div><!-- /.info-box -->
            </div><!-- /.col -->

            <!-- fix for small devices only -->
            <div class="clearfix visible-sm-block"></div>

            <div class="col-md-3 col-sm-6 col-xs-12">
              <div class="info-box">
                <span class="info-box-icon bg-yellow"><i class="fas fa-remove-format"></i></span>
                <div class="info-box-content">
                  <span class="info-box-text">Booking Cancelled</span>
                  <span class="info-box-number">7</span>
                </div><!-- /.info-box-content -->
              </div><!-- /.info-box -->
            </div><!-- /.col -->
            <div class="col-md-3 col-sm-6 col-xs-12">
              <div class="info-box">
                <span class="info-box-icon bg-red"><i class="fa fa-check-circle"></i></span>
                <div class="info-box-content">
                  <span class="info-box-text">Total Booking</span>
                  <span class="info-box-number">4</span>
                </div><!-- /.info-box-content -->
              </div><!-- /.info-box -->
            </div><!-- /.col -->
          </div>
        <!-- /.row -->
      </div><!-- /.container-fluid -->

@endsection