[pve-devel] [PATCH manager] ui: improve vm/container migration user experience

Philipp Hufnagl p.hufnagl at proxmox.com
Tue Sep 5 15:51:22 CEST 2023


After the implementation of fix #474, it has been suggested that
instead of requiring the user to click a checkbox allowing migration,
it should be allowed automatically and and a warning should be displayed

Further it has been discussed to rename the feature from "transfer" to
"migrate". However and API change would break already implemented usage
and so it has been decided to call it (for now) transfer everywhere to
avoid confusion

Signed-off-by: Philipp Hufnagl <p.hufnagl at proxmox.com>
---
 www/manager6/grid/PoolMembers.js | 29 ++++++++++++++++++++++-------
 1 file changed, 22 insertions(+), 7 deletions(-)

diff --git a/www/manager6/grid/PoolMembers.js b/www/manager6/grid/PoolMembers.js
index 224daca3..d6fa0278 100644
--- a/www/manager6/grid/PoolMembers.js
+++ b/www/manager6/grid/PoolMembers.js
@@ -35,6 +35,20 @@ Ext.define('PVE.pool.AddVM', {
 	    ],
 	});
 
+	let transferWarning = Ext.create('Ext.form.field.Display', {
+	    userCls: 'pmx-hint',
+	    value: gettext('One or more vms or container will be removed from their old pool'),
+	    hidden: true,
+	});
+
+	let transfer = Ext.create('Ext.form.field.Checkbox', {
+	    name: 'transfer',
+	    boxLabel: gettext('Allow Transfer'),
+	    inputValue: 1,
+	    hidden: true,
+	    value: 0,
+	});
+
 	var vmGrid = Ext.create('widget.grid', {
 	    store: vmStore,
 	    border: true,
@@ -46,9 +60,15 @@ Ext.define('PVE.pool.AddVM', {
 		listeners: {
 		    selectionchange: function(model, selected, opts) {
 			var selectedVms = [];
+			var isTransfer = false;
 			selected.forEach(function(vm) {
 			    selectedVms.push(vm.data.vmid);
+			    if (vm.data.pool !== '') {
+				isTransfer = true;
+			    }
 			});
+			transfer.setValue(isTransfer);
+			transferWarning.setHidden(!isTransfer);
 			vmsField.setValue(selectedVms);
 		    },
 		},
@@ -90,15 +110,10 @@ Ext.define('PVE.pool.AddVM', {
 	    ],
 	});
 
-	let transfer = Ext.create('Ext.form.field.Checkbox', {
-	    name: 'transfer',
-	    boxLabel: gettext('Allow Transfer'),
-	    inputValue: 1,
-	    value: 0,
-	});
+
 	Ext.apply(me, {
 	    subject: gettext('Virtual Machine'),
-	    items: [vmsField, vmGrid, transfer],
+	    items: [vmsField, vmGrid, transferWarning, transfer],
 	});
 
 	me.callParent();
-- 
2.39.2






More information about the pve-devel mailing list