<div class="content-body">
            <!-- row -->
        <div class="container-fluid">
          <div class="row">
            <div class="col-xl-6">
              <div class="row">
                <div class="col-xl-12">
                  <div class="row">
                    <div class="col-xl-12 col-sm-12 col-xxl-12">
                      <div class="card" id="user-activity">
                        <div class="card-header border-0 pb-0 flex-wrap">
                          <div>
                            <h4 class="fs-24 mb-3 d-block fs-16">Penjualan Jasa & Part <?=date('Y')?></h4>
                          
                          </div>
                        
                        </div>
                        <div class="card-body pb-3">
                          <!-- chart -->
                            <div id="chartBar" class="chartBar"></div>
                          <!-- end chart -->
                        </div>
                      </div>
                    </div>
                    
                  </div>
                </div>

              </div>
            </div>
            <div class="col-xl-6">
              <div class="row">
                <div class="col-xl-12">
                  <div class="card bg-progradient manage-project">
                    <div class="card-body">
                      <div class="row align-items-center">
                        <div class="col-xl-6 col-12">
                          <h4 class="fs-24 font-w700 text-white">FAKTUR PENJUALAN</h4>
                          <span class="fs-16 text-white d-block">Shortcut Faktur Penjualan </span>
                        </div>
                        <div class="col-xl-6 col-12 text-end">
                          <a href="/transactions/invoices" class="btn  bg-white fs-18 btn-rounded">OPEN</a>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                
                
                <div class="col-xl-12">
                    <div class="row">
                        <!--  UE -->
                        <div class="col-xl-4 col-sm-4">
                          <div class="card">
                            <div class="card-body d-flex px-4 pb-0 justify-content-between">
                              <div>
                                <h4 class="fs-18 font-w600 mb-4 text-nowrap">Total Unit Entry</h4>
                                
                              </div> 
                            
                            </div>
                            <div class="card-footer pt-0 pb-0 text-center">
                              <div class="row">
                                <div class="col-6 pt-3 pb-3 border-end">
                                  <h3 class="mb-1 text-primary"><?=number_format($getUnitEntryMonth)?></h3><span>Month</span>
                                </div>
                                <div class="col-6 pt-3 pb-3 border-end">
                                  <h3 class="mb-1 text-primary"><?=number_format($getUnitEntryDaily)?></h3><span>Day</span>
                                </div>
                                
                              </div>
                            </div>
                          </div>
                        </div>
                        
                        <!--  -->
                        <!--  UE -->
                        <div class="col-xl-8 col-sm-8">
                          <div class="card">
                            <div class="card-body d-flex px-4 pb-0 justify-content-between">
                              <div>
                                <h4 class="fs-18 font-w600 mb-4 text-nowrap">Total Penjualan Jasa & Part Bulan ini</h4>
                              </div> 
                            
                            </div>
                            <div class="card-footer pt-0 pb-0 text-center">
                              <div class="row">
                                <div class="col-6 pt-3 pb-3 border-end">
                                  <h3 class="mb-1 text-primary"><?=number_format($getJasa[0]['total'])?></h3><span>Jasa</span>
                                </div>
                                <div class="col-6 pt-3 pb-3 border-end">
                                  <h3 class="mb-1 text-primary"><?=number_format($getPart[0]['total'])?></h3><span>Part</span>
                                </div>
                                
                              </div>
                            </div>
                          </div>
                        </div>
                      
                    </div>
                </div>
                


              </div>
            </div>


          </div>
          <div class="row">
          <div class="col-xl-4 col-sm-4">
                <div class="card">
                  <div class="card-body px-4 pb-0 ">
                    
                      <h4 class="fs-18 font-w600 mb-4 text-nowrap">10 Top Customer</h4>
                      
                      <!--  -->
                      <table class="table" width="100%">
                      <?php foreach($topcustomer as $i=>$v){?>
                        <tr>
                          <td class="col-md-8"><?=$v['nopol']?></td>
                          <td class="col-md-4 text-end"><span class="badge badge-sm badge-danger"><?=$v['total']?></span></td>
                        </tr>
                     <?php } ?>
                      </table>
                      <!--  -->
                   
                   
                  </div>
                </div>
              </div>
              <div class="col-xl-4 col-sm-4">
                <div class="card">
                  <div class="card-body px-4 pb-0 ">
                    
                      <h4 class="fs-18 font-w600 mb-4 text-nowrap">10 Top Mekanik</h4>
                      
                      <!--  -->
                      <table class="table" width="100%">
                      <?php foreach($topsalesman as $i=>$v){?>
                        <tr>
                          <td class="col-md-8"><?=$v['nama_mekanik']?></td>
                          <td class="col-md-4 text-end"><span class="badge badge-sm badge-danger"><?=$v['total']?></span></td>
                        </tr>
                     <?php } ?>
                      </table>
                      <!--  -->
                   
                   
                  </div>
                </div>
              </div>
              <div class="col-xl-4 col-sm-4">
                <div class="card">
                    <div class="card-body px-4 pb-0 ">
                    
                      <h4 class="fs-18 font-w600 mb-4 text-nowrap">10 Top Sales Part</h4>
                      
                      <!--  -->
                      <table class="table" width="100%">
                      <?php foreach($topPart as $i=>$v){?>
                        <tr>
                          <td class="col-md-8"><?=$v['partdesc']?></td>
                          <td class="col-md-4 text-end"><span class="badge badge-sm badge-danger"><?=$v['total']?></span></td>
                        </tr>
                     <?php } ?>
                      </table>
                      <!--  -->
                   
                   
                  </div>
                  
                </div>
              </div>
          </div>
        </div>
</div>
<?php
$this->Html->scriptStart(['block' => 'scriptBottom']);
?>
<?php
// Sample data
$datajasa = $njasa;
$datapart = $npart;
$categories=['Jan','Feb','Mar','Apr','Mei','Jun','Jul','Agust','Sept','Okt','Nov','Des']

?>
var options = {
    chart: {
      type: 'bar'
    },
    series: [
    {
      name: 'Jasa',
      data: <?php echo json_encode($datajasa); ?>
    },

    {
      name: 'Part',
      data: <?php echo json_encode($datapart); ?>
    }

    ],
    xaxis: {
      categories: <?php echo json_encode($categories); ?>
    },
    colors:['#008F53', '#FF5E4B'],
    dataLabels: {
      enabled: false,
    },
    markers: {
      shape: "circle",
  }
  };

    var chartBar = new ApexCharts(document.querySelector("#chartBar"), options);
    chartBar.render();
 

<?php
$this->Html->scriptEnd();
?>