From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from firstgate.proxmox.com (firstgate.proxmox.com [212.224.123.68]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by lists.proxmox.com (Postfix) with ESMTPS id 55D3674873 for ; Mon, 19 Apr 2021 13:02:11 +0200 (CEST) Received: from firstgate.proxmox.com (localhost [127.0.0.1]) by firstgate.proxmox.com (Proxmox) with ESMTP id 53CBA14FCE for ; Mon, 19 Apr 2021 13:02:11 +0200 (CEST) Received: from proxmox-new.maurer-it.com (proxmox-new.maurer-it.com [212.186.127.180]) (using TLSv1.3 with cipher TLS_AES_256_GCM_SHA384 (256/256 bits) key-exchange X25519 server-signature RSA-PSS (2048 bits)) (No client certificate requested) by firstgate.proxmox.com (Proxmox) with ESMTPS id 6104214F5E for ; Mon, 19 Apr 2021 13:02:08 +0200 (CEST) Received: from proxmox-new.maurer-it.com (localhost.localdomain [127.0.0.1]) by proxmox-new.maurer-it.com (Proxmox) with ESMTP id 2BA9645B65 for ; Mon, 19 Apr 2021 13:02:08 +0200 (CEST) From: Dominik Csapak To: pbs-devel@lists.proxmox.com Date: Mon, 19 Apr 2021 13:02:04 +0200 Message-Id: <20210419110206.28498-5-d.csapak@proxmox.com> X-Mailer: git-send-email 2.20.1 In-Reply-To: <20210419110206.28498-1-d.csapak@proxmox.com> References: <20210419110206.28498-1-d.csapak@proxmox.com> MIME-Version: 1.0 Content-Transfer-Encoding: 8bit X-SPAM-LEVEL: Spam detection results: 0 AWL 0.157 Adjusted score from AWL reputation of From: address KAM_DMARC_STATUS 0.01 Test Rule for DKIM or SPF Failure with Strict Alignment RCVD_IN_DNSWL_MED -2.3 Sender listed at https://www.dnswl.org/, medium trust SPF_HELO_NONE 0.001 SPF: HELO does not publish an SPF Record SPF_PASS -0.001 SPF: sender matches SPF record Subject: [pbs-devel] [PATCH proxmox-backup 4/6] ui: factor out NodeInfoPanel X-BeenThere: pbs-devel@lists.proxmox.com X-Mailman-Version: 2.1.29 Precedence: list List-Id: Proxmox Backup Server development discussion List-Unsubscribe: , List-Archive: List-Post: List-Help: List-Subscribe: , X-List-Received-Date: Mon, 19 Apr 2021 11:02:11 -0000 so that Dashboard.js will be less cluttered when we add more information there. No functional change, but reworked the fingerprint button disabling to use a property of the view instead of a viewmodel Signed-off-by: Dominik Csapak --- www/Dashboard.js | 123 ++-------------------------------- www/Makefile | 1 + www/panel/NodeInfo.js | 151 ++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 156 insertions(+), 119 deletions(-) create mode 100644 www/panel/NodeInfo.js diff --git a/www/Dashboard.js b/www/Dashboard.js index 52107a8e..88f3cd5d 100644 --- a/www/Dashboard.js +++ b/www/Dashboard.js @@ -69,72 +69,6 @@ Ext.define('PBS.Dashboard', { me.lookup('subscription').setSubStatus(subStatus); }, - updateUsageStats: function(store, records, success) { - if (!success) { - return; - } - if (records === undefined || records.length < 1) { - return; - } - let me = this; - let viewmodel = me.getViewModel(); - - let res = records[0].data; - viewmodel.set('fingerprint', res.info.fingerprint || Proxmox.Utils.unknownText); - - let cpu = res.cpu, - mem = res.memory, - root = res.root; - - var cpuPanel = me.lookup('cpu'); - cpuPanel.updateValue(cpu); - - var memPanel = me.lookup('mem'); - memPanel.updateValue(mem.used / mem.total); - - var hdPanel = me.lookup('root'); - hdPanel.updateValue(root.used / root.total); - }, - - showFingerPrint: function() { - let me = this; - let vm = me.getViewModel(); - let fingerprint = vm.get('fingerprint'); - Ext.create('Ext.window.Window', { - modal: true, - width: 600, - title: gettext('Fingerprint'), - layout: 'form', - bodyPadding: '10 0', - items: [ - { - xtype: 'textfield', - inputId: 'fingerprintField', - value: fingerprint, - editable: false, - }, - ], - buttons: [ - { - xtype: 'button', - iconCls: 'fa fa-clipboard', - handler: function(b) { - var el = document.getElementById('fingerprintField'); - el.select(); - document.execCommand("copy"); - }, - text: gettext('Copy'), - }, - { - text: gettext('Ok'), - handler: function() { - this.up('window').close(); - }, - }, - ], - }).show(); - }, - updateTasks: function(store, records, success) { if (!success) return; let me = this; @@ -182,31 +116,14 @@ Ext.define('PBS.Dashboard', { viewModel: { data: { - fingerprint: "", days: 30, }, formulas: { - disableFPButton: (get) => get('fingerprint') === "", sinceEpoch: (get) => (Date.now()/1000 - get('days') * 24*3600).toFixed(0), }, stores: { - usage: { - storeid: 'dash-usage', - type: 'update', - interval: 3000, - autoStart: true, - autoLoad: true, - autoDestroy: true, - proxy: { - type: 'proxmox', - url: '/api2/json/nodes/localhost/status', - }, - listeners: { - load: 'updateUsageStats', - }, - }, subscription: { storeid: 'dash-subscription', type: 'update', @@ -271,43 +188,11 @@ Ext.define('PBS.Dashboard', { items: [ { - height: 250, - iconCls: 'fa fa-tasks', - title: gettext('Server Resources'), - bodyPadding: '0 20 0 20', - tools: [ - { - xtype: 'button', - text: gettext('Show Fingerprint'), - handler: 'showFingerPrint', - bind: { - disabled: '{disableFPButton}', - }, - }, - ], - layout: { - type: 'hbox', - align: 'center', - }, - defaults: { - xtype: 'proxmoxGauge', - spriteFontSize: '20px', - flex: 1, + xtype: 'pbsNodeInfoPanel', + bind: { + store: '{stores.usage}', }, - items: [ - { - title: gettext('CPU'), - reference: 'cpu', - }, - { - title: gettext('Memory'), - reference: 'mem', - }, - { - title: gettext('Root Disk'), - reference: 'root', - }, - ], + height: 250, }, { xtype: 'pbsDatastoresStatistics', diff --git a/www/Makefile b/www/Makefile index 2b847e74..e01b8ddf 100644 --- a/www/Makefile +++ b/www/Makefile @@ -81,6 +81,7 @@ JSSRC= \ panel/AccessControl.js \ panel/StorageAndDisks.js \ panel/UsageChart.js \ + panel/NodeInfo.js \ ZFSList.js \ DirectoryList.js \ LoginView.js \ diff --git a/www/panel/NodeInfo.js b/www/panel/NodeInfo.js new file mode 100644 index 00000000..ca9ebb21 --- /dev/null +++ b/www/panel/NodeInfo.js @@ -0,0 +1,151 @@ +Ext.define('PBS.NodeInfoPanel', { + extend: 'Ext.panel.Panel', + alias: 'widget.pbsNodeInfoPanel', + + iconCls: 'fa fa-tasks', + title: gettext('Server Resources'), + + controller: { + xclass: 'Ext.app.ViewController', + + showFingerPrint: function() { + let me = this; + let view = me.getView(); + let fingerprint = view.fingerprint; + Ext.create('Ext.window.Window', { + modal: true, + width: 600, + title: gettext('Fingerprint'), + layout: 'form', + bodyPadding: '10 0', + items: [ + { + xtype: 'textfield', + inputId: 'fingerprintField', + value: fingerprint, + editable: false, + }, + ], + buttons: [ + { + xtype: 'button', + iconCls: 'fa fa-clipboard', + handler: function(b) { + var el = document.getElementById('fingerprintField'); + el.select(); + document.execCommand("copy"); + }, + text: gettext('Copy'), + }, + { + text: gettext('Ok'), + handler: function() { + this.up('window').close(); + }, + }, + ], + }).show(); + }, + + updateUsageStats: function(store, records, success) { + if (!success) { + return; + } + if (records === undefined || records.length < 1) { + return; + } + let me = this; + let view = me.getView(); + + let res = records[0].data; + view.fingerprint = res.info.fingerprint; + + me.lookup('fpButton').setDisabled(!view.fingerprint); + + let cpu = res.cpu, + mem = res.memory, + root = res.root; + + var cpuPanel = me.lookup('cpu'); + cpuPanel.updateValue(cpu); + + var memPanel = me.lookup('mem'); + memPanel.updateValue(mem.used / mem.total); + + var hdPanel = me.lookup('root'); + hdPanel.updateValue(root.used / root.total); + }, + + init: function(view) { + let me = this; + + view.store = Ext.create('Proxmox.data.UpdateStore', { + interval: 3000, + proxy: { + type: 'proxmox', + url: '/api2/json/nodes/localhost/status', + }, + }); + + me.mon(view.store, 'load', me.updateUsageStats, me); + + view.store.startUpdate(); + }, + + startStore: function() { + let me = this; + let view = me.getView(); + view.store.startUpdate(); + }, + + stopStore: function() { + let me = this; + let view = me.getView(); + view.store.stopUpdate(); + }, + }, + + listeners: { + activate: 'startStore', + deactivate: 'stopStore', + destroy: 'stopStore', + }, + + bodyPadding: '0 20 0 20', + + tools: [ + { + xtype: 'button', + reference: 'fpButton', + text: gettext('Show Fingerprint'), + handler: 'showFingerPrint', + disabled: true, + }, + ], + + layout: { + type: 'hbox', + align: 'center', + }, + + defaults: { + xtype: 'proxmoxGauge', + spriteFontSize: '20px', + flex: 1, + }, + + items: [ + { + title: gettext('CPU'), + reference: 'cpu', + }, + { + title: gettext('Memory'), + reference: 'mem', + }, + { + title: gettext('Root Disk'), + reference: 'root', + }, + ], +}); -- 2.20.1