@dump($TodasEntidades);

@extends('../layouts.navigation')
@section('content')
   
<main id="main" class="main">

     <!-- Page Title -->
     <div class="pagetitle">
        <h1>Dashboard</h1>
        <nav>
          <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item active">Dados Analíticos</li>
          </ol>
        </nav>
      </div>
      <!-- End Page Title -->
        <section class="section">
            <div class="row">
                
                <div class="col-lg-6">
                  <div class="card">
                    <div class="card-body">
                      <h5 class="card-title">Registos por Categoria</h5>
        
                      <!-- Bar Chart -->
                      <div id="barChart_registos_por_categoria" style="min-height: 400px;" class="echart"></div>
        
                      <script>
                        document.addEventListener("DOMContentLoaded", () => {
                          echarts.init(document.querySelector("#barChart_registos_por_categoria")).setOption({
                            xAxis: {
                              type: 'category',
                              data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                            },
                            yAxis: {
                              type: 'value'
                            },
                            series: [{
                              data: [120, 200, 150, 80, 70, 110, 130],
                              type: 'bar'
                            }]
                          });
                        });
                      </script>
                      <!-- End Bar Chart -->
        
                    </div>
                  </div>
                </div>

                <div class="col-lg-6">
                    <div class="card">
                      <div class="card-body">
                        <h5 class="card-title">Registos por Departamento</h5>
          
                        <!-- Bar Chart -->
                        <div id="barChart_registos_por_departamento" style="min-height: 400px;" class="echart"></div>
          
                        <script>
                          document.addEventListener("DOMContentLoaded", () => {
                            echarts.init(document.querySelector("#barChart_registos_por_departamento")).setOption({
                              xAxis: {
                                type: 'category',
                                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
                              },
                              yAxis: {
                                type: 'value'
                              },
                              series: [{
                                data: [120, 200, 150, 80, 70, 110, 130],
                                type: 'bar'
                              }]
                            });
                          });
                        </script>
                        <!-- End Bar Chart -->
          
                      </div>
                    </div>
                  </div>
                
              </div>
        </section>

  </main>
  <!-- End #main -->

@endsection