refactor: domain name config

feat: store_retail
feat: sign-in page
2023-11-29 00:02:15 +01:00 · 2023-11-26 23:17:56 +01:00 · 2023-11-22 00:38:20 +01:00 · 2023-11-21 22:50:43 +01:00 · 2023-11-21 00:34:30 +01:00
9 changed files with 1192 additions and 4310 deletions
--- a/assets/plugins/custom/md5/js-md5
+++ b/assets/plugins/custom/md5/js-md5
--- a/config/config.js
+++ b/config/config.js
@ -0,0 +1,16 @@
+var config = {
+    dev: {
+        apiBaseURL: 'http://localhost:8080/hdpos/api'
+    },
+    prod: {
+        apiBaseURL: 'http://V-XSTO-A01-IIDC.adic.lan/hdpos/api'
+    }
+};
+
+// Now we check the hostname where the script is running
+var env = window.location.hostname.includes('localhost') ? 'dev' : 'prod';
+
+var selectedConfig = config[env];
+
+// Make the selected configuration available for other scripts
+window.config = selectedConfig;
--- a/dashboard.html
+++ b/dashboard.html
@ -1,17 +1,16 @@
-
 <!DOCTYPE html>
 <!--
 Author: Frédérik Benoist
-Product Name: HDPos
+Product Name: HDwPos
 Product Version: 1.0.0
 Contact: frederik.benoist@inetum.com
 -->
 <html lang="fr">
 	<!--begin::Head-->
 	<head>
-		<title>HDPos - HelpDesk POS - XSTORE</title>
+		<title>HDwPos - HelpDesk Web POS - XSTORE</title>
 		<meta charset="utf-8" />
-		<meta name="description" content="HDPos - HelpDesk POS - XSTORE" />
+		<meta name="description" content="HDwPos - HelpDesk Web POS - XSTORE" />
 		<meta name="keywords" content="helpdesk, XSTORE" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		<meta property="og:locale" content="fr_FR" />
@ -57,7 +56,7 @@ Contact: frederik.benoist@inetum.com
 						<!--end::Header mobile toggle-->
 						<!--begin::Logo-->
 						<div class="d-flex align-items-center flex-grow-1 flex-lg-grow-0 me-lg-15">
-							<a href="index.html">
+							<a href="dashboard.html">
 								<img alt="Logo" src="assets/media/logos/demo30-small.svg" class="h-25px d-lg-none" />
 								<img alt="Logo" src="assets/media/logos/demo30.svg" class="h-25px d-none d-lg-inline app-sidebar-logo-default theme-light-show" />
 								<img alt="Logo" src="assets/media/logos/demo30-dark.png" class="h-25px d-none d-lg-inline app-sidebar-logo-default theme-dark-show" />
@ -180,7 +179,7 @@ Contact: frederik.benoist@inetum.com
 									<ul class="breadcrumb breadcrumb-separatorless fw-semibold">
 										<!--begin::Item-->
 										<li class="breadcrumb-item text-white fw-bold lh-1">
-											<a href="index.html" class="text-white text-hover-primary">
+											<a href="dashboard.html" class="text-white text-hover-primary">
 												<i class="ki-outline ki-home text-white fs-3"></i>
 											</a>
 										</li>
@ -191,7 +190,7 @@ Contact: frederik.benoist@inetum.com
 										</li>
 										<!--end::Item-->
 										<!--begin::Item-->
-										<li class="breadcrumb-item text-white fw-bold lh-1">Dashboards</li>
+										<li class="breadcrumb-item text-white fw-bold lh-1">Dashboard</li>
 										<!--end::Item-->
 									</ul>
 									<!--end::Breadcrumb-->
@ -233,7 +232,7 @@ Contact: frederik.benoist@inetum.com
 									<div class="app-content-menu menu menu-rounded menu-gray-800 menu-state-bg flex-wrap fs-5 fw-semibold border-bottom mt-n7 pt-5 pb-6 px-10 mb-10">
 										<!--begin::Menu item-->
 										<div class="menu-item pe-2">
-											<a class="menu-link px-5 active" href="index.html">
+											<a class="menu-link px-5 active" href="dashboard.html">
 												<span class="menu-title text-gray-800">Général</span>
 											</a>
 										</div>
@ -269,7 +268,7 @@ Contact: frederik.benoist@inetum.com
 														</div>
 														<!--end::Heading-->
 														<!--begin::Description-->
-														<span class="fs-6 fw-semibold text-gray-500">Nombre de tickets</span>
+														<span class="fs-6 fw-semibold text-gray-500">Nombre de transactions</span>
 														<!--end::Description-->
 													</div>
 													<!--end::Statistics-->
--- a/sign-in.html
+++ b/sign-in.html
@ -2,7 +2,7 @@
 <!DOCTYPE html>
 <!--
 Author: Frederik BENOIST
-Product Name: HelpDesk POS
+Product Name: HelpDesk Web POS
 Product Version: 1.0.0
 Contact: frederik.benoist@inetum.com
 -->
@ -10,17 +10,17 @@ Contact: frederik.benoist@inetum.com
 	<!--begin::Head-->
 	<head>
        <!--<base href="/webapp/" />-->
-		<title>HelpDesk POS - The World's #1 Selling Bootstrap Admin Template - Metronic by KeenThemes</title>
+		<title>HelpDesk Web POS - XSTORE</title>
 		<meta charset="utf-8" />
-		<meta name="description" content="The most advanced Bootstrap 5 Admin Theme with 40 unique prebuilt layouts on Themeforest trusted by 100,000 beginners and professionals. Multi-demo, Dark Mode, RTL support and complete React, Angular, Vue, Asp.Net Core, Rails, Spring, Blazor, Django, Express.js, Node.js, Flask, Symfony & Laravel versions. Grab your copy now and get life-time updates for free." />
-		<meta name="keywords" content="metronic, bootstrap, bootstrap 5, angular, VueJs, React, Asp.Net Core, Rails, Spring, Blazor, Django, Express.js, Node.js, Flask, Symfony & Laravel starter kits, admin themes, web design, figma, web development, free templates, free admin themes, bootstrap theme, bootstrap template, bootstrap dashboard, bootstrap dak mode, bootstrap button, bootstrap datepicker, bootstrap timepicker, fullcalendar, datatables, flaticon" />
+		<meta name="description" content="HelpDesk Web POS - XSTORE" />
+		<meta name="keywords" content="HelpDesk, web, POS" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		<meta property="og:locale" content="fr_FR" />
 		<meta property="og:type" content="article" />
-		<meta property="og:title" content="Metronic - The World's #1 Selling Bootstrap Admin Template - Metronic by KeenThemes" />
-		<meta property="og:url" content="https://keenthemes.com/metronic" />
-		<meta property="og:site_name" content="Metronic by Keenthemes" />
-		<link rel="canonical" href="https://preview.keenthemes.com/metronic8" />
+		<meta property="og:title" content="HelpDesk Web POS" />
+		<meta property="og:url" content="https://inetum.com" />
+		<meta property="og:site_name" content="HelpDesk Web POS by Inetums" />
+		<link rel="canonical" href="https://inetum.com" />
 		<link rel="shortcut icon" href="assets/media/logos/favicon.ico" />
 		<!--begin::Fonts(mandatory for all pages)-->
 		<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:300,400,500,600,700" />
@ -54,7 +54,7 @@ Contact: frederik.benoist@inetum.com
 						</a>
 						<!--end::Logo-->
 						<!--begin::Title-->
-						<h2 class="text-white fw-normal m-0">Consulter l'activité des caisse XSTORE</h2>
+						<h2 class="text-white fw-normal m-0">Consulter l'activité des caisses XSTORE</h2>
 						<!--end::Title-->
 					</div>
 					<!--begin::Aside-->
@ -74,16 +74,16 @@ Contact: frederik.benoist@inetum.com
 									<h1 class="text-gray-900 fw-bolder mb-3">Sign In</h1>
 									<!--end::Title-->
 									<!--begin::Subtitle-->
-									<div class="text-gray-500 fw-semibold fs-6">HelpDesk POS</div>
+									<div class="text-gray-500 fw-semibold fs-6">HelpDesk Web POS</div>
 									<!--end::Subtitle=-->
 								</div>
 								<!--begin::Heading-->
    							<!--begin::Login options-->
 								<!--begin::Input group=-->
 								<div class="fv-row mb-8">
-									<!--begin::id_structure-->
-									<input type="text" placeholder="id_structure" name="id_structure" autocomplete="off" class="form-control bg-transparent" />
-									<!--end::id_structure-->
+									<!--begin::user_name-->
+									<input type="text" placeholder="user_name" name="user_name" autocomplete="off" class="form-control bg-transparent" />
+									<!--end::user_name-->
 								</div>
 								<!--end::Input group=-->
 								<div class="fv-row mb-3">
@ -124,7 +124,8 @@ Contact: frederik.benoist@inetum.com
 		<script src="assets/js/scripts.bundle.js"></script>
 		<!--end::Global Javascript Bundle-->
 		<!--begin::Custom Javascript(used for this page only)-->
-		<script src="assets/js/custom/authentication/sign-in/general.js"></script>
+		<script src="assets/plugins/custom/md5/js-md5 min.js"></script>
+		<script src="sign-in.js"></script>
 		<!--end::Custom Javascript-->
 		<!--end::Javascript-->
 	</body>
--- a/sign-in.js
+++ b/sign-in.js
@ -0,0 +1,97 @@
+"use strict";
+
+// Class definition
+var KTSigninGeneral = function () {
+    // Elements
+    var form;
+    var submitButton;
+    var validator;
+
+    // Handle form
+    var handleValidation = function (e) {
+        // Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/
+        validator = FormValidation.formValidation(
+            form,
+            {
+                fields: {
+                    'user_name': {
+                        validators: {
+                            notEmpty: {
+                                message: 'user_name is required'
+                            }
+                        }
+                    },
+                    'password': {
+                        validators: {
+                            notEmpty: {
+                                message: 'The password is required'
+                            }
+                        }
+                    }
+                },
+                plugins: {
+                    trigger: new FormValidation.plugins.Trigger(),
+                    bootstrap: new FormValidation.plugins.Bootstrap5({
+                        rowSelector: '.fv-row',
+                        eleInvalidClass: '',  // comment to enable invalid state icons
+                        eleValidClass: '' // comment to enable valid state icons
+                    })
+                }
+            }
+        );
+    }
+
+    var handleSubmit = function (e) {
+        // Handle form submit
+        submitButton.addEventListener('click', function (e) {
+            // Prevent button default action
+            e.preventDefault();
+
+            // Validate form
+            validator.validate().then(function (status) {
+                if (status == 'Valid') {
+                    var hashedUsername = md5(form.querySelector('[name="user_name"]').value); 
+                    var hashedPassword = md5(form.querySelector('[name="password"]').value);
+
+                    if (hashedUsername === '21232f297a57a5a743894a0e4a801fc3' && hashedPassword === '21232f297a57a5a743894a0e4a801fc3') {
+                        // Generate session ID
+                        var sessionId = md5(Math.random().toString(36));
+
+                        // Store session ID in cookie
+                        var date = new Date(Date.now() + 1 * 24 * 60 * 60 * 1000); // +1 day from now
+                        KTCookie.set("session_id", sessionId, { expires: date });
+
+                        // Redirect to the appropriate page
+                        location.href = form.getAttribute('data-kt-redirect-url');
+                    } else {
+                        // Show error popup. For more info check the plugin's official documentation: https://sweetalert2.github.io/
+                        Swal.fire({
+                        text: "Invalid username or password.",
+                        icon: "error",
+                        buttonsStyling: false,
+                        confirmButton: "Ok, got it!",
+                        customClass: { confirmButton: "btn btn-primary" }
+                        });
+                    }
+                }
+            });
+        });
+    }
+
+    // Public functions
+    return {
+        // Initialization
+        init: function () {
+            form = document.querySelector('#kt_sign_in_form');
+            submitButton = document.querySelector('#kt_sign_in_submit');
+
+            handleValidation();
+            handleSubmit(); // used for demo purposes only
+        }
+    };
+}();
+
+// On document ready
+KTUtil.onDOMContentLoaded(function () {
+    KTSigninGeneral.init();
+});
--- a/store/list/list.html
+++ b/store/list/list.html
@ -56,7 +56,7 @@ Contact: frederik.benoist@inetum.com
 						<!--end::Header mobile toggle-->
 						<!--begin::Logo-->
 						<div class="d-flex align-items-center flex-grow-1 flex-lg-grow-0 me-lg-15">
-							<a href="index.html">
+							<a href="dashboard.html">
 								<img alt="Logo" src="assets/media/logos/demo30-small.svg" class="h-25px d-lg-none" />
 								<img alt="Logo" src="assets/media/logos/demo30.svg" class="h-25px d-none d-lg-inline app-sidebar-logo-default theme-light-show" />
 								<img alt="Logo" src="assets/media/logos/demo30-dark.png" class="h-25px d-none d-lg-inline app-sidebar-logo-default theme-dark-show" />
@ -179,18 +179,18 @@ Contact: frederik.benoist@inetum.com
 									<ul class="breadcrumb breadcrumb-separatorless fw-semibold">
 										<!--begin::Item-->
 										<li class="breadcrumb-item text-white fw-bold lh-1">
-											<a href="index.html" class="text-white text-hover-primary">
-												<i class="ki-outline ki-home text-white fs-3"></i>
+											<a href="dashboard.html" class="text-white text-hover-primary">
+												<i class="ki-outline ki-home text-white fs-6"></i>
 											</a>
 										</li>
 										<!--end::Item-->
 										<!--begin::Item-->
 										<li class="breadcrumb-item">
-											<i class="ki-outline ki-right fs-4 text-white mx-n1"></i>
+											<i class="ki-outline ki-right fs-7 text-white mx-n1"></i>
 										</li>
 										<!--end::Item-->
 										<!--begin::Item-->
-										<li class="breadcrumb-item text-white fw-bold lh-1">Dashboards</li>
+										<li class="breadcrumb-item text-white fw-bold lh-1">Store</li>
 										<!--end::Item-->
 									</ul>
 									<!--end::Breadcrumb-->
@ -237,7 +237,7 @@ Contact: frederik.benoist@inetum.com
 												<!--begin::Search-->
 												<div class="d-flex align-items-center position-relative my-1">
 													<i class="ki-outline ki-magnifier fs-3 position-absolute ms-5"></i>
-													<input type="text" data-kt-user-table-filter="search" class="form-control form-control-solid w-250px ps-13" placeholder="Rechercher Store" />
+													<input type="text" data-kt-user-table-filter="search" class="form-control form-control-solid w-250px ps-13" placeholder="Search store" />
 												</div>
 												<!--end::Search-->
 											</div>
@ -369,6 +369,7 @@ Contact: frederik.benoist@inetum.com
 		<script src="assets/plugins/custom/datatables/datatables.bundle.js"></script>
 		<!--end::Vendors Javascript-->
 		<!--begin::Custom Javascript(used for this page only)-->
+		<script src="config/config.js"></script>
 		<script src="store/list/table.js"></script>
 		<!--end::Custom Javascript-->
 		<!--end::Javascript-->
--- a/store/list/table.js
+++ b/store/list/table.js
@ -50,12 +50,15 @@ var KTUsersList = function () {

        // Init datatable --- more info on datatables: https://datatables.net/manual/
        datatable = $(table).DataTable({
-            "info": false,
-            "bStateSave": true, // cookie
-            'order': [],
-            "pageLength": 10,
-            "lengthChange": false,
-            'columnDefs': [
+            info: false,
+            bStateSave: false, // cookie
+            order: [],
+            pageLength: 10,
+            lengthChange: true,
+            processing: false,
+            paging: true,
+            autoWidth: false,
+            columnDefs: [
                { orderable: true, targets: 0 }, // Disable ordering on column 0 (checkbox)
                { orderable: false, targets: 3 }, // Disable ordering on column 6 (actions)                
            ],
@ -64,24 +67,20 @@ var KTUsersList = function () {
                { data: "nom", name: "nom",
                    fnCreatedCell: function (nTd, sData, oData, iRow, iCol) {
                        if(oData.nom) {
-                            $(nTd).html("<a href='store/view/view-store.html?id_structure=" +oData.id_structure+"'>"+oData.nom+"</a>");
+                            $(nTd).html("<a href='store/view/view-store.html?storeId=" + oData.id_structure + "&ip=" + oData.ip +"'>"+oData.nom+"</a>");
                        }
                    }
                },
                { data: 'ip', name: "ip" },
                { data: 'telephone', name: "telephone"}
            ],
-            "ajax": {
-                "url": "http://localhost:8080/hdpos/api/stores/getAll", // Remplacez cela par l'URL correcte de votre API
-                "dataSrc": "" // Indique à DataTables de traiter le tableau directement
+            ajax: {
+                "url": config.apiBaseURL + "/stores/getAll", 
+                "dataSrc": "" 
            },
-        });
-
-        // Re-init functions on every table re-draw -- more info: https://datatables.net/reference/event/draw
-        datatable.on('draw', function () {
-            //initToggleToolbar();
-            handleDeleteRows();
-            //toggleToolbars();
+            error: function (jqXHR, textStatus, errorThrown) {
+                toastr.error(jqXHR.responseJSON.error, "Error");
+            }
        });
    }

--- a/store/view/view-store.html
+++ b/store/view/view-store.html
--- a/store/view/view-store.js
+++ b/store/view/view-store.js
@ -3,21 +3,622 @@
 // Class definition
 var KTStoreView = function () {
    // Shared variables
-    var id_structure 
+    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 = () => {

-        console.log("ID"+id_structure);
+        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 () {
-            // Elements
-            id_structure = KTUtil.getURLParam("id_structure");
+            // 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();
        }
    };
 }();
Author	SHA1	Message	Date
Frédérik Benoist	0d7f53c937	refactor: domain name config	2023-11-29 00:02:15 +01:00
Frédérik Benoist	4e4a838045	feat: store_retail	2023-11-26 23:17:56 +01:00
Frédérik Benoist	b5d7024ab5	feat: sign-in page	2023-11-22 00:38:20 +01:00
Frédérik Benoist	9e0aac7ad3	feat:	2023-11-21 22:50:43 +01:00
Frédérik Benoist	a1cb0cb4a2	feat: view store details	2023-11-21 00:34:30 +01:00