From: Dominik Csapak <d.csapak@proxmox.com>
To: pbs-devel@lists.proxmox.com
Subject: [pbs-devel] [PATCH proxmox-backup v9 7/7] ui: add MetricServerView and use it
Date: Fri, 10 Jun 2022 13:17:57 +0200 [thread overview]
Message-ID: <20220610111757.2788694-9-d.csapak@proxmox.com> (raw)
In-Reply-To: <20220610111757.2788694-1-d.csapak@proxmox.com>
simple CRUD interface to show/add/edit/delete metric servers
it's a bit different from PVE's so it's harder to reuse that than to
copy it. If we need it again, we can still refactor and combine them.
introduce 'PBS.Schema' class to hold the server type/xtype mappings
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
www/Makefile | 2 +
www/Schema.js | 15 ++++
www/SystemConfiguration.js | 6 ++
www/config/MetricServerView.js | 128 +++++++++++++++++++++++++++++++++
4 files changed, 151 insertions(+)
create mode 100644 www/Schema.js
create mode 100644 www/config/MetricServerView.js
diff --git a/www/Makefile b/www/Makefile
index 3a36daba..4aa2b026 100644
--- a/www/Makefile
+++ b/www/Makefile
@@ -36,6 +36,7 @@ TAPE_UI_FILES= \
JSSRC= \
Utils.js \
+ Schema.js \
form/TokenSelector.js \
form/AuthidSelector.js \
form/RemoteSelector.js \
@@ -62,6 +63,7 @@ JSSRC= \
config/WebauthnView.js \
config/CertificateView.js \
config/NodeOptionView.js \
+ config/MetricServerView.js \
window/ACLEdit.js \
window/BackupFileDownloader.js \
window/BackupGroupChangeOwner.js \
diff --git a/www/Schema.js b/www/Schema.js
new file mode 100644
index 00000000..dcd47a4a
--- /dev/null
+++ b/www/Schema.js
@@ -0,0 +1,15 @@
+Ext.define('PBS.Schema', {
+
+ singleton: true,
+
+ metricServer: {
+ 'influxdb-http': {
+ type: 'InfluxDB (HTTP)',
+ xtype: 'InfluxDbHttp',
+ },
+ 'influxdb-udp': {
+ type: 'InfluxDB (UDP)',
+ xtype: 'InfluxDbUdp',
+ },
+ },
+});
diff --git a/www/SystemConfiguration.js b/www/SystemConfiguration.js
index cdc9de35..ddb6ece5 100644
--- a/www/SystemConfiguration.js
+++ b/www/SystemConfiguration.js
@@ -45,6 +45,12 @@ Ext.define('PBS.SystemConfiguration', {
},
],
},
+ {
+ title: gettext('Metric Server'),
+ iconCls: 'fa fa-bar-chart',
+ xtype: 'pbsMetricServerView',
+ itemId: 'metrics',
+ },
{
xtype: 'panel',
title: gettext('Other'),
diff --git a/www/config/MetricServerView.js b/www/config/MetricServerView.js
new file mode 100644
index 00000000..5aaf81b6
--- /dev/null
+++ b/www/config/MetricServerView.js
@@ -0,0 +1,128 @@
+Ext.define('PBS.config.MetricServerView', {
+ extend: 'Ext.grid.Panel',
+ alias: ['widget.pbsMetricServerView'],
+
+ stateful: true,
+ stateId: 'grid-metricserver',
+
+ controller: {
+ xclass: 'Ext.app.ViewController',
+
+ editWindow: function(xtype, id) {
+ let me = this;
+ Ext.create(`PBS.window.${xtype}Edit`, {
+ serverid: id,
+ autoShow: true,
+ autoLoad: !!id,
+ listeners: {
+ destroy: () => me.reload(),
+ },
+ });
+ },
+
+ addServer: function(button) {
+ this.editWindow(PBS.Schema.metricServer[button.type]?.xtype);
+ },
+
+ editServer: function() {
+ let me = this;
+ let view = me.getView();
+ let selection = view.getSelection();
+ if (!selection || selection.length < 1) {
+ return;
+ }
+
+ let cfg = selection[0].data;
+
+ me.editWindow(PBS.Schema.metricServer[cfg.type]?.xtype, cfg.name);
+ },
+
+ reload: function() {
+ this.getView().getStore().load();
+ },
+ },
+
+ store: {
+ autoLoad: true,
+ id: 'metricservers',
+ proxy: {
+ type: 'proxmox',
+ url: '/api2/json/admin/metrics',
+ },
+ },
+
+ columns: [
+ {
+ text: gettext('Name'),
+ flex: 2,
+ dataIndex: 'name',
+ },
+ {
+ text: gettext('Type'),
+ width: 150,
+ dataIndex: 'type',
+ renderer: (v) => PBS.Schema.metricServer[v]?.type ?? v,
+ },
+ {
+ text: gettext('Enabled'),
+ dataIndex: 'disable',
+ width: 100,
+ renderer: Proxmox.Utils.format_neg_boolean,
+ },
+ {
+ text: gettext('Target Server'),
+ width: 200,
+ dataIndex: 'server',
+ },
+ {
+ text: gettext('Comment'),
+ flex: 3,
+ dataIndex: 'comment',
+ renderer: Ext.htmlEncode,
+ },
+ ],
+
+ tbar: [
+ {
+ text: gettext('Add'),
+ menu: [
+ {
+ text: 'InfluxDB (HTTP)',
+ type: 'influxdb-http',
+ iconCls: 'fa fa-fw fa-bar-chart',
+ handler: 'addServer',
+ },
+ {
+ text: 'InfluxDB (UDP)',
+ type: 'influxdb-udp',
+ iconCls: 'fa fa-fw fa-bar-chart',
+ handler: 'addServer',
+ },
+ ],
+ },
+ {
+ text: gettext('Edit'),
+ xtype: 'proxmoxButton',
+ handler: 'editServer',
+ disabled: true,
+ },
+ {
+ xtype: 'proxmoxStdRemoveButton',
+ getUrl: (rec) => `/api2/extjs/config/metrics/${rec.data.type}/${rec.data.name}`,
+ getRecordName: (rec) => rec.data.name,
+ callback: 'reload',
+ },
+ ],
+
+ listeners: {
+ itemdblclick: 'editServer',
+ },
+
+ initComponent: function() {
+ var me = this;
+
+ me.callParent();
+
+ Proxmox.Utils.monStoreErrors(me, me.getStore());
+ },
+});
--
2.30.2
next prev parent reply other threads:[~2022-06-10 11:18 UTC|newest]
Thread overview: 11+ messages / expand[flat|nested] mbox.gz Atom feed top
2022-06-10 11:17 [pbs-devel] [PATCH proxmox/proxmox-backup v9] add metrics server capability Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox v9 1/1] proxmox-metrics: send_data_to_channels: change from slice to IntoIterator Dominik Csapak
2022-06-13 8:04 ` [pbs-devel] applied: " Wolfgang Bumiller
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 1/7] pbs-api-types: add metrics api types Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 2/7] pbs-config: add metrics config class Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 3/7] backup-proxy: decouple stats gathering from rrd update Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 4/7] proxmox-backup-proxy: send metrics to configured metrics server Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 5/7] api: add metricserver endpoints Dominik Csapak
2022-06-10 11:17 ` [pbs-devel] [PATCH proxmox-backup v9 6/7] ui: add window/InfluxDbEdit Dominik Csapak
2022-06-10 11:17 ` Dominik Csapak [this message]
2022-06-13 8:06 ` [pbs-devel] applied-series: [PATCH proxmox/proxmox-backup v9] add metrics server capability Wolfgang Bumiller
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
--in-reply-to=20220610111757.2788694-9-d.csapak@proxmox.com \
--to=d.csapak@proxmox.com \
--cc=pbs-devel@lists.proxmox.com \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox