first commit
This commit is contained in:
@@ -0,0 +1,520 @@
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<link rel="stylesheet" href="/assets/css/query-builder.default.min.css">
|
||||
<div id="overlay" style="display:none;">
|
||||
<div class="spinner"></div>
|
||||
<br />
|
||||
Importing...
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-11">
|
||||
<div class="panel panel-flat">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title">Get Quote</h6>
|
||||
<div class="heading-elements">
|
||||
<a href="/bkoreport/quote">Recent</a>
|
||||
| <a href="/bkoreport/quotes">Aggregate</a>
|
||||
| <a href="/bkoreport/totalquotes">Total</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="getquote" class="table-responsive" style="background-color:#CEE0D7;">
|
||||
<div style="margin-left:20px;width:800px;">
|
||||
<span style="color:red"><b><?=isset($message) ? $message : '' ?></b></span>
|
||||
<form method="get" action="/bkoreport/quote" id="search-form">
|
||||
<input type="hidden" name="from" id="from" value="<?= isset($from) ? $from : '' ?>">
|
||||
<input type="hidden" name="to" id="to" value="<?= isset($to) ? $to : '' ?>">
|
||||
<fieldset>
|
||||
<table width="100%">
|
||||
<tr>
|
||||
<th style="text-align:right;">Origin:</th>
|
||||
<td><input type="text" class="form-control" name="address_from" id="autofrom" value="<?= isset($address_from) ? $address_from : '' ?>" size="20"></td>
|
||||
<th style="text-align:right;">Country:</th>
|
||||
<td><?= $card_country ?></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th style="text-align:right;">Destination:</th>
|
||||
<td><input type="text" class="form-control" name="address_to" id="autoto" value="<?= isset($address_to) ? $address_to : '' ?>" size="20"></td>
|
||||
<th style="text-align:right;">Provider:</th>
|
||||
<td><?= $card_transport_provider ?></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th style="text-align:right;">Quote Source: </th>
|
||||
<td><?= $card_prefill ?></td>
|
||||
<td colspan="2" style="text-align:right;">
|
||||
<input type="button" name="quote" data-action="quote" value="Quote" />
|
||||
<input type="button" name="filter" data-action="quote" value="Filter" />
|
||||
<input type="button" name="export" data-action="exportCSV" value="Export" /></td>
|
||||
</tr>
|
||||
<tr></tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<input type="hidden" id="sql_raw" name="sql_raw" value="<?= isset($sql_raw) ? $sql_raw : '' ?>">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recent Members -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="query-builder">
|
||||
<div id="builder"></div>
|
||||
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-primary parse-sql" data-target="import_export" data-stmt="false" id="btn-parse-sql">
|
||||
Apply
|
||||
</button>
|
||||
<button class="btn btn-warning reset" id="btn-reset" data-target="basic">Reset</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="container">
|
||||
<div class="import-group">
|
||||
<form id="form-upload">
|
||||
<div class="member">
|
||||
<label>Member ID</label>
|
||||
<input type="text" class="form-control" name="member_id" maxlength=10>
|
||||
</div>
|
||||
<div class="file-upload">
|
||||
<span id="pickfiles">[Choose files]</span>
|
||||
<input type="button" id="btn-upload" class="btn btn-warning btn-sm" value="Upload">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="filelist"></div>
|
||||
<div id="import-message"></div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<!-- Recent Members -->
|
||||
<div class="panel panel-flat" style="background-color:#CEE0D7;">
|
||||
<div class="panel-heading">
|
||||
<h6 class="panel-title">Recent Quotes</h6>
|
||||
<div class="heading-elements">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<?= $link ?>
|
||||
<div id="quotes" class="table-responsive">
|
||||
<?= $quotes_table ?>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /Recent Members -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
function checkQuote(id, btn) {
|
||||
if (id > 0) {
|
||||
//document.location = '/bkoreport/checkQuote?id='+id;
|
||||
btn.disabled = true;
|
||||
$.ajax({
|
||||
url: "/bkoreport/checkQuote?id=" + id
|
||||
}).done(function(data) {
|
||||
btn.disabled = false;
|
||||
$('#check' + id).html(data);
|
||||
});
|
||||
}
|
||||
return false;
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- jQuery UI -->
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script type='text/javascript'>
|
||||
$(document).ready(function() {
|
||||
console.log('aaaa');
|
||||
// Initialize
|
||||
$("#autofrom").autocomplete({
|
||||
source: function(request, response) {
|
||||
console.log('bbbb');
|
||||
// Fetch data
|
||||
$.ajax({
|
||||
url: "/bkoreport/addresssearch",
|
||||
type: 'post',
|
||||
dataType: "json",
|
||||
data: {
|
||||
search: request.term
|
||||
},
|
||||
success: function(data) {
|
||||
response(data);
|
||||
},
|
||||
error: function(data) {
|
||||
console.log(data);
|
||||
}
|
||||
});
|
||||
},
|
||||
select: function(event, ui) {
|
||||
// Set selection
|
||||
$('#autofrom').val(ui.item.label); // display the selected text
|
||||
$('#from').val(ui.item.value); // save selected id to input
|
||||
return false;
|
||||
}
|
||||
});
|
||||
$("#autoto").autocomplete({
|
||||
source: function(request, response) {
|
||||
// Fetch data
|
||||
$.ajax({
|
||||
url: "/bkoreport/addresssearch",
|
||||
type: 'post',
|
||||
dataType: "json",
|
||||
data: {
|
||||
search: request.term
|
||||
},
|
||||
success: function(data) {
|
||||
response(data);
|
||||
}
|
||||
});
|
||||
},
|
||||
select: function(event, ui) {
|
||||
// Set selection
|
||||
$('#autoto').val(ui.item.label); // display the selected text
|
||||
$('#to').val(ui.item.value); // save selected id to input
|
||||
return false;
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
<script src="/assets/js/query-builder.standalone.min.js"></script>
|
||||
<script src="/assets/js/plugins/pickers/datepicker.js"></script>
|
||||
<script src="/assets/js/app.js"></script>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
let DOMCACHESTORE = {};
|
||||
DOMCACHE = {
|
||||
get: function(selector, force) {
|
||||
if (DOMCACHESTORE[selector] !== undefined && !force) {
|
||||
return DOMCACHESTORE[selector];
|
||||
}
|
||||
|
||||
DOMCACHESTORE[selector] = $(selector);
|
||||
return DOMCACHESTORE[selector];
|
||||
}
|
||||
};
|
||||
|
||||
const _filters = [
|
||||
{
|
||||
id: 'a.id',
|
||||
label: 'ID',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'transport_provider_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'automation_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'cost_raw',
|
||||
type: 'string'
|
||||
},
|
||||
{
|
||||
id: 'cost',
|
||||
type: 'double'
|
||||
},
|
||||
{
|
||||
id: 'DATE(created)',
|
||||
label: 'created',
|
||||
type: 'date',
|
||||
placeholder: '____-__-__',
|
||||
validation: {
|
||||
format: 'YYYY/MM/DD'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'DATE(completed)',
|
||||
label: 'completed',
|
||||
type: 'date',
|
||||
placeholder: '____-__-__',
|
||||
validation: {
|
||||
format: 'YYYY/MM/DD'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'member_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'location_start_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'location_end_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'quote_group_id',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'a.prefill',
|
||||
label: 'Data Source',
|
||||
type: 'string',
|
||||
input: 'select',
|
||||
values: {
|
||||
'f' : 'Application',
|
||||
't': 'Automatic'
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 'pool',
|
||||
type: 'integer'
|
||||
},
|
||||
{
|
||||
id: 'DATE(travel_date)',
|
||||
label: 'travel_date',
|
||||
type: 'date',
|
||||
placeholder: '____-__-__',
|
||||
validation: {
|
||||
format: 'YYYY/MM/DD'
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
let init_builder_query = {
|
||||
filters: _filters,
|
||||
}
|
||||
|
||||
// If sql_raw is empty then clear localstorage
|
||||
if (window.getURLParameter(window.location.href, 'sql_raw') === null) {
|
||||
window.localStorage.clear();
|
||||
}
|
||||
|
||||
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)
|
||||
|
||||
$('#btn-parse-sql').on('click', function() {
|
||||
const result = DOMCACHE.get('#builder').queryBuilder('getSQL');
|
||||
|
||||
window.localStorage.setItem(
|
||||
'rules',
|
||||
JSON.stringify(DOMCACHE.get('#builder').queryBuilder('getRules'))
|
||||
);
|
||||
|
||||
if (result.sql.length) {
|
||||
DOMCACHE
|
||||
.get('#search-form')
|
||||
.children('#sql_raw')
|
||||
.val(result.sql);
|
||||
DOMCACHE
|
||||
.get('#search-form')
|
||||
.attr('action', 'quote')
|
||||
.submit();
|
||||
}
|
||||
});
|
||||
|
||||
$('#btn-reset').on('click', function() {
|
||||
DOMCACHE.get('#builder').queryBuilder('reset');
|
||||
$('#sql_raw').val('');
|
||||
});
|
||||
|
||||
// Fix for Bootstrap Datepicker
|
||||
DOMCACHE.get('#builder').on('afterUpdateRuleValue.queryBuilder', function(e, rule) {
|
||||
const date_picker = [
|
||||
'created',
|
||||
'completed',
|
||||
'travel_date'
|
||||
]
|
||||
|
||||
if (date_picker.indexOf(rule.filter.label) !== -1) {
|
||||
addDatePicker(rule.$el.find('.rule-value-container input'));
|
||||
}
|
||||
})
|
||||
|
||||
DOMCACHE.get('#search-form').on('click', 'input[type="button"]', function() {
|
||||
const action = $(this).data('action');
|
||||
DOMCACHE.get('#search-form').attr('action', `/bkoreport/${action}`).submit();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
<!-- upload and import file -->
|
||||
<script src="/assets/js/plupload.full.min.js"></script>
|
||||
<script>
|
||||
window.addEventListener("load", function() {
|
||||
let uploader = new plupload.Uploader({
|
||||
runtimes: 'html5',
|
||||
browse_button: 'pickfiles',
|
||||
container: document.getElementById('container'),
|
||||
url: '/bkoreport/upload',
|
||||
chunk_size: '200kb',
|
||||
max_retries: 2,
|
||||
filters: {
|
||||
max_file_size: '50mb',
|
||||
mime_types: [{
|
||||
title: "CSV files",
|
||||
extensions: "csv"
|
||||
}]
|
||||
},
|
||||
init: {
|
||||
PostInit: function() {
|
||||
document.getElementById('filelist').innerHTML = '';
|
||||
},
|
||||
FilesAdded: function(up, files) {
|
||||
$("#import-message").text('');
|
||||
plupload.each(files, function(file) {
|
||||
document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
|
||||
});
|
||||
},
|
||||
UploadProgress: function(up, file) {
|
||||
document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
|
||||
},
|
||||
Error: function(up, err) {
|
||||
// DO YOUR ERROR HANDLING!
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
uploader.bind('FileUploaded', function() {
|
||||
// After file uploaded , send signal to insert all records
|
||||
removeFile();
|
||||
$('#overlay').fadeIn();
|
||||
$.ajax({
|
||||
url: '/bkoreport/importCSV',
|
||||
method: 'POST',
|
||||
dataType: 'JSON',
|
||||
data: {
|
||||
'member_id' : $('input[name="member_id"]').val()
|
||||
},
|
||||
success: function(data) {
|
||||
$("#import-message").text(data.message);
|
||||
},
|
||||
error: function(err) {
|
||||
$("#import-message").text('Something went wrong !!!');
|
||||
},
|
||||
complete: function() {
|
||||
$('#overlay').fadeOut();
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
uploader.init()
|
||||
|
||||
function removeFile() {
|
||||
$.each(uploader.files, function (i, file) {
|
||||
if (file) {
|
||||
uploader.removeFile(file);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// validate upload form
|
||||
$("#form-upload").validate({
|
||||
rules: {
|
||||
member_id: {
|
||||
required: true,
|
||||
number: true
|
||||
}
|
||||
},
|
||||
messages: {
|
||||
member_id: {
|
||||
required: 'Please input Member ID',
|
||||
number: 'Please input number'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$('#btn-upload').on('click', function(e) {
|
||||
$('#import-message').text('');
|
||||
|
||||
if (uploader.files.length === 0) {
|
||||
$('#import-message').text('Please choose a file !!!');
|
||||
return;
|
||||
}
|
||||
|
||||
if ( ! uploader.files[0].size) {
|
||||
$('#import-message').text('File is empty');
|
||||
removeFile();
|
||||
return;
|
||||
}
|
||||
|
||||
if ( ! $("#form-upload").valid()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uploader.start();
|
||||
})
|
||||
|
||||
});
|
||||
</script>
|
||||
<!-- upload and import file -->
|
||||
<style>
|
||||
#query-builder {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.btn-group {
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
#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);
|
||||
}
|
||||
}
|
||||
|
||||
#form-upload {
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
margin-bottom: 1rem;
|
||||
width: 33rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
input[name='member_id'] {
|
||||
width: 16rem;
|
||||
}
|
||||
|
||||
.file-upload {
|
||||
position: absolute;
|
||||
left: 17rem;
|
||||
top: 3.2rem;
|
||||
}
|
||||
|
||||
.import-group {
|
||||
padding: 10px;
|
||||
padding-bottom: 6px;
|
||||
border: 1px solid #dcc896;
|
||||
background: rgba(250,240,210,.5);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user