first commit
This commit is contained in:
dev-chiefworks
@@ -0,0 +1,139 @@
|
||||
<div class="row trips_containers">
|
||||
<div class="col-lg-4">
|
||||
<div class="summary-wrapper">
|
||||
<div class="sw-header">
|
||||
<p class="text-center"><strong>Activity</strong></p>
|
||||
<span class="currency">$</span>
|
||||
<span class="total-amount"><?=number_format($trip_report['total_amount'], 2)?></span>
|
||||
<p class="description">
|
||||
<?php
|
||||
$checkDateRangeExist = ( isset( $start_date ) and !empty( $start_date ) ) and ( isset( $end_date ) and !empty( $end_date ) );
|
||||
if ( $checkDateRangeExist ) {
|
||||
printf( 'Total money spent from %s to %s', $start_date, $end_date );
|
||||
} else {
|
||||
printf( 'Total money spent last %s days', $trip_report['data']['days'] );
|
||||
}
|
||||
?>
|
||||
</p>
|
||||
</div>
|
||||
<div class="sw-content">
|
||||
<?php foreach($trip_report['report'] as $category) { ?>
|
||||
<div class="item-summary <?php echo count($category['items']) > 0 ? 'active' : '' ?>" data-type="<?php echo $category['type'] ?>">
|
||||
<div class="category"><?=$category['type']?></div>
|
||||
<div class="amount">
|
||||
<p class="currency">$</p>
|
||||
<p class="category-total"><?=number_format($category['spent'], 2)?></p>
|
||||
<p class="right-icon"><svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-arrow-right-circle" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/>
|
||||
<path fill-rule="evenodd" d="M7.646 11.354a.5.5 0 0 1 0-.708L10.293 8 7.646 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0z"/>
|
||||
<path fill-rule="evenodd" d="M4.5 8a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5z"/>
|
||||
</svg></p>
|
||||
</div>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-8">
|
||||
<p class="transport-category"></p>
|
||||
<div class="details-wrapper">
|
||||
<table id="transportDetails" style="background-color:aliceblue" class="table table-striped table-hover table-bordered table-condensed">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th>Data Source</th>
|
||||
<th>ID</th>
|
||||
<th>Import ID</th>
|
||||
<th>Member ID</th>
|
||||
<th>Amount</th>
|
||||
<th>Currency</th>
|
||||
<th>Description</th>
|
||||
<th>Time</th>
|
||||
<th>Category</th>
|
||||
<th>Provider Category</th>
|
||||
<th>Merchant Name</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
const tripData = JSON.parse('<?php echo json_encode($trip_report) ?>');
|
||||
const memberID = (tripData.data || {}).member_id || '';
|
||||
$(document).ready(function() {
|
||||
$('.item-summary.active').on('click', function(e) {
|
||||
const transportType = $(this).data('type');
|
||||
const transportData = tripData.report.find(item => item.type === transportType) || {items: []};
|
||||
const transportItems = parseTransportDetails(transportData.items);
|
||||
const transportItemsHtml = transportItems.map(item => {
|
||||
return gernerateDetail(item);
|
||||
}).join(' ');
|
||||
|
||||
$('.transport-category').text(transportType);
|
||||
$('#transportDetails tbody').html(transportItemsHtml);
|
||||
});
|
||||
|
||||
// find and get first category which has data for display on table
|
||||
let firstData = null;
|
||||
for(let i = 0; i < tripData.report.length; i++) {
|
||||
const item = tripData.report[i];
|
||||
if (!item || !item.items || !item.items.length) {
|
||||
continue;
|
||||
}
|
||||
|
||||
firstData = item;
|
||||
break;
|
||||
}
|
||||
|
||||
if (firstData) {
|
||||
const transportItems = parseTransportDetails(firstData.items);
|
||||
const transportItemsHtml = transportItems.map(item => {
|
||||
return gernerateDetail(item);
|
||||
}).join(' ');
|
||||
|
||||
$('.transport-category').text(firstData.type || '');
|
||||
$('#transportDetails tbody').html(transportItemsHtml);
|
||||
}
|
||||
// End find and get first data
|
||||
});
|
||||
|
||||
function parseTransportDetails($data) {
|
||||
return $data.map(item => {
|
||||
return Object.assign({}, item, {
|
||||
currency: formatCurrency(item.currency),
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
function formatCurrency(currency) {
|
||||
return currency.replace(/[0-9]/g, '');
|
||||
}
|
||||
|
||||
function gernerateDetail(data) {
|
||||
let data_source = '';
|
||||
if(data.hasOwnProperty('import_id') && data.import_id){
|
||||
data_source = 'Bank';
|
||||
}else if(data.hasOwnProperty('trackedemail_item_id') && data.trackedemail_item_id){
|
||||
data_source = 'Email';
|
||||
}
|
||||
return `
|
||||
<tr>
|
||||
<td>${data_source}</td>
|
||||
<td>${data.id || ''}</td>
|
||||
<td>${data.import_id || ''}</td>
|
||||
<td>${data.member_id || memberID || ''}</td>
|
||||
<td>${data.cost || ''}</td>
|
||||
<td>${data.currency || ''}</td>
|
||||
<td>${data.description || ''}</td>
|
||||
<td>${data.travel_date || ''}</td>
|
||||
<td>${data.category || ''}</td>
|
||||
<td>${data.provider_category || ''}</td>
|
||||
<td>${data.transport_provider_name || ''}</td>
|
||||
</tr>
|
||||
`;
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<hr/>
|
||||
<h4 class="text-center">Activities cards</h4>
|
||||
<table class="activities-cards-table table-bordered table-condensed table-hover table-striped table-condensed d-none mb-15" style="background-color:#f0f8ff;" width="100%">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th>Card ID</th>
|
||||
<th>Description</th>
|
||||
<th>Action</th>
|
||||
<th>Card Icon</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($activities_cards ?? [] as $item){ ?>
|
||||
<tr>
|
||||
<td><?=$item['card_id']??''?></td>
|
||||
<td><?=$item['detail_data']['description']??''?></td>
|
||||
<td><?=$item['detail_data']['action']??''?></td>
|
||||
<td><?=$item['detail_data']['card_icon']??''?></td>
|
||||
</tr>
|
||||
<?php }
|
||||
if(empty($activities_cards ?? [])){
|
||||
echo '<tr class="text-center"><td colspan="100%">Empty result</td></tr>';
|
||||
}
|
||||
?>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -0,0 +1,214 @@
|
||||
<?php
|
||||
// EMISSIONS CALC
|
||||
$emissions = $emission_charts = [];
|
||||
// filter by range date
|
||||
$checkDateRangeExist = ( isset( $start_date ) and !empty( $start_date ) ) and ( isset( $end_date ) and !empty( $end_date ) );
|
||||
if ( $checkDateRangeExist ) {
|
||||
$start_date = str_replace( '-', '/', $start_date );
|
||||
$end_date = str_replace('-', '/', $end_date);
|
||||
$emission_data['report'] = array_filter( $emission_data['report'], function( $e ) use ( $start_date, $end_date ) {
|
||||
$report_time = strtotime( $e['date'] );
|
||||
if ( $report_time >= strtotime( $start_date ) and $report_time <= strtotime( $end_date ) ) {
|
||||
return $e;
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
$emissionTotalItems = isset($emission_data["report"]) ? count($emission_data["report"]) : 0;
|
||||
|
||||
// do not separation by date if have date range params
|
||||
if ( ! $checkDateRangeExist ) {
|
||||
if ($emissionTotalItems >= 7) {
|
||||
$emissions['7D'] = array_reverse(array_slice($emission_data['report'], 0, 7));
|
||||
}
|
||||
if ($emissionTotalItems >= 30) {
|
||||
$emissions['30D'] = array_reverse(array_slice($emission_data['report'], 0, 30));
|
||||
if ($emissionTotalItems > 30) {
|
||||
$emissions[$emissionTotalItems . 'D'] = array_reverse($emission_data['report']);
|
||||
}
|
||||
} elseif ($emissionTotalItems > 0) {
|
||||
$emissions[$emissionTotalItems . 'D'] = array_reverse($emission_data['report']);
|
||||
}
|
||||
} else {
|
||||
$emissions['dateranges'] = array_reverse( $emission_data['report'] );
|
||||
}
|
||||
|
||||
foreach ($emissions as $key_day => $ems) {
|
||||
$em_chart = [
|
||||
'labels' => [],
|
||||
'data' => [],
|
||||
'total_value' => 0
|
||||
];
|
||||
$total = 0;
|
||||
foreach ($ems as $em) {
|
||||
$total+=$em['value'];
|
||||
}
|
||||
foreach ($ems as $em) {
|
||||
$em_chart['labels'][] = $em['date'].'/'.$total;
|
||||
$em_chart['data'][] = round($em['value'],2);//($em['value']*100/$total);
|
||||
|
||||
}
|
||||
$em_chart['total_value'] += $total;
|
||||
$emission_charts[$key_day] = $em_chart;
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="col-lg-7 overflow-auto">
|
||||
<?php
|
||||
foreach ($emissions as $key_day => $ems) {
|
||||
?>
|
||||
<div class="table_emission_wrap" id="table_emission_wrap_<?= $key_day ?>">
|
||||
<table class="table_emission table table-striped table-border-solid"
|
||||
id="table_emission_<?= $key_day ?>">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>#</th>
|
||||
<th>Date</th>
|
||||
<th>Emission</th>
|
||||
<th>GAS</th>
|
||||
<th>GAS Emission</th>
|
||||
<th>Merchant name</th>
|
||||
<th>Transaction amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
$ii = 0;
|
||||
foreach ($ems as $rows) {
|
||||
$ii++;
|
||||
echo '<tr>';
|
||||
echo '<td>' . $ii . '</td>';
|
||||
echo '<td>' . $ii . '</td>';
|
||||
echo '<td>' . $rows["date"] . '</td>';
|
||||
echo '<td><span' . ($rows["value"] > 0 ? ' style="font-weight:bold;"' : '') . '>' . number_format($rows["value"], 2) . '</span></td>';
|
||||
echo '<td><span' . ($rows["value"] > 0 ? ' style="font-weight:bold;"' : '') . '>' . number_format($rows["gas"], 2) . '</span></td>';
|
||||
echo '<td><span' . ($rows["value"] > 0 ? ' style="font-weight:bold;"' : '') . '>' . number_format($rows["gas_emission"], 2) . '</span></td>';
|
||||
echo '<td>' . $rows["merchant_name"]??'-' . '</td>';
|
||||
echo '<td>' . $rows["amount"]??'-' . '</td>';
|
||||
echo '</tr>';
|
||||
}
|
||||
?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<div class="col-lg-5 overflow-auto">
|
||||
<h4 class="text-center">Emission Chart</h4>
|
||||
<?php if ( !$checkDateRangeExist ): ?>
|
||||
<div class="text-center" style="margin-bottom: 8px;">
|
||||
<div class="btn-group" role="group" aria-label="Basic example">
|
||||
<?php
|
||||
foreach (array_keys($emission_charts) as $id) {
|
||||
echo '<button type="button" id="btn_switch_emission_' . $id . '" class="btn_switch_emission btn btn-outline-secondary" onclick="fn_show_emission_(\'' . $id . '\')">' . $id . '</button>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
<?php
|
||||
foreach ((array_keys($emission_charts)) as $em_chart_id) {
|
||||
echo '<canvas class="emission_chart" id="emission_chart_' . $em_chart_id . '" height="500px" width="800px"></canvas>';
|
||||
}
|
||||
?>
|
||||
|
||||
<div>
|
||||
<?php
|
||||
$activities_cards = $emission_data['options']['cards']??[];
|
||||
include( __DIR__ . '/cards.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
var emission_charts = <?php echo json_encode($emission_charts); ?>;
|
||||
var emission_keys = <?php echo json_encode(array_keys($emission_charts)); ?>;
|
||||
$(function () {
|
||||
emission_keys.forEach(function (id) {
|
||||
$('#table_emission_' + id).DataTable({
|
||||
"columnDefs": [
|
||||
{
|
||||
"targets": [1],
|
||||
"visible": false,
|
||||
"searchable": false
|
||||
}
|
||||
],
|
||||
"order": [[2, "desc"]]
|
||||
});
|
||||
});
|
||||
for (var chart_id in emission_charts) {
|
||||
var em_chart = emission_charts[chart_id];
|
||||
var ctx = document.getElementById("emission_chart_" + chart_id);
|
||||
if ( ctx == null ) {
|
||||
continue;
|
||||
}
|
||||
new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: em_chart.labels,
|
||||
datasets: [{
|
||||
label: numberWithCommas(em_chart.total_value.toFixed(2)) + ' kg/CO2',
|
||||
data: em_chart.data,
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
scales: {},
|
||||
plugins: { labels: { render: 'value' } },
|
||||
// plugins: {
|
||||
// labels: {
|
||||
// render: function (args) {
|
||||
// console.log(args);
|
||||
// let sum = em_chart.data.reduce(function(a, b) { return a + b; }, 0);
|
||||
// var prc = (args.value*100/sum);
|
||||
// return prc > 0 ? prc.toFixed(1) + '%' : '';
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
label: function(tooltipItem) {
|
||||
var total = parseFloat(tooltipItem.label.split('/')[1]);
|
||||
var prc = parseFloat(tooltipItem.yLabel)*100/total;
|
||||
return tooltipItem.yLabel+'kg/CO2 - '+prc.toFixed(1) + "%";
|
||||
}
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
display: true,
|
||||
ticks: {
|
||||
min: 0,
|
||||
},
|
||||
}],
|
||||
xAxes: [{
|
||||
display: true,
|
||||
ticks: {
|
||||
callback: function (value) {
|
||||
return value.split("/")[0];
|
||||
},
|
||||
},
|
||||
}],
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function fn_show_emission_(id) {
|
||||
$('.emission_chart').hide();
|
||||
$('#emission_chart_' + id).show();
|
||||
|
||||
$('.table_emission_wrap').hide();
|
||||
$('#table_emission_wrap_' + id).show();
|
||||
|
||||
$(".btn_switch_emission").removeClass('btn-success');
|
||||
$("#btn_switch_emission_" + id).addClass('btn-success');
|
||||
}
|
||||
|
||||
if (emission_keys.length > 0) {
|
||||
//trigger show first days default
|
||||
fn_show_emission_(emission_keys[0]);
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,120 @@
|
||||
<div class="col-lg-12 overflow-auto">
|
||||
<table class="table table-striped table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">Total or City Data</th>
|
||||
<th scope="col">Users Data</th>
|
||||
<th scope="col" class="text-center">Plot</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row" style="max-width: 25%">
|
||||
<table class="table table-striped">
|
||||
<?php
|
||||
$ii = $radar_data_sum_value = 0;
|
||||
foreach ($radar_data["report"][0] as $rows) {
|
||||
$radar_data_sum_value += $rows['value']??0;
|
||||
}
|
||||
foreach ($radar_data["report"][0] as &$rows) {
|
||||
$ii++;
|
||||
$prc = $rows["value"]>0?$rows["value"]*100/$radar_data_sum_value:0;
|
||||
$rows['prc'] = round($prc, 2);
|
||||
echo '<tr>';
|
||||
echo '<td>'.$ii.'</td>';
|
||||
echo '<td>'.$rows["axis"].'</td>';
|
||||
echo '<td title="'.$rows['value'].'">'.$rows['prc'].'%</td>';
|
||||
echo '</tr>';
|
||||
}
|
||||
?>
|
||||
</table>
|
||||
</th>
|
||||
<td style="max-width: 25%">
|
||||
<table class="table table-striped">
|
||||
<?php
|
||||
$ii = 0;
|
||||
$radar_data_sum_value = 0;
|
||||
foreach ($radar_data["report"][1] as &$rows) {
|
||||
$radar_data_sum_value += $rows['value']??0;
|
||||
}
|
||||
foreach ($radar_data["report"][1] as &$rows) {
|
||||
$ii++;
|
||||
$prc = $rows["value"]>0?$rows["value"]*100/$radar_data_sum_value:0;
|
||||
$rows['prc'] = round($prc, 2);
|
||||
echo '<tr>';
|
||||
echo '<td>'.$ii.'</td>';
|
||||
echo '<td>'.$rows["axis"].'</td>';
|
||||
echo '<td title="'.$rows['value'].'" '.($rows['prc']>0?'style="font-weight:bold;"':'').'>'.$rows['prc'].'%</td>';
|
||||
echo '</tr>';
|
||||
}
|
||||
?>
|
||||
</table>
|
||||
</td>
|
||||
<td style="width: 50%">
|
||||
<canvas id="personaltyRadarChart"></canvas>
|
||||
<script>
|
||||
var radar_data = <?php echo json_encode($radar_data) ?>;
|
||||
var radar_labels = [], radar_data_value_total = [],
|
||||
radar_data_value_user = [];
|
||||
radar_data.report[0].forEach(function (element, ielement) {
|
||||
radar_labels.push(element.axis);
|
||||
radar_data_value_total.push(element.prc);
|
||||
});
|
||||
radar_data_value_user = radar_data.report[1].reduce(function (a, b) {
|
||||
a.push(parseFloat(b.prc));
|
||||
return a;
|
||||
}, []);
|
||||
var marksCanvas = document.getElementById("personaltyRadarChart");
|
||||
var marksData = {
|
||||
labels: radar_labels,
|
||||
datasets: [{
|
||||
label: "Your travel",
|
||||
backgroundColor: "rgba(200,0,0,0.2)",
|
||||
data: radar_data_value_user
|
||||
}, {
|
||||
label: "Avg person in your city",
|
||||
backgroundColor: "rgba(0,0,200,0.2)",
|
||||
data: radar_data_value_total
|
||||
}]
|
||||
};
|
||||
var radarChart = new Chart(marksCanvas, {
|
||||
type: 'radar',
|
||||
data: marksData,
|
||||
options: {
|
||||
backgroundColor: 'red',
|
||||
scale: {
|
||||
gridLines: {
|
||||
circular: true
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
},
|
||||
pointLabels: {
|
||||
fontSize: 14,
|
||||
},
|
||||
},
|
||||
plugins: {
|
||||
labels: {
|
||||
render: 'percentage',
|
||||
fontColor: function (data) {
|
||||
var rgb = chartHexToRgb(data.dataset.backgroundColor[data.index]);
|
||||
var threshold = 140;
|
||||
var luminance = 0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b;
|
||||
return luminance > threshold ? 'black' : 'white';
|
||||
},
|
||||
precision: 2
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div>
|
||||
<?php
|
||||
$activities_cards = $radar_data['options']['cards']??[];
|
||||
include( __DIR__ . '/cards.php' ); ?>
|
||||
</div>
|
||||
@@ -0,0 +1,183 @@
|
||||
<?php
|
||||
$spents = [];
|
||||
if (isset($speding_category7) && isset($speding_category7["report"])) {
|
||||
$spents['7D'] = $speding_category7;
|
||||
}
|
||||
if (isset($speding_category30) && isset($speding_category30["report"])) {
|
||||
$spents['30D'] = $speding_category30;
|
||||
}
|
||||
if (isset($speding_category) && isset($speding_category["report"])) {
|
||||
$spents['60D'] = $speding_category;
|
||||
}
|
||||
if (isset($speding_category_daysrange) && isset($speding_category_daysrange['report'])) {
|
||||
$spents['daysrange'] = $speding_category_daysrange;
|
||||
}
|
||||
$spent_charts = [];
|
||||
$colors = ["#3e95cd", "#8e5ea2", "#3cba9f", "#e8c3b9", "#c45850", "#969696"];
|
||||
$spent_keys = array_keys($spents);
|
||||
$checkDateRangeExist = ( isset( $start_date ) and !empty( $start_date ) ) and ( isset( $end_date ) and !empty( $end_date ) );
|
||||
?>
|
||||
|
||||
<div class="col-lg-4 overflow-auto">
|
||||
<?php
|
||||
foreach ($spents as $spent_id => $spent) {
|
||||
?>
|
||||
<div class="spent_table_wrap" id="spent_table_wrap_<?= $spent_id ?>">
|
||||
<table class="table table-striped">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">Type</th>
|
||||
<th scope="col">Amount</th>
|
||||
<th scope="col">Percent</th>
|
||||
<th scope="col">Detail</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
$ii = 0;
|
||||
$spent_chart_item = [
|
||||
'labels' => [],
|
||||
'total_spent' => 0,
|
||||
'datasets' => [
|
||||
'data' => [],
|
||||
'backgroundColor' => []
|
||||
]
|
||||
];
|
||||
$total_spent = 0;
|
||||
foreach ($spent["report"] as $rows) {
|
||||
$total_spent += (float)$rows['spent'];
|
||||
}
|
||||
|
||||
foreach ($spent["report"] as $rows) {
|
||||
$ii++;
|
||||
$prc = $total_spent > 0 ? ((float)$rows['spent']??0)*100/($total_spent?:1) : 0;
|
||||
echo '<tr>';
|
||||
echo '<td>'.$ii.'</td>';
|
||||
echo '<td>'.$rows["type"].'</td>';
|
||||
echo '<td>'.$rows["spent"].'</td>';
|
||||
echo '<td '.($prc>0?'style="font-weight:bold;"':'').'>'.number_format($prc,2,'.','').'%</td>';
|
||||
echo '<td></td>';
|
||||
echo '</tr>';
|
||||
//echo "<tr><td>$ii</td><td>" . $rows["type"] . "</td><td>" . $rows["spent"] . "</td><td></td></tr>";
|
||||
$spent_chart_item['labels'][] = $rows["type"] ?? '-';
|
||||
$spent_chart_item['datasets']['data'][] = (float)$rows["spent"] ?? 0;
|
||||
$spent_chart_item['datasets']['backgroundColor'][] = isset($colors[$ii - 1]) ? $colors[$ii - 1] : '#49ff00';
|
||||
}
|
||||
$spent_chart_item['total_spent'] = $total_spent;
|
||||
$spent_charts[$spent_id] = $spent_chart_item;
|
||||
?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
<div class="col-lg-8 overflow-auto">
|
||||
<?php if ( ! $checkDateRangeExist ): ?>
|
||||
<div class="text-center" style="margin-bottom: 8px;">
|
||||
<div class="btn-group" role="group" aria-label="Basic example">
|
||||
<?php
|
||||
foreach ($spent_keys as $id) {
|
||||
echo '<button type="button" id="btn_switch_spent_' . $id . '"
|
||||
class="btn_switch_spent btn btn-outline-secondary"
|
||||
onclick="fn_show_spent_(\'' . $id . '\')">' . $id . '</button>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
|
||||
<?php
|
||||
foreach ($spent_keys as $id) {
|
||||
echo '<canvas id="spent_category_chart_' . $id . '" class="spent_chart" width="800" height="450"></canvas>';
|
||||
}
|
||||
?>
|
||||
<script type="text/javascript">
|
||||
function chartHexToRgb(hex) {
|
||||
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
||||
return result ? {
|
||||
r: parseInt(result[1], 16),
|
||||
g: parseInt(result[2], 16),
|
||||
b: parseInt(result[3], 16)
|
||||
} : null;
|
||||
}
|
||||
|
||||
var spent_categore_charts = <?=json_encode($spent_charts)?>;
|
||||
var spent_keys = <?=json_encode(array_keys($spent_charts))?>;
|
||||
for (var spent_id in spent_categore_charts) {
|
||||
var spent_char_data = spent_categore_charts[spent_id];
|
||||
var showTitle = '<?php echo !$checkDateRangeExist ? 'true' : 'false'; ?>';
|
||||
var _title;
|
||||
if ( showTitle == 'true' ) {
|
||||
_title = 'Spend Category Chart ' + spent_id;
|
||||
} else {
|
||||
_title = 'Spend Category Chart from ' + '<?php if ( isset( $start_date ) ) echo $start_date; ?>' + ' to ' + '<?php if ( isset( $end_date ) ) echo $end_date; ?>';
|
||||
}
|
||||
|
||||
var ctx = document.getElementById("spent_category_chart_" + spent_id);
|
||||
if ( ctx == null ) {
|
||||
continue;
|
||||
}
|
||||
|
||||
new Chart(ctx, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
labels: spent_char_data.labels,
|
||||
datasets: [
|
||||
{
|
||||
backgroundColor: spent_char_data.datasets.backgroundColor,
|
||||
data: spent_char_data.datasets.data,
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
title: {
|
||||
display: true,
|
||||
text: [_title,'Total Spend: $'+spent_char_data.total_spent]
|
||||
},
|
||||
tooltips: {
|
||||
enabled: true
|
||||
},
|
||||
plugins: {
|
||||
labels: {
|
||||
textShadow: true,
|
||||
render: function (args) {
|
||||
return args.percentage+'%\n$'+args.value;
|
||||
},
|
||||
fontColor: function (data) {
|
||||
var rgb = chartHexToRgb(data.dataset.backgroundColor[data.index]);
|
||||
var threshold = 140;
|
||||
var luminance = 0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b;
|
||||
return luminance > threshold ? 'black' : 'white';
|
||||
},
|
||||
precision: 2
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function fn_show_spent_(id) {
|
||||
$('.spent_chart').hide();
|
||||
$('#spent_category_chart_' + id).show();
|
||||
|
||||
$('.spent_table_wrap').hide();
|
||||
$('#spent_table_wrap_' + id).show();
|
||||
|
||||
$(".btn_switch_spent").removeClass('btn-success');
|
||||
$("#btn_switch_spent_" + id).addClass('btn-success');
|
||||
}
|
||||
|
||||
if (spent_keys.length > 0) {
|
||||
//trigger show first days default
|
||||
fn_show_spent_(spent_keys[0]);
|
||||
}
|
||||
</script>
|
||||
<div>
|
||||
<?php
|
||||
$activities_cards = $speding_category7['options']['cards']??[];
|
||||
include( __DIR__ . '/cards.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,334 @@
|
||||
<?php
|
||||
$ttrs = $ttrCharts = [];
|
||||
$ttrTotalItems = isset($timetravel_data['report']) ? count($timetravel_data['report']) : 0;
|
||||
|
||||
$checkDateRangeExist = ( isset( $start_date ) and !empty( $start_date ) ) and ( isset( $end_date ) and !empty( $end_date ) );
|
||||
|
||||
if ( !$checkDateRangeExist ) {
|
||||
if ($ttrTotalItems >= 7) {
|
||||
$ttrs['7D'] = array_slice($timetravel_data['report'], -7, 7, true);
|
||||
}
|
||||
if ($ttrTotalItems >= 30) {
|
||||
$ttrs['30D'] = array_slice($timetravel_data['report'], -30, 30, true);
|
||||
if ($ttrTotalItems > 30) {
|
||||
$ttrs[$ttrTotalItems . 'D'] = $timetravel_data['report'];
|
||||
}
|
||||
} elseif ($ttrTotalItems > 0) {
|
||||
$ttrs[$ttrTotalItems . 'D'] = $timetravel_data['report'];
|
||||
}
|
||||
} else {
|
||||
$ttrs['dateranges'] = ( $ttrTotalItems > 0 ) ? array_reverse( $timetravel_data['report'] ) : array();
|
||||
}
|
||||
|
||||
$timeTravelledTotal7 = $timeTravelledTotal30 = $timeTravelledTotal60 = $daterangesTravelledTotal = $daysCounter = 0;
|
||||
if ($ttrTotalItems > 0) {
|
||||
//array_reverse to get newest
|
||||
foreach (array_reverse($timetravel_data['report']) as $k => $v) {
|
||||
$daysCounter++;
|
||||
$timeTravelled = 0;
|
||||
|
||||
if (isset($v[$k])) {
|
||||
$timeTravelled = 0;//$v[$k]['duration'] ?? 0;
|
||||
foreach ($v[$k] as $item_k){
|
||||
$timeTravelled+=$item_k['duration']??0;
|
||||
}
|
||||
}
|
||||
|
||||
if ( !$checkDateRangeExist ) {
|
||||
if ($daysCounter <= 7) {
|
||||
$timeTravelledTotal7 += $timeTravelled;
|
||||
}
|
||||
if ($daysCounter <= 30) {
|
||||
$timeTravelledTotal30 += $timeTravelled;
|
||||
}
|
||||
if ($daysCounter <= 60) {
|
||||
$timeTravelledTotal60 += $timeTravelled;
|
||||
}
|
||||
} else {
|
||||
$daterangesTravelledTotal += $timeTravelled;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
?>
|
||||
<div class="col-lg-5 overflow-auto">
|
||||
<div class="f-two-tables" style="display: flex; flex-direction: column">
|
||||
<div class="table-responsive" style="order:1;margin-top: 10px;">
|
||||
<table class="table table-striped table-hover table-bordered table-condensed">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th></th>
|
||||
<?php if ( !$checkDateRangeExist ): ?>
|
||||
<th>7 days</th>
|
||||
<th>30 days</th>
|
||||
<th>60 days</th>
|
||||
<?php else: ?>
|
||||
<th><?php printf( 'from %s to %s', $start_date, $end_date ); ?></th>
|
||||
<?php endif ?>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th class="text-center">Total Time traveled</th>
|
||||
<?php if ( !$checkDateRangeExist ): ?>
|
||||
<td class="sys-ttv" data-minutes="<?=$timeTravelledTotal7??0?>"><?= $timeTravelledTotal7 ?? 0 ?> <strong></strong></td>
|
||||
<td class="sys-ttv" data-minutes="<?=$timeTravelledTotal30??0?>"><?= $timeTravelledTotal30 ?? 0 ?> <strong></strong></td>
|
||||
<td class="sys-ttv" data-minutes="<?=$timeTravelledTotal60??0?>"><?= $timeTravelledTotal60 ?? 0 ?> <strong></strong></td>
|
||||
<?php else: ?>
|
||||
<td><?php echo $daterangesTravelledTotal ?? 0; ?></td>
|
||||
<?php endif ?>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php if ( $ttrs ): ?>
|
||||
<?php foreach ( $ttrs as $totalDays => $timetravelDataReportFiltered ): ?>
|
||||
<div class="table-responsive timetravel_table_wrap"
|
||||
id="timetravel_table_wrap_<?= $totalDays ?>"
|
||||
style="order: 2; margin-top: 10px;">
|
||||
<table id="timetravel_table_<?= $totalDays ?>"
|
||||
class="table table-striped table-bordered"
|
||||
style="width: 100%;">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Transport Mode</th>
|
||||
<th>Transport Mode</th>
|
||||
<th>Merchant Name</th>
|
||||
<th>Distance Travelled</th>
|
||||
<th>Time Travelled</th>
|
||||
<th>Date</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
$ttrChart = [
|
||||
'labels' => [],
|
||||
'data' => [],
|
||||
'total_minutes' => 0
|
||||
];
|
||||
$curTimeTravelledPoint = 0;
|
||||
|
||||
foreach ($timetravelDataReportFiltered as $k => $v) {
|
||||
$transportMode = $marchantName = '-';
|
||||
$distance = $v['distance'] ?? 0;
|
||||
$date = $v['date'] ?? '-';
|
||||
$marchantName = $transportMode = '-';
|
||||
$timeTravelled = $v['duration']??0;
|
||||
if (isset($v[$k])) {
|
||||
$category_default = $v[$k]['category']??'';
|
||||
$merchant_name_default = $v[$k]['merchant_name']??'';
|
||||
foreach ($v[$k] as $child){
|
||||
$timeTravelled += $child['duration']??0;
|
||||
echo '<tr>';
|
||||
echo '<td>' . ($child['category']??$category_default) . '</td>';
|
||||
echo '<td>' . ($child['category']??$category_default) . '</td>';
|
||||
echo '<td>' . ($child['merchant_name']??$merchant_name_default) . '</td>';
|
||||
echo '<td>' . $distance . '</td>';
|
||||
echo '<td>' . $child['duration'] . '</td>';
|
||||
echo '<td>' . $date . '</td>';
|
||||
echo '</tr>';
|
||||
}
|
||||
}else{
|
||||
echo '<tr>';
|
||||
echo '<td>' . $transportMode . '</td>';
|
||||
echo '<td>' . $transportMode . '</td>';
|
||||
echo '<td>' . $marchantName . '</td>';
|
||||
echo '<td>' . $distance . '</td>';
|
||||
echo '<td>' . $timeTravelled . '</td>';
|
||||
echo '<td>' . $date . '</td>';
|
||||
echo '</tr>';
|
||||
}
|
||||
|
||||
$curTimeTravelledPoint += $timeTravelled; // time increase
|
||||
//final chart
|
||||
$ttrChart['labels'][] = $date;
|
||||
$ttrChart['data'][] = $curTimeTravelledPoint;
|
||||
$ttrChart['total_minutes'] += $timeTravelled;
|
||||
}
|
||||
//push charts
|
||||
$ttrCharts[$totalDays] = $ttrChart;
|
||||
?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endforeach ?>
|
||||
<?php endif ?>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
window.toHHMM = function (sec) {
|
||||
var sec_num = parseInt(sec, 10); // don't forget the second param
|
||||
var hours = Math.floor(sec_num / 3600);
|
||||
var minutes = Math.floor((sec_num - (hours * 3600)) / 60);
|
||||
var seconds = sec_num - (hours * 3600) - (minutes * 60);
|
||||
|
||||
if (hours < 10) {hours = "0"+hours;}
|
||||
if (minutes < 10 && hours>0) {minutes = "0"+minutes;}
|
||||
if (seconds < 10) {seconds = "0"+seconds;}
|
||||
if(parseInt(hours)>0){
|
||||
return hours+'h '+minutes+'m';
|
||||
}
|
||||
return minutes+'m';
|
||||
}
|
||||
// format time in total time traveled
|
||||
$(function(){
|
||||
$('td.sys-ttv').each(function(){
|
||||
let minutes = $(this).data('minutes') || 0;
|
||||
$(this).find('strong').first().html('<br/>'+toHHMM(minutes*60));
|
||||
});
|
||||
});
|
||||
|
||||
var timetravel_charts = <?php echo json_encode($ttrCharts); ?>;
|
||||
var timetravel_keys = <?php echo json_encode(array_keys($ttrs)); ?>;
|
||||
$(function () {
|
||||
timetravel_keys.forEach(function (id) {
|
||||
$('#timetravel_table_' + id).DataTable({
|
||||
"columnDefs": [
|
||||
{
|
||||
"targets": [1],
|
||||
"visible": false,
|
||||
"searchable": false
|
||||
}
|
||||
],
|
||||
"order": [[5, "desc"]]
|
||||
});
|
||||
});
|
||||
for (var chart_id in timetravel_charts) {
|
||||
var ctx = document.getElementById('timetravel_chart_' + chart_id);
|
||||
if ( ctx == null ) {
|
||||
continue;
|
||||
}
|
||||
ctx = ctx.getContext('2d');
|
||||
var yticks = {
|
||||
min: 0, // it is for ignoring negative step.
|
||||
beginAtZero: true,
|
||||
callback: function(value, index, values) {
|
||||
if (Math.floor(value) === value) {
|
||||
return value+'m';
|
||||
}
|
||||
}
|
||||
};
|
||||
if(timetravel_charts[chart_id].total_minutes>0){
|
||||
yticks = {
|
||||
beginAtZero: true,
|
||||
callback: function(label, index, labels) {
|
||||
return toHHMM(parseInt(label)*60);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
new Chart(ctx, {
|
||||
// The type of chart we want to create
|
||||
type: 'line', // also try bar or other graph types
|
||||
// The data for our dataset
|
||||
data: {
|
||||
labels: timetravel_charts[chart_id].labels,
|
||||
// Information about the dataset
|
||||
datasets: [{
|
||||
label: "Time travel",
|
||||
backgroundColor: 'lightblue',
|
||||
borderColor: 'royalblue',
|
||||
data: timetravel_charts[chart_id].data,
|
||||
}]
|
||||
},
|
||||
// Configuration options
|
||||
options: {
|
||||
tooltips: {
|
||||
callbacks: {
|
||||
title: function(tooltipItem, data) {
|
||||
return data['labels'][tooltipItem[0]['index']];
|
||||
},
|
||||
label: function (tooltipItem, data) {
|
||||
return toHHMM(tooltipItem.value*60);
|
||||
},
|
||||
},
|
||||
backgroundColor: '#FFF',
|
||||
titleFontSize: 16,
|
||||
titleFontColor: '#0066ff',
|
||||
bodyFontColor: '#000',
|
||||
bodyFontSize: 14,
|
||||
displayColors: false
|
||||
},
|
||||
layout: {
|
||||
padding: 10,
|
||||
},
|
||||
legend: {
|
||||
position: 'bottom',
|
||||
},
|
||||
title: {
|
||||
display: true,
|
||||
text: 'Time travelled (' + toHHMM(timetravel_charts[chart_id].total_minutes*60) + ')'
|
||||
},
|
||||
scales: {
|
||||
yAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: 'Time value'
|
||||
},
|
||||
ticks: yticks,
|
||||
}],
|
||||
xAxes: [{
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: chart_id
|
||||
},
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
},
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function fn_show_ttr(id) {
|
||||
$('.timetravel_chart').hide();
|
||||
$('#timetravel_chart_' + id).show();
|
||||
|
||||
$('.timetravel_table_wrap').hide();
|
||||
$('#timetravel_table_wrap_' + id).show();
|
||||
|
||||
$(".btn_switch_ttr").removeClass('btn-success');
|
||||
$("#btn_switch_ttr_" + id).addClass('btn-success');
|
||||
}
|
||||
|
||||
if (timetravel_keys.length > 0) {
|
||||
//trigger show first default
|
||||
fn_show_ttr(timetravel_keys[0]);//timetravel_keys.length - 1
|
||||
}
|
||||
</script>
|
||||
<div class="col-lg-7 overflow-auto">
|
||||
<?php if ($ttrTotalItems > 0) { ?>
|
||||
<h4>Time Travel Chart</h4>
|
||||
<?php if ( !$checkDateRangeExist ): ?>
|
||||
<div class="text-center" style="margin-bottom: 8px;">
|
||||
<div class="btn-group" role="group" aria-label="Basic example">
|
||||
<?php
|
||||
foreach (array_keys($ttrs) as $id) {
|
||||
echo '<button type="button" id="btn_switch_ttr_' . $id . '" class="btn_switch_ttr btn btn-outline-secondary" onclick="fn_show_ttr(\'' . $id . '\')">' . $id . '</button>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?php
|
||||
foreach ($ttrCharts as $totalDays => $chart) {
|
||||
echo ' <canvas class="timetravel_chart" id="timetravel_chart_' . $totalDays . '" width="400" height="200"></canvas>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
<?php } ?>
|
||||
|
||||
|
||||
<div>
|
||||
<?php
|
||||
$activities_cards = $timetravel_data['options']['cards']??[];
|
||||
include( __DIR__ . '/cards.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,70 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger mt-20" id="print-members-account-receipts-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<div class="col-lg-12">
|
||||
|
||||
<div class="panel-heading mt-15 mb-10">
|
||||
<div class="heading-elements">
|
||||
Other Account Transactions
|
||||
</div>
|
||||
</div>
|
||||
<?=$member_bank_other?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- <script type="text/javascript">
|
||||
function viewTrackedAdvice(tracked_id) {
|
||||
|
||||
$('#lineoption').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewTrackedAdvice?proc=PROCESS&tracked_id=" + tracked_id
|
||||
}).done(function(data) {
|
||||
$('#lineoption').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
//initMap();
|
||||
//
|
||||
</script> -->
|
||||
<script src="/assets/js/app.js" type="text/javascript"></script>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<!-- script src="/assets/js/pages/members_account_receipts/list.js" type="text/javascript"></script -->
|
||||
|
||||
<style>
|
||||
#members-account-receipts-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,131 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger mt-20" id="print-members-account-receipts-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="members-account-receipts-error-msg"></p>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<div class="col-lg-12">
|
||||
<div>
|
||||
<form name="members_account_receipts_form" id="members-account-receipts-form">
|
||||
<div class="form-group">
|
||||
<div class="date">
|
||||
<label for="start_date" class="font-weight-bold col-lg-1 col-form-label">Date</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="currency">
|
||||
<label for="currency" class="font-weight-bold col-lg-1 col-form-label">Currency</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="currency" name="currency">
|
||||
</div>
|
||||
</div>
|
||||
<div class="category">
|
||||
<label for="category" class="font-weight-bold col-lg-1 col-form-label">Category</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="category" name="category">
|
||||
</div>
|
||||
</div>
|
||||
<div class="provider_category">
|
||||
<label for="provider_category" class="font-weight-bold col-lg-12 col-form-label">Provider Category</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="provider_category" name="provider_category">
|
||||
</div>
|
||||
</div>
|
||||
<div class="merchant_name">
|
||||
<label for="merchant_name" class="font-weight-bold col-lg-12 col-form-label">Merchant Name</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="merchant_name" name="merchant_name">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<input type="hidden" value="<?= $member_id ?>" id="member_id" name="member_id">
|
||||
</div>
|
||||
<input type="button" name="search_members_account_receipts" id="search_members_account_receipts" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="panel-heading mt-15 mb-10">
|
||||
<div class="heading-elements">
|
||||
<div id="pagination-members-account-receipts"></div>
|
||||
</div>
|
||||
</div>
|
||||
<table id="members-account-receipts-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>ID</th>
|
||||
<th>Import ID</th>
|
||||
<th>Member ID</th>
|
||||
<th>Amount</th>
|
||||
<th>Currency</th>
|
||||
<th>Description</th>
|
||||
<th>Time</th>
|
||||
<th>Category</th>
|
||||
<th>Provider Categpry</th>
|
||||
<th>Merchant Name</th>
|
||||
<th>Added</th>
|
||||
<th>Updated</th>
|
||||
<th>Status</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- <script type="text/javascript">
|
||||
function viewTrackedAdvice(tracked_id) {
|
||||
|
||||
$('#lineoption').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewTrackedAdvice?proc=PROCESS&tracked_id=" + tracked_id
|
||||
}).done(function(data) {
|
||||
$('#lineoption').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
//initMap();
|
||||
//
|
||||
</script> -->
|
||||
<script src="/assets/js/app.js" type="text/javascript"></script>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script src="/assets/js/pages/members_account_receipts/list.js" type="text/javascript"></script>
|
||||
|
||||
<style>
|
||||
#members-account-receipts-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,229 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<b><?= $selected_user['firstname'] ?> <?= $selected_user['lastname'] ?></b>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-2">
|
||||
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Savvy Score </a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Travel Personalty</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Today's revenue -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Share Permission</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /today's revenue -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Space ....</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Space ....</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<a href='#'>Space ....</a>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3">
|
||||
<?= $member_trackemail ?>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3">
|
||||
<?= $member_tracktable ?>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<!-- Recent Members -->
|
||||
<div id="map" style="border:1px;border-style: dotted; height:750px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<div id ="trackgroup_list"> </div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?=$member_tracked?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-8">
|
||||
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?=$member_trackemail?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
|
||||
var map;
|
||||
function initMap() {
|
||||
map = new google.maps.Map(document.getElementById('map'), {
|
||||
center: {lat: 3.397, lng: 10.644},
|
||||
zoom: 3
|
||||
});
|
||||
}
|
||||
|
||||
var loaded_data = new Array();
|
||||
function showTranspModal(service_request_id) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
// alert(service_request_id);
|
||||
// collect data - either from forms or from data variables
|
||||
var id = $(this).data('id');
|
||||
|
||||
// load the modal content with a loader gif and message
|
||||
$('#modal-content').html('Loading...');
|
||||
|
||||
// show modal window
|
||||
$('#modal_theme_primary').modal('show');
|
||||
//alert(5);
|
||||
// do the ajax bit
|
||||
var post_data = {
|
||||
'interest_id': service_request_id,
|
||||
};
|
||||
//alert(6);
|
||||
$.ajax({
|
||||
url: "/transp/transp_modal?service_request_id=" + service_request_id
|
||||
}).done(function (data) {
|
||||
//alert(data);
|
||||
//alert(7);
|
||||
$('#modal-content').html(data);
|
||||
//initialize_map();
|
||||
var myLatlng = new google.maps.LatLng(33.7489954, -84.3879824);
|
||||
var myOptions = {
|
||||
zoom: 13,
|
||||
center: myLatlng,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP};
|
||||
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
|
||||
directionsDisplay.setMap(map);
|
||||
directionsDisplay.setPanel(document.getElementById("directionsDiv"));
|
||||
|
||||
fitMapToBounds_map();
|
||||
|
||||
calcRoute(loaded_data[0], loaded_data[1]);
|
||||
//alert(loaded_data[0]);
|
||||
});
|
||||
}
|
||||
|
||||
function viewTracked(traked_group) {
|
||||
|
||||
$('#trackgroup_list').html('Processing...');
|
||||
$('#acc' + traked_group).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewtrackedgroup?proc=PROCESS&traked_group=" + traked_group
|
||||
}).done(function (data) {
|
||||
//$('#trackgroup_list').html(data);
|
||||
$('#trackgroup_list').html('');
|
||||
plotMarkers(eval(data));
|
||||
$('#acc' + traked_group).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
function plotMarkers(locations) {
|
||||
var n = parseInt(''+locations.length/2,10)-1;
|
||||
if (n<0) n=0;
|
||||
var map = new google.maps.Map(document.getElementById('map'), {
|
||||
zoom: 11,
|
||||
center: new google.maps.LatLng(locations[n].lat, locations[0].lng),
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||||
});
|
||||
var flightPath = new google.maps.Polyline({
|
||||
path: locations,
|
||||
geodesic: true,
|
||||
strokeColor: '#FF0000',
|
||||
strokeOpacity: 1.0,
|
||||
strokeWeight: 4
|
||||
});
|
||||
flightPath.setMap(map);
|
||||
}
|
||||
|
||||
//initMap();
|
||||
// -->
|
||||
</script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDvjiRTxngOQyBP4zpqFlZuiquc0ROvo9c&callback=initMap" async defer></script>
|
||||
@@ -0,0 +1,230 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-10">
|
||||
<h4>Notifications</h4>
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<!-- <?= $alerts_recieved ?> -->
|
||||
|
||||
<div>
|
||||
<form id="notifications-form">
|
||||
<div class="form-group">
|
||||
<div class="trigger_key">
|
||||
<label for="trigger_key" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Trigger Key
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<input type="search" name="trigger_key" id="trigger_key" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="msg_status">
|
||||
<label for="msg_status" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Message Status
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<?= $card_msg_status ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="added">
|
||||
<label for="start_date" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Added
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search-notifications" id="search-notifications" value="Search" class="btn btn-info" />
|
||||
|
||||
</div>
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
<div id="pagination-notifications"></div>
|
||||
<table id="notifications-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>Added</th>
|
||||
<th>Expire</th>
|
||||
<th>Send Alert</th>
|
||||
<th>Email Alert</th>
|
||||
<th>Trigger Key</th>
|
||||
<th>Notice Type</th>
|
||||
<th>Message</th>
|
||||
<th>Message Status</th>
|
||||
<th>Mmode</th>
|
||||
<th>Send</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<h4>*</h4>
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript" src="/assets/js/app.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
// Datepicker
|
||||
$("input[name='start_date']").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: "yyyy-mm-dd",
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
});
|
||||
|
||||
$("input[name='end_date']").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: "yyyy-mm-dd",
|
||||
onClose: function(selectedDate) {
|
||||
$("input[name='end_date']").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
});
|
||||
|
||||
setDefaultDate($('#notifications-form'));
|
||||
|
||||
// Oauth2 Tokens
|
||||
function createNotificationsTable(result) {
|
||||
|
||||
$('#notifications-list tbody').empty();
|
||||
|
||||
for (index in result) {
|
||||
let tr =
|
||||
`<tr>
|
||||
<td>${result[index].added}</td>
|
||||
<td>${result[index].expire}</td>
|
||||
<td>${result[index].sendalert}</td>
|
||||
<td>${result[index].emailalert}</td>
|
||||
<td>${result[index].trigger_key}</td>
|
||||
<td>${result[index].notice_type}</td>
|
||||
<td>${result[index].msg}</td>
|
||||
<td>${result[index].msg_status}</td>
|
||||
<td>${result[index].mmode}</td>
|
||||
<td>
|
||||
<button
|
||||
type="button"
|
||||
onclick="pushNotification(
|
||||
'${result[index].id_members_notification}',
|
||||
'${result[index].id_members}'
|
||||
);"
|
||||
class="btn btn-danger"
|
||||
id="acc'${result[index].id_members_notification}'"
|
||||
>Send
|
||||
</button>
|
||||
<div id="msgl${result[index].id_members_notification}"></div>
|
||||
</td>
|
||||
</tr>`;
|
||||
|
||||
$('#notifications-list tbody').append(tr);
|
||||
}
|
||||
}
|
||||
// Detect pagination click
|
||||
$('#pagination-notifications').on('click', 'a', function(e) {
|
||||
e.preventDefault();
|
||||
var pageno = $(this).attr('data-ci-pagination-page');
|
||||
loadNotificationsRecord(pageno);
|
||||
});
|
||||
|
||||
// Detect search click
|
||||
$('#search-notifications').on('click', function(e) {
|
||||
setDefaultDate($(this).closest('form'));
|
||||
loadNotificationsRecord(0);
|
||||
});
|
||||
|
||||
// Prevent submit form by press the enter button
|
||||
$(window).keydown(function(event) {
|
||||
if (event.keyCode == 13) {
|
||||
loadNotificationsRecord(0);
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
function loadNotificationsRecord(pagno, btnSearch = null) {
|
||||
loadingButton(btnSearch);
|
||||
$.ajax({
|
||||
url: '/member/loadNotificationsRecord?row_no=' + pagno,
|
||||
type: 'get',
|
||||
dataType: 'json',
|
||||
data: $('#notifications-form').serialize(),
|
||||
success: function(response) {
|
||||
$('#pagination-notifications').html(response.pagination);
|
||||
createNotificationsTable(response.result);
|
||||
},
|
||||
complete: function() {
|
||||
stopLoadingButton(btnSearch);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
loadNotificationsRecord(0);
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
function pushNotification(notice_id, member_id) {
|
||||
$('#msgl' + notice_id).html('Processing...');
|
||||
$('#acc' + notice_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/notifications/sendnotification?notice_id=" + notice_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#msgl'+ notice_id).html(data);
|
||||
$('#acc' + notice_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
|
||||
return false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#notifications-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.added {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
padding: 15px 0px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,204 @@
|
||||
<script>
|
||||
if(typeof numberWithCommas === 'undefined'){
|
||||
function numberWithCommas(x) {
|
||||
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<link href="/assets/css/member/activity.css" rel="stylesheet" type="text/css" />
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="wrap-activites-table">
|
||||
<h4>User App Activities</h4>
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<ul class="nav nav-tabs list-active-tab" role="tablist">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link active" href="#activity" role="tab" data-toggle="tab" aria-selected="true" data-screen-name="activity">Activity</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#timetravel" role="tab" data-toggle="tab" data-screen-name="activity-time-traveled">Time Travel</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#spentcategory" role="tab" data-toggle="tab" data-screen-name="activity-monthly-spent">Spent Category</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#emission" role="tab" data-toggle="tab" data-screen-name="activity-emissions">Emission</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#personalty" role="tab" data-toggle="tab" data-screen-name="activity-personality">Personalty</a>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- Tab panes -->
|
||||
<div class="tab-content">
|
||||
<div class="wrap-form-date-range-filter" style="max-width: 400px; margin-bottom: 20px;">
|
||||
<form name="range-date-filter">
|
||||
<div class="input-group">
|
||||
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
|
||||
<input type="text" class="form-control inp-filter-date" placeholder="Search">
|
||||
<div class="input-group-btn">
|
||||
<button class="btn btn-default" type="submit">
|
||||
<i class="glyphicon glyphicon-search"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane active" id="activity" data-action="getTripreport">
|
||||
<?php if ( isset( $trip_report ) ): ?>
|
||||
<div class="col-12" id="getTripreport">
|
||||
<?php include_once( __DIR__ . '/activities/activity.php' ); ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane fade" id="timetravel" data-action="getTimetravel">
|
||||
<?php if ( $timetravel_data ): ?>
|
||||
<div id="getTimetravel">
|
||||
<?php include_once( __DIR__ . '/activities/timetravel.php' ); ?>
|
||||
</div>
|
||||
<?php endif ?>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane fade" id="spentcategory" data-action="getSpentCategory">
|
||||
<div class="row" id="getSpentCategory">
|
||||
<?php include_once( __DIR__ . '/activities/spentcategory.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane fade" id="emission" data-action="getEmissions">
|
||||
<div class="row" id="getEmissions">
|
||||
<?php include_once( __DIR__ . '/activities/emissions.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div role="tabpanel" class="tab-pane fade" id="personalty" data-action="getPersonalty">
|
||||
<div class="row" id="getPersonalty">
|
||||
<?php include_once( __DIR__ . '/activities/personalty.php' ); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
// Load member's activities cards for each activity
|
||||
if(typeof filterParams !== "undefined"){
|
||||
filterParams.member_id = <?= $member_id ?>;
|
||||
}
|
||||
|
||||
|
||||
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
|
||||
var screen_name = $(e.target).data('screen-name');
|
||||
|
||||
if (screen_name != 'activity' && typeof filterParams!=='undefined') {
|
||||
filterParams.screen_name = screen_name;
|
||||
}
|
||||
});
|
||||
|
||||
(function( $ ) {
|
||||
// add input range date
|
||||
var customizer = {
|
||||
rangeDateInput: $('.inp-filter-date'),
|
||||
formFilterByRange: $('form[name="range-date-filter"]'),
|
||||
memberId: '<?php echo $selected_user['id']; ?>',
|
||||
oldFilter: '<?php echo (isset( $start_date ) and isset( $end_date )) ? $start_date . ' - ' . $end_date : ''; ?>',
|
||||
activeTab: '<?php echo $active_tab; ?>',
|
||||
init: function() {
|
||||
this.rangeDateInputInit();
|
||||
this.filterByRangeDate();
|
||||
this.triggerShowNext();
|
||||
|
||||
if ( this.oldFilter.length ) {
|
||||
this.rangeDateInput.val( this.oldFilter );
|
||||
}
|
||||
|
||||
// active tab
|
||||
$('ul.list-active-tab').find('a[href="'+this.activeTab+'"]').trigger('click');
|
||||
},
|
||||
enabledNext: function() {
|
||||
$('.calendar.left').find('th.month').next().addClass('next available').html('<i class="icon-arrow-right32"></i>');
|
||||
},
|
||||
triggerShowNext: function() {
|
||||
$(document.body).find('.calendar')
|
||||
.on('click.daterangepicker', '.prev', customizer.enabledNext)
|
||||
.on('click.daterangepicker', '.next', customizer.enabledNext)
|
||||
.on('mousedown.daterangepicker', 'td.available', customizer.enabledNext)
|
||||
.on('mouseenter.daterangepicker', 'td.available', customizer.enabledNext)
|
||||
.on('mouseleave.daterangepicker', 'td.available', customizer.enabledNext);
|
||||
|
||||
$(document.body).find('.ranges')
|
||||
.on('mouseenter.daterangepicker', 'li', customizer.enabledNext);
|
||||
},
|
||||
rangeDateInputInit: function() {
|
||||
this.rangeDateInput.daterangepicker({
|
||||
opens: 'right',
|
||||
autoUpdateInput: false,
|
||||
locale: {
|
||||
cancelLabel: 'Clear'
|
||||
},
|
||||
ranges: {
|
||||
'Today': [moment(), moment()],
|
||||
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
||||
'Last 7 Days': [moment().subtract(6, '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
|
||||
}, function(start, end, label) {
|
||||
$('.calendar.left').find('th.month').next().addClass('next available').html('<i class="icon-arrow-right32"></i>');
|
||||
});
|
||||
|
||||
this.rangeDateInput.on('show.daterangepicker', function(event) {
|
||||
customizer.enabledNext();
|
||||
});
|
||||
|
||||
this.rangeDateInput.on('apply.daterangepicker', function(ev, picker) {
|
||||
$(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
|
||||
});
|
||||
|
||||
this.rangeDateInput.on('cancel.daterangepicker', function(ev, picker) {
|
||||
$(this).val('');
|
||||
});
|
||||
},
|
||||
filterByRangeDate: function() {
|
||||
this.formFilterByRange.on('submit', function(event) {
|
||||
event.preventDefault();
|
||||
try {
|
||||
// get current tab
|
||||
var _this = $(this),
|
||||
_input = _this.find( customizer.rangeDateInput ),
|
||||
_active = $('ul.list-active-tab').find('li.active').children('a').attr('href'),
|
||||
startDate,
|
||||
endDate;
|
||||
|
||||
if ( _input.val().length <= 0 ) {
|
||||
startDate = null;
|
||||
endDate = null;
|
||||
} else {
|
||||
var rangeDate = _input.val().split('-');
|
||||
startDate = $.trim(rangeDate[0]);
|
||||
endDate = $.trim(rangeDate[1]);
|
||||
}
|
||||
viewMemberActionLimitOffset( 'ACTIVITIES', customizer.memberId, 50, 0, {'start_date': startDate, 'end_date': endDate, 'active_tab': _active } );
|
||||
} catch (err) {
|
||||
console.log( err );
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
customizer.init();
|
||||
})(jQuery);
|
||||
</script>
|
||||
@@ -0,0 +1,39 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-10">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Members Banks</h5>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<?=$bank_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<div id="carpool_send"></div>
|
||||
|
||||
<div id="carpool_sel">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,144 @@
|
||||
<style>
|
||||
.d-flex {
|
||||
display: flex;
|
||||
}
|
||||
.flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.col-1 {
|
||||
flex-basis: 8.333333%;
|
||||
}
|
||||
.col-2 {
|
||||
flex-basis: 16.666667%;
|
||||
}
|
||||
.col-3 {
|
||||
flex-basis: 25%;
|
||||
}
|
||||
.d-none {
|
||||
display: none;
|
||||
}
|
||||
.p-15 {
|
||||
padding: 15px;
|
||||
}
|
||||
.pr-15 {
|
||||
padding-right: 15px !important;
|
||||
}
|
||||
.mb-15 {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.overflow-auto {
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="panel panel-white overflow-auto p-15">
|
||||
<form id="filter-form" class="d-flex flex-wrap">
|
||||
<div class="col-2 mb-15 pr-15"><input type="text" name="id" class="form-control" placeholder="ID"></div>
|
||||
<div class="col-2 mb-15 pr-15"><input type="text" name="quote_id" class="form-control" placeholder="Quote ID"></div>
|
||||
<div class="col-2 mb-15 pr-15"><input type="text" name="provider_booking_ref" class="form-control" placeholder="Provider Booking Ref"></div>
|
||||
<!-- <div class="col-2 mb-15 pr-15"><input type="text" name="details" class="form-control" placeholder="Detail"></div> -->
|
||||
<div class="col-2 mb-15 pr-15"><input type="text" name="message" class="form-control" placeholder="Message"></div>
|
||||
<div class="col-2 mb-15 pr-15">
|
||||
<select name="status" id="" class="form-control">
|
||||
<option value="recent">Recent Bookings</option>
|
||||
<option value="pending">Pending Bookings</option>
|
||||
<option value="cancelled">Cancelled Bookings</option>
|
||||
<option value="active">Active Bookings</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-2 mb-15 pr-15"><input type="text" name="cost" class="form-control" placeholder="Cost"></div>
|
||||
<div class="input-group col-3 mb-15 pr-15">
|
||||
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
|
||||
<input type="text" name="created" value="" class="form-control" placeholder="Created"/>
|
||||
</div>
|
||||
<div class="input-group col-3 mb-15 pr-15">
|
||||
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
|
||||
<input type="text" name="updated" value="" class="form-control" placeholder="Updated"/>
|
||||
</div>
|
||||
<div class="input-group col-3 mb-15 pr-15">
|
||||
<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
|
||||
<input type="text" name="completed" value="" class="form-control" placeholder="Completed"/>
|
||||
</div>
|
||||
<div class="col pr-15">
|
||||
<button class="btn btn-primary">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
<h5 id="booking-table-loading" class="col-12 d-none">Loading...</h5>
|
||||
<table id="booking-table" class="table-bordered table-condensed table-hover table-striped table-condensed d-none mb-15" style="background-color:#f0f8ff;" width="100%">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Quote ID</th>
|
||||
<th>Provider Booking Ref</th>
|
||||
<th>Detail</th>
|
||||
<th>Created</th>
|
||||
<th>Updated</th>
|
||||
<th>Completed</th>
|
||||
<th>Status</th>
|
||||
<th>Message</th>
|
||||
<th>Member ID</th>
|
||||
<th>Cost</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
<td>No result</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div id="booking-pagination" class="col-12 text-center"></div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pagination/bootpag.min.js"></script>
|
||||
<script src="/assets/js/pages/booking/index.js?v=1"></script>
|
||||
|
||||
<script>
|
||||
if(typeof filterParams !== 'undefined'){
|
||||
filterParams.member_id = <?= $member_id ?>;
|
||||
}
|
||||
loadPage(filterParams);
|
||||
|
||||
$(function() {
|
||||
var daterangeInputs = 'input[name="created"], input[name="updated"], input[name="completed"]';
|
||||
var start = moment().subtract(29, 'days');
|
||||
var end = moment();
|
||||
|
||||
$(daterangeInputs).daterangepicker({
|
||||
opens: 'right',
|
||||
autoUpdateInput: false,
|
||||
locale: {
|
||||
cancelLabel: 'Clear',
|
||||
format: 'YYYY/MM/DD'
|
||||
},
|
||||
ranges: {
|
||||
'Today': [moment(), moment()],
|
||||
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
||||
'Last 7 Days': [moment().subtract(6, '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')],
|
||||
'Last 2 Months': [moment().subtract(2, 'month').startOf('month'), moment().subtract(2, 'month').endOf('month')]
|
||||
},
|
||||
alwaysShowCalendars: true,
|
||||
});
|
||||
|
||||
$(daterangeInputs).on('apply.daterangepicker', function(ev, picker) {
|
||||
$(this).val(picker.startDate.format('YYYY/MM/DD') + ' - ' + picker.endDate.format('YYYY/MM/DD'));
|
||||
});
|
||||
|
||||
$(daterangeInputs).on('cancel.daterangepicker', function(ev, picker) {
|
||||
$(this).val('');
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,91 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
|
||||
|
||||
<div class="col-lg-5">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Available Personalty Cards</h5>
|
||||
<div class="heading-elements">
|
||||
<table><tr><td></td><td></td></tr></table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
<?= $available_cards ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-lg-2">
|
||||
<!-- Current server load -->
|
||||
<div class="panel panel-white">
|
||||
<div class="panel-heading">
|
||||
<h5>.</h5>
|
||||
<div class="heading-elements">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="col-lg-5">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Assigned Cards</h5>
|
||||
<div class="heading-elements">
|
||||
<button type="button" class="btn btn-info" id="refButton" onclick="return refreshMemberCard(<?=$member_id?>);"><div id="cardRef">Refresh Category Cards</div></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
<?= $assigned_cards ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
|
||||
function refreshMemberCard(member_id){
|
||||
if (!confirm('Confirm Card Refresh')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardRef').html('Processing...');
|
||||
$('#refButton').prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/refreshMemberCard?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardRef').html(data);
|
||||
$('#refButton').prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
//initMap();
|
||||
// -->
|
||||
</script>
|
||||
@@ -0,0 +1,214 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Available Cards</h5>
|
||||
<div class="heading-elements">
|
||||
<table><tr><td><?= $links ?></td><td><?= $card_category ?></td></tr></table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
<?= $available_cards ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel panel-white">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title text-semibold">Manage</h6>
|
||||
<div class="heading-elements">
|
||||
<button type="button" class="btn btn-info" id="refButton" onclick="return refreshMemberCard(<?=$member_id?>);"><div id="cardRef">Refresh Category Cards</div></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?= $member_cards ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
var index; // variable to set the selected row index
|
||||
function moveMemberCard(card_id, member_id, direction, btn){
|
||||
//alert("Diretcion - "+ member_id);
|
||||
// $('#moveMemberCardDiv' + direction + card_id).html('Processing...');
|
||||
$('#moveMemberCardDiv' + direction + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/moveMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id + "&direction=" + direction
|
||||
}).done(function (data) {
|
||||
// $('#moveMemberCardDiv'+ direction + card_id).html(data);
|
||||
$('#moveMemberCardDiv' + direction + card_id).prop('disabled', false);
|
||||
dir = 'bottom';
|
||||
if (direction == 1) dir = 'up';
|
||||
if (direction == 2) dir = 'top';
|
||||
upNdown(dir, btn);
|
||||
});
|
||||
}
|
||||
function getSelectedRow() {
|
||||
var table = document.getElementById("member_cards");
|
||||
for (var i = 1; i < table.rows.length; i++) {
|
||||
table.rows[i].onclick = function() {
|
||||
// clear the selected from the previous selected row
|
||||
// the first time index is undefined
|
||||
if (typeof index !== "undefined") {
|
||||
//table.rows[index].classList.toggle("selected");
|
||||
}
|
||||
index = this.rowIndex;
|
||||
//this.classList.toggle("selected");
|
||||
};
|
||||
}
|
||||
}
|
||||
getSelectedRow();
|
||||
function upNdown(direction) {
|
||||
var rows = document.getElementById("member_cards").rows,
|
||||
parent = rows[index].parentNode;
|
||||
if (direction === "top") {
|
||||
if (index > 1) {
|
||||
parent.insertBefore(rows[index], rows[index - 1]);
|
||||
index--;
|
||||
upNdown(direction);
|
||||
}
|
||||
}
|
||||
if (direction === "bottom") {
|
||||
if (index < rows.length - 1) {
|
||||
parent.insertBefore(rows[index + 1], rows[index]);
|
||||
index++;
|
||||
upNdown(direction);
|
||||
}
|
||||
}
|
||||
if (direction === "up") {
|
||||
if (index > 1){
|
||||
parent.insertBefore(rows[index], rows[index - 1]);
|
||||
// when the row go up the index will be equal to index - 1
|
||||
index--;
|
||||
}
|
||||
}
|
||||
if (direction === "down") {
|
||||
if (index < rows.length - 1){
|
||||
parent.insertBefore(rows[index + 1], rows[index]);
|
||||
// when the row go down the index will be equal to index + 1
|
||||
index++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function refreshMemberCard(member_id){
|
||||
if (!confirm('Confirm Card Refresh')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardRef').html('Processing...');
|
||||
$('#refButton').prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/refreshMemberCard?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardRef').html(data);
|
||||
$('#refButton').prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function addMemberCard(card_id, member_id) {
|
||||
if (!confirm('Confirm Add Card to Account')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/addMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function deleteMemberCard(card_id, member_id){
|
||||
if (!confirm('Confirm Remove Card')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDeleteDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/deleteMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardDeleteDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
function viewTrackedAdvice(tracked_id) {
|
||||
|
||||
$('#lineoption').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewTrackedAdvice?proc=PROCESS&tracked_id=" + tracked_id
|
||||
}).done(function (data) {
|
||||
$('#lineoption').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function getSlideCards(element, member_id, card_category) {
|
||||
let str = element.href;
|
||||
let pos = str.indexOf("#/");
|
||||
let opos = pos;
|
||||
while (pos != - 1) {
|
||||
pos = str.indexOf("#/", pos + 1);
|
||||
if (pos == - 1) break;
|
||||
opos = pos;
|
||||
}
|
||||
if (opos == - 1) {
|
||||
opos = - 2;
|
||||
str = "0";
|
||||
}
|
||||
let offset = str.substring(opos + 2);
|
||||
return getSlideCardsReal(offset, member_id, card_category);
|
||||
}
|
||||
|
||||
function getSlideCardsReal(offset, member_id, card_category) {
|
||||
// &member_id=<?= $member_id ?>
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction/" + offset + "?proc=PROCESS&action_name=MCARDS&member_id=" + member_id + "&limit=<?= $limit ?>&offset=" + offset + "&card_category=" + card_category
|
||||
}).done(function (data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
$(function() {
|
||||
$('select[name=card_category]').change(function() {
|
||||
getSlideCardsReal(0,<?= $member_id ?>, this.value == ''?'0':this.value);
|
||||
});
|
||||
});
|
||||
//initMap();
|
||||
// -->
|
||||
</script>
|
||||
@@ -0,0 +1,380 @@
|
||||
<style type="text/css">
|
||||
#member_cards thead .sorting:after {
|
||||
top: 20px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
#member_cards thead .sorting_desc:after,
|
||||
#member_cards thead .sorting_asc:after {
|
||||
top: 16px;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
#member_cards thead .sorting:before {
|
||||
content: '';
|
||||
}
|
||||
</style>
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Available Cards</h5>
|
||||
<div class="heading-elements">
|
||||
<table>
|
||||
<tr>
|
||||
<td><?= $links ?></td>
|
||||
<td><?= $card_category ?></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
<?= $available_cards ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel panel-white">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title text-semibold">Manage</h6>
|
||||
<div class="heading-elements">
|
||||
<!-- ALL/APP mode -->
|
||||
<div class="btn-group" id="ddl_view_card_mode" style="margin-right: 10px;">
|
||||
<textarea style="display: none" id="xdump"><?= json_encode($app_card_result_list ?? []) ?></textarea>
|
||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
|
||||
aria-haspopup="true" aria-expanded="false">
|
||||
<?= ($mode ?? 'ALL') == 'APP' ? '<i class="icon-iphone"></i><span> App cards </span>' : '<i class="icon-list"></i><span> All cards </span>' ?>
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a href="javascript:void(0);" data-mode="ALL"><i class="icon-list"></i> All
|
||||
cards </a></li>
|
||||
<li><a href="javascript:void(0);" data-mode="APP"><i class="icon-iphone"></i> App
|
||||
cards </a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<button type="button" class="btn btn-info" id="refButton"
|
||||
onclick="return refreshMemberCard(<?= $member_id ?>);">
|
||||
<div id="cardRef">Refresh Category Cards</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?php
|
||||
if (($mode ?? 'ALL') == 'APP') {
|
||||
?>
|
||||
<table id="member_cards" style="background-color:aliceblue"
|
||||
class="table table-striped table-hover table-bordered table-condensed">
|
||||
<thead class="bg-indigo">
|
||||
<tr>
|
||||
<th>pic</th>
|
||||
<th>title</th>
|
||||
<th>description</th>
|
||||
<th>card_list_order</th>
|
||||
<th>card_country</th>
|
||||
<th>del</th>
|
||||
<th>move</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($app_card_result_list ?? [] as $row) { ?>
|
||||
<tr>
|
||||
<td>
|
||||
<?php if ($row['template'] == 7 && !empty($row['background_color'])) {
|
||||
echo '<div style="width: 130px; height: 130px; background-color:#' . $row['background_color'] . '"></div>';
|
||||
} else {
|
||||
?>
|
||||
<img src="<?= $row['background_picture'] ?>" style="width:130px;">
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</td>
|
||||
<td><?= $row['card_id'] ?>: <?= $row['title'] ?><br>
|
||||
[<b><?= $row['button1_action'] ?></b>]
|
||||
</td>
|
||||
<td><?= $row['description'] ?></td>
|
||||
<td><?= $row['card_order'] ?></td>
|
||||
<td><?= $row['card_country'] ?></td>
|
||||
<td>
|
||||
<div id="cardDeleteDiv<?=$row['assign_id']?>">
|
||||
<button type="button" class="btn btn-danger btn-xs"
|
||||
onclick="deleteMemberCard(<?= $row['assign_id'] ?>,<?= $member_id ?>);">
|
||||
DEL
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div id="moveMemberCardDiv1<?=$row['assign_id']?>">
|
||||
<button type="button" class="btn btn-info btn-xs"
|
||||
onclick="moveMemberCard(<?= $row['assign_id'] ?>,<?= $member_id ?>,1,this);"><span
|
||||
class="glyphicon glyphicon-triangle-top"></span></button>
|
||||
</div>
|
||||
<br>
|
||||
<div id="moveMemberCardDiv2<?=$row['assign_id']?>">
|
||||
<button type="button" class="btn btn-info btn-xs"
|
||||
onclick="moveMemberCard(<?= $row['assign_id'] ?>,<?= $member_id ?>,2,this);"><span
|
||||
class="glyphicon glyphicon-circle-arrow-up"></span></button>
|
||||
</div>
|
||||
<br>
|
||||
<div id="moveMemberCardDiv0<?=$row['assign_id']?>">
|
||||
<button type="button" class="btn btn-primary btn-xs"
|
||||
onclick="moveMemberCard(<?= $row['assign_id'] ?>,<?= $member_id ?>,0,this);"><span
|
||||
class="glyphicon glyphicon-circle-arrow-down"></span>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<?php } ?>
|
||||
</tbody>
|
||||
</table>
|
||||
<?php } else { //ALL
|
||||
echo $member_cards;
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
window.member_card_ids = <?=json_encode($member_card_ids??[])?>;
|
||||
window.fn_check_card_added = function(){
|
||||
$(".btn-add-card").each(function(){
|
||||
let card_id = $(this).data('id');
|
||||
if( window.member_card_ids.includes(card_id) ){
|
||||
//$(this).attr('disabled','disabled').text('Added');
|
||||
$(this).closest('tr').css('opacity',0.6);
|
||||
$(this).closest('td').text('Added');
|
||||
console.log(card_id);
|
||||
}
|
||||
});
|
||||
}
|
||||
$(function (){
|
||||
window.fn_check_card_added();
|
||||
});
|
||||
var index; // variable to set the selected row index
|
||||
function moveMemberCard(card_id, member_id, direction, btn) {
|
||||
//alert("Diretcion - "+ member_id);
|
||||
// $('#moveMemberCardDiv' + direction + card_id).html('Processing...');
|
||||
$('#moveMemberCardDiv' + direction + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/moveMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id + "&direction=" + direction
|
||||
}).done(function (data) {
|
||||
// $('#moveMemberCardDiv'+ direction + card_id).html(data);
|
||||
$('#moveMemberCardDiv' + direction + card_id).prop('disabled', false);
|
||||
dir = 'bottom';
|
||||
if (direction == 1) dir = 'up';
|
||||
if (direction == 2) dir = 'top';
|
||||
upNdown(dir, btn);
|
||||
});
|
||||
}
|
||||
|
||||
function getSelectedRow() {
|
||||
var table = document.getElementById("member_cards");
|
||||
if (!table) {
|
||||
return;
|
||||
}
|
||||
for (var i = 1; i < table.rows.length; i++) {
|
||||
table.rows[i].onclick = function () {
|
||||
// clear the selected from the previous selected row
|
||||
// the first time index is undefined
|
||||
if (typeof index !== "undefined") {
|
||||
//table.rows[index].classList.toggle("selected");
|
||||
}
|
||||
index = this.rowIndex;
|
||||
//this.classList.toggle("selected");
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
getSelectedRow();
|
||||
|
||||
function upNdown(direction) {
|
||||
var rows = document.getElementById("member_cards").rows,
|
||||
parent = rows[index].parentNode;
|
||||
if (direction === "top") {
|
||||
if (index > 1) {
|
||||
parent.insertBefore(rows[index], rows[index - 1]);
|
||||
index--;
|
||||
upNdown(direction);
|
||||
}
|
||||
}
|
||||
if (direction === "bottom") {
|
||||
if (index < rows.length - 1) {
|
||||
parent.insertBefore(rows[index + 1], rows[index]);
|
||||
index++;
|
||||
upNdown(direction);
|
||||
}
|
||||
}
|
||||
if (direction === "up") {
|
||||
if (index > 1) {
|
||||
parent.insertBefore(rows[index], rows[index - 1]);
|
||||
// when the row go up the index will be equal to index - 1
|
||||
index--;
|
||||
}
|
||||
}
|
||||
if (direction === "down") {
|
||||
if (index < rows.length - 1) {
|
||||
parent.insertBefore(rows[index + 1], rows[index]);
|
||||
// when the row go down the index will be equal to index + 1
|
||||
index++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function refreshMemberCard(member_id) {
|
||||
if (!confirm('Confirm Card Refresh')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardRef').html('Processing...');
|
||||
$('#refButton').prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/refreshMemberCard?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardRef').html(data);
|
||||
$('#refButton').prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function addMemberCard(card_id, member_id) {
|
||||
if (!confirm('Confirm Add Card to Account')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/addMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
if(data == 'Added'){
|
||||
$('#cardDiv' + card_id).closest('tr').css('opacity',0.5);
|
||||
}
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function deleteMemberCard(card_id, member_id) {
|
||||
if (!confirm('Confirm Remove Card')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDeleteDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/deleteMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#cardDeleteDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
function viewTrackedAdvice(tracked_id) {
|
||||
|
||||
$('#lineoption').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewTrackedAdvice?proc=PROCESS&tracked_id=" + tracked_id
|
||||
}).done(function (data) {
|
||||
$('#lineoption').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function getSlideCards(element, member_id, card_category) {
|
||||
let str = element.href;
|
||||
let pos = str.indexOf("#/");
|
||||
let opos = pos;
|
||||
while (pos != -1) {
|
||||
pos = str.indexOf("#/", pos + 1);
|
||||
if (pos == -1) break;
|
||||
opos = pos;
|
||||
}
|
||||
if (opos == -1) {
|
||||
opos = -2;
|
||||
str = "0";
|
||||
}
|
||||
let offset = str.substring(opos + 2);
|
||||
return getSlideCardsReal(offset, member_id, card_category);
|
||||
}
|
||||
|
||||
function getSlideCardsReal(offset, member_id, card_category) {
|
||||
if (typeof member_id === "undefined") {
|
||||
return false;
|
||||
}
|
||||
// &member_id=<?= $member_id ?>
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction/" + offset
|
||||
+ "?proc=PROCESS&action_name=MCARDS&member_id=" + member_id
|
||||
+ "&limit=<?= $limit ?>&offset=" + offset
|
||||
+ "&card_category=" + card_category
|
||||
}).done(function (data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
window.fn_check_card_added();
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
$(function () {
|
||||
$("#ddl_view_card_mode").on('click', 'li a', function () {
|
||||
let mode = $(this).data('mode');
|
||||
viewMemberActionLimitOffset('MCARDS', <?= $member_id ?>, 50, 0, {'mode': mode});
|
||||
// look good but don't need because content replaced by ajax
|
||||
$("#ddl_view_card_mode").find(".btn:first-child").text($(this).text());
|
||||
$("#ddl_view_card_mode").find(".btn:first-child").val($(this).text());
|
||||
});
|
||||
});
|
||||
$(function () {
|
||||
$('select[name=card_category]').change(function () {
|
||||
getSlideCardsReal(0, <?= $member_id ?>, this.value == '' ? '0' : this.value);
|
||||
});
|
||||
$("#member_cards").DataTable({
|
||||
"columns":[
|
||||
{
|
||||
"sortable": false
|
||||
},
|
||||
{
|
||||
"sortable": true
|
||||
},
|
||||
{
|
||||
"sortable": false
|
||||
},
|
||||
{
|
||||
"sortable": true
|
||||
},
|
||||
{
|
||||
"sortable": true
|
||||
},
|
||||
{
|
||||
"sortable": false
|
||||
},
|
||||
{
|
||||
"sortable": false
|
||||
}
|
||||
],
|
||||
"pageLength": 100,
|
||||
"order": [[3, "desc"]] // order by card list order default
|
||||
});
|
||||
});
|
||||
//initMap();
|
||||
</script>
|
||||
@@ -0,0 +1,104 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-6">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Carpool</h5>
|
||||
</div>
|
||||
<div class="panel-body" style="height: 550px;">
|
||||
<?= $carpool_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<div id="carpool_send"></div>
|
||||
|
||||
<div id="carpool_sel">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
|
||||
|
||||
function sendCarpoolMessage(carpool_id) {
|
||||
|
||||
$('#carpool_send').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/sendCarpoolMessage?proc=PROCESS&carpool_id=" + carpool_id
|
||||
}).done(function (data) {
|
||||
$('#carpool_send').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
function viewCarpool(carpool_id) {
|
||||
|
||||
$('#carpool_sel').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewCarpoolData?proc=PROCESS&carpool_id=" + carpool_id
|
||||
}).done(function (data) {
|
||||
$('#carpool_sel').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
function processCarpool(carpool_id) {
|
||||
|
||||
var result = confirm("Continue processing carpool points? ");
|
||||
if (!result) {
|
||||
return;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function cancelCarpool(carpool_id, member_id) {
|
||||
|
||||
var result = confirm("Continue carpool cancel? ");
|
||||
if (result==false) {
|
||||
return true;
|
||||
}
|
||||
|
||||
$('#carpool_sel').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/cancelCarpool?proc=PROCESS&carpool_id=" + carpool_id +"&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#carpool_sel').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
// -->
|
||||
</script>
|
||||
@@ -0,0 +1,37 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-6">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,196 @@
|
||||
<!--
|
||||
street1 | character varying(50) |
|
||||
street2 | character varying(50) |
|
||||
city | character varying(50) |
|
||||
zipcode | character varying(12) |
|
||||
state | character varying(50) |
|
||||
country | character varying(2) |
|
||||
-->
|
||||
<div style="width:100%;">
|
||||
<div class="row col-lg-11">
|
||||
<form name="member_detail_form" id="member-detail-form" autocomplete="off">
|
||||
<div class="form-group row">
|
||||
<div class="col-lg-12">
|
||||
<label for="start_address" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Status
|
||||
</label>
|
||||
<div class="col-lg-5">
|
||||
<?= $card_status ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group row">
|
||||
<div class="col-lg-12">
|
||||
<label for="start_date" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Date
|
||||
</label>
|
||||
<div class="input-daterange">
|
||||
<div class="col-lg-5">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-5">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="hidden" id='member_id' name='member_id' value="<?= $member_id ?>" />
|
||||
<div class="form-group row col-lg-12">
|
||||
<div class="col-lg-12">
|
||||
<input type="button" id="search-member-detail" value="Search" class="btn btn-info legitRipple" />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<form name="memberProfile" id="memberProfile" action="/member/updateMemberProfile">
|
||||
<input type="hidden" id='member_id' name='member_id' value="<?= $member_id ?>" />
|
||||
<table class="table">
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th width="50px;" scope="row">Firstname</th>
|
||||
<td><?= $firstname ?></td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Lastname</th>
|
||||
<td><?= $lastname ?></td>
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">Email</th>
|
||||
<td><?= $email ?></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<img id="profile_picure" src="<?= $storage ?>profile/<?= $member_id ?>.<?= $picture_format ?>" alt="..." class="img-thumbnail" onChange='getoutput()'>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td colspan="2" style="text-align:center">
|
||||
<input type="hidden" name="catid" value="5">
|
||||
<input type="file" name="cardimg" id="cardimg">
|
||||
<button id="btn_upload" type="button" class="btn btn-info btn-sm" onclick="return submitProfileImage(this.form);">Change Picture</button>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
<div>
|
||||
<ul>
|
||||
<? $i = 0;
|
||||
foreach ($devices as $player_id) { ?>
|
||||
<li><input type="radio" name="player_id" value="<?= $player_id ?>" <?= $i == 0 ? 'checked' : '' ?>> <?= $player_id ?></li>
|
||||
<? $i++;
|
||||
} ?>
|
||||
</ul>
|
||||
</div>
|
||||
<input type="submit" value="Send Test Message" class="btn btn-info" onclick="return sendSampleMessage(this.form);">
|
||||
<div id="message_sent"></div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
let member_id = '<?= $member_id ?>';
|
||||
// Attach a submit handler to the form
|
||||
function sendSampleMessage(form) {
|
||||
if (form.player_id == null || form.player_id.value == null) {
|
||||
alert('No devices registered!');
|
||||
return false;
|
||||
}
|
||||
$('#message_sent').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
|
||||
//alert(form.member_id.value);
|
||||
var post_data = {
|
||||
'member_id': form.member_id.value,
|
||||
'player_id': form.player_id.value,
|
||||
'message': 'This is a test message to member ' + form.member_id.value,
|
||||
};
|
||||
// Get some values from elements on the page:
|
||||
var url = "/member/sendSampleMessage";
|
||||
// Send the data using post
|
||||
var posting = $.post(url, post_data);
|
||||
// Put the results in a div
|
||||
posting.done(function(data) {
|
||||
$('#message_sent').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function submitProfileImage(form) {
|
||||
$.ajax({
|
||||
url: '/member/profileImageUpload',
|
||||
type: "post",
|
||||
data: new FormData(form),
|
||||
processData: false,
|
||||
contentType: false,
|
||||
cache: false,
|
||||
async: false,
|
||||
success: function(data) {
|
||||
alert("Upload Profile Image Successful: " + data);
|
||||
const d = new Date();
|
||||
$('#profile_picure').attr("src", "<?= $storage ?>profile/<?= $member_id ?>." + extension + "?" + d.getTime());
|
||||
}
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var extension = '<?= $picture_format ?>';
|
||||
|
||||
function getoutput(event) {
|
||||
if (!event || !event.target || !event.target.files || event.target.files.length === 0) {
|
||||
return;
|
||||
}
|
||||
const name = event.target.files[0].name;
|
||||
const lastDot = name.lastIndexOf('.');
|
||||
const fileName = name.substring(0, lastDot);
|
||||
const ext = name.substring(lastDot + 1);
|
||||
//outputfile = fileName;
|
||||
extension = ext;
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
// Datepicker
|
||||
$("#start_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$("#end_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#end_date").datepicker("option", "maxDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$('#search-member-detail').on('click', () => {
|
||||
setDefaultDate();
|
||||
})
|
||||
|
||||
$('#member-detail-form').ready(() => {
|
||||
setDefaultDate();
|
||||
});
|
||||
|
||||
function setDefaultDate() {
|
||||
if ( ! $('#start_date').val() && ! $('#end_date').val()) {
|
||||
$('#start_date')
|
||||
.datepicker('setDate', moment(moment.now())
|
||||
.subtract(1,'months').format("YYYY/MM/DD"));
|
||||
$('#end_date')
|
||||
.datepicker('setDate', moment(moment.now())
|
||||
.format("YYYY/MM/DD"));
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,55 @@
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-lg-8">
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Email Parsed Fail</h5>
|
||||
</div>
|
||||
<div class="panel-body tbl-sm-pad" style="padding: 4px">
|
||||
<?php echo $member_parsedemailfail; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
(function( $ ) {
|
||||
$(function() {
|
||||
var customizer = {
|
||||
locked: false,
|
||||
init: function() {
|
||||
this.process();
|
||||
},
|
||||
/**
|
||||
* Parse email receipt manually
|
||||
* @return {json}
|
||||
*/
|
||||
process: function() {
|
||||
$(document.body).on('click', '.manually-parse', function(event) {
|
||||
|
||||
// locked
|
||||
if ( customizer.locked ) { return; }
|
||||
customizer.locked = true;
|
||||
|
||||
var id = $(this).attr('data-id');
|
||||
var urlPath = '/member/parse?id=' + id;
|
||||
|
||||
$.get( urlPath, function(data) {
|
||||
if ( data.data.parsed_status == 1 ) {
|
||||
alert( 'Successfully parsed the email manually!' );
|
||||
$(this).closest('tr').fadeOut('slow', function() {
|
||||
$(this).remove();
|
||||
});
|
||||
} else {
|
||||
alert( 'Parsed the email getting an errors, please check Slack!' );
|
||||
}
|
||||
customizer.locked = false;
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
customizer.init();
|
||||
});
|
||||
})(jQuery);
|
||||
</script>
|
||||
@@ -0,0 +1,495 @@
|
||||
<div id="overlay" style="display:none;">
|
||||
<div class="spinner"></div>
|
||||
<br />
|
||||
Exporting...
|
||||
</div <div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Tracked Email Items</h5>
|
||||
</div>
|
||||
<div>
|
||||
<form id="tracked-email-form" autocomplete="off" class="pad-10-20">
|
||||
<div class="row">
|
||||
<div class="form-group col-md-6">
|
||||
<div class="subject">
|
||||
<label for="subject" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Subject
|
||||
</label>
|
||||
<div class="">
|
||||
<input type="search" name="subject" id="subject" value="<?= $subject ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group col-md-6">
|
||||
<div class="sender">
|
||||
<label for="message_from" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Sender
|
||||
</label>
|
||||
<div class="">
|
||||
<input type="search" name="message_from" id="message_from" value="<?= $message_from ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group text-right">
|
||||
<div class="btn-group">
|
||||
<input type="button" name="search" id="search" value="Search" class="btn btn-xs btn-info" />
|
||||
<input type="button" id="exportZIP" value="Export" class="btn btn-warning btn-xs" />
|
||||
</div>
|
||||
<input type="hidden" name="member_id" id="member_id" value="<?= $member_id ?>" class="form-control" />
|
||||
</div>
|
||||
</form>
|
||||
<span style="color:red" id="message"></span>
|
||||
<div class="alert alert-danger" id="print-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-heading mb-20">
|
||||
<div class="heading-elements">
|
||||
<? if (is_array($tpages)) { ?><table>
|
||||
<tr>
|
||||
<td>Page <?= $tpage ?> out of <?= $ttotal_pages ?></td>
|
||||
<td><?= $pagination_config['full_tag_open'] ?>
|
||||
<?php foreach ($tpages??[] as $key => $val) {
|
||||
if ($member_tracked_offset == $val) {
|
||||
echo $pagination_config['cur_tag_open'] . $key . $pagination_config['cur_tag_close'];
|
||||
} else {
|
||||
echo $pagination_config['num_tag_open'] .
|
||||
"<a href='#'
|
||||
onclick=\"viewMemberActionLimitOffset(
|
||||
'EMAILRECIP',
|
||||
${member_id},
|
||||
'${limit}',
|
||||
'${val}',
|
||||
'subject=${subject}&message_from=${message_from}','member_tracked'
|
||||
);
|
||||
return false;\">
|
||||
${key}
|
||||
</a>" . $pagination_config['num_tag_close'];
|
||||
}
|
||||
}
|
||||
echo $pagination_config['full_tag_close']; ?></td>
|
||||
</tr>
|
||||
</table><? } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body tbl-sm-pad" style="padding: 4px">
|
||||
<?= $member_tracked ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-9">
|
||||
<?php if(isset($email_data_fetch_info)) { ?>
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<div class="row">
|
||||
<div class="col-md-3 text-left"><strong>Email Account: </strong> <?= $email_data_fetch_info['email_account']??'' ?></div>
|
||||
<div class="col-md-3 text-center"><strong>Account Status: </strong> <?= $email_data_fetch_info['account_status']??'' ?></div>
|
||||
<div class="col-md-3 text-center"><strong>Email Status: </strong> <?= $email_data_fetch_info['email_status']??'' ?></div>
|
||||
<?php
|
||||
$last_data_fetch = '';
|
||||
if(!empty($email_data_fetch_info['last_data_fetch']) && strlen($email_data_fetch_info['last_data_fetch'])>=10) {
|
||||
try {
|
||||
$last_data_fetch = (new DateTime($email_data_fetch_info['last_data_fetch']))->format('Y-m-d H:m:s');
|
||||
}catch (Exception $ex){}
|
||||
}
|
||||
?>
|
||||
<div class="col-md-3 text-right"><strong>Last Data Fetch: </strong> <?= $last_data_fetch ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php } ?>
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Parsed Email Receipts</h5>
|
||||
</div>
|
||||
<div class="pad-10-20">
|
||||
<form name="parsed_email_form" id="parsed-email-form" autocomplete="off">
|
||||
<div class="form-group">
|
||||
<div class="travel_date">
|
||||
<label for="start_travel_date" class="font-weight-bold col-form-label">
|
||||
Travel Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" name="start_travel_date" id="start_travel_date" value="<?= $start_travel_date ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" name="end_travel_date" id="end_travel_date" value="<?= $end_travel_date ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="duration">
|
||||
<label for="duration_start" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Duration
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="duration_start" id="duration_start" value="<?= $duration_start ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="duration_end" id="duration_end" value="<?= $duration_end ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cost">
|
||||
<label for="cost_start" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Cost
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="cost_start" id="cost_start" value="<?= $cost_start ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="cost_end" id="cost_end" value="<?= $cost_end ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="distance">
|
||||
<label for="distance_start" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Distance
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="distance_start" id="distance_start" value="<?= $distance_start ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="distance_end" id="distance_end" value="<?= $distance_end ?>" class="form-control mw-100"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="surge">
|
||||
<label for="surge" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Surge
|
||||
</label>
|
||||
<div class="surge__input">
|
||||
<select id="surge" class="form-control" name="surge">
|
||||
<option value="" selected> --- </option>
|
||||
<option value="0" <?= $surge == '0' ? 'selected' : ''?>> No</option>
|
||||
<option value="1" <?= $surge == '1' ? 'selected' : ''?> >Yes</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search_parsed_email" id="search_parsed_email" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
<?php if (!empty($errors)) { ?>
|
||||
<div class="alert alert-danger" id="parsed-email-error-msg">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg">
|
||||
<?php foreach ($errors as $ele) { ?>
|
||||
<p><?= $ele ?></p>
|
||||
<?php } ?>
|
||||
</p>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
|
||||
<div class="panel-heading mt-20">
|
||||
<div class="heading-elements">
|
||||
<?php if (is_array($pages)) { ?><table>
|
||||
<tr>
|
||||
<td>Page <?= $page ?> out of <?= $total_pages ?></td>
|
||||
<td><?= $pagination_config['full_tag_open'] ?>
|
||||
<?php foreach ($pages??[] as $key => $val) {
|
||||
if ($member_parsedemail_offset == $val) {
|
||||
echo $pagination_config['cur_tag_open'] . $key . $pagination_config['cur_tag_close'];
|
||||
} else {
|
||||
echo $pagination_config['num_tag_open'] .
|
||||
"<a href='#' onclick=\"viewMemberActionLimitOffset(
|
||||
'EMAILRECIP',
|
||||
${member_id},
|
||||
'${limit}',
|
||||
'${val}',
|
||||
generateParamsFromForm('parsed-email-form'),'member_parsedemail'
|
||||
);
|
||||
return false;\">${key}</a>"
|
||||
. $pagination_config['num_tag_close'];
|
||||
}
|
||||
}
|
||||
echo $pagination_config['full_tag_close']; ?></td>
|
||||
</tr>
|
||||
</table><?php } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body tbl-sm-pad">
|
||||
<?= $member_parsedemail ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
if(typeof window.paging_state === "undefined"){
|
||||
window.paging_state = {
|
||||
member_parsedemail: {
|
||||
offset: 0
|
||||
},
|
||||
member_tracked: {
|
||||
offset: 0
|
||||
}
|
||||
};
|
||||
}
|
||||
function viewMemberActionLimitOffset(action_name, member_id, limit, offset, params, type) {
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
|
||||
//save data
|
||||
if(type == 'member_parsedemail' || type == 'member_tracked'){
|
||||
window.paging_state[type].offset = offset;
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction?proc=PROCESS&action_name=" + action_name +
|
||||
"&member_id=" + member_id +
|
||||
"&limit=" + limit +
|
||||
"&offset=" + offset +
|
||||
"&member_parsedemail_offset="+ window.paging_state.member_parsedemail.offset +
|
||||
"&member_tracked_offset="+ window.paging_state.member_tracked.offset +
|
||||
'&' + params
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
}
|
||||
|
||||
function generateParamsFromForm(form) {
|
||||
return $('#' + form).serialize();
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#search').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'EMAILRECIP', <?= $member_id ?>, '50', '0', $('#tracked-email-form').serialize());
|
||||
})
|
||||
|
||||
$('#search_parsed_email').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'EMAILRECIP', <?= $member_id ?>, '50', '0', $('#parsed-email-form').serialize());
|
||||
})
|
||||
|
||||
$("#start_date, #start_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_date, #start_travel_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$("#end_date, #end_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#end_date, #end_travel_date").datepicker("option", "maxDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$('.close').on('click', function() {
|
||||
$(this).parent().toggle();
|
||||
})
|
||||
|
||||
$('#exportZIP').on('click', function(e) {
|
||||
$('#message').empty();
|
||||
e.preventDefault();
|
||||
|
||||
// validate upload form
|
||||
// $("#tracked-email-form").validate({
|
||||
// rules: {
|
||||
// member_id_filter: {
|
||||
// required: true,
|
||||
// number: true
|
||||
// }
|
||||
// },
|
||||
// messages: {
|
||||
// member_id_filter: {
|
||||
// required: 'Please input Member ID',
|
||||
// number: 'Please input number'
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
if ($("#tracked-email-form").valid() === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
$('#overlay').fadeIn();
|
||||
|
||||
export_zip_file()
|
||||
.then((data) => {
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
$('message').append('<b>Something went wrong !!!</b>');
|
||||
|
||||
}).finally(() => {
|
||||
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
});
|
||||
})
|
||||
|
||||
function export_zip_file() {
|
||||
return new Promise(function(resolve, reject) {
|
||||
const params = {
|
||||
proc: 'PROCESS',
|
||||
action_name: 'EMAILRECIP',
|
||||
member_id: '<?= $member_id ?>',
|
||||
export: 'ZIP',
|
||||
filters: $('#tracked-email-form').serialize()
|
||||
};
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.onerror = function() {
|
||||
reject(Error("Network Error"));
|
||||
};
|
||||
|
||||
xhr.open('POST', '/member/viewMemberAction', true);
|
||||
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
|
||||
xhr.onload = function() {
|
||||
if (xhr.status == 200) {
|
||||
// get file name
|
||||
let filename = "";
|
||||
const disposition = xhr.getResponseHeader('Content-Disposition');
|
||||
if (disposition && disposition.indexOf('attachment') !== -1) {
|
||||
const filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
|
||||
const matches = filenameRegex.exec(disposition);
|
||||
if (matches != null && matches[1]) {
|
||||
filename = matches[1].replace(/['"]/g, '');
|
||||
}
|
||||
}
|
||||
|
||||
let a = document.createElement('a');
|
||||
let url = window.URL.createObjectURL(this.response);
|
||||
a.href = url;
|
||||
a.download = filename;
|
||||
document.body.append(a);
|
||||
a.click();
|
||||
a.remove();
|
||||
|
||||
resolve(xhr.response);
|
||||
} else if (xhr.status == 404) {
|
||||
|
||||
$('#message').append(`<b>Data Not Found!!!</b>`);
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
} else {
|
||||
|
||||
reject(Error(xhr.statusText));
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
xhr.responseType = 'blob';
|
||||
xhr.send(new URLSearchParams(params).toString());
|
||||
})
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#parsed-email-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#tracked-email-form .form-group {
|
||||
|
||||
}
|
||||
|
||||
.cost,
|
||||
.duration,
|
||||
.travel_date,
|
||||
.distance,
|
||||
.subject,
|
||||
.sender,
|
||||
.surge {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
#overlay {
|
||||
background: #ffffff;
|
||||
color: #666666;
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 5000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
float: left;
|
||||
text-align: center;
|
||||
padding-top: 25%;
|
||||
opacity: .80;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
margin: 0 auto;
|
||||
height: 64px;
|
||||
width: 64px;
|
||||
animation: rotate 0.8s infinite linear;
|
||||
border: 5px solid firebrick;
|
||||
border-right-color: transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.mw-100{
|
||||
max-width: 100px;
|
||||
}
|
||||
.pad-10-20{
|
||||
padding: 10px 20px;
|
||||
}
|
||||
.tbl-sm-pad td{
|
||||
padding: 6px !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,158 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
<b><?= $selected_user['firstname'] ?> <?= $selected_user['lastname'] ?></b>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3">
|
||||
<div>
|
||||
<form id="traked_group_form">
|
||||
<div class="form-group">
|
||||
<div class="date">
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control" />
|
||||
</div>
|
||||
<input type="hidden" name="member_id" id="member_id" value="<?= $member_id ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search" id="search" value="Search" class="btn btn-info" />
|
||||
<input type="button" name="export_csv" id="export_csv" value="export" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="alert alert-danger" id="print-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg"></p>
|
||||
</div>
|
||||
<div class="panel-heading" style="margin-bottom: 5rem">
|
||||
<div class="heading-elements">
|
||||
<div id="pagination_tracked_group"></div>
|
||||
</div>
|
||||
</div>
|
||||
<table id="tracked-group-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th></th>
|
||||
<th>Tracked Group</th>
|
||||
<th>Count</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-9">
|
||||
<!-- Recent Members -->
|
||||
<div id="map" style="border:1px;border-style: dotted; height:750px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-danger mt-20" id="print-member-tracking-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="member-tracking-error-msg"></p>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive mt-20">
|
||||
<div class="col-lg-12">
|
||||
<div>
|
||||
<form name="member_tracking_form" id="member_tracking_form">
|
||||
<div class="form-group row">
|
||||
<div class="date">
|
||||
<label for="start_date" class="font-weight-bold col-lg-1 col-form-label">Date</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="text" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="text" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="device_id">
|
||||
<label for="device_id" class="font-weight-bold col-lg-12 col-form-label">Device ID</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="device_id" name="device_id">
|
||||
</div>
|
||||
</div>
|
||||
<div class="radius">
|
||||
<label for="radius" class="font-weight-bold col-lg-12 col-form-label">Radius</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="radius" name="radius">
|
||||
</div>
|
||||
</div>
|
||||
<div class="lat">
|
||||
<label for="lat" class="font-weight-bold col-lg-12 col-form-label">Latitude</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="lat" name="lat">
|
||||
</div>
|
||||
</div>
|
||||
<div class="lng">
|
||||
<label for="lng" class="font-weight-bold col-lg-12 col-form-label">Longitude</label>
|
||||
<div class="col-lg-12">
|
||||
<input class="form-control" type="search" id="lng" name="lng">
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search_member_tracking" id="search_member_tracking" value="Search" class="btn btn-info" />
|
||||
|
||||
</div>
|
||||
<input type="hidden" name="traked_group" id="traked_group" />
|
||||
</form>
|
||||
</div>
|
||||
<div class="panel-heading mb-10">
|
||||
<div class="heading-elements">
|
||||
<div id="pagination-member-tracking"></div>
|
||||
</div>
|
||||
</div>
|
||||
<table id="member-tracking-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>ID</th>
|
||||
<th>Member ID</th>
|
||||
<th>Tracked Group</th>
|
||||
<th>Speed</th>
|
||||
<th>Latitutde</th>
|
||||
<th>Longitude</th>
|
||||
<th>GPS</th>
|
||||
<th>Ttime</th>
|
||||
<th>Loc</th>
|
||||
<th>Device ID</th>
|
||||
<th>Previous ID</th>
|
||||
<th>Distance</th>
|
||||
<th>Duration</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script src="/assets/js/pages/member_geolocation/list.js?v=2"></script>
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDvjiRTxngOQyBP4zpqFlZuiquc0ROvo9c&callback=initMap" async defer></script>
|
||||
|
||||
<style>
|
||||
#traked_group_form .form-group,
|
||||
#member_tracking_form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,472 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Merged Receipts</h5>
|
||||
<div class="row">
|
||||
<form name="merged_receipts_form" id="merged-receipts-form" autocomplete="off">
|
||||
<div class="form-group row">
|
||||
<div class="type">
|
||||
<label for="?column?" class="font-weight-bold col-lg-3 col-md-3 col-sm-3 col-xs-3 col-form-label">
|
||||
Type
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<?= $acc_email_card ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="travel_date">
|
||||
<label for="start_travel_date" class="font-weight-bold col-lg-6 col-md-6 col-sm-6 col-xs-6 col-form-label">
|
||||
Travel Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="start_travel_date" id="start_travel_date" value="<?= $start_travel_date ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="end_travel_date" id="end_travel_date" value="<?= $end_travel_date ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cost">
|
||||
<label for="start_cost" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Cost
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" maxlength="10" name="start_cost" id="start_cost" value="<?= $start_cost ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" maxlength="10" name="end_cost" id="end_cost" value="<?= $end_cost ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search_merged_receipts" id="search-merged-receipts" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="alert alert-danger" id="print-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg"></p>
|
||||
</div>
|
||||
<div>
|
||||
<? if (is_array($pages)) { ?><table>
|
||||
<tr>
|
||||
<td>Page <?= $page ?> out of <?= $total_pages ?></td>
|
||||
<td><?= $pagination_config['full_tag_open'] ?>
|
||||
<? foreach ($pages as $key => $val) {
|
||||
if ($offset == $val) {
|
||||
echo $pagination_config['cur_tag_open'] . $key . $pagination_config['cur_tag_close'];
|
||||
} else {
|
||||
echo $pagination_config['num_tag_open'] . "<a href='#' onclick=\"viewMemberActionLimitOffset(
|
||||
'MERGED',
|
||||
${member_id},
|
||||
'${limit}',
|
||||
'${val}',
|
||||
generateParamsFromForm('merged-receipts-form')
|
||||
);return false;\">${key}</a>" . $pagination_config['num_tag_close'];
|
||||
}
|
||||
}
|
||||
echo $pagination_config['full_tag_close']; ?></td>
|
||||
</tr>
|
||||
</table><? } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<?= $member_merged ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<canvas id="myChart" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<canvas id="myChart" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
|
||||
$c = 0;
|
||||
$labelArray = '';
|
||||
$valueArray = '';
|
||||
foreach ($plot["plot_transpotercount"] as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ($c > 0) {
|
||||
$labelArray .= ',';
|
||||
$valueArray .= ',';
|
||||
}
|
||||
$labelArray .= "'" . $rr['name'] . "'";
|
||||
$valueArray .= $rr['count'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$dowL = array('Sun', 'Mon', 'Tue', 'Wed', 'Thurs', 'Fri', 'Sat');
|
||||
$c = 0;
|
||||
$labelArray2 = '';
|
||||
$valueArray2 = '';
|
||||
foreach ($plot["plot_dayofweekcount"] as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ($c > 0) {
|
||||
$labelArray2 .= ',';
|
||||
$valueArray2 .= ',';
|
||||
}
|
||||
$labelArray2 .= "'" . $dowL[$rr['dow']] . "'";
|
||||
$valueArray2 .= $rr['count'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$dowL = array('Sun', 'Mon', 'Tue', 'Wed', 'Thurs', 'Fri', 'Sat');
|
||||
$c = 0;
|
||||
$labelArray3 = '';
|
||||
$valueArray3 = '';
|
||||
foreach ($plot["plot_dayofweekamount"] as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ($c > 0) {
|
||||
$labelArray3 .= ',';
|
||||
$valueArray3 .= ',';
|
||||
}
|
||||
$labelArray3 .= "'" . $dowL[$rr['dow']] . "'";
|
||||
$valueArray3 .= $rr['sum'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$c = 0;
|
||||
$labelArray4 = '';
|
||||
$valueArray4 = '';
|
||||
foreach ($plot["plot_dayofweekdistance"] as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ($c > 0) {
|
||||
$labelArray4 .= ',';
|
||||
$valueArray4 .= ',';
|
||||
}
|
||||
$labelArray4 .= "'" . $dowL[$rr['dow']] . "'";
|
||||
$valueArray4 .= $rr['sum'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//echo $labelArray;
|
||||
//$l1Arr = " 'Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange' ";
|
||||
|
||||
?>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
$('#search-merged-receipts').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'MERGED',
|
||||
<?= $member_id ?>,
|
||||
'50',
|
||||
'0',
|
||||
$('#merged-receipts-form').serialize()
|
||||
);
|
||||
})
|
||||
|
||||
function generateParamsFromForm(form) {
|
||||
return $('#' + form).serialize();
|
||||
}
|
||||
|
||||
$("#start_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_travel_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$("#end_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#end_travel_date").datepicker("option", "maxDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$('.close').on('click', function() {
|
||||
$(this).parent().toggle();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
var ctx = document.getElementById("myChart");
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?= $labelArray ?>],
|
||||
datasets: [{
|
||||
label: 'Frequency by Transport mode',
|
||||
data: [<?= $valueArray ?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx1 = document.getElementById("myChartL");
|
||||
var myChart = new Chart(ctx1, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?= $labelArray2 ?>],
|
||||
datasets: [{
|
||||
label: 'Frequency by Day of the Week',
|
||||
data: [<?= $valueArray2 ?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx3 = document.getElementById("myChartX");
|
||||
var myChart = new Chart(ctx3, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?= $labelArray3 ?>],
|
||||
datasets: [{
|
||||
label: 'Amount by Day of the Week',
|
||||
data: [<?= $valueArray3 ?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx4 = document.getElementById("myChartD");
|
||||
var myChart = new Chart(ctx4, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: [<?= $labelArray4 ?>],
|
||||
datasets: [{
|
||||
label: 'Distance by Day of the Week',
|
||||
data: [<?= $valueArray4 ?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var ctx1 = document.getElementById("scatterChart");
|
||||
var scatterChart = new Chart(ctx1, {
|
||||
type: 'scatter',
|
||||
data: {
|
||||
datasets: [{
|
||||
label: 'Mode Group By Price',
|
||||
data: [{
|
||||
x: -10,
|
||||
y: 0
|
||||
}, {
|
||||
x: 0,
|
||||
y: 10
|
||||
}, {
|
||||
x: 10,
|
||||
y: 5
|
||||
}]
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
position: 'bottom'
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx3 = document.getElementById("myPieChart ");
|
||||
var myPieChart = new Chart(ctx3, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [10, 20, 30]
|
||||
}],
|
||||
labels: [
|
||||
'Red',
|
||||
'Yellow',
|
||||
'Blue'
|
||||
]
|
||||
},
|
||||
options: {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
function viewMemberActionLimitOffset(action_name, member_id, limit, offset, params) {
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction?proc=PROCESS&action_name=" + action_name +
|
||||
"&member_id=" + member_id +
|
||||
"&limit=" + limit +
|
||||
"&offset=" + offset +
|
||||
'&' + params
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
}
|
||||
|
||||
function generateParamsFromForm(form) {
|
||||
return $('#' + form).serialize();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#merged-receipts-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.travel_date,
|
||||
.cost {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,294 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div align="center" style="text-align:center;color:red;font-weight:bold;"><?= $message ?></div>
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>OAuth2 Tokens</h5>
|
||||
<div class="heading-elements">
|
||||
<table>
|
||||
<tr>
|
||||
<td><?= $links ?></td>
|
||||
<td><?= $token_provider ?></td>
|
||||
</tr>
|
||||
</table>
|
||||
<button style="background-color:red;font-weight:bold;color:white;" onclick="return DeleteMemberData(<?= $member_id ?>);">Delete User's E-mails, OAuth2 tokens, Pull jobs and Threads</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
<form id="oauth2-tokens-form">
|
||||
<div class="form-group row">
|
||||
<div class="email">
|
||||
<label for="email" class="font-weight-bold col-lg-1 col-form-label mt-10">
|
||||
Email
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<input type="search" name="email" id="email" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="updated">
|
||||
<label for="start_date" class="font-weight-bold col-lg-1 col-form-label mt-10">
|
||||
Updated
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search-oauth2-tokens" id="search-oauth2-tokens" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
<div id="pagination-oauth2-tokens"></div>
|
||||
<table id="oauth2-tokens-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>Email</th>
|
||||
<th>Name</th>
|
||||
<th>Provider</th>
|
||||
<th>Created</th>
|
||||
<th>Updated</th>
|
||||
<th>Expires</th>
|
||||
<th>Access Type</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
<form id="oauth2-pull-jobs-form">
|
||||
<div class="form-group">
|
||||
<div class="completed">
|
||||
<label for="start_date">
|
||||
Completed
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" name="search-oauth2-pull-jobs" id="search-oauth2-pull-jobs" value="Search" class="btn btn-info" />
|
||||
|
||||
</div>
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
</form>
|
||||
</div>
|
||||
<div id="pagination-oauth2-pull-jobs"></div>
|
||||
<table id="oauth2-pull-jobs-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>Created</th>
|
||||
<th>Started</th>
|
||||
<th>Completed</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>OAuth2 Pull Threads</h5>
|
||||
<div class="heading-elements">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div>
|
||||
<form id="oauth2-pull-threads-form">
|
||||
<div class="form-group">
|
||||
<div class="search_term">
|
||||
<label for="search_term" class="font-weight-bold col-lg-6 col-form-label">
|
||||
Search Term
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<input type="search" name="search_term" id="search_term" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="date">
|
||||
<label for="start_date" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Completed
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="hidden" name="member_id" value='<?= $member_id ?>'>
|
||||
<input type="button" name="search-oauth2-pull-threads" id="search-oauth2-pull-threads" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="pagination-oauth2-pull-threads"></div>
|
||||
<table id="oauth2-pull-threads-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>Created</th>
|
||||
<th>Started</th>
|
||||
<th>Completed</th>
|
||||
<th>Item Count</th>
|
||||
<th>Search Term</th>
|
||||
<th>Search From</th>
|
||||
<th>Failed</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript" src="/assets/js/app.js"></script>
|
||||
<script type="text/javascript" src="/assets/js/pages/oauth2/list.js"></script>
|
||||
<!-- <script type="text/javascript">
|
||||
function addMemberCard(card_id, member_id) {
|
||||
if (!confirm('Confirm Add Card to Account')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/addMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function(data) {
|
||||
$('#cardDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function deleteMemberCard(card_id, member_id) {
|
||||
if (!confirm('Confirm Remove Card')) {
|
||||
return false;
|
||||
}
|
||||
$('#cardDeleteDiv' + card_id).html('Processing...');
|
||||
$('#cardButton' + card_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/deleteMemberCard?proc=PROCESS&card_id=" + card_id + "&member_id=" + member_id
|
||||
}).done(function(data) {
|
||||
$('#cardDeleteDiv' + card_id).html(data);
|
||||
$('#cardButton' + card_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
function viewTrackedAdvice(tracked_id) {
|
||||
|
||||
$('#lineoption').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewTrackedAdvice?proc=PROCESS&tracked_id=" + tracked_id
|
||||
}).done(function(data) {
|
||||
$('#lineoption').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function getSlideCards(element, member_id, card_category) {
|
||||
let str = element.href;
|
||||
let pos = str.indexOf("#/");
|
||||
let opos = pos;
|
||||
while (pos != -1) {
|
||||
pos = str.indexOf("#/", pos + 1);
|
||||
if (pos == -1) break;
|
||||
opos = pos;
|
||||
}
|
||||
if (opos == -1) {
|
||||
opos = -2;
|
||||
str = "0";
|
||||
}
|
||||
let offset = str.substring(opos + 2);
|
||||
return getSlideCardsReal(offset, member_id, card_category);
|
||||
}
|
||||
|
||||
function getSlideCardsReal(offset, member_id, card_category) {
|
||||
// &member_id=<?= $member_id ?>
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction/" + offset + "?proc=PROCESS&action_name=MCARDS&member_id=" + member_id + "&limit=<?= $limit ?>&offset=" + offset + "&card_category=" + card_category
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function DeleteMemberData(member_id) {
|
||||
if (confirm('Are you sure you want to delete all user\'s E-mails, OAuth2 tokens, Pull jobs and Threads')) {
|
||||
viewMemberAction('OAUTH2_DELETE', member_id);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
$(function() {
|
||||
$('select[name=card_category]').change(function() {
|
||||
getSlideCardsReal(0, <?= $member_id ?>, this.value == '' ? '0' : this.value);
|
||||
});
|
||||
});
|
||||
//initMap();
|
||||
//
|
||||
-->
|
||||
<!-- </script> -->
|
||||
|
||||
<style>
|
||||
#oauth2-tokens-form .form-group,
|
||||
#oauth2-pull-jobs-form .form-group,
|
||||
#oauth2-pull-threads-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.updated,
|
||||
.completed,
|
||||
.date {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.panel-heading {
|
||||
padding: 15px 0px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,456 @@
|
||||
<div id="overlay" style="display:none;">
|
||||
<div class="spinner"></div>
|
||||
<br />
|
||||
Exporting...
|
||||
</div <div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Tracked Email Items</h5>
|
||||
</div>
|
||||
<div>
|
||||
<form id="tracked-email-form" autocomplete="off">
|
||||
<div style="padding: 10px">
|
||||
<div class="date">
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control" placeholder="Start date"/>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control" placeholder="End date"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
<!-- <div class="member_id_filter">
|
||||
<label for="member_id_filter" class="font-weight-bold col-form-label">
|
||||
Member ID
|
||||
</label>
|
||||
<div class="">
|
||||
<input type="search" name="member_id_filter" id="member_id_filter" value="<?= $member_id_filter ?>" class="form-control" />
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="row" style="margin-top: 5px;">
|
||||
<div class="form-group subject col-md-6">
|
||||
<label for="subject" class="font-weight-bold">
|
||||
Subject
|
||||
</label>
|
||||
<div class="">
|
||||
<input type="search" name="subject" id="subject" value="<?= $subject ?>" class="form-control" placeholder="Subject" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group sender col-md-6">
|
||||
<label for="message_from" class="font-weight-bold">
|
||||
Sender
|
||||
</label>
|
||||
<div class="">
|
||||
<input type="search" name="message_from" id="message_from" value="<?= $message_from ?>" class="form-control" placeholder="Sender" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-right">
|
||||
<input type="button" name="search" id="search" value="Search" class="btn btn-info" />
|
||||
<input type="button" id="exportZIP" value="Export" class="btn btn-warning" />
|
||||
</div>
|
||||
<input type="hidden" name="member_id" id="member_id" value="<?= $member_id ?>" class="form-control" />
|
||||
</div>
|
||||
</form>
|
||||
<span style="color:red" id="message"></span>
|
||||
<div class="alert alert-danger" id="print-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clearfix"></div>
|
||||
<div class="panel-heading mb-20" style="margin-top: 10px">
|
||||
<div class="heading-elements">
|
||||
<?php if (is_array($tpages)) { ?><table>
|
||||
<tr>
|
||||
<td>Page <?= $tpage ?> out of <?= $ttotal_pages ?></td>
|
||||
<td><?= $pagination_config['full_tag_open'] ?>
|
||||
<?php foreach ($tpages as $key => $val) {
|
||||
if ($member_tracked_offset == $val) {
|
||||
echo $pagination_config['cur_tag_open'] . $key . $pagination_config['cur_tag_close'];
|
||||
} else {
|
||||
echo $pagination_config['num_tag_open'] .
|
||||
"<a href='#'
|
||||
onclick=\"viewMemberActionLimitOffset(
|
||||
'EMAILOTHER',
|
||||
${member_id},
|
||||
'${limit}',
|
||||
'${val}',
|
||||
'subject=${subject}&message_from=${message_from}',
|
||||
'member_tracked'
|
||||
);
|
||||
return false;\">
|
||||
${key}
|
||||
</a>" . $pagination_config['num_tag_close'];
|
||||
}
|
||||
}
|
||||
echo $pagination_config['full_tag_close']; ?></td>
|
||||
</tr>
|
||||
</table><?php } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" style="padding: 0">
|
||||
<div class="table-responsive tbl-small">
|
||||
<?= $member_tracked ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-9">
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Parsed Email Receipts</h5>
|
||||
</div>
|
||||
<div>
|
||||
<form name="parsed_email_form" id="parsed-email-form" autocomplete="off">
|
||||
<div class="form-group" style="padding: 0 20px">
|
||||
<div class="travel_date">
|
||||
<label for="start_travel_date" class="font-weight-bold col-form-label">
|
||||
Receipt Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" name="start_travel_date" id="start_travel_date" value="<?= $start_travel_date ?>" class="form-control" placeholder="Start date"/>
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" name="end_travel_date" id="end_travel_date" value="<?= $end_travel_date ?>" class="form-control" placeholder="End date"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="cost">
|
||||
<label for="cost_start" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Amount
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="cost_start" id="cost_start" value="<?= $cost_start ?>" class="form-control" placeholder="Amount from" />
|
||||
</div>
|
||||
<div class="">
|
||||
<input type="search" maxlength="10" name="cost_end" id="cost_end" value="<?= $cost_end ?>" class="form-control" placeholder="Amount to" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<input type="button" name="search_parsed_email" id="search_parsed_email" value="Search" class="btn btn-info" />
|
||||
</div>
|
||||
</form>
|
||||
<?php if (!empty($errors)) { ?>
|
||||
<div class="alert alert-danger" id="parsed-email-error-msg">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="error-msg">
|
||||
<?php foreach ($errors as $ele) { ?>
|
||||
<p><?= $ele ?></p>
|
||||
<?php } ?>
|
||||
</p>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
|
||||
<div class="panel-heading mt-20">
|
||||
<div class="heading-elements">
|
||||
<?php if (is_array($pages)) { ?><table>
|
||||
<tr>
|
||||
<td>Page <?= $page ?> out of <?= $total_pages ?></td>
|
||||
<td><?= $pagination_config['full_tag_open'] ?>
|
||||
<?php foreach ($pages as $key => $val) {
|
||||
if ($member_parsedemail_offset == $val) {
|
||||
echo $pagination_config['cur_tag_open'] . $key . $pagination_config['cur_tag_close'];
|
||||
} else {
|
||||
echo $pagination_config['num_tag_open'] .
|
||||
"<a href='#' onclick=\"viewMemberActionLimitOffset(
|
||||
'EMAILOTHER',
|
||||
${member_id},
|
||||
'${limit}',
|
||||
'${val}',
|
||||
generateParamsFromForm('parsed-email-form'),
|
||||
'member_parsedemail'
|
||||
);
|
||||
return false;\">${key}</a>"
|
||||
. $pagination_config['num_tag_close'];
|
||||
}
|
||||
}
|
||||
echo $pagination_config['full_tag_close']; ?></td>
|
||||
</tr>
|
||||
</table><?php } ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body" style="padding: 0">
|
||||
<div class="table-responsive">
|
||||
<?= $member_parsedemail ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
if(typeof window.email_other_paging_state === "undefined"){
|
||||
window.email_other_paging_state = {
|
||||
member_tracked: {
|
||||
offset: 0
|
||||
},
|
||||
member_parsedemail: {
|
||||
offset: 0
|
||||
},
|
||||
};
|
||||
}
|
||||
function viewMemberActionLimitOffset(action_name, member_id, limit, offset, params, type) {
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
|
||||
//save data
|
||||
type = type || '';
|
||||
if(type === 'member_parsedemail' || type === 'member_tracked'){
|
||||
window.email_other_paging_state[type].offset = offset;
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: "/member/viewMemberAction?proc=PROCESS&action_name=" + action_name +
|
||||
"&member_id=" + member_id +
|
||||
"&limit=" + limit +
|
||||
"&member_parsedemail_offset="+ window.email_other_paging_state.member_parsedemail.offset +
|
||||
"&member_tracked_offset="+ window.email_other_paging_state.member_tracked.offset +
|
||||
'&' + params
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
}
|
||||
|
||||
function generateParamsFromForm(form) {
|
||||
return $('#' + form).serialize();
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#search').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'EMAILOTHER', <?= $member_id ?>, '50', '0', $('#tracked-email-form').serialize(),'member_tracked');
|
||||
})
|
||||
|
||||
$('#search_parsed_email').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'EMAILOTHER', <?= $member_id ?>, '50', '0', $('#parsed-email-form').serialize(),'member_parsedemail');
|
||||
})
|
||||
|
||||
$("#start_date, #start_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#start_date, #start_travel_date").datepicker("option", "minDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$("#end_date, #end_travel_date").datepicker({
|
||||
defaultDate: "+1w",
|
||||
changeMonth: true,
|
||||
numberOfMonths: 3,
|
||||
format: 'yyyy-mm-dd',
|
||||
onClose: function(selectedDate) {
|
||||
$("#end_date, #end_travel_date").datepicker("option", "maxDate", selectedDate);
|
||||
}
|
||||
})
|
||||
|
||||
$('.close').on('click', function() {
|
||||
$(this).parent().toggle();
|
||||
})
|
||||
|
||||
$('#exportZIP').on('click', function(e) {
|
||||
$('#message').empty();
|
||||
e.preventDefault();
|
||||
|
||||
// validate upload form
|
||||
// $("#tracked-email-form").validate({
|
||||
// rules: {
|
||||
// member_id_filter: {
|
||||
// required: true,
|
||||
// number: true
|
||||
// }
|
||||
// },
|
||||
// messages: {
|
||||
// member_id_filter: {
|
||||
// required: 'Please input Member ID',
|
||||
// number: 'Please input number'
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
|
||||
if ($("#tracked-email-form").valid() === false) {
|
||||
return;
|
||||
}
|
||||
|
||||
$('#overlay').fadeIn();
|
||||
|
||||
export_zip_file()
|
||||
.then((data) => {
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
$('message').append('<b>Something went wrong !!!</b>');
|
||||
|
||||
}).finally(() => {
|
||||
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
});
|
||||
})
|
||||
|
||||
function export_zip_file() {
|
||||
return new Promise(function(resolve, reject) {
|
||||
const params = {
|
||||
proc: 'PROCESS',
|
||||
action_name: 'EMAILOTHER',
|
||||
member_id: '<?= $member_id ?>',
|
||||
export: 'ZIP',
|
||||
filters: $('#tracked-email-form').serialize()
|
||||
};
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.onerror = function() {
|
||||
reject(Error("Network Error"));
|
||||
};
|
||||
|
||||
xhr.open('POST', '/member/viewMemberAction', true);
|
||||
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
|
||||
xhr.onload = function() {
|
||||
if (xhr.status == 200) {
|
||||
// get file name
|
||||
let filename = "";
|
||||
const disposition = xhr.getResponseHeader('Content-Disposition');
|
||||
if (disposition && disposition.indexOf('attachment') !== -1) {
|
||||
const filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
|
||||
const matches = filenameRegex.exec(disposition);
|
||||
if (matches != null && matches[1]) {
|
||||
filename = matches[1].replace(/['"]/g, '');
|
||||
}
|
||||
}
|
||||
|
||||
let a = document.createElement('a');
|
||||
let url = window.URL.createObjectURL(this.response);
|
||||
a.href = url;
|
||||
a.download = filename;
|
||||
document.body.append(a);
|
||||
a.click();
|
||||
a.remove();
|
||||
|
||||
resolve(xhr.response);
|
||||
} else if (xhr.status == 404) {
|
||||
|
||||
$('#message').append(`<b>Data Not Found!!!</b>`);
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
} else {
|
||||
|
||||
reject(Error(xhr.statusText));
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
xhr.responseType = 'blob';
|
||||
xhr.send(new URLSearchParams(params).toString());
|
||||
})
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#parsed-email-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
#tracked-email-form .form-group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cost,
|
||||
.duration,
|
||||
.travel_date,
|
||||
.distance,
|
||||
.subject,
|
||||
.sender,
|
||||
.surge {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
#overlay {
|
||||
background: #ffffff;
|
||||
color: #666666;
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 5000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
float: left;
|
||||
text-align: center;
|
||||
padding-top: 25%;
|
||||
opacity: .80;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
margin: 0 auto;
|
||||
height: 64px;
|
||||
width: 64px;
|
||||
animation: rotate 0.8s infinite linear;
|
||||
border: 5px solid firebrick;
|
||||
border-right-color: transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.tbl-small td{
|
||||
padding: 5px !important;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,346 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<canvas id="myChart" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<canvas id="myChartL" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<canvas id="myChartX" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<canvas id="myChartD" style="width:100%; height:400px"></canvas>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<?=$common_comute?>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-12">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?//$member_parsedetail ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<?php
|
||||
|
||||
$c=0;
|
||||
$labelArray = '';
|
||||
$valueArray = '';
|
||||
foreach ($plot_transpotercount as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ( $c > 0 )
|
||||
{
|
||||
$labelArray .= ',';
|
||||
$valueArray .= ',';
|
||||
}
|
||||
$labelArray .= "'".$rr['name']."'";
|
||||
$valueArray .= $rr['count'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$dowL= array('Sun','Mon','Tue','Wed','Thurs','Fri','Sat');
|
||||
$c=0;
|
||||
$labelArray2 = '';
|
||||
$valueArray2 = '';
|
||||
foreach ($plot_dayofweekcount as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ( $c > 0 )
|
||||
{
|
||||
$labelArray2 .= ',';
|
||||
$valueArray2 .= ',';
|
||||
}
|
||||
$labelArray2 .= "'".$dowL[$rr['dow']]."'";
|
||||
$valueArray2 .= $rr['count'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$dowL= array('Sun','Mon','Tue','Wed','Thurs','Fri','Sat');
|
||||
$c=0;
|
||||
$labelArray3 = '';
|
||||
$valueArray3 = '';
|
||||
foreach ($plot_dayofweekamount as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ( $c > 0 )
|
||||
{
|
||||
$labelArray3 .= ',';
|
||||
$valueArray3 .= ',';
|
||||
}
|
||||
$labelArray3 .= "'".$dowL[$rr['dow']]."'";
|
||||
$valueArray3 .= $rr['sum'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
$c=0;
|
||||
$labelArray4 = '';
|
||||
$valueArray4 = '';
|
||||
foreach ($plot_dayofweekdistance as $rr) {
|
||||
// echo "{$key} => {$value} ";
|
||||
// print_r($rr);
|
||||
if ( $c > 0 )
|
||||
{
|
||||
$labelArray4 .= ',';
|
||||
$valueArray4 .= ',';
|
||||
}
|
||||
$labelArray4 .= "'".$dowL[$rr['dow']]."'";
|
||||
$valueArray4 .= $rr['sum'];
|
||||
$c++;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//echo $labelArray;
|
||||
//$l1Arr = " 'Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange' ";
|
||||
|
||||
?>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
<!--
|
||||
var ctx = document.getElementById("myChart");
|
||||
var myChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?=$labelArray?>],
|
||||
datasets: [{
|
||||
label: 'Frequency by Transport mode',
|
||||
data: [<?=$valueArray?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero:true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx1 = document.getElementById("myChartL");
|
||||
var myChart = new Chart(ctx1, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?=$labelArray2?>],
|
||||
datasets: [{
|
||||
label: 'Frequency by Day of the Week',
|
||||
data: [<?=$valueArray2?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero:true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx3 = document.getElementById("myChartX");
|
||||
var myChart = new Chart(ctx3, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: [<?=$labelArray3?>],
|
||||
datasets: [{
|
||||
label: 'Amount by Day of the Week',
|
||||
data: [<?=$valueArray3?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero:true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
var ctx4 = document.getElementById("myChartD");
|
||||
var myChart = new Chart(ctx4, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: [<?=$labelArray4?>],
|
||||
datasets: [{
|
||||
label: 'Distance by Day of the Week',
|
||||
data: [<?=$valueArray4?>],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(255, 206, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgba(255,99,132,1)',
|
||||
'rgba(54, 162, 235, 1)',
|
||||
'rgba(255, 206, 86, 1)',
|
||||
'rgba(75, 192, 192, 1)',
|
||||
'rgba(153, 102, 255, 1)',
|
||||
'rgba(255, 159, 64, 1)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero:true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var ctx1 = document.getElementById("scatterChart");
|
||||
var scatterChart = new Chart(ctx1, {
|
||||
type: 'scatter',
|
||||
data: {
|
||||
datasets: [{
|
||||
label: 'Mode Group By Price',
|
||||
data: [{
|
||||
x: -10,
|
||||
y: 0
|
||||
}, {
|
||||
x: 0,
|
||||
y: 10
|
||||
}, {
|
||||
x: 10,
|
||||
y: 5
|
||||
}]
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
xAxes: [{
|
||||
type: 'linear',
|
||||
position: 'bottom'
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var ctx3 = document.getElementById("myPieChart ");
|
||||
var myPieChart = new Chart(ctx3, {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [10, 20, 30]
|
||||
}],
|
||||
labels: [
|
||||
'Red',
|
||||
'Yellow',
|
||||
'Blue'
|
||||
]
|
||||
},
|
||||
options: {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//initMap();
|
||||
// -->
|
||||
</script>
|
||||
@@ -0,0 +1,30 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-6">
|
||||
<h4>Points Recieved</h4>
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?= $points_recieved ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
<h4>Points Redeemed</h4>
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<?= $points_redeemed ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,209 @@
|
||||
<?= $message ?>
|
||||
<!--
|
||||
street1 | character varying(50) |
|
||||
street2 | character varying(50) |
|
||||
city | character varying(50) |
|
||||
zipcode | character varying(12) |
|
||||
state | character varying(50) |
|
||||
country | character varying(2) |
|
||||
-->
|
||||
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-6">
|
||||
<!-- Members online -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="street1">Refresh cards</label><div id="refresh_result"></div>
|
||||
<input type="submit" class="btn btn-warning btn-block" value="Refresh Card List" onclick="return refreshMemberCards(<?= $member_id ?>);">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<label for="street1">Refresh Personalty</label><div id="refresh_result"></div>
|
||||
<input type="submit" class="btn btn-info btn-block" value="Refresh Personalty" onclick="return refreshMemberPersonalty(<?= $member_id ?>);">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="street1">Personalty History</label><div id="refresh_result"></div>
|
||||
<?=$personalty_table?>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="street1">Raw Data</label>
|
||||
<? //print_r($dat_array); ?>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /members online -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6">
|
||||
|
||||
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
|
||||
<input type="hidden" id='member_id' name='member_id' value="<?= $member_id ?>" />
|
||||
<div class="form-group">
|
||||
<label for="street1">Decision Group</label>
|
||||
<?= $decision_group ?>
|
||||
</div>
|
||||
|
||||
<div id="pers_result"></div>
|
||||
<input type="submit" id="acc<?= $member_id ?>" class="btn btn-primary" value="Set Personality" onclick="return submitMemberPersUpdate();">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
|
||||
<form name="memberProfile" id="memberProfile">
|
||||
<input type="hidden" id='member_id' name='member_id' value="<?= $member_id ?>" />
|
||||
<!-- div class="form-group">
|
||||
<label for="street1">Decision Group</label>
|
||||
<?= $decision_group ?>
|
||||
</!-->
|
||||
<div class="form-group">
|
||||
<label for="street1">Street 1</label>
|
||||
<input type="text" class="form-control" id="street1" name="street1" maxlength="50" placeholder="Street address line 1" value="<?= $street1 ?>" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="street1">Street 2</label>
|
||||
<input type="text" class="form-control" id="street2" name="street2" maxlength="50" placeholder="Street address line 2" value="<?= $street2 ?>" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="city">City</label>
|
||||
<input type="text" class="form-control" id="city" name="city" maxlength="50" placeholder="City" value="<?= $city ?>" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="zipcode">Zip code</label>
|
||||
<input type="text" class="form-control" id="zipcode" name="zipcode" maxlength="12" placeholder="Zip code" value="<?= $zipcode ?>" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="state">State</label>
|
||||
<input type="text" class="form-control" name="state" id="state" maxlength="50" placeholder="State" value="<?= $state ?>" />
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="country">Country</label>
|
||||
<input type="text" class="form-control" name="country" id="country" maxlength="2" placeholder="Country" value="<?= $country ?>" />
|
||||
</div>
|
||||
<div id="profile_detail"></div>
|
||||
<input type="submit" id="acc<?= $member_id ?>" class="btn btn-primary" value="Update" onclick="return submitMemberUpdate(this.form);">
|
||||
</form>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
let member_id = '<?= $member_id ?>';
|
||||
// Attach a submit handler to the form
|
||||
|
||||
function refreshMemberCards(member_id) {
|
||||
// alert(decision_group);
|
||||
//refresh_result
|
||||
|
||||
|
||||
|
||||
|
||||
$('#refresh_result').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/refreshCards?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#refresh_result').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false
|
||||
|
||||
}
|
||||
|
||||
function refreshMemberPersonalty(member_id) {
|
||||
// alert(member_id);
|
||||
//refresh_result
|
||||
$('#refresh_result').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/refreshPersonalty?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#refresh_result').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false
|
||||
|
||||
}
|
||||
|
||||
function submitMemberPersUpdate(){
|
||||
// alert(1);
|
||||
var e = document.getElementById("decision_group");
|
||||
var decision_group_value = e.options[e.selectedIndex].value;
|
||||
//alert(decision_group_value);
|
||||
|
||||
$('#pers_result').html('Processing...');
|
||||
// $('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/personalityUpdate?proc=PROCESS&member_id=" + member_id + "&decision_group=" + decision_group_value
|
||||
}).done(function (data) {
|
||||
$('#pers_result').html(data);
|
||||
// $('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false
|
||||
|
||||
}
|
||||
|
||||
function submitMemberUpdate(form) {
|
||||
$('#profile_detail').html('Processing..updating...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
|
||||
//alert(form.member_id.value);
|
||||
var post_data = {
|
||||
'member_id': form.member_id.value,
|
||||
'street1': form.street1.value,
|
||||
'street2': form.street2.value,
|
||||
'city': form.city.value,
|
||||
'zipcode': form.zipcode.value,
|
||||
'state': form.state.value,
|
||||
'country': form.country.value,
|
||||
'decision_group': form.decision_group,
|
||||
};
|
||||
alert(1);
|
||||
// Get some values from elements on the page:
|
||||
var url = "/member/updateMemberProfile";
|
||||
// Send the data using post
|
||||
var posting = $.post(url, post_data);
|
||||
// Put the results in a div
|
||||
posting.done(function (data) {
|
||||
$('#profile_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,44 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Subscription</h5>
|
||||
<div class="heading-elements">
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<?= $member_subs ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,51 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div id="lineoption">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Surveys</h5>
|
||||
<div class="heading-elements">
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<?= $survey_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-heading">
|
||||
<h5>Onboarding Surveys</h5>
|
||||
<div class="heading-elements">
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<?= $onboarding_survey_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,275 @@
|
||||
<div class="m-l-md">
|
||||
<div class="row m-y-md">
|
||||
<div class="col-md-6">
|
||||
GPS TRACKED TRIPS
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-4">
|
||||
<div class="col-lg-12 mt-20">
|
||||
<form name="tracking-trips-form" id="tracking-trips-form" autocomplete="off">
|
||||
<div class="form-group row">
|
||||
<div class="duration">
|
||||
<label for="start_duration" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Duration
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="start_duration" id="start_duration" value="<?= isset($tracking_trips['start_duration'])
|
||||
? $tracking_trips['start_duration']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="end_duration" id="end_duration" value="<?= isset($tracking_trips['end_duration'])
|
||||
? $tracking_trips['end_duration']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="distance">
|
||||
<label for="start_distance" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Distance
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="start_distance" id="start_distance" value="<?= isset($tracking_trips['start_distance'])
|
||||
? $tracking_trips['start_distance']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
|
||||
<input type="search" name="end_distance" id="end_distance" value="<?= isset($tracking_trips['end_distance'])
|
||||
? $tracking_trips['end_distance']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" id="search-tracking-trips" value="Search" class="btn btn-info legitRipple" />
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="tracking-trips__pagination-link">
|
||||
<?= $tracking_trips_pagination_link ?>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="panel panel-flat">
|
||||
<div class="tracking-trips__table">
|
||||
<?= $tracking_trips_table ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tracking col-lg-8">
|
||||
<!-- Media library -->
|
||||
<div class="col-lg-12 mt-20">
|
||||
<form name="tracking-form" id="tracking-form" autocomplete="off">
|
||||
<div class="form-group row">
|
||||
<div class="date">
|
||||
<label for="start_date" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= isset($tracking['start_date'])
|
||||
? $tracking['start_date']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= isset($tracking['end_date'])
|
||||
? $tracking['end_date']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="duration">
|
||||
<label for="start_duration" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Duration
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_duration" id="start_duration" value="<?= isset($tracking['start_duration'])
|
||||
? $tracking['start_duration']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_duration" id="end_duration" value="<?= isset($tracking['end_duration'])
|
||||
? $tracking['end_duration']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="distance">
|
||||
<label for="start_distance" class="font-weight-bold col-lg-2 col-form-label">
|
||||
Distance
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_distance" id="start_distance" value="<?= isset($tracking['start_distance'])
|
||||
? $tracking['start_distance']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_distance" id="end_distance" value="<?= isset($tracking['end_distance'])
|
||||
? $tracking['end_distance']
|
||||
: '' ?>" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<input type="button" id="search-tracking" value="Search" class="btn btn-info legitRipple" />
|
||||
</div>
|
||||
</form>
|
||||
<div class="tracking__pagination-link"><?= $tracking_links ?></div>
|
||||
</div>
|
||||
<div class="panel panel-white">
|
||||
<div class="tracking__table"><?= $tracking_table ?> </div>
|
||||
</div>
|
||||
<!-- /media library -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/app.js" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
function viewTrip(id) {
|
||||
document.location = '/gps/trip?member_id=<?= $member_id ?>&id=' + id;
|
||||
return false;
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#search-tracking-trips').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'GPSTRIPS',
|
||||
<?= $member_id ?>,
|
||||
'50',
|
||||
'tracking_trips_offset=0',
|
||||
$('#tracking-trips-form').serialize()
|
||||
);
|
||||
})
|
||||
|
||||
$('#search-tracking').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
viewMemberActionLimitOffset(
|
||||
'GPSTRIPS',
|
||||
<?= $member_id ?>,
|
||||
'50',
|
||||
'tracking_offset=0',
|
||||
$('#tracking-form').serialize()
|
||||
);
|
||||
})
|
||||
|
||||
function viewMemberActionLimitOffset(action_name, member_id, limit, offset, params) {
|
||||
const url = "/member/viewMemberAction?proc=PROCESS&action_name=" + action_name +
|
||||
"&member_id=" + member_id +
|
||||
"&limit=" + limit +
|
||||
"&" + offset +
|
||||
'&tracking_trips=' + generateUrlByTrackingTrips() +
|
||||
'&tracking=' + generateUrlByTracking();
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
|
||||
$.ajax({
|
||||
url: url
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
}
|
||||
|
||||
function generateUrlByTrackingTrips(page_no = null) {
|
||||
const tracking_trips_form = $('#tracking-trips-form');
|
||||
const tracking_trips = JSON.stringify({
|
||||
'start_duration': tracking_trips_form.find('#start_duration').val(),
|
||||
'end_duration': tracking_trips_form.find('#end_duration').val(),
|
||||
'start_distance': tracking_trips_form.find('#start_distance').val(),
|
||||
'end_distance': tracking_trips_form.find('#end_distance').val(),
|
||||
'cur_page': page_no ?
|
||||
page_no :
|
||||
$('.tracking-trips__pagination-link')
|
||||
.find('li.active')
|
||||
.find('span.cur-page')
|
||||
.html()
|
||||
});
|
||||
|
||||
return tracking_trips;
|
||||
}
|
||||
|
||||
function generateUrlByTracking(page_no = null) {
|
||||
const tracking_form = $('#tracking-form');
|
||||
const tracking = JSON.stringify({
|
||||
'start_date': tracking_form.find('#start_date').val(),
|
||||
'end_date': tracking_form.find('#end_date').val(),
|
||||
'start_duration': tracking_form.find('#start_duration').val(),
|
||||
'end_duration': tracking_form.find('#end_duration').val(),
|
||||
'start_distance': tracking_form.find('#start_distance').val(),
|
||||
'end_distance': tracking_form.find('#end_distance').val(),
|
||||
'cur_page': page_no ?
|
||||
page_no :
|
||||
$('.tracking__pagination-link')
|
||||
.find('li.active')
|
||||
.find('span.cur-page')
|
||||
.html()
|
||||
});
|
||||
|
||||
return tracking;
|
||||
}
|
||||
|
||||
$('.tracking__pagination-anchor').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
const page_no = $(this).attr('data-ci-pagination-page');
|
||||
const url = $(this).attr('href') +
|
||||
'&tracking_trips=' + generateUrlByTrackingTrips() +
|
||||
'&tracking=' + generateUrlByTracking(page_no);
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$.ajax({
|
||||
url: url
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
});
|
||||
});
|
||||
|
||||
$('.tracking-trips__pagination-anchor').on('click', function(event) {
|
||||
event.preventDefault();
|
||||
const page_no = $(this).attr('data-ci-pagination-page');
|
||||
const url = $(this).attr('href') +
|
||||
'&tracking_trips=' + generateUrlByTrackingTrips(page_no) +
|
||||
'&tracking=' + generateUrlByTracking();
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$.ajax({
|
||||
url: url
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
});
|
||||
});
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#tracking-trips-form .form-group,
|
||||
#tracking-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.date,
|
||||
.duration,
|
||||
.distance {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,133 @@
|
||||
<div class="panel panel-flat" style="background-color: aliceblue;">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-lg-8">
|
||||
<!-- Current server load -->
|
||||
<div class="alert alert-danger mt-20" id="print-saved-trips-error-msg" style="display:none">
|
||||
<a href="#" class="close">×</a>
|
||||
<p id="saved-trips-error-msg"></p>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive mt-20">
|
||||
<div class="col-lg-12">
|
||||
<div>
|
||||
<form name="saved_trips_form" id="saved-trips-form" autocomplete="off">
|
||||
<div class="form-group">
|
||||
<div class="date">
|
||||
<label for="start_date" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="start_date" id="start_date" value="<?= $start_date ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<input type="search" name="end_date" id="end_date" value="<?= $end_date ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="address">
|
||||
<label for="start_address" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Address
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<div class="col-lg-6">
|
||||
<select type="text" class="form-control" id="start-address" />
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<select type="text" class="form-control" id="end-address" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="country">
|
||||
<label for="country" class="font-weight-bold col-lg-1 col-form-label">
|
||||
Country
|
||||
</label>
|
||||
<div class="col-lg-12">
|
||||
<?= $country_card ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<input type="button" name="search_saved_trips" id="search-saved-trips" value="Search" class="btn btn-info" />
|
||||
<input type="button" name="reset_saved_trips" id="reset-saved-trips" value="Reset" class="btn btn-warning" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="hidden" name="start_address" />
|
||||
<input type="hidden" name="end_address" />
|
||||
<input type="hidden" name="member_id" id="member_id" value=<?= $member_id ?> />
|
||||
</form>
|
||||
</div>
|
||||
<div class="panel-heading mb-10 mt-15">
|
||||
<div class="heading-elements">
|
||||
<div id="pagination-saved-trips"></div>
|
||||
</div>
|
||||
</div>
|
||||
<table id="saved-trips-list" class="table-bordered table-condensed table-hover table-striped table-condensed col-lg-12" style="padding:0px; background-color:aliceblue;">
|
||||
<thead class="bg-indigo">
|
||||
<th>ID</th>
|
||||
<th>Member ID</th>
|
||||
<th>Trip Name</th>
|
||||
<th>Trip From</th>
|
||||
<th>Trip To</th>
|
||||
<th>Country</th>
|
||||
<th>Trip Date</th>
|
||||
<th>Status</th>
|
||||
<th>Added</th>
|
||||
<th>Color</th>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<!-- Current server load -->
|
||||
<div class="panel">
|
||||
<div class="panel-body">
|
||||
<div id="carpool_send"></div>
|
||||
|
||||
<div id="carpool_sel">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /current server load -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/forms/selects/select2.min.js"></script>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script src="/assets/js/pages/saved_trips/list.js"></script>
|
||||
|
||||
<style>
|
||||
#saved-trips-form .form-group {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.date,
|
||||
.address {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.search-by-range div {
|
||||
padding: 1px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,535 @@
|
||||
<!-- Dashboard content -->
|
||||
<div class="row">
|
||||
<div class="col-lg-9">
|
||||
<div class="panel panel-flat">
|
||||
<div class="row">
|
||||
<form id="search-find-member" method="GET" action="/member/findmember">
|
||||
|
||||
<div class="col-lg-2">
|
||||
<?= $card_find_select ?>
|
||||
</div>
|
||||
<div class="col-lg-3">
|
||||
<?= $card_decision_group ?>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4">
|
||||
<input type="search" class="form-control" id="search_text" value="<?= isset($search_text) ? $search_text : '' ?>">
|
||||
</div>
|
||||
<div class="col-lg-1">
|
||||
<button type="button" class="btn btn-info btn-sm" id="extra-btn">Extra</button>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<button type="submit" class="btn btn-primary btn-sm btn-block" id="refresh-btn">Refresh</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-flat">
|
||||
<div class="table-responsive">
|
||||
<?= $member_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-flat">
|
||||
<div class="table-responsive"> <?= $link ?> </div>
|
||||
</div>
|
||||
<!-- /support tickets -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3">
|
||||
<!-- Recent Members -->
|
||||
<div class="panel panel-flat" style="background-color: #ccffff; height: 800px;">
|
||||
<div id="transp_detail">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title">View a member</h6>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recent Members -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /dashboard content -->
|
||||
|
||||
<!-- Filter Modal Start-->
|
||||
<div class="modal fade" id="filter-model" role="dialog" aria-labelledby="Filter data dialog">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<!-- Modal Header -->
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal">
|
||||
<span aria-hidden="true">×</span>
|
||||
<span class="sr-only">Close</span>
|
||||
</button>
|
||||
<h1>
|
||||
Filter Member
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<!-- Modal Body -->
|
||||
<div class="modal-body">
|
||||
<div class="container-fluid">
|
||||
|
||||
<form class="form-inline" role="form" id="filter_form" method="GET" action="/member/findmember">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="status">Status</label>
|
||||
<?= $card_status ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="status">Test</label>
|
||||
<?= $card_test ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="status">Country</label>
|
||||
<?= $card_country ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class=row>
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="status">Alert Notification</label>
|
||||
<?= $card_alert_notification ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="status">Alert Email</label>
|
||||
<?= $card_alert_email ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_added">Added</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_added" name="from_added" value='<?= isset($from_added) ? $from_added : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_added" name="to_added" value='<?= isset($to_added) ? $to_added : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_last_login">Last Login</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_last_login" name="from_last_login" value='<?= isset($from_last_login) ? $from_last_login : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_last_login" name="to_last_login" value='<?= isset($to_last_login) ? $to_last_login : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_last_acct">Last Acc</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_last_acct" name="from_last_acct" value='<?= isset($from_last_acct) ? $from_last_acct : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_last_acct" name="to_last_acct" value='<?= isset($to_last_acct) ? $to_last_acct : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_last_email">Last Email</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_last_email" name="from_last_email" value='<?= isset($from_last_email) ? $from_last_email : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_last_email" name="to_last_email" value='<?= isset($to_last_email) ? $to_last_email : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_last_audit">Last Audit</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_last_audit" name="from_last_audit" value='<?= isset($from_last_audit) ? $from_last_audit : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_last_audit" name="to_last_audit" value='<?= isset($to_last_audit) ? $to_last_audit : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_points_updated">Points Updated</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_points_updated" name="from_points_updated" value='<?= isset($from_points_updated) ? $from_points_updated : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_points_updated" name="to_points_updated" value='<?= isset($to_points_updated) ? $to_points_updated : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_updated">Updated</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_updated" name="from_updated" value='<?= isset($from_updated) ? $from_updated : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_updated" name="to_updated" value='<?= isset($to_updated) ? $to_updated : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_decision_updated">Decision Updated</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_decision_updated" name="from_decision_updated" value='<?= isset($from_decision_updated) ? $from_decision_updated : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_decision_updated" name="to_decision_updated" value='<?= isset($to_decision_updated) ? $to_decision_updated : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_gps_enabled">GPS Enabled</label>
|
||||
<div class="search-by-date">
|
||||
<input type="search" class="form-control" id="from_gps_enabled" name="from_gps_enabled" value='<?= isset($from_gps_enabled) ? $from_gps_enabled : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_gps_enabled" name="to_gps_enabled" value='<?= isset($to_gps_enabled) ? $to_gps_enabled : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_min_budget">Min Budget</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_min_budget" name="from_min_budget" value='<?= isset($from_min_budget) ? $from_min_budget : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_min_budget" name="to_min_budget" value='<?= isset($to_min_budget) ? $to_min_budget : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_max_budget">Max Budget</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_max_budget" name="from_max_budget" value='<?= isset($from_max_budget) ? $from_max_budget : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_max_budget" name="to_max_budget" value='<?= isset($to_max_budget) ? $to_max_budget : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_points">Points</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_points" name="from_points" value='<?= isset($from_points) ? $from_points : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_points" name="to_points" value='<?= isset($to_points) ? $to_points : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_count_acct">Count Acct</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_count_acct" name="from_count_acct" value='<?= isset($from_count_acct) ? $from_count_acct : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_count_acct" name="to_count_acct" value='<?= isset($to_count_acct) ? $to_count_acct : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_count_email">Count Email</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_count_email" name="from_count_email" value='<?= isset($from_count_email) ? $from_count_email : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_count_email" name="to_count_email" value='<?= isset($to_count_email) ? $to_count_email : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4">
|
||||
<div class="form-group">
|
||||
<label for="from_login_failures">Login Failure</label>
|
||||
<div class="search-by-numeric">
|
||||
<input type="search" class="form-control" id="from_login_failures" name="from_login_failures" value='<?= isset($from_login_failures) ? $from_login_failures : '' ?>'>
|
||||
|
||||
<input type="search" class="form-control" id="to_login_failures" name="to_login_failures" value='<?= isset($to_login_failures) ? $to_login_failures : '' ?>'>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="form-group">
|
||||
<label for="selected-city">City</label>
|
||||
<div class="city-filter">
|
||||
<select id="selected-city">
|
||||
<?= ! empty($city)
|
||||
? '<option selected value="' . $city . '">' . $city . '</option>'
|
||||
: ''
|
||||
?>
|
||||
</select>
|
||||
<button id="clear-city" type="button" class="btn btn-warning">Clear City</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-12" style="padding-top: 2rem;">
|
||||
<button id="extra-submit" type="button" class="btn btn-primary submitBtn">Submit</button>
|
||||
<button id="extra-clear" type="button" class="btn btn-danger">Clear</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Modal Footer -->
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--Filter Modal End-->
|
||||
|
||||
<script src="/assets/js/app.js" type="text/javascript"></script>
|
||||
<script src="/assets/js/plugins/forms/selects/select2.min.js"></script>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
var map;
|
||||
|
||||
function initMap() {
|
||||
map = new google.maps.Map(document.getElementById('map'), {
|
||||
center: {
|
||||
lat: 3.397,
|
||||
lng: 10.644
|
||||
},
|
||||
zoom: 3
|
||||
});
|
||||
}
|
||||
|
||||
var loaded_data = new Array();
|
||||
|
||||
function showTranspModal(service_request_id) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
// alert(service_request_id);
|
||||
// collect data - either from forms or from data variables
|
||||
var id = $(this).data('id');
|
||||
|
||||
// load the modal content with a loader gif and message
|
||||
$('#modal-content').html('Loading...');
|
||||
|
||||
// show modal window
|
||||
$('#modal_theme_primary').modal('show');
|
||||
//alert(5);
|
||||
// do the ajax bit
|
||||
var post_data = {
|
||||
'interest_id': service_request_id,
|
||||
};
|
||||
//alert(6);
|
||||
$.ajax({
|
||||
url: "/transp/transp_modal?service_request_id=" + service_request_id
|
||||
}).done(function(data) {
|
||||
//alert(data);
|
||||
//alert(7);
|
||||
$('#modal-content').html(data);
|
||||
//initialize_map();
|
||||
var myLatlng = new google.maps.LatLng(33.7489954, -84.3879824);
|
||||
var myOptions = {
|
||||
zoom: 13,
|
||||
center: myLatlng,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||||
};
|
||||
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
|
||||
directionsDisplay.setMap(map);
|
||||
directionsDisplay.setPanel(document.getElementById("directionsDiv"));
|
||||
|
||||
fitMapToBounds_map();
|
||||
|
||||
calcRoute(loaded_data[0], loaded_data[1]);
|
||||
//alert(loaded_data[0]);
|
||||
});
|
||||
}
|
||||
|
||||
function viewMember(member_id) {
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewmedberdetail?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function(data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
$("#extra-btn").on('click', function() {
|
||||
$("#filter-model").modal();
|
||||
})
|
||||
|
||||
// search-find-member press enter => submit search form
|
||||
$('#search-find-member #search_text').keyup(function (e) {
|
||||
if(e.which == 13) // the enter key code
|
||||
{
|
||||
$('#search-find-member #refresh-btn').click();
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
$('#refresh-btn').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const hidden_field =
|
||||
`<input type="hidden" name="search_text" value="${$('#search_text').val()}" />
|
||||
<input type="hidden" name="card_decision_group" value="${$('select[name=card_decision_group]').val()}" />
|
||||
<input type="hidden" name="card_find_select" value="${$('select[name=card_find_select]').val()}" />`;
|
||||
|
||||
$('#filter_form').append(hidden_field).submit();
|
||||
})
|
||||
|
||||
$('#extra-submit').on('click', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
let city_name = '';
|
||||
if (city.select2("data").length) {
|
||||
city_name = city.select2("data")[0].text;
|
||||
}
|
||||
|
||||
const hidden_field =
|
||||
`<input type="hidden" name="search_text" value="${$('#search_text').val()}" />
|
||||
<input type="hidden" name="card_decision_group" value="${$('select[name=card_decision_group]').val()}" />
|
||||
<input type="hidden" name="card_find_select" value="${$('select[name=card_find_select]').val()}" />
|
||||
<input type="hidden" name="city" value="${city_name}" />`;
|
||||
|
||||
$('#filter_form').append(hidden_field).submit();
|
||||
})
|
||||
|
||||
const city = $("#selected-city").select2({
|
||||
placeholder: "Search By City",
|
||||
maximumSelectionSize: 1,
|
||||
minimumInputLength: 3,
|
||||
ajax: {
|
||||
url: "/geofence_area_city/getCities",
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
delay: 250,
|
||||
data: function(params) {
|
||||
const query = {
|
||||
search_text: params.term,
|
||||
page: params.page || 1
|
||||
};
|
||||
return query;
|
||||
},
|
||||
processResults: function(res, params) {
|
||||
const {
|
||||
data,
|
||||
total
|
||||
} = res;
|
||||
params.page = params.page || 1;
|
||||
return {
|
||||
results: data.map(item => ({
|
||||
id: item.id,
|
||||
text: item.city_name
|
||||
})),
|
||||
pagination: {
|
||||
more: params.page * 20 < +total
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
// add library datepicker
|
||||
addDatePicker('.search-by-date input');
|
||||
|
||||
// clear extra form
|
||||
$("#extra-clear").on('click', function() {
|
||||
const form = $(this).closest('form');
|
||||
form.find("input[type=search]").val("");
|
||||
form.find("select").val("-1");
|
||||
form.find("select[name=card_country]").val("");
|
||||
|
||||
});
|
||||
|
||||
// only clear city field
|
||||
$("#clear-city").on('click', function() {
|
||||
$('#selected-city').empty();
|
||||
});
|
||||
|
||||
$(window).keydown(function(event){
|
||||
if(event.keyCode == 13) {
|
||||
event.preventDefault();
|
||||
return false;
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=<?= $google_api_key ?>&callback=initMap" async defer></script>
|
||||
<style>
|
||||
.search-by-date,
|
||||
.search-by-numeric {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.search-by-date input,
|
||||
.search-by-numeric input {
|
||||
width: 7.1em !important;
|
||||
}
|
||||
|
||||
.form-inline .form-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#filter_form .row {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.city-filter {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#clear-city {
|
||||
left: 5px;
|
||||
}
|
||||
|
||||
@media (min-width: 769px) {
|
||||
.modal-dialog {
|
||||
width: 700px;
|
||||
margin: 30px auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,172 @@
|
||||
<!-- Dashboard content -->
|
||||
<div class="row">
|
||||
<div class="panel panel-flat">
|
||||
<?= $member_table ?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
foreach ($member_items as $mitm) {
|
||||
echo "<button style='padding:2px; font-size:11px;' type=\"button\" onclick=\"viewMemberAction('" . $mitm[0] . "',{$member_id});\" class=\"btn {$mitm[2]} btn-sm\">" . $mitm[1] . "</button>";
|
||||
}
|
||||
?>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
|
||||
<div class="col-lg-12">
|
||||
<!-- Recent Members -->
|
||||
<div class="panel panel-flat" style="background-color: #ccffff;">
|
||||
<div class="table-responsive">
|
||||
<div id="transp_detail">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title">Recent Travel Tracking</h6>
|
||||
<div class="heading-elements">
|
||||
<span class="heading-text">Last: <span class="text-bold text-danger-600 position-right">PUT TIME HERE</span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<div id="map" style="border:1px;border-style: dotted; height:750px;"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recent Members -->
|
||||
</div>
|
||||
|
||||
<div class="col-lg-12">
|
||||
<!-- Recent Members -->
|
||||
<div class="panel panel-flat" style="background-color: #ccffff;">
|
||||
<?=$member_analysis?>
|
||||
</div>
|
||||
<!-- /Recent Members -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- /dashboard content -->
|
||||
|
||||
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
var map;
|
||||
function initMap() {
|
||||
map = new google.maps.Map(document.getElementById('map'), {
|
||||
center: {lat: 3.397, lng: 10.644},
|
||||
zoom: 3
|
||||
});
|
||||
}
|
||||
|
||||
var loaded_data = new Array();
|
||||
function showTranspModal(service_request_id) {
|
||||
if (typeof event !== 'undefined') {
|
||||
event.preventDefault();
|
||||
}
|
||||
// alert(service_request_id);
|
||||
// collect data - either from forms or from data variables
|
||||
var id = $(this).data('id');
|
||||
|
||||
// load the modal content with a loader gif and message
|
||||
$('#modal-content').html('Loading...');
|
||||
|
||||
// show modal window
|
||||
$('#modal_theme_primary').modal('show');
|
||||
//alert(5);
|
||||
// do the ajax bit
|
||||
var post_data = {
|
||||
'interest_id': service_request_id,
|
||||
};
|
||||
//alert(6);
|
||||
$.ajax({
|
||||
url: "/transp/transp_modal?service_request_id=" + service_request_id
|
||||
}).done(function (data) {
|
||||
//alert(data);
|
||||
//alert(7);
|
||||
$('#modal-content').html(data);
|
||||
//initialize_map();
|
||||
var myLatlng = new google.maps.LatLng(33.7489954, -84.3879824);
|
||||
var myOptions = {
|
||||
zoom: 13,
|
||||
center: myLatlng,
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP};
|
||||
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
|
||||
directionsDisplay.setMap(map);
|
||||
directionsDisplay.setPanel(document.getElementById("directionsDiv"));
|
||||
|
||||
fitMapToBounds_map();
|
||||
|
||||
calcRoute(loaded_data[0], loaded_data[1]);
|
||||
//alert(loaded_data[0]);
|
||||
});
|
||||
}
|
||||
|
||||
function viewMemberAction(action_name, member_id) {
|
||||
return viewMemberActionLimitOffset(action_name, member_id, 50, 0);
|
||||
}
|
||||
|
||||
function viewMemberActionLimitOffset(action_name, member_id, limit, offset, params){
|
||||
let params_str = '';
|
||||
if(typeof params == 'object' && Object.keys(params).length>0){
|
||||
params_str = '&'+jQuery.param( params );
|
||||
}
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
var callURL = "/member/viewMemberAction?proc=PROCESS&action_name="+action_name+"&member_id=" + member_id;
|
||||
callURL += "&limit=" + limit + "&offset=" + offset + params_str;
|
||||
|
||||
$.ajax({
|
||||
url: callURL
|
||||
}).done(function (data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function viewMember(member_id) {
|
||||
|
||||
$('#transp_detail').html('Processing...');
|
||||
$('#acc' + member_id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/viewmember?proc=PROCESS&member_id=" + member_id
|
||||
}).done(function (data) {
|
||||
$('#transp_detail').html(data);
|
||||
$('#acc' + member_id).prop('disabled', false);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function viewParse(id) {
|
||||
if (!confirm('Are you sure you want to parse this item again?')) return false;
|
||||
//$('#transp_detail').html('Processing...');
|
||||
$('#parseButton' + id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/parse?id=" + id
|
||||
}).done(function (data) {
|
||||
//$('#transp_detail').html(data);
|
||||
$('#parseButton' + id).prop('disabled', false);
|
||||
alert(data);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
function viewAdvice(id) {
|
||||
if (!confirm('Are you sure you want to run this item through transport vendor price estimates now?')) return false;
|
||||
//$('#transp_detail').html('Processing...');
|
||||
$('#adviceButton' + id).prop('disabled', true);
|
||||
$.ajax({
|
||||
url: "/member/advice?id=" + id
|
||||
}).done(function (data) {
|
||||
//$('#transp_detail').html(data);
|
||||
$('#adviceButton' + id).prop('disabled', false);
|
||||
alert(data);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
//initMap();
|
||||
</script>
|
||||
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDvjiRTxngOQyBP4zpqFlZuiquc0ROvo9c&callback=initMap" async defer></script>
|
||||
|
||||
|
||||
@@ -0,0 +1,320 @@
|
||||
<link rel="stylesheet" href="/assets/css/query-builder.default.min.css">
|
||||
<div id="overlay" style="display:none;">
|
||||
<div class="spinner"></div>
|
||||
<br />
|
||||
Exporting...
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="panel panel-white">
|
||||
<div class="search-section">
|
||||
<form id="tracked-email-form" action='/member/trackedemail_search' method='GET' autocomplete="off">
|
||||
<div class="form-group">
|
||||
<div class="created form-group__item">
|
||||
<label for="subject" class="font-weight-bold col-form-label">
|
||||
Created
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<input type="search" name="start_created" id="start_created" value="<?= isset($start_created) ? $start_created : '' ?>" class="form-control" />
|
||||
<input type="search" name="end_created" id="end_created" value="<?= isset($end_created) ? $end_created : '' ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="message_date form-group__item">
|
||||
<label for="subject" class="font-weight-bold col-form-label">
|
||||
Message Date
|
||||
</label>
|
||||
<div class="search-by-range">
|
||||
<input type="search" name="start_message_date" id="start_message_date" value="<?= isset($start_message_date) ? $start_message_date : '' ?>" class="form-control" />
|
||||
<input type="search" name="end_message_date" id="end_message_date" value="<?= isset($end_message_date) ? $end_message_date : '' ?>" class="form-control" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="member_id_filter form-group__item">
|
||||
<label for="member_id_filter" class="font-weight-bold col-form-label">
|
||||
Member ID
|
||||
</label>
|
||||
<input type="search" name="member_id_filter" id="member_id_filter" value="<?= isset($member_id_filter) ? $member_id_filter : '' ?>" class="form-control" />
|
||||
</div>
|
||||
<div class="subject form-group__item">
|
||||
<label for="subject" class="font-weight-bold col-form-label">
|
||||
Subject
|
||||
</label>
|
||||
<input type="search" name="subject" id="subject" value="<?= isset($subject) ? $subject : '' ?>" class="form-control" />
|
||||
</div>
|
||||
|
||||
<div class="sender form-group__item">
|
||||
<label for="message_from" class="font-weight-bold col-form-label">
|
||||
Sender
|
||||
</label>
|
||||
<input type="search" name="message_from" id="message_from" value="<?= isset($message_from) ? $message_from : '' ?>" class="form-control" />
|
||||
</div>
|
||||
|
||||
<input type="hidden" id="sql_raw" name="sql_raw" value="<?= isset($sql_raw) ? $sql_raw : '' ?>">
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="query-builder" class="col-lg-6">
|
||||
<div id="builder"></div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<input type="button" name="search" id="search" value="Search" class="btn btn-info" />
|
||||
<input type="button" id="exportZIP" value="Export" class="btn btn-warning" />
|
||||
</div>
|
||||
|
||||
<span style="color:red" id="message"></span>
|
||||
</div>
|
||||
|
||||
<div class="row col-lg-12 mt-10">
|
||||
<?= isset($link) ? $link : '' ?>
|
||||
<div class="panel" style="overflow: auto">
|
||||
<?= $tracked_email_table ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script src="/assets/js/app.js"></script>
|
||||
<script src="/assets/js/query-builder.standalone.min.js"></script>
|
||||
<script src="/assets/js/plugins/forms/tags/tokenfield.min.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
// submit form when press enter
|
||||
$("#tracked-email-form input").keyup(function(e){
|
||||
if(e.which == 13 && !['end_created','start_message_date','end_message_date','start_created'].includes(e.target.id)){
|
||||
$('#search').click();
|
||||
}
|
||||
});
|
||||
$('#search').on('click', function(e) {
|
||||
e.preventDefault()
|
||||
append_sql_raw_to_submit_form()
|
||||
|
||||
$('#tracked-email-form')
|
||||
.attr('method', 'GET')
|
||||
.submit()
|
||||
})
|
||||
|
||||
$('#exportZIP').on('click', function(e) {
|
||||
$('#message').empty();
|
||||
e.preventDefault();
|
||||
|
||||
append_sql_raw_to_submit_form();
|
||||
|
||||
if ($('#member_id_filter').val().trim() === '') {
|
||||
$('#message').append('<b>Please input Member ID</b>');
|
||||
return;
|
||||
}
|
||||
|
||||
$('#overlay').fadeIn();
|
||||
|
||||
export_zip_file()
|
||||
.then((data) => {})
|
||||
.catch(error => {
|
||||
|
||||
$('message').append('<b>Something went wrong !!!</b>');
|
||||
|
||||
}).finally(() => {
|
||||
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
});
|
||||
})
|
||||
|
||||
function export_zip_file() {
|
||||
return new Promise(function(resolve, reject) {
|
||||
const params = {
|
||||
proc: 'PROCESS',
|
||||
action_name: 'EMAILRECIP',
|
||||
filters: $('#tracked-email-form').serialize()
|
||||
};
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.onerror = function() {
|
||||
reject(Error("Network Error"));
|
||||
};
|
||||
|
||||
xhr.open('POST', '/member/trackedemail_export_zip', true);
|
||||
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
|
||||
xhr.onload = function() {
|
||||
if (xhr.status == 200) {
|
||||
// get file name
|
||||
let filename = "";
|
||||
const disposition = xhr.getResponseHeader('Content-Disposition');
|
||||
if (disposition && disposition.indexOf('attachment') !== -1) {
|
||||
const filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
|
||||
const matches = filenameRegex.exec(disposition);
|
||||
if (matches != null && matches[1]) {
|
||||
filename = matches[1].replace(/['"]/g, '');
|
||||
}
|
||||
}
|
||||
|
||||
let a = document.createElement('a');
|
||||
let url = window.URL.createObjectURL(this.response);
|
||||
a.href = url;
|
||||
a.download = filename;
|
||||
document.body.append(a);
|
||||
a.click();
|
||||
a.remove();
|
||||
|
||||
resolve(xhr.response);
|
||||
} else if (xhr.status == 404) {
|
||||
|
||||
$('#message').append(`<b>Data Not Found!!!</b>`);
|
||||
$('#overlay').fadeOut();
|
||||
|
||||
} else {
|
||||
|
||||
reject(Error(xhr.statusText));
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
xhr.responseType = 'blob';
|
||||
xhr.send(new URLSearchParams(params).toString());
|
||||
})
|
||||
}
|
||||
|
||||
// input multi value
|
||||
$('#member_id_filter').tokenfield()
|
||||
|
||||
addDatePicker(
|
||||
`#start_created,
|
||||
#end_created,
|
||||
#start_message_date,
|
||||
#end_message_date`
|
||||
);
|
||||
|
||||
// query builder
|
||||
let DOMCACHESTORE = {};
|
||||
DOMCACHE = {
|
||||
get: function(selector, force) {
|
||||
if (DOMCACHESTORE[selector] !== undefined && !force) {
|
||||
return DOMCACHESTORE[selector];
|
||||
}
|
||||
|
||||
DOMCACHESTORE[selector] = $(selector);
|
||||
return DOMCACHESTORE[selector];
|
||||
}
|
||||
};
|
||||
|
||||
const _filters = [
|
||||
{
|
||||
id: 'DATE(date_parsed)',
|
||||
label: 'date_parsed',
|
||||
type: 'date',
|
||||
placeholder: '____/__/__',
|
||||
validation: {
|
||||
format: 'YYYY/MM/DD'
|
||||
},
|
||||
operators: ['is_null', 'is_not_null']
|
||||
}
|
||||
]
|
||||
|
||||
let init_builder_query = {
|
||||
filters: _filters,
|
||||
conditions: ['AND'],
|
||||
default_group_flags: {
|
||||
// condition_readonly: true,
|
||||
no_add_group: true,
|
||||
no_delete: true
|
||||
}
|
||||
}
|
||||
|
||||
// If sql_raw is empty then clear localstorage
|
||||
if (window.getURLParameter(window.location.href, 'sql_raw') === null) {
|
||||
window.localStorage.removeItem('rules');
|
||||
}
|
||||
|
||||
const rule_basics =
|
||||
JSON.parse(window.localStorage.getItem('rules'));
|
||||
|
||||
if (rule_basics) {
|
||||
init_builder_query.rules = rule_basics;
|
||||
}
|
||||
|
||||
DOMCACHE.get('#builder').queryBuilder(init_builder_query)
|
||||
|
||||
// Fix for Bootstrap Datepicker
|
||||
DOMCACHE.get('#builder').on('afterUpdateRuleValue.queryBuilder', function(e, rule) {
|
||||
const date_picker = [
|
||||
'date_parsed'
|
||||
]
|
||||
|
||||
if (date_picker.indexOf(rule.filter.label) !== -1) {
|
||||
addDatePicker(rule.$el.find('.rule-value-container input'));
|
||||
}
|
||||
})
|
||||
|
||||
// query builder
|
||||
function append_sql_raw_to_submit_form() {
|
||||
// set sql_raw to hidden item
|
||||
const result = DOMCACHE.get('#builder').queryBuilder('getSQL');
|
||||
window.localStorage.setItem(
|
||||
'rules',
|
||||
JSON.stringify(DOMCACHE.get('#builder').queryBuilder('getRules'))
|
||||
);
|
||||
|
||||
if (result !== null && result.sql.length) {
|
||||
DOMCACHE
|
||||
.get('#tracked-email-form')
|
||||
.find('#sql_raw')
|
||||
.val(result.sql);
|
||||
} else {
|
||||
DOMCACHE
|
||||
.get('#tracked-email-form')
|
||||
.find('#sql_raw')
|
||||
.val('');
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style>
|
||||
.search-section {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
}
|
||||
.form-group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.search-by-range {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#overlay {
|
||||
background: #ffffff;
|
||||
color: #666666;
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 5000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
float: left;
|
||||
text-align: center;
|
||||
padding-top: 25%;
|
||||
opacity: .80;
|
||||
}
|
||||
|
||||
.spinner {
|
||||
margin: 0 auto;
|
||||
height: 64px;
|
||||
width: 64px;
|
||||
animation: rotate 0.8s infinite linear;
|
||||
border: 5px solid firebrick;
|
||||
border-right-color: transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user