@extends('layouts.app')

@section('conteudo')

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

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

</center>



@if($permission_funcionario)


<!-- Hero -->
<div class="content">
  <div class="d-md-flex justify-content-md-between align-items-md-center py-3 pt-md-3 pb-md-0 text-center text-md-start">
    <div>
      <h1 class="h3 mb-1">
        Início
      </h1>
      <p class="fw-medium mb-0 text-muted">
        Bem Vindo, {{ $user->name }}! Visualize os teus dados.
      </p>
    </div>

  </div>
</div>
<!-- END Hero -->


<div class="col-sm-6 col-xl-3" style="margin-top: 20px; margin-bottom: 20px;">
  <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
    <div class="block-content block-content-full flex-grow-1">
      <div class="item rounded-3 bg-body mx-auto my-3">
        <i class="fa fa-book fa-lg text-primary"></i>
      </div>
      <div class="text-muted mb-3">Turmas</div>
    </div>
    <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
      @can('pode_visualizar_turma')
      <a class="fw-medium" href="/turmas">
        Ver todas as turmas
        <i class="fa fa-arrow-right ms-1 opacity-25" ></i>
      </a>
      @endcan
    </div >
  </div>
</div>
<!-- END Overview -->


@else



<!-- Hero -->
<div class="content row">
  <div class="d-md-flex justify-content-md-between align-items-md-center py-3 pt-md-3 pb-md-0 text-center text-md-start">
    <div>
      <h1 class="h3 mb-1 col-12 col-sm-12 col-lg-12">
        Início
      </h1>
      <p class="fw-medium mb-0 text-muted">
        Bem Vindo, {{ $user->name }}! Visualize todos os dados e relatórios da tua aplicação.
      </p>
    </div>
    {{-- <div class="mt-4 mt-md-0">
      <!-- <a class="btn btn-sm btn-alt-primary" href="javascript:void(0)">
                <i class="fa fa-cog"></i>
              </a> -->




      <div class="dropdown d-inline-block">
        <button type="button" class="btn btn-sm btn-alt-primary px-3" id="dropdown-analytics-overview" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          Últimos 30 dias <i class="fa fa-fw fa-angle-down"></i>
        </button>
        <div class="dropdown-menu dropdown-menu-end fs-sm" aria-labelledby="dropdown-analytics-overview">
          <a class="dropdown-item" href="javascript:void(0)">This Week</a>
          <a class="dropdown-item" href="javascript:void(0)">Previous Week</a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="javascript:void(0)">This Month</a>
          <a class="dropdown-item" href="javascript:void(0)">Previous Month</a>
        </div>
      </div>
    </div> --}}
  </div>
</div>
<!-- END Hero -->

<!-- Page Content -->
<div class="content">
  <!-- Overview -->
  <div class="row items-push">
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-sitemap fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_organizacoes}}</div>
          <div class="text-muted mb-3">Organizações</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_organizacao')
          <a class="fw-medium" href="/organizacoes">
            Ver todas as organizações
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-folder-open fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_projetos}}</div>
          <div class="text-muted mb-3">Projetos</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_projeto')
          <a class="fw-medium" href="/projetos">
            Ver todos os projetos
            <br>
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-book fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_turmas}}</div>
          <div class="text-muted mb-3">Turmas</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_turma')
          <a class="fw-medium" href="/turmas">
            Ver todas as turmas
            <br>
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-address-book  fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_matriculas}}</div>
          <div class="text-muted mb-3">Matrículas</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_matricula')
          <a class="fw-medium" href="/matriculas">
            Ver todas as matrículas
            <br>
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>
  </div>
  <!-- END Overview -->

  <!-- Overview -->
  <div class="row items-push">
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-graduation-cap fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_estudantes}}</div>
          <div class="text-muted mb-3">Beneficiários</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_estudante')
          <a class="fw-medium" href="/estudantes">
            Ver todos os beneficiários
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>
    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full flex-grow-1">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-briefcase fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_funcionarios}}</div>
          <div class="text-muted mb-3">Prestadores</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_funcionario')
          <a class="fw-medium" href="/funcionarios">
            Ver todos os prestadores
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>

    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-users fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_usuarios}}</div>
          <div class="text-muted mb-3">Usuários</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_usuario')
          <a class="fw-medium" href="javascript:void(0)">
            Ver todos os usuários
            <br>
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>


    <div class="col-sm-6 col-xl-3">
      <div class="block block-rounded text-center d-flex flex-column h-100 mb-0">
        <div class="block-content block-content-full">
          <div class="item rounded-3 bg-body mx-auto my-3">
            <i class="fa fa-wallet fa-lg text-primary"></i>
          </div>
          <div class="fs-1 fw-bold">{{$total_vagas}}</div>
          <div class="text-muted mb-3">Vagas</div>
        </div>
        <div class="block-content block-content-full block-content-sm bg-body-light fs-sm">
          @can('pode_visualizar_turma')
          <a class="fw-medium" href="#!">
            Ver todas as vagas
            <br>
            <!-- <i class="fa fa-arrow-right ms-1 opacity-25"></i> -->
          </a>
          @endcan
        </div>
      </div>
    </div>


  </div>


  @endif






  @endsection