|
Server : Apache/2.4.18 (Ubuntu) System : Linux canvaswebdesign 3.13.0-71-generic #114-Ubuntu SMP Tue Dec 1 02:34:22 UTC 2015 x86_64 User : oppastar ( 1041) PHP Version : 7.0.33-0ubuntu0.16.04.15 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority, Directory : /var/www/laciasmara.com/public_html/shop/application/views/admin/graph/ |
Upload File : |
<div class="row">
<div class="col-sm-12">
<p><a href="<?= base_url('admin/dashboard'); ?>"><i class="fa fa-arrow-left" aria-hidden="true"></i> Kembali ke Dashboard</a></p><br>
<h2>Statistik</h2>
</div><!-- end class="col-sm-12" -->
</div> <!-- end row -->
<div class="row" style="padding-top:10px; border-bottom:none;">
<div class="panel panel-default">
<div class="panel-heading">
<h4>Penjualan</h4>
<div class='container'>
<!-- filter data -->
<?php echo form_open('admin/graph/getPenjualan', 'class="form-inline" id="penjualan"') ?>
<label class="sr-only" for="datetime">start</label>
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control mb-2 mr-sm-2" id="startPenjualan" name="startPenjualan" value="<?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] : "" ?>">
<label class="sr-only" for="datetime">end</label>
<div class="input-group mb-2 mr-sm-2">
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control" id="endPenjualan" name="endPenjualan" value="<?php echo (isset($_SESSION['endPenjualan'])) ? $_SESSION['endPenjualan'] : "" ?>">
</div>
<button id="submitPenjualan" type="submit" class="btn btn-primary mb-2">Submit</button>
</form>
</div>
</div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#tahun">Tahun</a></li>
<li><a data-toggle="tab" href="#bulan">Bulan</a></li>
<li><a data-toggle="tab" href="#hari">Hari</a></li>
</ul>
<!-- graph google chart -->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<style>
/* bootstrap hack: fix content width inside hidden tabs */
.tab-content>.tab-pane:not(.active),
.pill-content>.pill-pane:not(.active) {
display: block;
height: 0;
overflow-y: hidden;
}
/* bootstrap hack end */
</style>
<div class="tab-content">
<!-- table for print -->
<div id="tahun" class="tab-pane fade in active">
<table id="penjualantahun" class="display nowrap" style="width:100%; display:none">
<thead>
<tr>
<th>Tahun</th>
<th>Total penjualan (Rp)</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['penjualantahun'] as $tp) {
echo "<tr>
<td>" . $tp['tahun'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- make graph -->
<?php if (count($_SESSION['penjualantahun'])) : ?>
<div id="curve_chart_tahun" style="width: auto; height: auto"></div>
<script type="text/javascript">
google.charts.load('current', {
'packages': ['corechart']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Penjualan pertahun (Rp)'],
<?php
foreach ($_SESSION['penjualantahun'] as $pt) {
echo "['" . $pt['tahun'] . "', " . $pt['jumlah'] . "],";
}
?>
]);
var options = {
title: '',
curveType: '',
legend: {
position: 'bottom'
}
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart_tahun'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
<div id="bulan" class="tab-pane fade in ">
<!-- table to print -->
<table id="penjualanbulan" class="display nowrap" style="width:100%; display:none">
<thead>
<tr>
<th>Bulan</th>
<th>Total penjualan (Rp)</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['penjualanbulan'] as $tp) {
echo "<tr>
<td>" . $tp['bulan'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['penjualanbulan'])) : ?>
<div id="curve_chart_bulan" style="width: auto; height: auto"></div>
<script type="text/javascript">
google.charts.load('current', {
'packages': ['corechart']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Bulan', 'Penjualan perbulan (Rp)'],
<?php
foreach ($_SESSION['penjualanbulan'] as $pb) {
echo "['" . $pb['bulan'] . "', " . $pb['jumlah'] . "],";
}
?>
]);
var options = {
title: '',
curveType: '',
legend: {
position: 'bottom'
}
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart_bulan'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
<div id="hari" class="tab-pane fade in">
<!-- table to print -->
<table id="penjualanhari" class="display nowrap" style="width:100%; display:none">
<thead>
<tr>
<th>Hari</th>
<th>Total penjualan (Rp)</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['penjualanhari'] as $tp) {
echo "<tr>
<td>" . $tp['hari'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['penjualanhari'])) : ?>
<div id="curve_chart_hari" style="width: auto; height: auto"></div>
<script type="text/javascript">
google.charts.load('current', {
'packages': ['corechart']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Day', 'Penjualan perhari (Rp)'],
<?php
foreach ($_SESSION['penjualanhari'] as $ph) {
echo "['" . $ph['hari'] . "', " . $ph['jumlah'] . "],";
}
?>
]);
var options = {
title: '',
curveType: '',
legend: {
position: 'bottom'
}
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart_hari'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
</div>
</div>
<!-- <div class="panel-footer">Panel Footer</div> -->
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4>Produk</h4>
<!-- form filter data -->
<?php echo form_open('admin/graph/getProduk', 'class="form-inline" id="penjualan"') ?>
<label class="sr-only" for="datetime">start</label>
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control mb-2 mr-sm-2" id="startProduk" name="startProduk" value="<?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] : "" ?>">
<label class="sr-only" for="datetime">end</label>
<div class="input-group mb-2 mr-sm-2">
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control" id="endProduk" name="endProduk" value="<?php echo (isset($_SESSION['endProduk'])) ? $_SESSION['endProduk'] : "" ?>">
</div>
<button id="submitPenjualanProduk" type="submit" class="btn btn-primary mb-2">Submit</button>
</form>
</div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#top">Produk teratas</a></li>
<li><a data-toggle="tab" href="#poor">Produk terbawah</a></li>
<li><a data-toggle="tab" href="#poornotbuy">Produk tidak pernah diorder</a></li>
<li><a data-toggle="tab" href="#stockProduk">Stock Produk</a></li>
<li><a data-toggle="tab" href="#productdefect">Produk Rusak</a></li>
</ul>
<div class="tab-content">
<div id="top" class="tab-pane fade in active">
<!-- jquery datatable table with print -->
<table id="toptable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Produk</th>
<th>Jumlah penjualan</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['top'] as $tp) {
echo "<tr>
<td>" . $tp['produk'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<div id="poor" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="poortable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Produk</th>
<th>Jumlah penjualan</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['poor'] as $tp) {
echo "<tr>
<td>" . $tp['produk'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<div id="poornotbuy" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="poornotbuytable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Produk</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['poornotbuy'] as $tp) {
echo "<tr>
<td>" . $tp['produk'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<div id="stockProduk" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="stocktable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Produk</th>
<th>SKU</th>
<th>Stock</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['stockProduk'] as $tp) {
echo "<tr>
<td>" . $tp['product_name'] . "</td>
<td>" . $tp['sku'] . "</td>
<td>" . $tp['stock'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<div id="productdefect" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="productdefecttable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Produk</th>
<th>Jumlah Rusak</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['databarangrusak'] as $tp) {
echo "<tr>
<td>" . $tp['product_name'] . "</td>
<td>" . $tp['jumlah_rusak'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4>Customer</h4>
<!-- form filter data -->
<?php echo form_open('admin/graph/getCustomer', 'class="form-inline" id="penjualan"') ?>
<label class="sr-only" for="datetime">start</label>
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control mb-2 mr-sm-2" id="startCustomer" name="startCustomer" value="<?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] : "" ?>">
<label class="sr-only" for="datetime">end</label>
<div class="input-group mb-2 mr-sm-2">
<input required data-date-format="DD MMMM YYYY" type="date" class="form-control" id="endCustomer" name="endCustomer" value="<?php echo (isset($_SESSION['endCustomer'])) ? $_SESSION['endCustomer'] : "" ?>">
</div>
<button id="submitPenjualanCustomer" type="submit" class="btn btn-primary mb-2">Submit</button>
</form>
</div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#customerterbaik">Customer terbaik</a></li>
<li><a data-toggle="tab" href="#customerjkdiv">Customer Berdasarkan Jenis Kelamin</a></li>
<li><a data-toggle="tab" href="#customerumurdiv">Customer Umur</a></li>
<li><a data-toggle="tab" href="#customerlokasidiv">Customer Lokasi</a></li>
<li><a data-toggle="tab" href="#Customerbirthdaydiv">Customer Birthday</a></li>
<li><a data-toggle="tab" href="#customerreportdiv">Customer Report</a></li>
</ul>
<div class="tab-content">
<!-- jquery datatable table print hidden -->
<div id="customerterbaik" class="tab-pane fade in active">
<table id="bestcust" class="display nowrap" style="width:100%; display:none;">
<thead>
<tr>
<th>Nama</th>
<th>Jumlah pembelian</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['bestcustfull'] as $tp) {
echo "<tr>
<td>" . $tp['name'] . "</td>
<td>" . $tp['jumlah'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['bestcust'])) : ?>
<div id="chart_div3" style="width: auto; height: auto;"></div>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart', 'bar']
});
google.charts.setOnLoadCallback(drawBasic);
function drawBasic() {
var data = google.visualization.arrayToDataTable([
['Nama Customer', 'total pembelian', ],
<?php
foreach ($_SESSION['bestcust'] as $bestcust) {
echo "['" . $bestcust['name'] . "', " . $bestcust['jumlah'] . "],";
}
?>
]);
var options = {
title: 'Top 5 customer',
chartArea: {
width: '50%'
},
hAxis: {
title: 'Total pembelian',
minValue: 0
},
vAxis: {
title: 'Customer'
}
};
var chart = new google.visualization.BarChart(document.getElementById('chart_div3'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
<div id="customerjkdiv" class="tab-pane fade in">
<table id="customerjk" class="display nowrap" style="width:100%; display:none;">
<thead>
<tr>
<th>Jenis Kelamin</th>
<th>Jumlah</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['customerjk'] as $tp) {
echo "<tr>
<td>" . $tp['sex_type'] . "</td>
<td>" . $tp['total'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['customerjk'])) : ?>
<div id="chart_div4" style="width: auto; height: auto;"></div>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart', 'bar']
});
google.charts.setOnLoadCallback(drawBasic);
function drawBasic() {
var data = google.visualization.arrayToDataTable([
['Jenis Kelamin', 'Jumlah', ],
<?php
foreach ($_SESSION['customerjk'] as $customerjk) {
echo "['" . $customerjk['sex_type'] . "', " . $customerjk['total'] . "],";
}
?>
]);
var options = {
title: 'Jenis Kelamin',
chartArea: {
width: '50%'
},
hAxis: {
title: 'Jumlah',
minValue: 0
},
vAxis: {
title: 'Customer Sex Type'
}
};
var chart = new google.visualization.BarChart(document.getElementById('chart_div4'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
<div id="customerumurdiv" class="tab-pane fade in">
<table id="customerumur" class="display nowrap" style="width:100%; display:none;">
<thead>
<tr>
<th>Umur</th>
<th>Jumlah</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['customerumurtotal'] as $tp) {
echo "<tr>
<td>" . $tp['age'] . "</td>
<td>" . $tp['count_age'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['customerumur'])) : ?>
<div id="chart_div5" style="width: auto; height: auto;"></div>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart']
});
google.charts.setOnLoadCallback(drawBasic);
function drawBasic() {
var data = google.visualization.arrayToDataTable([
['Rentang Umur', 'Jumlah'],
<?php foreach ($_SESSION['customerumur'] as $customerumur) {
echo "['21 kebawah', " . $customerumur['21 kebawah'] . "],";
echo "['21-25', " . $customerumur['21-25'] . "],";
echo "['26-30', " . $customerumur['26-30'] . "],";
echo "['31-35', " . $customerumur['31-35'] . "],";
echo "['36-40', " . $customerumur['36-40'] . "],";
echo "['41-45', " . $customerumur['41-45'] . "],";
echo "['46 keatas', " . $customerumur['46 keatas'] . "],";
} ?>
]);
var options = {
title: 'Customers by Age Range',
is3D: false,
};
var chart = new google.visualization.PieChart(document.getElementById('chart_div5'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
<!-- <?php if (count($_SESSION['customerumur'])) : ?>
<div id="chart_div5" style="width: auto; height: auto;"></div>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart']
});
google.charts.setOnLoadCallback(drawBasic);
function drawBasic() {
var data = google.visualization.arrayToDataTable([
['Rentang Umur', 'Jumlah'],
<?php foreach ($_SESSION['customerumur'] as $customerumur) {
echo "['21 kebawah', " . $customerumur['21 kebawah'] . "],";
echo "['21-25', " . $customerumur['21-25'] . "],";
echo "['26-30', " . $customerumur['26-30'] . "],";
echo "['31-35', " . $customerumur['31-35'] . "],";
echo "['36-40', " . $customerumur['36-40'] . "],";
echo "['41-45', " . $customerumur['41-45'] . "],";
echo "['46 keatas', " . $customerumur['46 keatas'] . "],";
} ?>
]);
var options = {
title: 'Customers by Age Range',
pieHole: 0.5, // Set the value to create a donut chart
pieSliceTextStyle: {
color: 'white',
},
slices: {
0: {
color: '#ffa600'
},
1: {
color: '#ff6361'
},
2: {
color: '#bc5090'
},
3: {
color: '#58508d'
},
4: {
color: '#003f5c'
},
5: {
color: '#58508d'
},
6: {
color: '#bc5090'
}
},
};
var chart = new google.visualization.PieChart(document.getElementById('chart_div5'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>-->
</div>
<div id="customerlokasidiv" class="tab-pane fade in">
<table id="customerlokasi" class="display nowrap" style="width:100%; display:none;">
<thead>
<tr>
<th>Provinsi</th>
<th>Jumlah</th>
</tr>
</thead>
<tbody>
<?php
foreach ($_SESSION['customerlokasi'] as $tp) {
echo "<tr>
<td>" . $tp['province'] . "</td>
<td>" . $tp['customer_count'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<!-- draw google chart -->
<?php if (count($_SESSION['customerlokasi'])) : ?>
<div id="chart_div6" style="width: 100%; height: 500px;"></div>
<script type="text/javascript">
google.charts.load('current', {
'packages': ['geochart']
});
google.charts.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Province', 'Jumlah'],
<?php
$provinsi = array(
'Aceh' => 'ID-AC',
'Bali' => 'ID-BA',
'Bangka Belitung' => 'ID-BB',
'Banten' => 'ID-BT',
'Bengkulu' => 'ID-BE',
'DI Yogyakarta' => 'ID-YO',
'Gorontalo' => 'ID-GO',
'DKI Jakarta' => 'ID-JK',
'Jambi' => 'ID-JA',
'Jawa Barat' => 'ID-JB',
'Jawa Tengah' => 'ID-JT',
'Jawa Timur' => 'ID-JI',
'Kalimantan Barat' => 'ID-KB',
'Kalimantan Selatan' => 'ID-KS',
'Kalimantan Tengah' => 'ID-KT',
'Kalimantan Timur' => 'ID-KI',
'Kalimantan Utara' => 'ID-KU',
'Kepulauan Riau' => 'ID-KR',
'Lampung' => 'ID-LA',
'Maluku' => 'ID-MA',
'Maluku Utara' => 'ID-MU',
'Nusa Tenggara Barat (NTB)' => 'ID-NB',
'Nusa Tenggara Timur (NTT)' => 'ID-NT',
'Papua' => 'ID-PA',
'Papua Barat' => 'ID-PB',
'Riau' => 'ID-RI',
'Sulawesi Barat' => 'ID-SR',
'Sulawesi Selatan' => 'ID-SN',
'Sulawesi Tengah' => 'ID-ST',
'Sulawesi Tenggara' => 'ID-SG',
'Sulawesi Utara' => 'ID-SA',
'Sumatera Barat' => 'ID-SB',
'Sumatera Selatan' => 'ID-SS',
'Sumatera Utara' => 'ID-SU'
);
foreach ($_SESSION['customerlokasi'] as $customerlokasi) {
if (array_key_exists($customerlokasi['province'], $provinsi)) {
echo "['" . $provinsi[$customerlokasi['province']] . "', " . $customerlokasi['customer_count'] . "],";
}
}
?>
]);
var options = {
region: 'ID',
displayMode: 'regions',
resolution: 'provinces',
colorAxis: {
colors: ['#00853f', 'black', '#e31b23']
},
backgroundColor: '#81d4fa',
datalessRegionColor: '##3CDBD3',
defaultColor: '#CFFFFD',
};
var chart = new google.visualization.GeoChart(document.getElementById('chart_div6'));
chart.draw(data, options);
}
</script>
<?php else : ?>
<p>No data available</p>
<?php endif; ?>
</div>
<div id="Customerbirthdaydiv" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="birthdaytableday" class="display nowrap" style="width:100%">
<h3>Ulang Tahun Hari Ini</h3>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Birthday</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['birthdayday'] as $tp) {
echo "<tr>
<td>" . $tp['name'] . "</td>
<td>" . $tp['email'] . "</td>
<td>" . $tp['phone'] . "</td>
<td>" . $tp['birthday'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<table id="birthdaytableweek" class="display nowrap" style="width:100%">
<h3>Ulang Tahun Minggu Ini</h3>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Birthday</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['birthdayweek'] as $tp) {
echo "<tr>
<td>" . $tp['name'] . "</td>
<td>" . $tp['email'] . "</td>
<td>" . $tp['phone'] . "</td>
<td>" . $tp['birthday'] . "</td>
</tr>";
}
?>
</tbody>
</table>
<table id="birthdaytablemonth" class="display nowrap" style="width:100%">
<h3>Ulang Tahun Bulan Ini</h3>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Birthday</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['birthdaymonth'] as $tp) {
echo "<tr>
<td>" . $tp['name'] . "</td>
<td>" . $tp['email'] . "</td>
<td>" . $tp['phone'] . "</td>
<td>" . $tp['birthday'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<div id="customerreportdiv" class="tab-pane fade in">
<!-- jquery datatable table with print -->
<table id="customerreporttable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Nama</th>
<th>Jenis Kelamin</th>
<th>No. Telepon</th>
<th>Kota</th>
<th>Type</th>
</tr>
</thead>
<tbody>
<?php
$no = 0;
foreach ($_SESSION['customerreport'] as $tp) {
echo "<tr>
<td>" . $tp['name'] . "</td>
<td>" . $tp['sex_type'] . "</td>
<td>" . $tp['phone'] . "</td>
<td>" . $tp['district'] . "</td>
<td>" . $tp['type'] . "</td>
</tr>";
}
?>
</tbody>
</table>
</div>
<!-- Modal -->
<div class="modal fade" id="ordersModal" tabindex="-1" role="dialog" aria-labelledby="ordersModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="ordersModalLabel">Orders and Order Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<table id="ordersTable" class="display nowrap" style="width:100%">
<thead>
<tr>
<th>Order ID</th>
<th>Order Date</th>
<th>Total Amount</th>
</tr>
</thead>
<tbody id="ordersTableBody">
<!-- Order rows will be inserted here dynamically -->
</tbody>
</table>
</div>
</div>
</div>
</div>
<script>
function openModal(customerId) {
// Perform an AJAX request to fetch orders and order details based on the customer ID
$.ajax({
url: '<?php echo base_url('admin/graph/fetchOrders') ?>',
type: 'GET',
data: {
customerId: customerId
},
success: function(response) {
// Parse the response as JSON
var orders = JSON.parse(response);
// Clear the table body
$('#ordersTableBody').empty();
// Append the order rows to the table body
orders.forEach(function(order) {
var row = '<tr>' +
'<td>' + order.order_id + '</td>' +
'<td>' + order.order_date + '</td>' +
'<td>' + order.total_amount + '</td>' +
'</tr>';
$('#ordersTableBody').append(row);
});
// Open the modal
$('#ordersModal').modal('show');
},
error: function(xhr, status, error) {
console.error(xhr.responseText);
}
});
}
</script>
</div>
</div>
</div>
<!-- <div class="panel-footer">Panel Footer</div> -->
</div>
<!-- <div class="panel panel-default">
<div class="panel-heading"> <h4>Demography</h4></div>
<div class="panel-body">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#demopulau">Persebaran customer</a></li>
</ul>
<div class="tab-content">
<div id="demopulau" class="tab-pane fade in active">
<div id="chart_demopulau" style="width: auto; height: auto;"></div>
<!-- <script type="text/javascript" src="//maps.googleapis.com/maps/api/js?key=YOUR_API_KEY_GOES_HERE" async="" defer="defer"></script>
<script type='text/javascript'>
google.charts.load('current', {
'packages': ['geochart'],
// Note: you will need to get a mapsApiKey for your project.
// See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
'mapsApiKey': 'AIzaSyCQNGtA-M8kCnt8GeCNdYZFIDLUnBWCznQ'
});
google.charts.setOnLoadCallback(drawMarkersMap);
function drawMarkersMap() {
var data = google.visualization.arrayToDataTable([
['City', 'Population', 'Area'],
['Jakarta', 2761477, 1285.31],
]);
var options = {
region: 'ID',
displayMode: 'markers',
colorAxis: {colors: ['green', 'blue']}
};
var chart = new google.visualization.GeoChart(document.getElementById('chart_demopulau'));
chart.draw(data, options);
};
</script> -->
</div>
</div>
</div>
<!-- <div class="panel-footer">Panel Footer</div> -->
</div> -->
</div><!-- end row -->
<!-- js online source for datatable jquery -->
<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css">
<script>
$(document).ready(function() {
$('a[href="#stockProduk"]').on('click', function() {
$('#startProduk').hide();
$('#endProduk').hide();
$('#submitPenjualanProduk').hide();
});
});
$(document).ready(function() {
$('a[href="#poor"]').on('click', function() {
$('#startProduk').show();
$('#endProduk').show();
$('#submitPenjualanProduk').show();
});
});
$(document).ready(function() {
$('a[href="#top"]').on('click', function() {
$('#startProduk').show();
$('#endProduk').show();
$('#submitPenjualanProduk').show();
});
});
$(document).ready(function() {
$('a[href="#poornotbuy"]').on('click', function() {
$('#startProduk').show();
$('#endProduk').show();
$('#submitPenjualanProduk').show();
});
});
$(document).ready(function() {
$('a[href="#customerlokasidiv"]').on('click', function() {
$('#startCustomer').hide();
$('#endCustomer').hide();
$('#submitPenjualanCustomer').hide();
});
});
$(document).ready(function() {
$('a[href="#customerumurdiv"]').on('click', function() {
$('#startCustomer').hide();
$('#endCustomer').hide();
$('#submitPenjualanCustomer').hide();
});
});
$(document).ready(function() {
$('a[href="#customerjkdiv"]').on('click', function() {
$('#startCustomer').hide();
$('#endCustomer').hide();
$('#submitPenjualanCustomer').hide();
});
});
$(document).ready(function() {
$('a[href="#customerbirthdaydiv"]').on('click', function() {
$('#startCustomer').hide();
$('#endCustomer').hide();
$('#submitPenjualanCustomer').hide();
});
});
$(document).ready(function() {
$('a[href="#customerterbaik"]').on('click', function() {
$('#startCustomer').show();
$('#endCustomer').show();
$('#submitPenjualanCustomer').show();
});
});
// date picker
$(function() {
$('#datetime, #search-to-date, #startPenjualan, #endPenjualan, #startProduk, #endProduk, #startCustomer, #endCustomer').datepicker();
});
// datatable jquery
$(document).ready(function() {
$('#penjualantahun').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Sales per year <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Sales per year <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'print',
title: 'Sales per year <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
}
]
});
$('#penjualanbulan').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Sales per month <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Sales per month <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'print',
title: 'Sales per month <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
}
]
});
$('#penjualanhari').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Sales per day <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Sales per day <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
},
{
extend: 'print',
title: 'Sales per day <?php echo (isset($_SESSION['startPenjualan'])) ? $_SESSION['startPenjualan'] . " - " . $_SESSION['endPenjualan'] : "" ?>'
}
]
});
$('#toptable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Best Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Best Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'print',
title: 'Best Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
}
]
});
$('#poortable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Poor Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Poor Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'print',
title: 'Poor Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
}
]
});
$('#stocktable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Product Stock <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Product Stock <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'print',
title: 'Product Stock <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
}
]
});
$('#productdefecttable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [{
extend: 'excelHtml5',
title: 'Defect Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Defect Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
},
{
extend: 'print',
title: 'Defect Product <?php echo (isset($_SESSION['startProduk'])) ? $_SESSION['startProduk'] . " - " . $_SESSION['endProduk'] : "" ?>'
}
]
});
$('#poornotbuytable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Not ordered product'
},
{
extend: 'pdfHtml5',
title: 'Not ordered product'
},
{
extend: 'print',
title: 'Not ordered product'
}
]
});
$('#bestcust').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Best Customer <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Best Customer <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Best Customer <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#customerjk').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customer Sex Type <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customer Sex Type <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customer Sex Type <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#customerumur').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers by Age <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers by Age <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers by Age <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#customerlokasi').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers by Location <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers by Location <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers by Location <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#birthdaytableday').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers by Birthday in This Day <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers by Birthday in This Day <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers by Birthday in This Day <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#birthdaytableweek').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers by Birthday in This Week <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers by Birthday in This Week <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers by Birthday in This Week <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#customerreporttable').DataTable({
"ordering": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers Data And Report <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers Data And Report <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers Data And Report <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
$('#birthdaytablemonth').DataTable({
"ordering": false,
"searching": false,
"paging": false,
"info": false,
dom: 'Bfrtip',
buttons: [
{
extend: 'excelHtml5',
title: 'Customers by Birthday in This Month <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'pdfHtml5',
title: 'Customers by Birthday in This Month <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
},
{
extend: 'print',
title: 'Customers by Birthday in This Month <?php echo (isset($_SESSION['startCustomer'])) ? $_SESSION['startCustomer'] . " - " . $_SESSION['endCustomer'] : "" ?>'
}
]
});
});
</script>