@extends('layouts.app', ['activePage' => 'dashboard', 'titlePage' => __('Dashboard')])

@section('content')
  <div class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-lg-12 col-md-12 ">
          <div class="card card-chart">
            <div class="card-header card-header-warning">
              <div>{!! $chart->container() !!}</div>
            </div>
            <div class="card-body">
              <h4 class="card-title">Counted Companies by Category</h4>
            </div>

          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-md-6">
          <div class="card card-chart">
            <div class="card-header card-header-warning">
              <div>{!! $membershipChart->container() !!}</div>
            </div>
            <div class="card-body">
              <h4 class="card-title">Companies by Membership Type</h4>
            </div>
          </div>
        </div>
        <div class="col-md-6">
          <div class="card card-chart">
            <div class="card-header card-header-warning">
              <div>{!! $ownershipChart->container() !!}</div>
            </div>
            <div class="card-body">
              <h4 class="card-title">Companies by Ownership Type</h4>
            </div>
          </div>
        </div>
      </div>
      <div class="row">

        <div class="col-lg-12 col-md-12 col-sm-12">
          <div class="card card-chart">
            <div class="card-header card-header-warning">
              <div>{!! $amountChart->container() !!}</div>
            </div>
            <div class="card-body">
              <h4 class="card-title">Companies by Project Amount($)</h4>
            </div>

          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-12">
          <div class="card card-stats">
            <div class="card-header card-header-danger card-header-icon">
              <div class="card-icon">
                <i class="fa fa-file-text"></i>
              </div>
              <p class="card-category">Total Documents</p>
              <h3 class="card-title">{{ $totalDoc }}</h3>
            </div>
            <div class="card-footer">
              <div class="stats">
                Counted all type documents
              </div>
            </div>
          </div>
        </div>
        <div class="col-lg-6 col-md-6 col-sm-12">
          <div class="card card-stats">
            <div class="card-header card-header-info card-header-icon">
              <div class="card-icon">
                <i class="fa fa-industry"></i>
              </div>
              <p class="card-category">Total Companies</p>
              <h3 class="card-title">{{ $totalCompany }}</h3>
            </div>
            <div class="card-footer">
              <div class="stats">
                Counted all type companeis
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection

@push('js')
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js">
  <script src="{{ asset('js/Chart.bundle.min.js') }}" defer></script>
 {!! $chart->script() !!}
 {!! $amountChart->script() !!}
 {!! $membershipChart->script() !!}
 {!! $ownershipChart->script() !!}
@endpush