From a6f9237c133f66ed60df72f218eb7c6dffe33325 Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Wed, 15 Apr 2026 16:17:28 +0100 Subject: [PATCH 1/7] vue js conversion part 1 --- Views/device_view.php | 320 ++++++++++++++++++++++++------------------ 1 file changed, 185 insertions(+), 135 deletions(-) diff --git a/Views/device_view.php b/Views/device_view.php index 1c84165..c81447f 100644 --- a/Views/device_view.php +++ b/Views/device_view.php @@ -5,162 +5,212 @@ $version = 3; ?> - - - + -
-
-

- -
- -
-
-


-

- -

- -
- -

-
+
+
+

+ +
+


+

+ +

+ +
+ +

+ + +
+ +
+
- +
- -
From fd5e5046ca97ce3ce85b3dc6bf15bf8571b8014c Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Wed, 15 Apr 2026 16:36:46 +0100 Subject: [PATCH 2/7] dark theme --- Views/device_view.php | 328 +++++++++++++++++++++++++++++++++++------- 1 file changed, 279 insertions(+), 49 deletions(-) diff --git a/Views/device_view.php b/Views/device_view.php index c81447f..8356edb 100644 --- a/Views/device_view.php +++ b/Views/device_view.php @@ -9,21 +9,257 @@
-
-

-
-


+
+

+ +
+ +
+



@@ -33,62 +269,56 @@

- - -
+ -
+
+ +
Loading…
-
- +
+
+
From aa10883a1e47452cfff76b6478c65cd25412ea68 Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Wed, 15 Apr 2026 16:58:41 +0100 Subject: [PATCH 3/7] more styling --- Views/device_view.php | 153 +++++++++++++++++++++++++++--------------- 1 file changed, 99 insertions(+), 54 deletions(-) diff --git a/Views/device_view.php b/Views/device_view.php index 8356edb..33ce09a 100644 --- a/Views/device_view.php +++ b/Views/device_view.php @@ -10,14 +10,47 @@ - -
- -
+

-
+

@@ -304,13 +27,13 @@

-
+
-
- {{ groupName || '' }} - {{ group.length }} - +
+ {{ groupName || '' }} + {{ group.length }} +
@@ -340,17 +63,17 @@ - {{ d.nodeid }} - {{ d.name }} - {{ d.typename }} - {{ d.ip }} - {{ d.devicekey }} + {{ d.nodeid }} + {{ d.name }} + {{ d.typename }} + {{ d.ip }} + {{ d.devicekey }} - + - + @@ -358,10 +81,10 @@
-
Loading…
+
Loading…
-
- +
+
From a988bf223a8b5f3066f9f34b5906d52c719b49d5 Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Sun, 3 May 2026 08:15:41 +0100 Subject: [PATCH 5/7] basic changes to get modal to appear --- Views/device_dialog.css | 16 ++++++++-------- Views/device_dialog.js | 16 ++++++++-------- Views/device_dialog.php | 32 ++++++++++++++++---------------- Views/device_view.php | 3 +-- 4 files changed, 33 insertions(+), 34 deletions(-) diff --git a/Views/device_dialog.css b/Views/device_dialog.css index a6b4037..c3d709b 100644 --- a/Views/device_dialog.css +++ b/Views/device_dialog.css @@ -170,7 +170,7 @@ .table-inputs td:nth-of-type(6) { text-align: left; } -#device-config-modal.modal { +#device-config-modal.ec-modal { margin: 0; border-radius: 0; border: none; @@ -181,7 +181,7 @@ #device-config-body { padding: 0 } -#device-config-modal.modal .accordion-toggle { +#device-config-modal.ec-modal .accordion-toggle { white-space: nowrap; overflow: hidden; } @@ -210,19 +210,19 @@ font-size: 12px !important; font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace; } -#device-config-modal.modal .modal-content { +#device-config-modal.ec-modal .modal-content { margin-top: 0 } -#device-config-modal.modal .modal-sidebar { +#device-config-modal.ec-modal .modal-sidebar { margin: 0 } /* add horizontal padding to devices larger than iphone5 (320px)*/ @media (min-width: 340px) { - #device-config-modal.modal { + #device-config-modal.ec-modal { margin: 0 auto } - #device-config-modal.modal .modal-sidebar { + #device-config-modal.ec-modal .modal-sidebar { margin: 0 -1rem } #device-content { @@ -241,14 +241,14 @@ #device-content { left: 270px; } - #device-config-modal.modal { + #device-config-modal.ec-modal { margin: 0; border-radius: 6px; border: 1px solid rgba(0,0,0,0.3); width: 94%; left: 3%; } - #device-config-modal.modal .modal-sidebar { + #device-config-modal.ec-modal .modal-sidebar { margin: 0 -1rem } diff --git a/Views/device_dialog.js b/Views/device_dialog.js index a1593f6..7126f84 100644 --- a/Views/device_dialog.js +++ b/Views/device_dialog.js @@ -26,7 +26,7 @@ var device_dialog = }, 'drawConfig':function() { - $("#device-config-modal").modal('show'); + emoncmsModal.open('device-config-modal'); this.adjustConfigModal(); this.clearConfigModal(); @@ -280,7 +280,7 @@ var device_dialog = } } update(); - $('#device-config-modal').modal('hide'); + emoncmsModal.close('device-config-modal'); if (init) device_dialog.loadInit(); } else { @@ -290,17 +290,17 @@ var device_dialog = }); $("#device-delete").off('click').on('click', function () { - $('#device-config-modal').modal('hide'); + emoncmsModal.close('device-config-modal'); device_dialog.loadDelete(device_dialog.device, null); }); $("#device-init").off('click').on('click', function () { - $('#device-config-modal').modal('hide'); + emoncmsModal.close('device-config-modal'); device_dialog.loadInit(); }); $("#prepare-custom-template").off('click').on('click', function () { - $('#device-config-modal').modal('hide'); + emoncmsModal.close('device-config-modal'); device_dialog.loadInitCustom(); }); @@ -392,7 +392,7 @@ var device_dialog = 'drawInit': function (result) { - $('#device-init-modal').modal('show'); + emoncmsModal.open('device-init-modal'); device_dialog.adjustInitModal(); $('#device-init-modal-label').html('Initialize Device: '+device_dialog.device.name+''); @@ -577,7 +577,7 @@ var device_dialog = 'loadDelete': function(device, tablerow) { this.device = device; - $('#device-delete-modal').modal('show'); + emoncmsModal.open('device-delete-modal'); $('#device-delete-modal-label').html('Delete Device: '+device.name+''); // Initialize callbacks @@ -605,7 +605,7 @@ var device_dialog = update(); }); } - $('#device-delete-modal').modal('hide'); + emoncmsModal.close('device-delete-modal'); $('#wrap').trigger("device-delete"); }); } diff --git a/Views/device_dialog.php b/Views/device_dialog.php index 61ca5bc..ae83c18 100644 --- a/Views/device_dialog.php +++ b/Views/device_dialog.php @@ -1,14 +1,14 @@ - - + load_css("Modules/device/Views/device_dialog.css"); + load_js("Modules/device/Views/device_dialog.js"); +?> -
- - + +
-
+ -
- +
-
+ - + - -
+

From 4b3b72c22694848380590348c7555f892619c8f6 Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Sun, 3 May 2026 22:19:22 +0100 Subject: [PATCH 6/7] vue3 migration --- Views/device_view.php | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/Views/device_view.php b/Views/device_view.php index 2bf2f43..3f43104 100644 --- a/Views/device_view.php +++ b/Views/device_view.php @@ -1,12 +1,9 @@ - -
@@ -97,14 +94,15 @@ // The global update() below refreshes the Vue app anyway. var table = { remove: function() {}, timeServerLocalOffset: 0 }; - var deviceApp = new Vue({ - el: '#device-app', - data: { - deviceList: [], - collapsed: {}, - loading: false, - timeServerLocalOffset: 0, - updater: null + var deviceApp = Vue.createApp({ + data: function() { + return { + deviceList: [], + collapsed: {}, + loading: false, + timeServerLocalOffset: 0, + updater: null + }; }, computed: { groupedDevices: function() { @@ -147,7 +145,7 @@ if (interval > 0) this.updater = setInterval(this.update.bind(this), interval); }, toggleGroup: function(groupName) { - Vue.set(this.collapsed, groupName, !this.collapsed[groupName]); + this.collapsed[groupName] = !this.collapsed[groupName]; }, groupMaxTime: function(rows) { var max = 0; @@ -199,8 +197,12 @@ mounted: function() { this.update(); this.startUpdater(10000); + }, + beforeUnmount: function() { + clearInterval(this.updater); + this.updater = null; } - }); + }).mount('#device-app'); // Global update() so device_dialog.js can call it after delete/save function update() { deviceApp.update(); } From 3fdc47615e74c237127f7d1c3fa11a4bb5e66e72 Mon Sep 17 00:00:00 2001 From: Trystan Lea Date: Thu, 7 May 2026 15:05:40 +0100 Subject: [PATCH 7/7] card css --- Views/device_view.php | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/Views/device_view.php b/Views/device_view.php index 3f43104..5ea0d49 100644 --- a/Views/device_view.php +++ b/Views/device_view.php @@ -23,13 +23,14 @@

-
+
-
- {{ groupName || '' }} - {{ group.length }} - +
+ + {{ groupName || '' }} + {{ group.length }} +