{% extends 'main/dashboard.html' %}
{% block content %}



<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<div class="container-xxl flex-grow-1 container-p-y">
  <h4 class="fw-bold py-0 mb-0">

         
                




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



                
                
                  <div class="row">
                    <div class="col-lg-12 mb-4">
              
                                <div class="col-xxl">
                                  <div class="card mb-4">
                                    <div class="card-header d-flex align-items-center justify-content-between">
                                      <h5 class="mb-0">Quantidade Grupu Pre - Fabrika Iha Kada munisipiu</h5>
                                
                                    </div>
                                    <div class="card-body">
                            
                                      <canvas id="chartJSContainer" width="600" height="100"></canvas>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.3.0/chart.js"></script>

  
                                    <script type='text/javascript'>
                                      var options = {
                                        type: 'bar',
                                        data: {
                                          labels: [
                                            
                                          {% for dados in kontaprefabrika %}
                                          '{{dados.munisipiu}}', 
                                          {% endfor %}
                                        
                                        ],
                                          datasets: [{
                                              label: 'Total Grupu Pre - Fabrika',
                                              data: [

                                          {% for dados in kontaprefabrika %}
                                          {{dados.total}},
                                          {% endfor %}
                                              
                                              
                                              ],
                                              backgroundColor: "red",
                                              borderWidth: 1
                                            },
                                      
                                            {
                                              label: 'Total Grupu Viveirus',
                                              data: [
                                          {% for dados in kontagrupuviveirus %}
                                          {{dados.total}},
                                          {% endfor %}
                                              ],
                                              backgroundColor: "yellow",
                                              borderWidth: 1
                                            },


                                            {
                                              label: 'Total Area Bambu',
                                              data: [
                                          {% for dados in kontaareabambu %}
                                          {{dados.total}},
                                          {% endfor %}
                                              ],
                                              backgroundColor: "orange",
                                              borderWidth: 1
                                            },
                                      
                                           
                                          ]
                                        },
                                      
                                      
                                      }
                                      
                                      var ctx = document.getElementById('chartJSContainer').getContext('2d');
                                      new Chart(ctx, options);
                                          </script>


                                    </div>
                                  </div>
                                </div>
                </div>
              
                <div class="col-lg-4 mb-4">
              
                  <div class="col-xxl">
                    <div class="card mb-4">
                      <div class="card-header d-flex align-items-center justify-content-between">
                        <h5 class="mb-0">A. Dados Grupu Pre Fabrika bambu</h5>
                
                      </div>
                      <div class="card-body">
                 
                        {% for dados in kontaprefabrika %}
                        {% if dados.total == 0 %}
                        {{forloop.counter}} . Munisipiu {{dados.munisipiu}} ({{dados.total}})</br>
                        {% else %}
                        {{forloop.counter}} . <a href="{% url 'report:printprefabrika' dados.id %}">Munisipiu {{dados.munisipiu}} ({{dados.total}})</a> </br>
                        {% endif %}
                        {% endfor %}


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


              <div class="col-lg-4 mb-4">
              
                <div class="col-xxl">
                  <div class="card mb-4">
                    <div class="card-header d-flex align-items-center justify-content-between">
                      <h5 class="mb-0">B. Dados Grupu Viveirus </h5>
              
                    </div>
                    <div class="card-body">
                      {% for dados in kontagrupuviveirus %}
                      {% if dados.total == 0 %}
                      {{forloop.counter}} . Munisipiu {{dados.munisipiu}} ({{dados.total}})</br>
                      {% else %}
                      {{forloop.counter}} . <a href="{% url 'report:printviveirus' dados.id %}" target="__blank">Munisipiu {{dados.munisipiu}} ({{dados.total}})</a> </br>
                      {% endif %}
                      {% endfor %}
            
                    </div>
                  </div>
                </div>
            
            
            </div>


            <div class="col-lg-4 mb-4">
              
              <div class="col-xxl">
                <div class="card mb-4">
                  <div class="card-header d-flex align-items-center justify-content-between">
                    <h5 class="mb-0">Dados Plantasaun bambu iha Munisipiu Idak - Idak</h5>
            
                  </div>
                  <div class="card-body">
                    {% for dados in kontaareabambu %}
                    {% if dados.total == 0 %}
                    {{forloop.counter}} . Munisipiu {{dados.munisipiu}} ({{dados.total}})</br>
                    {% else %}
                    {{forloop.counter}} . <a href="{% url 'report:printareabambu' dados.id %}">Munisipiu {{dados.munisipiu}} ({{dados.total}})</a> </br>
                    {% endif %}
                    {% endfor %}

          
                  </div>
                </div>
              </div>
          
          
          </div>
                
              </div>
                
                
                
                </div>
              </div>
              <!-- / Content -->


{% endblock content %}