first commit
This commit is contained in:
dev-chiefworks
@@ -0,0 +1,294 @@
|
||||
<style>
|
||||
#tblSummary tr.hidd{
|
||||
display: none;
|
||||
}
|
||||
.tippy{
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
</style>
|
||||
<table class="table table-striped table-hover table-bordered table-condensed" id="tblSummary">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th>Location</th>
|
||||
<th>Points Assigned 24HRs</th>
|
||||
<th>Points Assigned Past 7 Days</th>
|
||||
<th>Points Assigned Past 14 Days</th>
|
||||
<th>Points Assigned Past 30 Days</th>
|
||||
<th>Points Assigned All Time</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
$s1 = $s2 = $s3 = $s4 = $s5 = 0;
|
||||
foreach ($data_report ?? [] as $item) {
|
||||
$s1 += $item['last_24_hrs'];
|
||||
$s2 += $item['last_7_days'];
|
||||
$s3 += $item['last_14_days'];
|
||||
$s4 += $item['last_30_days'];
|
||||
$s5 += $item['total_assigned_times'];
|
||||
?>
|
||||
<tr class="<?=$item['location']?> <?=(!in_array($item['location'],['SG','US','Unknown'])?'hidd':'')?>" >
|
||||
<td class="text-right">
|
||||
<?php
|
||||
if($item['location'] === 'Unknown'){
|
||||
echo '<span class="tippy" data-tippy-content="User has not provided GPS Permission">'.$item["location"].'</span>';
|
||||
}else{
|
||||
echo $item['location'];
|
||||
}
|
||||
?>
|
||||
</td>
|
||||
<td class="text-right"><?= $item['last_24_hrs'] ?></td>
|
||||
<td class="text-right"><?= $item['last_7_days'] ?></td>
|
||||
<td class="text-right"><?= $item['last_14_days'] ?></td>
|
||||
<td class="text-right"><?= $item['last_30_days'] ?></td>
|
||||
<td class="text-right"><?= $item['total_assigned_times'] ?></td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
<tr>
|
||||
<td colspan="100%" class="text-center">
|
||||
<a onclick="fnShowExpand(this)">...Expand...</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="background-color: #efefbf8c; opacity: 0.8; font-weight: bold">
|
||||
<td class="text-right"></td>
|
||||
<td class="text-right"><?=$s1?></td>
|
||||
<td class="text-right"><?=$s2?></td>
|
||||
<td class="text-right"><?=$s3?></td>
|
||||
<td class="text-right"><?=$s4?></td>
|
||||
<td class="text-right"><?=$s5?></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div class="block" style="margin-top: 30px">
|
||||
<hr/>
|
||||
<form method="get" action="#" onsubmit="return fnSubmitFormReport();">
|
||||
<div class="row">
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" id="date_range" name="date_range"
|
||||
value="<?= $date_range ?? '' ?>" style="width: 100%" autocomplete="off"
|
||||
placeholder="Allocation Date"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" id="email" name="email" placeholder="Email" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<?= $country_filter ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<?= $point_key ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<div class="form-group">
|
||||
<?= $point_value ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-2">
|
||||
<a class="btn btn-default" href="/points/systemicpointssummary">Reset</a>
|
||||
<input type="button" onclick="fn_export_csv();" class="btn btn-info btn-xs" value="Export CSV">
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="block">
|
||||
<div class="table-responsive">
|
||||
<table id="tblReport" class="table table-striped table-hover table-bordered table-condensed">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Allocation Date</th>
|
||||
<th>Sign-up Date</th>
|
||||
<th>Location</th>
|
||||
<th>User ID</th>
|
||||
<th>User Email</th>
|
||||
<th>Point Key</th>
|
||||
<th>Point Name</th>
|
||||
<th>Point Value</th
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://unpkg.com/@popperjs/core@2"></script>
|
||||
<script src="https://unpkg.com/tippy.js@6"></script>
|
||||
<link rel="stylesheet" href="https://unpkg.com/tippy.js@6/animations/scale.css"/>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
tippy('.tippy', {
|
||||
content: 'Global content',
|
||||
animation: 'scale',
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
const $date_range = $('input[name="date_range"]');
|
||||
$date_range.daterangepicker({
|
||||
opens: 'right',
|
||||
autoUpdateInput: false,
|
||||
locale: {
|
||||
cancelLabel: 'Clear'
|
||||
},
|
||||
ranges: {
|
||||
'Today': [moment(), moment()],
|
||||
'Past 24 hours': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
||||
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
|
||||
'Last 14 Days': [moment().subtract(13, 'days'), moment()],
|
||||
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
||||
'Last 60 Days': [moment().subtract(59, 'days'), moment()],
|
||||
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
||||
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
|
||||
'Two months ago': [moment().subtract(2, 'month').startOf('month'), moment().subtract(2, 'month').endOf('month')]
|
||||
},
|
||||
alwaysShowCalendars: true
|
||||
});
|
||||
$date_range.on('apply.daterangepicker', function (ev, picker) {
|
||||
$(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
|
||||
fnSubmitFormReport();
|
||||
});
|
||||
$date_range.on('cancel.daterangepicker', function (ev, picker) {
|
||||
$(this).val('');
|
||||
fnSubmitFormReport();
|
||||
});
|
||||
$date_range.on('show.daterangepicker', function (ev, picker) {
|
||||
$("#date_range").get(0).scrollIntoView();
|
||||
});
|
||||
|
||||
$('#country_filter').change(function () {
|
||||
fnSubmitFormReport();
|
||||
});
|
||||
|
||||
$('#point_key').change(function () {
|
||||
fnSubmitFormReport();
|
||||
});
|
||||
|
||||
$('#point_value').change(function () {
|
||||
fnSubmitFormReport();
|
||||
});
|
||||
|
||||
window.tblReport = null;
|
||||
window.date_range_value = '';
|
||||
window.country_filter = '';
|
||||
$(function () {
|
||||
window.tblReport = $('#tblReport').DataTable({
|
||||
"sDom": 'lrtip',
|
||||
"responsive": true,
|
||||
"processing": true,
|
||||
"serverSide": true,
|
||||
'ajax': {
|
||||
'url': '/points/getSystemicPointsDatatables',
|
||||
"type": "POST",
|
||||
"data": {
|
||||
"date_range": function () {
|
||||
return $("#date_range").val()
|
||||
},
|
||||
"email": function () {
|
||||
return $('#email').val()
|
||||
},
|
||||
"country_filter": function () {
|
||||
return $('#country_filter').val()
|
||||
},
|
||||
"point_key": function () {
|
||||
return $('#point_key').val()
|
||||
},
|
||||
"point_value": function () {
|
||||
return $('#point_value').val()
|
||||
},
|
||||
},
|
||||
"error": function (xhr, ajaxOptions, thrownError) {
|
||||
alert(thrownError);
|
||||
}
|
||||
},
|
||||
"order": [[1, "desc"]],
|
||||
"pageLength": 25,
|
||||
"lengthMenu": [10, 25, 50, 100, 200, 500, 1000],
|
||||
'columns': [
|
||||
{data: 'allocation_date'},
|
||||
{data: 'sign_up_date'},
|
||||
{data: 'country'},
|
||||
{data: 'member_id'},
|
||||
{data: 'email'},
|
||||
{data: 'point_key'},
|
||||
{data: 'name'},
|
||||
{data: 'points'}
|
||||
],
|
||||
'columnDefs': [
|
||||
{
|
||||
targets: 2,
|
||||
render: function (data, type, row, meta) {
|
||||
const _user_id = row.user_id;
|
||||
if (type === 'display' && data === 'Unknown') {
|
||||
return '<span class="tippy" data-tippy-content="User has not provided GPS Permission">'+data+'</span>';
|
||||
}
|
||||
return data;
|
||||
}
|
||||
},
|
||||
{
|
||||
targets: 3,
|
||||
render: function (data, type, row, meta) {
|
||||
if (type === 'display') {
|
||||
return `<a href="/member/viewLocateMember?member_id=${data}" target="_blank">${data}</a>`;
|
||||
}
|
||||
return data;
|
||||
}
|
||||
},
|
||||
{"orderable": false, "targets": [4,5,6,7]}
|
||||
],
|
||||
});
|
||||
|
||||
window.tblReport.on( 'draw', function () {
|
||||
tippy('.tippy', {
|
||||
content: 'Global content',
|
||||
animation: 'scale',
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function fnShowExpand(that){
|
||||
const cur_text = $(that).text();
|
||||
$(that).text(cur_text == '...Expand...'?'Collapse':'...Expand...');
|
||||
$('#tblSummary').find('tr.hidd').toggle();
|
||||
}
|
||||
|
||||
function debounce(func, wait) {
|
||||
var timeout;
|
||||
|
||||
return function() {
|
||||
var context = this,
|
||||
args = arguments;
|
||||
|
||||
var executeFunction = function() {
|
||||
func.apply(context, args);
|
||||
};
|
||||
|
||||
clearTimeout(timeout);
|
||||
timeout = setTimeout(executeFunction, wait);
|
||||
};
|
||||
};
|
||||
|
||||
var handleSearchEmail = debounce(function (e) {
|
||||
fnSubmitFormReport();
|
||||
}, 500);
|
||||
|
||||
$('#email').on('keyup', handleSearchEmail);
|
||||
|
||||
//filter clicked
|
||||
function fnSubmitFormReport() {
|
||||
window.tblReport.ajax.reload(false);
|
||||
return false;
|
||||
}
|
||||
function fn_export_csv(){
|
||||
window.location.assign("/points/systemicPointsReportCSV");
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user