[pve-devel] [PATCH V8 pve-manager 12/17] sdn: display pending values

Alexandre Derumier aderumier at odiso.com
Fri Nov 27 15:23:40 CET 2020


Signed-off-by: Alexandre Derumier <aderumier at odiso.com>
---
 www/manager6/Utils.js              | 29 ++++++++++++++++++
 www/manager6/sdn/ControllerView.js | 39 +++++++++++++++++++++---
 www/manager6/sdn/SubnetView.js     | 49 +++++++++++++++++++++++++++---
 www/manager6/sdn/VnetView.js       | 31 +++++++++++++++++--
 www/manager6/sdn/ZoneView.js       | 47 +++++++++++++++++++++++++---
 5 files changed, 181 insertions(+), 14 deletions(-)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 5440b972..257af3fd 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -175,6 +175,35 @@ Ext.define('PVE.Utils', { utilities: {
 	'HEALTH_ERR':'critical'
     },
 
+    render_sdn_pending: function(rec,value,key, index) {
+        if (rec.data.state === 'deleted') {
+            if (value === undefined) {
+                return '';
+            } else {
+                return '<div style="text-decoration: line-through;">'+ value +'</div>';
+            }
+
+        } else if (rec.data.state === 'new') {
+            if(index === undefined) {
+                value = rec.data.pending[key];
+            }
+            if (value === undefined || value === null) {
+                value = '';
+            }
+            return '<div style="color:green">' + value + '</div>';
+        } else if (rec.data.state === 'changed') {
+            if (value === undefined || value === null) {
+                value = '<br>';
+            }
+            if (rec.data.pending[key] === undefined || rec.data.pending[key] === null) {
+                rec.data.pending[key] = value;
+            }
+           return '<div style="text-decoration: line-through;">'+ value +'</div>' + '<div style="color:orange">' + rec.data.pending[key] + '</div>';
+        } else {
+            return value;
+        }
+    },
+
     render_ceph_health: function(healthObj) {
 	var state = {
 	    iconCls: PVE.Utils.get_health_icon(),
diff --git a/www/manager6/sdn/ControllerView.js b/www/manager6/sdn/ControllerView.js
index 4fdcdecd..e4730be0 100644
--- a/www/manager6/sdn/ControllerView.js
+++ b/www/manager6/sdn/ControllerView.js
@@ -31,7 +31,7 @@ Ext.define('PVE.sdn.ControllerView', {
 	    model: 'pve-sdn-controller',
 	    proxy: {
                 type: 'proxmox',
-		url: "/api2/json/cluster/sdn/controllers"
+		url: "/api2/json/cluster/sdn/controllers?pending=1"
 	    },
 	    sorters: {
 		property: 'controller',
@@ -45,6 +45,16 @@ Ext.define('PVE.sdn.ControllerView', {
 
 	var sm = Ext.create('Ext.selection.RowModel', {});
 
+	var set_button_status = function() {
+	    var rec = me.selModel.getSelection()[0];
+
+	    if (!rec || rec.data.state === 'deleted') {
+		edit_btn.disable();
+		remove_btn.disable();
+		return;
+	    }
+	};
+
 	var run_editor = function() {
 	    var rec = sm.getSelection()[0];
 	    if (!rec) {
@@ -109,19 +119,40 @@ Ext.define('PVE.sdn.ControllerView', {
 		    header: 'ID',
 		    flex: 2,
 		    sortable: true,
-		    dataIndex: 'controller'
+		    dataIndex: 'controller',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'controller', 1);
+                    }
 		},
 		{
 		    header: gettext('Type'),
 		    flex: 1,
 		    sortable: true,
 		    dataIndex: 'type',
-		    renderer: PVE.Utils.format_sdncontroller_type
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'type', 1);
+                    }
 		},
+                {
+                    header: gettext('Pending'),
+                    flex: 3,
+                    dataIndex: 'pending',
+                    renderer: function(value, metaData, rec) {
+                        if(value !== undefined ) {
+                                delete value.controller;
+                                delete value.type;
+				if(!Ext.Object.isEmpty(value)){
+				    return JSON.stringify(value);
+				}
+                        }
+                        return '';
+                    }
+                }
 	    ],
 	    listeners: {
 		activate: reload,
-		itemdblclick: run_editor
+		itemdblclick: run_editor,
+                selectionchange: set_button_status
 	    }
 	});
 
diff --git a/www/manager6/sdn/SubnetView.js b/www/manager6/sdn/SubnetView.js
index 96240617..0c04ddf1 100644
--- a/www/manager6/sdn/SubnetView.js
+++ b/www/manager6/sdn/SubnetView.js
@@ -20,7 +20,7 @@ Ext.define('PVE.sdn.SubnetView', {
             me.remove_btn.baseurl = url + '/';
             me.store.setProxy({
                 type: 'proxmox',
-                url: '/api2/json/' + url
+                url: '/api2/json/' + url + '?pending=1'
             });
 
             me.store.load();
@@ -40,6 +40,16 @@ Ext.define('PVE.sdn.SubnetView', {
 
 	let sm = Ext.create('Ext.selection.RowModel', {});
 
+	var set_button_status = function() {
+	    var rec = me.selModel.getSelection()[0];
+
+	    if (!rec || rec.data.state === 'deleted') {
+		edit_btn.disable();
+		remove_btn.disable();
+		return;
+	    }
+	};
+
         let run_editor = function() {
 	    let rec = sm.getSelection()[0];
 
@@ -92,27 +102,58 @@ Ext.define('PVE.sdn.SubnetView', {
 		{
 		    header: 'ID',
 		    flex: 2,
-		    dataIndex: 'cidr'
+		    dataIndex: 'cidr',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'cidr', 1);
+                    }
 		},
 		{
 		    header: gettext('Gateway'),
 		    flex: 1,
 		    dataIndex: 'gateway',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'gateway');
+                    }
 		},
 		{
 		    header: 'SNAT',
 		    flex: 1,
 		    dataIndex: 'snat',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'snat');
+                    }
 		},
 		{
 		    header: 'Ipam',
 		    flex: 1,
 		    dataIndex: 'ipam',
-		}
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'ipam');
+                    }
+		},
+                {
+                    header: gettext('Pending'),
+                    flex: 3,
+                    dataIndex: 'pending',
+                    renderer: function(value, metaData, rec) {
+                        if(value !== undefined ) {
+                                delete value.cidr;
+                                delete value.gateway;
+                                delete value.snat;
+                                delete value.ipam;
+				if(!Ext.Object.isEmpty(value)){
+				    return JSON.stringify(value);
+				}
+                        }
+                        return '';
+                    }
+                },
+
 	    ],
 	    listeners: {
 		activate: reload,
-		itemdblclick: run_editor
+		itemdblclick: run_editor,
+                selectionchange: set_button_status
 	    }
 	});
 
diff --git a/www/manager6/sdn/VnetView.js b/www/manager6/sdn/VnetView.js
index e3d86c9a..da0234dd 100644
--- a/www/manager6/sdn/VnetView.js
+++ b/www/manager6/sdn/VnetView.js
@@ -16,17 +16,28 @@ Ext.define('PVE.sdn.VnetView', {
 	    model: 'pve-sdn-vnet',
 	    proxy: {
                 type: 'proxmox',
-		url: "/api2/json/cluster/sdn/vnets"
+		url: "/api2/json/cluster/sdn/vnets?pending=1"
 	    },
 	    sorters: {
 		property: 'vnet',
 		order: 'DESC'
 	    }
 	});
+
 	let reload = () => store.load();
 
 	let sm = Ext.create('Ext.selection.RowModel', {});
 
+	var set_button_status = function() {
+	    var rec = me.selModel.getSelection()[0];
+
+	    if (!rec || rec.data.state === 'deleted') {
+		edit_btn.disable();
+ 		remove_btn.disable();
+		return;
+ 	    }
+	};
+
         let run_editor = function() {
 	    let rec = sm.getSelection()[0];
 
@@ -77,32 +88,48 @@ Ext.define('PVE.sdn.VnetView', {
 		{
 		    header: 'ID',
 		    flex: 2,
-		    dataIndex: 'vnet'
+		    dataIndex: 'vnet',
+                    renderer: function(value, metaData, rec) {
+			return PVE.Utils.render_sdn_pending(rec, value, 'vnet', 1);
+		    }
 		},
 		{
 		    header: gettext('Alias'),
 		    flex: 1,
 		    dataIndex: 'alias',
+                    renderer: function(value, metaData, rec) {
+			return PVE.Utils.render_sdn_pending(rec, value, 'alias');
+		    }
 		},
 		{
 		    header: gettext('Zone'),
 		    flex: 1,
 		    dataIndex: 'zone',
+                    renderer: function(value, metaData, rec) {
+			return PVE.Utils.render_sdn_pending(rec, value, 'zone');
+		    }
 		},
 		{
 		    header: gettext('Tag'),
 		    flex: 1,
 		    dataIndex: 'tag',
+                    renderer: function(value, metaData, rec) {
+			return PVE.Utils.render_sdn_pending(rec, value, 'tag');
+		    }
 		},
 		{
 		    header: gettext('VLAN Aware'),
 		    flex: 1,
 		    dataIndex: 'vlanaware',
+                    renderer: function(value, metaData, rec) {
+			return PVE.Utils.render_sdn_pending(rec, value, 'vlanaware');
+		    }
 		}
 	    ],
 	    listeners: {
 		activate: reload,
 		itemdblclick: run_editor,
+		selectionchange: set_button_status,
                 show: reload,
                 select: function(sm, rec) {
                     var url = '/cluster/sdn/vnets/' + rec.data.vnet + '/subnets';
diff --git a/www/manager6/sdn/ZoneView.js b/www/manager6/sdn/ZoneView.js
index 7b664537..b530bd5f 100644
--- a/www/manager6/sdn/ZoneView.js
+++ b/www/manager6/sdn/ZoneView.js
@@ -31,7 +31,7 @@ Ext.define('PVE.sdn.ZoneView', {
 	    model: 'pve-sdn-zone',
 	    proxy: {
                 type: 'proxmox',
-		url: "/api2/json/cluster/sdn/zones"
+		url: "/api2/json/cluster/sdn/zones?pending=1"
 	    },
 	    sorters: {
 		property: 'zone',
@@ -45,6 +45,16 @@ Ext.define('PVE.sdn.ZoneView', {
 
 	let sm = Ext.create('Ext.selection.RowModel', {});
 
+	var set_button_status = function() {
+	    var rec = me.selModel.getSelection()[0];
+
+	    if (!rec || rec.data.state === 'deleted') {
+		edit_btn.disable();
+		remove_btn.disable();
+ 		return;
+ 	    }
+	};
+
 	let run_editor = function() {
 	    let rec = sm.getSelection()[0];
 	    if (!rec) {
@@ -108,28 +118,57 @@ Ext.define('PVE.sdn.ZoneView', {
 		{
 		    header: 'ID',
 		    flex: 2,
-		    dataIndex: 'zone'
+		    dataIndex: 'zone',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'zone', 1);
+                    }
 		},
 		{
 		    header: gettext('Type'),
 		    flex: 1,
 		    dataIndex: 'type',
-		    renderer: PVE.Utils.format_sdnzone_type
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'type', 1);
+                    }
 		},
 		{
 		    header: 'MTU',
 		    flex: 1,
 		    dataIndex: 'mtu',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'mtu');
+                    }
 		},
 		{
 		    header: gettext('Nodes'),
 		    flex: 3,
 		    dataIndex: 'nodes',
+                    renderer: function(value, metaData, rec) {
+                        return PVE.Utils.render_sdn_pending(rec, value, 'nodes');
+                    }
+		},
+		{
+		    header: gettext('Pending'),
+		    flex: 3,
+		    dataIndex: 'pending',
+                    renderer: function(value, metaData, rec) {
+			if(value !== undefined ) {
+				delete value.nodes;
+				delete value.zone;
+				delete value.type;
+				delete value.mtu;
+				if(!Ext.Object.isEmpty(value)){
+				    return JSON.stringify(value);
+ 				}
+			}
+			return '';
+                    }
 		},
 	    ],
 	    listeners: {
 		activate: reload,
-		itemdblclick: run_editor
+		itemdblclick: run_editor,
+                selectionchange: set_button_status
 	    }
 	});
 
-- 
2.20.1





More information about the pve-devel mailing list