From: Leo Nunner <l.nunner@proxmox.com>
To: pve-devel@lists.proxmox.com
Subject: [pve-devel] [PATCH v2 manager 2/2] lxc: show IPs in summary view
Date: Thu, 15 Jun 2023 11:43:33 +0200 [thread overview]
Message-ID: <20230615094333.66179-4-l.nunner@proxmox.com> (raw)
In-Reply-To: <20230615094333.66179-1-l.nunner@proxmox.com>
modelled after the QEMU Guest Agent UI. We only show the first
non-loopback IP on the summary page itself.
Signed-off-by: Leo Nunner <l.nunner@proxmox.com>
---
www/manager6/Makefile | 1 +
www/manager6/lxc/ContainerIPView.js | 194 ++++++++++++++++++++++++++
www/manager6/panel/GuestStatusView.js | 12 +-
www/manager6/panel/GuestSummary.js | 2 +-
4 files changed, 207 insertions(+), 2 deletions(-)
create mode 100644 www/manager6/lxc/ContainerIPView.js
diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index 71ab928ff..2e967d949 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -180,6 +180,7 @@ JSSRC= \
lxc/ResourceEdit.js \
lxc/Resources.js \
lxc/MultiMPEdit.js \
+ lxc/ContainerIPView.js \
menu/MenuItem.js \
menu/TemplateMenu.js \
ceph/CephInstallWizard.js \
diff --git a/www/manager6/lxc/ContainerIPView.js b/www/manager6/lxc/ContainerIPView.js
new file mode 100644
index 000000000..69b107af3
--- /dev/null
+++ b/www/manager6/lxc/ContainerIPView.js
@@ -0,0 +1,194 @@
+Ext.define('PVE.window.ContainerIPInfo', {
+ extend: 'Ext.window.Window',
+ width: 600,
+ title: gettext('Container Network Information'),
+ height: 300,
+ layout: {
+ type: 'fit',
+ },
+ modal: true,
+ items: [
+ {
+ xtype: 'grid',
+ store: {},
+ emptyText: gettext('No network information'),
+ columns: [
+ {
+ dataIndex: 'name',
+ text: gettext('Name'),
+ flex: 2,
+ },
+ {
+ dataIndex: 'hwaddr',
+ text: gettext('MAC address'),
+ width: 140,
+ },
+ {
+ dataIndex: 'inet',
+ text: gettext('IPv4 address'),
+ align: 'right',
+ flex: 3,
+ },
+ {
+ dataIndex: 'inet6',
+ text: gettext('IPv6 address'),
+ align: 'right',
+ flex: 4,
+ },
+ ],
+ },
+ ],
+});
+
+Ext.define('PVE.lxc.IPView', {
+ extend: 'Ext.container.Container',
+ xtype: 'pveContainerIPView',
+
+ layout: {
+ type: 'hbox',
+ align: 'top',
+ },
+
+ items: [
+ {
+ xtype: 'box',
+ html: '<i class="fa fa-exchange"></i> IPs',
+ },
+ {
+ xtype: 'container',
+ flex: 1,
+ layout: {
+ type: 'vbox',
+ align: 'right',
+ pack: 'end',
+ },
+ items: [
+ {
+ xtype: 'label',
+ flex: 1,
+ itemId: 'ipBox',
+ style: {
+ 'text-align': 'right',
+ },
+ },
+ {
+ xtype: 'button',
+ itemId: 'moreBtn',
+ hidden: true,
+ ui: 'default-toolbar',
+ handler: function(btn) {
+ let view = this.up('pveContainerIPView');
+
+ var win = Ext.create('PVE.window.ContainerIPInfo');
+ win.down('grid').getStore().setData(view.ifaces);
+ win.show();
+ },
+ text: gettext('More'),
+ },
+ ],
+ },
+ ],
+
+ getDefaultIps: function(ifaces) {
+ var me = this;
+ var ips = [];
+ ifaces.forEach(function(iface) {
+ // We only want to show the first non-loopback interface
+ if (!ips.length &&
+ iface.data.hwaddr &&
+ iface.data.hwaddr !== '00:00:00:00:00:00' &&
+ iface.data.hwaddr !== '0:0:0:0:0:0') {
+ ips.push(iface.data.inet);
+ ips.push(iface.data.inet6);
+ }
+ });
+
+ return ips;
+ },
+
+ startIPStore: function(store, records, success) {
+ var me = this;
+ let state = store.getById('status');
+
+ me.running = state && state.data.value === 'running';
+
+ var caps = Ext.state.Manager.get('GuiCap');
+
+ if (!caps.vms['VM.Monitor']) {
+ var errorText = gettext("Requires '{0}' Privileges");
+ me.updateStatus(false, Ext.String.format(errorText, 'VM.Monitor'));
+ return;
+ }
+
+ if (me.running && me.ipStore.isStopped) {
+ me.ipStore.startUpdate();
+ } else if (me.ipStore.isStopped) {
+ me.updateStatus();
+ }
+ },
+
+ updateStatus: function(unsuccessful, defaulttext) {
+ var me = this;
+ var text = defaulttext || gettext('No network information');
+ var more = false;
+ if (Ext.isArray(me.ifaces) && me.ifaces.length) {
+ more = true;
+ var ips = me.getDefaultIps(me.ifaces);
+ if (ips.length !== 0) {
+ text = ips.join('<br>');
+ }
+ }
+
+ var ipBox = me.down('#ipBox');
+ ipBox.update(text);
+
+ var moreBtn = me.down('#moreBtn');
+ moreBtn.setVisible(more);
+ },
+
+ initComponent: function() {
+ var me = this;
+
+ if (!me.rstore) {
+ throw 'rstore not given';
+ }
+
+ if (!me.pveSelNode) {
+ throw 'pveSelNode not given';
+ }
+
+ var nodename = me.pveSelNode.data.node;
+ var vmid = me.pveSelNode.data.vmid;
+
+ me.ipStore = Ext.create('Proxmox.data.UpdateStore', {
+ interval: 10000,
+ storeid: 'lxc-interfaces-' + vmid,
+ method: 'GET',
+ proxy: {
+ type: 'proxmox',
+ url: '/api2/json/nodes/' + nodename + '/lxc/' + vmid + '/interfaces',
+ },
+ });
+
+ me.callParent();
+
+ me.mon(me.ipStore, 'load', function(store, records, success) {
+ if (records && records.length) {
+ me.ifaces = records;
+ } else {
+ me.ifaces = undefined;
+ }
+ me.updateStatus(!success);
+ });
+
+ me.on('destroy', me.ipStore.stopUpdate, me.ipStore);
+
+ // if we already have info about the guest, use it immediately
+ if (me.rstore.getCount()) {
+ me.startIPStore(me.rstore, me.rstore.getData(), false);
+ }
+
+ // check if the guest agent is there on every statusstore load
+ me.mon(me.rstore, 'load', me.startIPStore, me);
+ },
+});
diff --git a/www/manager6/panel/GuestStatusView.js b/www/manager6/panel/GuestStatusView.js
index 8db1f492c..7a093bb34 100644
--- a/www/manager6/panel/GuestStatusView.js
+++ b/www/manager6/panel/GuestStatusView.js
@@ -113,7 +113,7 @@ Ext.define('PVE.panel.GuestStatusView', {
height: 15,
},
{
- itemId: 'ips',
+ itemId: 'agentIPs',
xtype: 'pveAgentIPView',
cbind: {
rstore: '{rstore}',
@@ -122,6 +122,16 @@ Ext.define('PVE.panel.GuestStatusView', {
disabled: '{isLxc}',
},
},
+ {
+ itemId: 'ctIPS',
+ xtype: 'pveContainerIPView',
+ cbind: {
+ rstore: '{rstore}',
+ pveSelNode: '{pveSelNode}',
+ hidden: '{!isLxc}',
+ disabled: '{!isLxc}',
+ },
+ },
],
updateTitle: function() {
diff --git a/www/manager6/panel/GuestSummary.js b/www/manager6/panel/GuestSummary.js
index 1565db3f6..049b63aa9 100644
--- a/www/manager6/panel/GuestSummary.js
+++ b/www/manager6/panel/GuestSummary.js
@@ -54,7 +54,7 @@ Ext.define('PVE.guest.Summary', {
items = [
{
xtype: 'container',
- height: 300,
+ height: 350,
layout: {
type: 'hbox',
align: 'stretch',
--
2.30.2
prev parent reply other threads:[~2023-06-15 9:43 UTC|newest]
Thread overview: 9+ messages / expand[flat|nested] mbox.gz Atom feed top
2023-06-15 9:43 [pve-devel] [PATCH v2 container manager] Show dynamic container IPs in GUI Leo Nunner
2023-06-15 9:43 ` [pve-devel] [PATCH v2 container] api: network: get interfaces from containers Leo Nunner
2023-11-14 16:43 ` DERUMIER, Alexandre
2023-11-14 17:00 ` Thomas Lamprecht
2023-11-14 17:34 ` DERUMIER, Alexandre
2023-11-14 18:23 ` [pve-devel] applied: " Thomas Lamprecht
2023-06-15 9:43 ` [pve-devel] [PATCH v2 manager 1/2] lxc: show dynamically assigned IPs in network tab Leo Nunner
2023-11-15 20:51 ` DERUMIER, Alexandre
2023-06-15 9:43 ` Leo Nunner [this message]
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=20230615094333.66179-4-l.nunner@proxmox.com \
--to=l.nunner@proxmox.com \
--cc=pve-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