<script src="<?php echo getConfig($connect, 'base_url');?>assets/plugins/chartjs/Chart.bundle.js"></script> 
<div class="block-header">
  <h2>DASHBOARD</h2>
</div>
<div class="row clearfix">
      <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="info-box bg-pink hover-expand-effect">
          <a href="?page=transaksi"><div class="icon"> <i class="material-icons">playlist_add_check</i> </div></a>
          <div class="content">
            <div class="text">TRANSACTIONS</div>
			<?php
				(int)$j=mysqli_num_rows(mysqli_query($connect, "select ID from transaksi where hapus='0'"));
			?>
            <div class="number count-to" data-from="0" data-to="<?php echo $j;?>" data-speed="1" data-fresh-interval="20"></div>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="info-box bg-cyan hover-expand-effect">
          <a href="?page=toko"><div class="icon"> <i class="material-icons">store_mall_directory</i> </div></a>
          <div class="content">
            <div class="text">STORES</div>
			<?php
				(int)$j=mysqli_num_rows(mysqli_query($connect, "select ID from toko"));
			?>
            <div class="number count-to" data-from="0" data-to="<?php echo $j;?>" data-speed="1" data-fresh-interval="20"></div>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="info-box bg-light-green hover-expand-effect">
          <a href="?page=data-produk"><div class="icon"> <i class="material-icons">book</i> </div></a>
          <div class="content">
            <div class="text">PRODUCTS</div>
            <?php
				(int)$j=mysqli_num_rows(mysqli_query($connect, "select ID from produk"));
			?>
            <div class="number count-to" data-from="0" data-to="<?php echo $j;?>" data-speed="1" data-fresh-interval="20"></div>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
        <div class="info-box bg-orange hover-expand-effect">
          <a href="?page=users"><div class="icon"> <i class="material-icons">person_add</i> </div></a>
          <div class="content">
            <div class="text">USER</div>
            <?php
				(int)$j=mysqli_num_rows(mysqli_query($connect, "select ID from users"));
			?>
            <span class="number count-to" data-from="0" data-to="<?php echo $j;?>" data-speed="1" data-fresh-interval="20"></span>
          </div>
        </div>
      </div>
    </div>
<div class="row">
	<div class="col-md-12">
		<div class="card">
          <div class="header text-center">
            <h2>FAV PRODUCT FROM ALL STORES</h2>
          </div>
          <div class="body">
            <canvas id="horizontal_chart" height="100"></canvas>
          </div>
        </div>
		  <?php
			$qi=mysqli_query($connect, "select * from produk") or die(mysqli_error($connect));
			if(mysqli_num_rows($qi)){
				$q=mysqli_query($connect, "select sum(a.hit) as s_hits,a.* from produk a group by lower(a.nama_produk) order by sum(a.hit) desc limit 0,100") or die(mysqli_error($connect));
				$label=array();
				$data=array();
				$color=array();
				while($b=mysqli_fetch_array($q)){
					$label[]=$b['nama_produk'];
					$data[]=$b['s_hits'];
					$color[]=genColorCodeFromText($b['nama_produk']);
				}
				$datas=array('label'=>'Jumlah Penjualan','data'=>$data,'backgroundColor'=>$color);
		?>
		 <script>
		 	$(document).ready(function(e) {
				var data='[<?php echo json_encode($datas);?>]';
				new Chart(document.getElementById("horizontal_chart").getContext("2d"), getChartJs('horizontalBar',data,<?php echo json_encode($label);?>));
			});
	    </script>
		<?php }else{$st=-1;?>
			<script>
		 	$(function(e) {
				$('canvas').closest('.body').html('<i>Belum ada data</i>');
			});
			</script>
		<?php }?>
	</div>
</div>
<script src="<?php echo getConfig($connect, 'base_url');?>assets/plugins/jquery-countto/jquery.countTo.js"></script> 
<script>
$(function(e) {
    $('.count-to').countTo();
});
</script>