commit 29/01/2026

2026-01-29 12:35:16 +07:00
parent bfa6a5a2cf
commit de62c4ac8d
10 changed files with 112509 additions and 49 deletions
--- a/html/FlightFilterTable.html
+++ b/html/FlightFilterTable.html
@@ -6,12 +6,14 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

 <body>
+    <div class="col w-100 h-100 ms-1 me-1 mt-1 mb-1">
        <div class="row">
-        <div class="table-responsive">
+            <div class="table-responsive FlightFilterTable">
                <table class="table">
                    <thead>
                        <tr>
@@ -23,35 +25,19 @@
                            <th class="text-center align-middle">Arrival Zones</th>
                        </tr>
                    </thead>
-                <tbody id="tablebody" class="tablebody">
-                    <tr>
-                        <td>Cell 1</td>
-                        <td>Cell 2</td>
-                        <td>Cell 3</td>
-                        <td>Cell 4</td>
-                        <td>Cell 5</td>
-                        <td>Cell 6</td>
-                    </tr>
-                    <tr>
-                        <td>Cell 3</td>
-                        <td>Cell 4</td>
-                        <td>Cell 3</td>
-                        <td>Cell 4</td>
-                        <td>Cell 5</td>
-                        <td>Cell 6</td>
-                    </tr>
-                </tbody>
+                    <tbody id="tablebody" class="tablebody"></tbody>
                </table>
            </div>
        </div>
        <div class="row">
-        <div class="col-2 ms-1 me-1"><button class="btn btn-primary w-100 h-100" type="button">Clear</button></div>
-        <div class="col-2 ms-1 me-1"><button class="btn btn-primary w-100 h-100" type="button">Add</button></div>
-        <div class="col-2 ms-1 me-1"><button class="btn btn-primary w-100 h-100" type="button">Delete</button></div>
-        <div class="col-2 ms-1 me-1"><button class="btn btn-primary w-100 h-100" type="button">Edit</button></div>
-        <div class="col ms-1 me-1"></div>
+            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 clearButton" type="button">Clear</button></div>
+            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 addButton" type="button">Add</button></div>
+            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 deleteButton" type="button">Delete</button></div>
+            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 editButton" type="button">Edit</button></div>
+        </div>
    </div>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
    <script src="assets/js/script.js"></script>
 </body>
--- a/html/assets/css/datatables.css
+++ b/html/assets/css/datatables.css
--- a/html/assets/js/datatables.js
+++ b/html/assets/js/datatables.js
--- a/html/assets/js/flightfilter.js
+++ b/html/assets/js/flightfilter.js
@@ -0,0 +1,188 @@
+/**
+ * @typedef {object} FlightFilter
+ * @property {number} id
+ * @property {string} description
+ * @property {string} airlineCode
+ * @property {string} flightNumber
+ * @property {string} departureZone
+ * @property {string} arrivalZone
+ */
+
+
+flightfilterdata = {
+    /**
+     * @type {FlightFilter[]}
+     */
+    aas1: [],
+    /**
+     * @type {FlightFilter[]}
+     */
+    aas2: [],
+    /**
+     * @type {FlightFilter[]}
+     */
+    aas3: [],
+}
+
+/**
+ * Check if flight ID is valid
+ * @param {number} id number from 1 to 3
+ * @returns true if valid, false otherwise
+ */
+function validFlightID(id) {
+    return (typeof id === 'number' && id >= 1 && id <= 3);
+}
+
+/**
+ * Clear flight filter data for given ID
+ * @param {number} id from 1 to 3 
+ */
+function clearflightfilterdata(id) {
+    if (validFlightID(id)) {
+        switch (id) {
+            case 1:
+                flightfilterdata.aas1 = [];
+                break;
+            case 2:
+                flightfilterdata.aas2 = [];
+                break;
+            case 3:
+                flightfilterdata.aas3 = [];
+                break;
+        }
+    }
+}
+
+/**
+ * Fetch flight filter data for given ID
+ * @param {number} id from 1 to 3 
+ * @param {function} cbOK Callback when done
+ * @param {function} cbErr Callback on error contain error message
+ */
+function getflightfilterdata(id, cbOK, cbErr) {
+    if (validFlightID(id) === false) return;
+    
+    clearflightfilterdata(id);
+    // use POST function from script.js with URL "FlightFilter" with command="get" and aas_id=id
+    Post("FlightFilter", { command: "get", aas_id: id }, function (data) {
+        if (data && Array.isArray(data.filters)) {
+            switch (id) {
+                case 1:
+                    flightfilterdata.aas1 = data.filters;
+                    break;
+                case 2:
+                    flightfilterdata.aas2 = data.filters;
+                    break;
+                case 3:
+                    flightfilterdata.aas3 = data.filters;
+                    break;
+            }
+            if (cbOK) cbOK();
+        } else if (cbErr) cbErr("Invalid data format received from server.");
+    }, function (errMsg) {
+        if (cbErr) cbErr(errMsg);
+    }); 
+}
+
+/**
+ * Clear flight filter data for given ID on server
+ * @param {number} id from 1 to 3 
+ * @param {function} cbOK Callback when done
+ * @param {function} cbErr Callback on error contain error message
+ */
+function clearflightfilterdata(id, cbOK, cbErr) {
+    if (validFlightID(id) === false) return;
+
+    // use POST function from script.js with URL "FlightFilter" with command="clear" and aas_id=id
+    Post("FlightFilter", { command: "clear", aas_id: id }, function (data) {
+        switch (id) {
+            case 1:
+                flightfilterdata.aas1 = [];
+                break;
+            case 2:
+                flightfilterdata.aas2 = [];
+                break;
+            case 3:
+                flightfilterdata.aas3 = [];
+                break;
+        }
+        if (cbOK) cbOK();
+    }, function (errMsg) {
+        if (cbErr) cbErr(errMsg);
+    });
+}
+
+/**
+ * Add flight filter data for given ID on server
+ * @param {number} id from 1 to 3 
+ * @param {FlightFilter} data 
+ * @param {function} cbOK Callback when done
+ * @param {function} cbErr Callback on error contain error message
+ * @returns 
+ */
+function addFlightFilter(id, data, cbOK, cbErr) {
+    if (validFlightID(id) === false) return;
+    // use POST function from script.js with URL "FlightFilter" with command="add", aas_id=id and data=data in FlightFilter format
+    Post("FlightFilter", { command: "add", aas_id: id, filter: data }, function (respData) {
+        if (cbOK) cbOK();
+    }, function (errMsg) {
+        if (cbErr) cbErr(errMsg);
+    });
+}
+
+/**
+ * delete flight filter data for given ID on server
+ * @param {number} id from 1 to 3 
+ * @param {number} filterId row ID to delete
+ * @param {function} cbOK Callback when done
+ * @param {function} cbErr Callback on error contain error message
+ * @returns 
+ */
+function deleteflightfilter(id, filterId, cbOK, cbErr) {
+    if (validFlightID(id) === false) return;
+    // use POST function from script.js with URL "FlightFilter" with command="delete", aas_id=id and filter_id=filterId
+    Post("FlightFilter", { command: "delete", aas_id: id, filter_id: filterId }, function (respData) {
+        if (cbOK) cbOK();
+    }, function (errMsg) {
+        if (cbErr) cbErr(errMsg);
+    });
+}
+
+/**
+ * Patch flight filter data for given ID on server
+ * @param {number} id from 1 to 3
+ * @param {FlightFilter} data data to patch
+ * @param {function} cbOK Callback when done
+ * @param {function} cbErr Callback on error contain error message
+ * @returns 
+ */
+function patchflightfilter(id, data, cbOK, cbErr) {
+    if (validFlightID(id) === false) return;
+    // use POST function from script.js with URL "FlightFilter" with command="patch", aas_id=id and data=data in FlightFilter format
+    Post("FlightFilter", { command: "patch", aas_id: id, data: data }, function (respData) {
+        if (cbOK) cbOK();
+    }, function (errMsg) {
+        if (cbErr) cbErr(errMsg);
+    });
+}
+
+$(document).ready(function () {
+    console.log("Flight filter script loaded.");
+
+    getflightfilterdata(1);
+    getflightfilterdata(2);
+    getflightfilterdata(3);
+    
+    $("#accordion").on("shown.bs.collapse", function (e) {
+        const $panel = $(e.target);
+
+
+        const $table = $panel.find('.FlightFilterTable');
+        const $clear = $panel.find('.clearButton');
+        const $add = $panel.find('.addButton');
+        const $del = $panel.find('.deleteButton');
+        const $edit = $panel.find('.editButton');
+
+
+    });
+});
--- a/html/flightfilter.html
+++ b/html/flightfilter.html
@@ -6,6 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

@@ -22,34 +23,108 @@
            </div>
        </div>
    </nav>
-    <div class="accordion" role="tablist" id="accordion-1">
+    <div class="accordion" role="tablist" id="accordion">
        <div class="accordion-item">
-            <h2 class="accordion-header" role="tab"><button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#accordion-1 .item-1" aria-expanded="true" aria-controls="accordion-1 .item-1">AAS 1</button></h2>
-            <div class="accordion-collapse collapse show item-1" role="tabpanel" data-bs-parent="#accordion-1">
+            <h2 class="accordion-header" role="tab"><button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#accordion .item-1" aria-expanded="true" aria-controls="accordion .item-1">AAS 1</button></h2>
+            <div class="accordion-collapse collapse show item-1" role="tabpanel" data-bs-parent="#accordion">
                <div class="accordion-body">
-                    <p class="mb-0">Konten AAS 1</p>
+                    <div class="col w-100 h-100 ms-1 me-1 mt-1 mb-1">
+                        <div class="row">
+                            <div class="table-responsive FlightFilterTable">
+                                <table class="table">
+                                    <thead>
+                                        <tr>
+                                            <th class="text-center col-1 align-middle">Index</th>
+                                            <th class="text-center col-2 align-middle">Description</th>
+                                            <th class="text-center col-1 align-middle">Airline Code</th>
+                                            <th class="text-center col-1 align-middle">Flight Number</th>
+                                            <th class="text-center align-middle">Departure Zones</th>
+                                            <th class="text-center align-middle">Arrival Zones</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody id="tablebody" class="tablebody"></tbody>
+                                </table>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 clearButton" type="button">Clear</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 addButton" type="button">Add</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 deleteButton" type="button">Delete</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 editButton" type="button">Edit</button></div>
+                        </div>
+                    </div>
                </div>
            </div>
        </div>
        <div class="accordion-item">
-            <h2 class="accordion-header" role="tab"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordion-1 .item-2" aria-expanded="false" aria-controls="accordion-1 .item-2">AAS 2</button></h2>
-            <div class="accordion-collapse collapse item-2" role="tabpanel" data-bs-parent="#accordion-1">
+            <h2 class="accordion-header" role="tab"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordion .item-2" aria-expanded="false" aria-controls="accordion .item-2">AAS 2</button></h2>
+            <div class="accordion-collapse collapse item-2" role="tabpanel" data-bs-parent="#accordion">
                <div class="accordion-body">
-                    <p class="mb-0">Konten AAS 2</p>
+                    <div class="col w-100 h-100 ms-1 me-1 mt-1 mb-1">
+                        <div class="row">
+                            <div class="table-responsive FlightFilterTable">
+                                <table class="table">
+                                    <thead>
+                                        <tr>
+                                            <th class="text-center col-1 align-middle">Index</th>
+                                            <th class="text-center col-2 align-middle">Description</th>
+                                            <th class="text-center col-1 align-middle">Airline Code</th>
+                                            <th class="text-center col-1 align-middle">Flight Number</th>
+                                            <th class="text-center align-middle">Departure Zones</th>
+                                            <th class="text-center align-middle">Arrival Zones</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody id="tablebody-1" class="tablebody"></tbody>
+                                </table>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 clearButton" type="button">Clear</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 addButton" type="button">Add</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 deleteButton" type="button">Delete</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 editButton" type="button">Edit</button></div>
+                        </div>
+                    </div>
                </div>
            </div>
        </div>
        <div class="accordion-item">
-            <h2 class="accordion-header" role="tab"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordion-1 .item-3" aria-expanded="false" aria-controls="accordion-1 .item-3">AAS 3</button></h2>
-            <div class="accordion-collapse collapse item-3" role="tabpanel" data-bs-parent="#accordion-1">
+            <h2 class="accordion-header" role="tab"><button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordion .item-3" aria-expanded="false" aria-controls="accordion .item-3">AAS 3</button></h2>
+            <div class="accordion-collapse collapse item-3" role="tabpanel" data-bs-parent="#accordion">
                <div class="accordion-body">
-                    <p class="mb-0">Konten AAS 3</p>
+                    <div class="col w-100 h-100 ms-1 me-1 mt-1 mb-1">
+                        <div class="row">
+                            <div class="table-responsive FlightFilterTable">
+                                <table class="table">
+                                    <thead>
+                                        <tr>
+                                            <th class="text-center col-1 align-middle">Index</th>
+                                            <th class="text-center col-2 align-middle">Description</th>
+                                            <th class="text-center col-1 align-middle">Airline Code</th>
+                                            <th class="text-center col-1 align-middle">Flight Number</th>
+                                            <th class="text-center align-middle">Departure Zones</th>
+                                            <th class="text-center align-middle">Arrival Zones</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody id="tablebody-2" class="tablebody"></tbody>
+                                </table>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 clearButton" type="button">Clear</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 addButton" type="button">Add</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 deleteButton" type="button">Delete</button></div>
+                            <div class="col ms-1 me-1"><button class="btn btn-primary w-100 h-100 editButton" type="button">Edit</button></div>
+                        </div>
+                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
+    <script src="assets/js/flightfilter.js"></script>
    <script src="assets/js/script.js"></script>
 </body>

--- a/html/home.html
+++ b/html/home.html
@@ -6,6 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

@@ -30,6 +31,7 @@
    </div>
    <div class="row"></div>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
    <script src="assets/js/home.js"></script>
    <script src="assets/js/script.js"></script>
--- a/html/log.html
+++ b/html/log.html
@@ -6,6 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

@@ -45,6 +46,7 @@
        </div>
    </div>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
    <script src="assets/js/log.js"></script>
    <script src="assets/js/script.js"></script>
--- a/html/login.html
+++ b/html/login.html
@@ -6,6 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

@@ -36,6 +37,7 @@
        </div>
    </section>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
    <script src="assets/js/login.js"></script>
    <script src="assets/js/script.js"></script>
--- a/html/setting.html
+++ b/html/setting.html
@@ -6,6 +6,7 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
    <title>FarmToAAS</title>
    <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/datatables.css">
    <link rel="stylesheet" href="assets/css/Login-Form-Basic-icons.css">
 </head>

@@ -68,6 +69,7 @@
        </div>
    </div>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
+    <script src="assets/js/datatables.js"></script>
    <script src="assets/js/jquery-3.7.1.min.js"></script>
    <script src="assets/js/script.js"></script>
    <script src="assets/js/setting.js"></script>
--- a/src/Web/WebUI.kt
+++ b/src/Web/WebUI.kt
@@ -71,6 +71,8 @@ class WebUI {
                it.redirect("login.html")
            }

+            
+
            get("getSetting") {
                val fd = farmData(
                    config.ActiveMQ_BrokerURL,