hdwpos/store/view/view-store.js

629 lines
26 KiB
JavaScript

"use strict";
// Class definition
var KTStoreView = function () {
// Shared variables
var storeId
var ipAddress
var inputIpAddress = document.getElementById("hb_storeIpAddress");
var butIpAddress = document.getElementById("but_storeIpAddress"); //
// dt Item
var datatableItem;
var tableItem = document.getElementById('kt_dt_item');
var statusItem = document.getElementById('kt_dt_item_status');
// dt Item option
var datatableItemOptions
var tableItemOptions = document.getElementById('kt_dt_item_options');
var statusItemOptions = document.getElementById('kt_dt_item_options_status');
// dt Item price
var datatableItemPrice;
var tableItemPrice = document.getElementById('kt_dt_item_price');
var statusItemPrice = document.getElementById('kt_dt_item_price_status');
// dt Item stock
var datatableItemStock;
var tableItemStock = document.getElementById('kt_dt_item_stock');
var statusItemStock = document.getElementById('kt_dt_item_stock_status');
// dt Store version
var datatableStoreVersion;
var tableStoreVersion = document.getElementById('kt_dt_store_version');
var statusStoreVersion = document.getElementById('kt_dt_store_version_status');
// dt Store sequence
var datatableStoreSequence;
var tableStoreSequence = document.getElementById('kt_dt_store_sequence');
var statusStoreSequence = document.getElementById('kt_dt_store_sequence_status');
// dt Store signature
var datatableStoreSignature;
var tableStoreSignature = document.getElementById('kt_dt_store_signature');
var statusStoreSignature = document.getElementById('kt_dt_store_signature_status');
// Init store view page
var initStoreView = () => {
var tabs = Array.prototype.slice.call(document.querySelectorAll('a[data-bs-toggle="tab"]'));
tabs.map(function(tab){
tab.addEventListener('click', function(e){
var target = this.getAttribute("href"); // activated tab
if (target == '#kt_store_item') {
// null
} else if (target == '#kt_store_general') {
loadStoreVersion();
} else if (target == '#kt_store_admin') {
loadStoreSequence();
loadStoreSignature();
}
});
});
// call StoreDetails API
fetch(config.apiBaseURL + "/stores/getStoreDetails?dbHost="+ipAddress+"&storeId="+storeId)
.then(response => response.json())
.then(data => {
debugger;
document.getElementById('hb_storePhoto').style.backgroundImage = "url('" + data.store.photoLink + "')";
document.getElementById("hb_storeTitle").innerText = data.store.id_structure + " - " + data.store.nom;
document.getElementById("hb_storeIpAddress").value = ipAddress;
document.getElementById("hb_storePhoneNumber").innerText = data.store.telephone;
document.getElementById("hb_storeEnseigne").innerText = data.store.enseigne;
// Display backOffice transaction informations
var statusTransaction = document.getElementById("hb_backOfficeTransactionOk");
if (data.transaction.backOfficeTransactionOk==true) {
statusTransaction.classList.add("bg-success");
document.getElementById("hb_backOfficeBusinessDate").classList.add("text-gray-800");
} else {
statusTransaction.classList.add("bg-danger");
document.getElementById("hb_backOfficeBusinessDate").classList.add("text-danger");
}
document.getElementById("hb_backOfficeTransactions").innerText = data.transaction.backOfficeTransactions;
document.getElementById("hb_minBackOfficeTransactionDate").innerText = data.transaction.minBackOfficeTransactionDate;
document.getElementById("hb_maxBackOfficeTransactionDate").innerText = data.transaction.maxBackOfficeTransactionDate;
document.getElementById("hb_backOfficeBusinessDate").innerText = data.transaction.backOfficeBusinessDate;
// Display replication informations
var statusReplication = document.getElementById("hb_pendingReplicationOk");
if (data.replication.pendingReplicationOk) {
statusReplication.classList.add("bg-success");
} else {
statusReplication.classList.add("bg-danger");
}
document.getElementById("hb_pendingReplications").innerText = data.replication.pendingReplications;
document.getElementById("hb_minPendingReplicationDate").innerText = data.replication.minPendingReplicationDate;
document.getElementById("hb_maxPendingReplicationDate").innerText = data.replication.maxPendingReplicationDate;
})
.catch(error => {
console.error('Error retrieving store details:', error);
});
}
const loadItem = (itemId) => {
if (!$.fn.dataTable.isDataTable('#kt_dt_item') ) {
statusItem.innerHTML = 'Loading...';
// call StoreDetails API
datatableItem = $(tableItem).DataTable({
info: false,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: false,
autoWidth: false,
fixedColumns: {
left: 1
},
ajax: {
"url": config.apiBaseURL + "/items/" + itemId,
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusItem, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'itemId', name: "ITEM_ID" },
{ data: 'itemLevelCode', name: "LEVEL" },
{ data: 'parentItemId', name: "PARENT" },
{ data: 'itemTypeCode', name: "TYPE" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
] ,
initComplete: function () {
dtUpdateStatus(statusItem, "Last refresh", "", false)
}
});
} else {
statusItem.innerHTML = 'Loading...';
datatableItem.ajax.url(config.apiBaseURL + "/items/" + itemId);
datatableItem.ajax.reload(function() {
dtUpdateStatus(statusItem, "Last refresh", "", false)
}, true);
}
}
const loadItemOptions = (itemId) => {
if (!$.fn.dataTable.isDataTable('#kt_dt_item_options') ) {
statusItemOptions.innerHTML = 'Loading...';
// call StoreDetails API
datatableItemOptions = $(tableItemOptions).DataTable({
info: false,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: true,
autoWidth: false,
fixedColumns: {
left: 1
},
ajax: {
"url": config.apiBaseURL + "/items/" + itemId + "/options",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusItemOptions, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'itemId', name: "ITEM_ID" },
{ data: null,
render: function(data, type, full, meta) {
return full.levelCode + ':' + full.levelValue;
}
},
{ data: 'itemAvailabilityCode', name: "VENDABLE" },
{ data: 'taxGroupId', name: "Tkt_dt_item_priceAXE" },
{ data: 'vendor', name: "VENDOR" },
{ data: 'seasonCode', name: "SEASON" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
] ,
initComplete: function () {
dtUpdateStatus(statusItemOptions, "Last refresh", "", false)
}
});
} else {
statusItemOptions.innerHTML = 'Loading...';
datatableItemOptions.ajax.url(config.apiBaseURL + "/items/" + itemId + "/options");
datatableItemOptions.ajax.reload(function() {
dtUpdateStatus(statusItemOptions, "Last refresh", "", false)
}, true);
}
}
const loadItemPrice = (itemId) => {
if (!$.fn.dataTable.isDataTable('#kt_dt_item_price') ) {
statusItemPrice.innerHTML = 'Loading...';
// call StoreDetails API
datatableItemPrice = $(tableItemPrice).DataTable({
info: false,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: true,
autoWidth: false,
fixedColumns: {
left: 1
},
ajax: {
"url": config.apiBaseURL + "/items/" + itemId + "/price",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusItemPrice, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'itemId', name: "ITEM_ID" },
{ data: null,
render: function(data, type, full, meta) {
return full.levelCode + ':' + full.levelValue;
}
},
{ data: 'itmPricePropertyCode', name: "TYPE" },
{ data: 'effectiveDate', name: "EFFECTIVE DATE" },
{ data: 'expirationDate', name: "EXPIRATION DATE" },
{ data: 'price', name: "PRICE" },
{ data: 'externalId', name: "EXTERNAL_ID" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
],
initComplete: function () {
dtUpdateStatus(statusItemPrice, "Last refresh", "", false)
}
});
} else {
statusItemPrice.innerHTML = 'Loading...';
datatableItemPrice.ajax.url(config.apiBaseURL + "/items/" + itemId + "/price");
datatableItemPrice.ajax.reload(function() {
dtUpdateStatus(statusItemPrice, "Last refresh", "", false)
}, true);
}
}
const loadItemStock = (itemId) => {
if (!$.fn.dataTable.isDataTable('#kt_dt_item_stock') ) {
statusItemStock.innerHTML = 'Loading...';
// call StoreDetails API
datatableItemStock = $(tableItemStock).DataTable({
info: false,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: true,
autoWidth: false,
fixedColumns: {
left: 1
},
ajax: {
"url": config.apiBaseURL + "/items/" + itemId + "/stock",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusItemStock, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'itemId', name: "ITEM_ID" },
{ data: 'invLocationId', name: "LOCATION" },
{ data: 'bucketId', name: "BUCKET" },
{ data: 'unitCount', name: "STOCK" },
{ data: 'inventoryValue', name: "INV VALUE" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
],
initComplete: function () {
dtUpdateStatus(statusItemStock, "Last refresh", "", false)
}
});
} else {
statusItemStock.innerHTML = 'Loading...';
datatableItemStock.ajax.url(config.apiBaseURL + "/items/" + itemId + "/stock");
datatableItemStock.ajax.reload(function() {
dtUpdateStatus(statusItemStock, "Last refresh", "", false)
}, true);
}
}
const loadStoreVersion = () => {
if (!$.fn.dataTable.isDataTable('#kt_dt_store_version') ) {
statusStoreVersion.innerHTML = 'Loading...';
// call StoreDetails API
datatableStoreVersion = $(tableStoreVersion).DataTable({
info: false,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: false,
autoWidth: false,
ajax: {
"url": config.apiBaseURL + "/stores/version",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusStoreVersion, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'seq', name: "SEQ" },
{ data: 'baseSchemaDate', name: "BASE_SCHEMA_DATE" },
{ data: 'baseSchemaVersion', name: "BASE_SCHEMA_VERSION" },
{ data: 'customerSchemaDate', name: "CUSTOMER_SCHEMA_DATE" },
{ data: 'customerSchemaVersion', name: "CUSTOMER_SCHEMA_VERSION" },
{ data: 'customer', name: "CUSTOMER" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
] ,
initComplete: function () {
dtUpdateStatus(statusStoreVersion, "Last refresh", "", false)
}
});
}
}
const loadStoreSequence = () => {
if (!$.fn.dataTable.isDataTable('#kt_dt_store_sequence') ) {
statusStoreSequence.innerHTML = 'Loading...';
// call StoreDetails API
datatableStoreSequence = $(tableStoreSequence).DataTable({
info: true,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: true,
autoWidth: false,
ajax: {
"url": config.apiBaseURL + "/stores/sequence",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusStoreSequence, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'wkstnId', name: "WSID" },
{ data: 'sequenceId', name: "NAME" },
{ data: 'sequenceMode', name: "MODE" },
{ data: 'sequenceNbr', name: "VALUE" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
],
initComplete: function () {
this.api()
.columns()
.every(function () {
let column = this;
let title = column.footer().textContent;
// Create input element
let input = document.createElement('input');
input.placeholder = title;
// Get the width of the header cell and apply it to the input element
let headerWidth = column.header().offsetWidth;
input.style.width = headerWidth + 'px';
column.footer().replaceChildren(input);
// Event listener for user input
input.addEventListener('keyup', () => {
if (column.search() !== this.value) {
column.search(input.value).draw();
}
});
});
dtUpdateStatus(statusStoreSequence, "Last refresh", "", false)
}
});
document.getElementById("kt_dt_store_sequence_reload").addEventListener('click', function() {
statusStoreSequence.innerHTML = 'Loading...';
datatableStoreSequence.ajax.reload(function() {
dtUpdateStatus(statusStoreSequence, "Last refresh", "", false)
}, true);
});
}
}
const loadStoreSignature = () => {
if (!$.fn.dataTable.isDataTable('#kt_dt_store_signature') ) {
statusStoreSignature.innerHTML = 'Loading...';
// call StoreDetails API
datatableStoreSignature = $(tableStoreSignature).DataTable({
info: true,
bStateSave: false, // cookie
order: [],
pageLength: 10,
lengthChange: true,
processing: true,
paging: true,
autoWidth: false,
fixedColumns: {
left: 2
},
ajax: {
"url": config.apiBaseURL + "/stores/signature",
"dataSrc": "",
"data": {
"dbHost": ipAddress
},
"error": function (jqXHR, textStatus, errorThrown) {
dtUpdateStatus(statusStoreSignature, "Ajax Error", jqXHR.responseJSON.error, true)
}
},
columns: [
{ data: 'wkstnId', name: "WSID" },
{ data: 'signatureId', name: "SIGNATURE_ID" },
{ data: 'signatureMode', name: "MODE" },
{ data: 'signatureString', name: "SIGNATURE_STRING" },
{ data: 'signatureSource', name: "SIGNATURE_SOURCE" },
{ data: 'createDate', name: "DATE CREATE" },
{ data: 'createUserId', name: "USER CREATE"},
{ data: 'updateDate', name: "DATE UPDATE" },
{ data: 'updateUserId', name: "USER UPDATE"},
],
initComplete: function () {
this.api()
.columns()
.every(function () {
let column = this;
let title = column.footer().textContent;
// Create input element
let input = document.createElement('input');
input.placeholder = title;
// Get the width of the header cell and apply it to the input element
let headerWidth = column.header().offsetWidth;
input.style.width = headerWidth + 'px';
column.footer().replaceChildren(input);
// Event listener for user input
input.addEventListener('keyup', () => {
if (column.search() !== this.value) {
column.search(input.value).draw();
}
});
});
dtUpdateStatus(statusStoreSignature, "Last refresh", "", false)
}
});
}
}
const handleIpChange = () => {
// Add an event listener for value change
butIpAddress.addEventListener('click', function() {
// Create a URL object with the current URL
var url = new URL(window.location.href);
// Get URL search parameters
var params = url.searchParams;
// Modify IP address
params.set('ip', inputIpAddress.value);
// Update URL with new search parameters
url.search = params.toString();
// Change the current URL and reload the page
window.location.href = url.toString();
});
}
// Submit form handler
const handleItemSubmit = () => {
// Define variables
let validator;
// Get elements
const form = document.getElementById('kt_store_item_form');
const submitButton = document.getElementById('kt_store_item_submit');
// Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/
validator = FormValidation.formValidation(
form,
{
fields: {
'itemId': {
validators: {
notEmpty: {
message: 'Item ID is required'
},
stringLength: {
min: 7,
message: 'Item ID must be 7 characters or more'
}
}
}
},
plugins: {
trigger: new FormValidation.plugins.Trigger(),
bootstrap: new FormValidation.plugins.Bootstrap5({
rowSelector: '.fv-row',
eleInvalidClass: '',
eleValidClass: ''
})
}
}
);
// Handle submit item search button
submitButton.addEventListener('click', e => {
e.preventDefault();
// Validate form before submit
if (validator) {
validator.validate().then(function (status) {
if (status == 'Valid') {
var itemId = document.querySelector('input[name="itemId"]').value;
loadItem(itemId);
loadItemOptions(itemId);
loadItemPrice(itemId);
loadItemStock(itemId);
}
});
}
})
}
function dtUpdateStatus(statusElement, statusMessage, toastMessage, isError) {
const currentDate = new Date();
const formattedDate = `${currentDate.getDate()}/${currentDate.getMonth() + 1}/${currentDate.getFullYear()} @ ${currentDate.getHours().toString().padStart(2, '0')}:${currentDate.getMinutes().toString().padStart(2, '0')}:${currentDate.getSeconds().toString().padStart(2, '0')}`;
// Check if the message is an error or information
if (isError) {
toastr.error(toastMessage, "Error");
} else {
toastr.info("Refreshed data", "Info");
}
statusElement.innerHTML = `${statusMessage}: ${formattedDate}`;
}
return {
// Public functions
init: function () {
// Parse the URL parameter
storeId = KTUtil.getURLParam("storeId");
ipAddress = KTUtil.getURLParam("ip");
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": false,
"positionClass": "toastr-top-right",
"preventDuplicates": true,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
};
// Handle forms
initStoreView();
handleIpChange();
handleItemSubmit();
}
};
}();
// On document ready
KTUtil.onDOMContentLoaded(function () {
KTStoreView.init();
});