<?php include "Views/templates/header.php"; ?>

</div>
<!-- /.row -->
<section class="content">
  <div class="container-fluid">
    <div class="row">

      <div class="col-md-6">
        <div class="card card-primary">
          <div class="card-header border-info fw-bold ">
            <i class="fas fa-chart-bar"></i> Ventas totales por mes
            <!-- <div class="card-tools">
              <button type="button" class="btn btn-tool" data-card-widget="collapse">
                <i class="fas fa-minus"></i>
              </button>
              <button type="button" class="btn btn-tool" data-card-widget="remove">
                <i class="fas fa-times"></i>
              </button>
            </div> -->
            <div class="form-inline">
                <div class="form-group d-flex w-100 mb-0">
                    <select id="year1" class="form-control form-control-sm align-middle" style='max-width:90px;'>
                      <?php
                      $fecha = date('Y');
                      for ($i = 2021; $i <= $fecha; $i++) { ?>
                        <option value="<?php echo $i; ?>" <?php echo ($i == $fecha) ? 'selected' : ''; ?>><?php echo $i; ?></option>
                      <?php } ?>
                    </select>
                    <button class='btn btn-success btn-sm ml-2' onclick="actualizarGraficoVentasMes()"><i class="fas fa-sync-alt"></i></button>
                </div>
            </div>
          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion1" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>


      
      <div class="col-md-6">
        <div class="card card-danger">
          <div class="card-header border-info fw-bold">
            <i class="fas fa-chart-line"></i> Comparación de Pagos y Ventas por Mes
            <!-- <div class="card-tools">
              <button type="button" class="btn btn-tool" data-card-widget="collapse">
                <i class="fas fa-minus"></i>
              </button>
              <button type="button" class="btn btn-tool" data-card-widget="remove">
                <i class="fas fa-times"></i>
              </button>
            </div> -->

            <!-- <div class="form-inline">
                <select id="year5" class="form-control form-control-sm align-middle" style='max-width:60px;'>
                  <?php
                  $fecha = date('Y');
                  for ($i = 2021; $i <= $fecha; $i++) { ?>
                    <option value="<?php echo $i; ?>" <?php echo ($i == $fecha) ? 'selected' : ''; ?>><?php echo $i; ?></option>
                  <?php } ?>
                </select>
                <button class='btn btn-success btn-sm ml-2' onclick="actualizarGrafico()"><i class="fas fa-sync-alt"></i> Actualizar</button>
            </div> -->

            <div class="form-inline">
                <div class="form-group d-flex w-100 mb-0">
                    <select id="year5" class="form-control form-control-sm align-middle" style='max-width:90px;'>
                      <?php
                      $fecha = date('Y');
                      for ($i = 2021; $i <= $fecha; $i++) { ?>
                        <option value="<?php echo $i; ?>" <?php echo ($i == $fecha) ? 'selected' : ''; ?>><?php echo $i; ?></option>
                      <?php } ?>
                    </select>
                    <button class='btn btn-success btn-sm ml-2' onclick="actualizarGrafico()"><i class="fas fa-sync-alt"></i></button>
                </div>
            </div>


          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>




      <div class="col-md-6">
        <div class="card card-success">
          <div class="card-header border-info fw-bold ">
            <i class="fas fa-chart-bar"></i> Ventas por vendedor
            
            
            <div class="form-inline">

                <div class='d-flex flex-wrap'>
                    <div class="input-group input-group-sm form-inline" style='max-width:290px;'>
                        <input type="date" class="form-control" id='fecha1_comporacion4'>
                        <div class="input-group-prepend">
                          <span class="input-group-text" id="inputGroup-sizing-sm"><i class="fas fa-exchange-alt"></i></span>
                        </div>
                        <input type="date" class="form-control" id='fecha2_comporacion4'>
                    </div>
                    <div class='d-flex'>
                          <select id="sucursal4" class="form-control form-control-sm align-middle" style='max-width:250px;'>
                            <option value='0'>TODAS</option>
                            <?php
                            foreach($data['categorias'] as $value) { ?>
                              <option value="<?php echo $value['id']; ?>">[ <?php echo $value['cod_linea']; ?> ] - <?php echo $value['categoria']; ?></option>
                            <?php } ?>
                          </select>

                          <button class='btn btn-warning btn-sm ml-2' onclick="actualizarGraficoVentasVendedor()"><i class="fas fa-sync-alt"></i></button>
                    </div>
                </div>
            </div>

          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion4" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>



      <div class="col-md-6">
        <div class="card card-success">
          <div class="card-header border-info fw-bold ">
            <i class="fas fa-chart-bar"></i> Ventas por Operador
            
            <div class='d-flex flex-wrap'>
                <div class="input-group input-group-sm form-inline" style='width:290px;'>
                    <input type="date" class="form-control" id='fecha1_comporacion6'>
                    <div class="input-group-prepend">
                      <span class="input-group-text" id="inputGroup-sizing-sm"><i class="fas fa-exchange-alt"></i></span>
                    </div>
                    <input type="date" class="form-control" id='fecha2_comporacion6'>
                </div>
                <div class='d-flex'>
                      <select id="sucursal6" class="form-control form-control-sm align-middle" style='max-width:250px;'>
                        <option value='0'>TODAS</option>
                        <?php
                        foreach($data['categorias'] as $value) { ?>
                          <option value="<?php echo $value['id']; ?>">[ <?php echo $value['cod_linea']; ?> ] - <?php echo $value['categoria']; ?></option>
                        <?php } ?>
                      </select>

                      <button class='btn btn-warning btn-sm ml-2' onclick="actualizarGraficoVentasOperador()"><i class="fas fa-sync-alt"></i></button>
                </div>
            </div>

          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion6" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>






      <div class="col-md-12">
        <div class="card card-success">
          <div class="card-header border-info fw-bold ">
            <i class="fas fa-chart-bar"></i> Ventas por departamento
            
            <div class='d-flex flex-wrap'>
                <div class="input-group input-group-sm form-inline" style='width:290px;'>
                    <input type="date" class="form-control" id='fecha1_comporacion5'>
                    <div class="input-group-prepend">
                      <span class="input-group-text" id="inputGroup-sizing-sm"><i class="fas fa-exchange-alt"></i></span>
                    </div>
                    <input type="date" class="form-control" id='fecha2_comporacion5'>
                </div>
                <div class='d-flex'>
                      <select id="sucursal5" class="form-control form-control-sm align-middle" style='max-width:250px;'>
                        <option value='0'>TODAS</option>
                        <?php
                        foreach($data['vendedores'] as $value) { ?>
                          <option value="<?php echo $value['id']; ?>">[ <?php echo $value['id']; ?> ] - <?php echo $value['nombre']; ?></option>
                        <?php } ?>                  
                      </select>

                      <button class='btn btn-warning btn-sm ml-2' onclick="actualizarGraficoVentasDepartamento()"><i class="fas fa-sync-alt"></i></button>
                </div>
            </div>
            
          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion5" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>


      <div class="col-md-12">
        <div class="card card-warning">
          <div class="card-header border-info fw-bold ">
            <i class="fas fa-chart-bar"></i> Ventas por Categoria
            
            
            <div class='d-flex flex-wrap'>
                <div class="input-group input-group-sm form-inline" style='width:290px;'>
                    <input type="date" class="form-control" id='fecha1_comporacion7'>
                    <div class="input-group-prepend">
                      <span class="input-group-text" id="inputGroup-sizing-sm"><i class="fas fa-exchange-alt"></i></span>
                    </div>
                    <input type="date" class="form-control" id='fecha2_comporacion7'>
                </div>
                <div class='d-flex'>
                      <select id="sucursal7" class="form-control form-control-sm align-middle" style='max-width:250px;'>
                          <option value='0'>TODAS</option>
                          <?php
                          foreach($data['vendedores'] as $value) { ?>
                            <option value="<?php echo $value['id']; ?>">[ <?php echo $value['id']; ?> ] - <?php echo $value['nombre']; ?></option>
                          <?php } ?>
                      </select>

                      <button class='btn btn-success btn-sm ml-2' onclick="actualizarGraficoVentasCategoria()"><i class="fas fa-sync-alt"></i></button>
                </div>
            </div>

            <!-- <div class="form-inline">
                <div class="input-group input-group-sm form-inline" style='width:290px;'>
                  <input type="date" class="form-control" id='fecha1_comporacion7'>
                  <div class="input-group-prepend">
                    <span class="input-group-text" id="inputGroup-sizing-sm"><i class="fas fa-exchange-alt"></i></span>
                  </div>
                  <input type="date" class="form-control" id='fecha2_comporacion7'>
                </div>

                <select id="sucursal7" class="form-control form-control-sm align-middle ml-2">
                  <option value='0'>TODAS</option>
                  <?php
                  foreach($data['vendedores'] as $value) { ?>
                    <option value="<?php echo $value['id']; ?>">[ <?php echo $value['id']; ?> ] - <?php echo $value['nombre']; ?></option>
                  <?php } ?>
                </select>

                <button class='btn btn-success btn-sm ml-2' onclick="actualizarGraficoVentasCategoria()"><i class="fas fa-sync-alt"></i> Actualizar</button>
            </div> -->

          </div>
          <div class="card-body">
            <div class="chart">
              <!-- Sales Chart Canvas -->
              <canvas id="comparacion7" height="180" style="height: 250px;"></canvas>
            </div>
          </div>
        </div>
      </div>




      
    </div>
    <!-- /.row -->
  </div><!-- /.container-fluid -->
</section>
<?php include "Views/templates/footer.php"; ?>