[pve-devel] [PATCH manager 1/1] ui: use ZFS components and functions from widget-toolkit

Dominik Csapak d.csapak at proxmox.com
Thu Jun 25 13:59:33 CEST 2020


render_zfs_health is now in widget-toolkit
as well as the 'MultiDiskSelector' and the Detailwindow

and drop the now unnecessary classes

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 www/manager6/Utils.js    |  26 ----
 www/manager6/node/ZFS.js | 255 +--------------------------------------
 2 files changed, 6 insertions(+), 275 deletions(-)

diff --git a/www/manager6/Utils.js b/www/manager6/Utils.js
index 1dae292e..37327ded 100644
--- a/www/manager6/Utils.js
+++ b/www/manager6/Utils.js
@@ -193,32 +193,6 @@ Ext.define('PVE.Utils', { utilities: {
 	return state;
     },
 
-    render_zfs_health: function(value) {
-	if (typeof value == 'undefined'){
-	    return "";
-	}
-	var iconCls = 'question-circle';
-	switch (value) {
-	    case 'AVAIL':
-	    case 'ONLINE':
-		iconCls = 'check-circle good';
-		break;
-	    case 'REMOVED':
-	    case 'DEGRADED':
-		iconCls = 'exclamation-circle warning';
-		break;
-	    case 'UNAVAIL':
-	    case 'FAULTED':
-	    case 'OFFLINE':
-		iconCls = 'times-circle critical';
-		break;
-	    default: //unknown
-	}
-
-	return '<i class="fa fa-' + iconCls + '"></i> ' + value;
-
-    },
-
     get_kvm_osinfo: function(value) {
 	var info = { base: 'Other' }; // default
 	if (value) {
diff --git a/www/manager6/node/ZFS.js b/www/manager6/node/ZFS.js
index 0b63ccd7..3c83361f 100644
--- a/www/manager6/node/ZFS.js
+++ b/www/manager6/node/ZFS.js
@@ -19,24 +19,6 @@ Ext.define('PVE.node.CreateZFS', {
 
 	me.isCreate = true;
 
-	var update_disklist = function() {
-	    var grid = me.down('#disklist');
-	    var disks = grid.getSelection();
-
-	    var val = [];
-	    disks.sort(function(a,b) {
-		var aorder = a.get('order') || 0;
-		var border = b.get('order') || 0;
-		return (aorder - border);
-	    });
-
-	    disks.forEach(function(disk) {
-		val.push(disk.get('devpath'));
-	    });
-
-	    me.down('field[name=devices]').setValue(val.join(','));
-	};
-
 	Ext.apply(me, {
 	    url: '/nodes/' + me.nodename + '/disks/zfs',
 	    method: 'POST',
@@ -47,12 +29,6 @@ Ext.define('PVE.node.CreateZFS', {
 			return values;
 		    },
 		    column1: [
-			{
-			    xtype: 'textfield',
-			    hidden: true,
-			    name: 'devices',
-			    allowBlank: false
-			},
 			{
 			    xtype: 'proxmoxtextfield',
 			    name: 'name',
@@ -106,62 +82,11 @@ Ext.define('PVE.node.CreateZFS', {
 		    ],
 		    columnB: [
 			{
-			    xtype: 'grid',
+			    xtype: 'pmxMultiDiskSelector',
+			    name: 'devices',
+			    nodename: me.nodename,
 			    height: 200,
 			    emptyText: gettext('No Disks unused'),
-			    itemId: 'disklist',
-			    selModel: 'checkboxmodel',
-			    listeners: {
-				selectionchange: update_disklist
-			    },
-			    store: {
-				proxy: {
-				    type: 'proxmox',
-				    url: '/api2/json/nodes/' + me.nodename + '/disks/list?type=unused'
-				}
-			    },
-			    columns: [
-				{
-				    text: gettext('Device'),
-				    dataIndex: 'devpath',
-				    flex: 2,
-				},
-				{
-				    text: gettext('Model'),
-				    dataIndex: 'model',
-				    flex: 2,
-				},
-				{
-				    text: gettext('Serial'),
-				    dataIndex: 'serial',
-				    flex: 2,
-				},
-				{
-				    text: gettext('Size'),
-				    dataIndex: 'size',
-				    renderer: PVE.Utils.render_size,
-				    flex: 1,
-				},
-				{
-				    header: gettext('Order'),
-				    xtype: 'widgetcolumn',
-				    dataIndex: 'order',
-				    sortable: true,
-				    flex: 1,
-				    widget: {
-					xtype: 'proxmoxintegerfield',
-					minValue: 1,
-					isFormField: false,
-					listeners: {
-					    change: function(numberfield, value, old_value) {
-						var record = numberfield.getWidgetRecord();
-						record.set('order', value);
-						update_disklist(record);
-					    }
-					}
-				    }
-				}
-			    ]
 			}
 		    ]
 		},
@@ -177,137 +102,6 @@ Ext.define('PVE.node.CreateZFS', {
 	});
 
         me.callParent();
-	me.down('#disklist').getStore().load();
-    }
-});
-
-Ext.define('PVE.node.ZFSDevices', {
-    extend: 'Ext.tree.Panel',
-    xtype: 'pveZFSDevices',
-    stateful: true,
-    stateId: 'grid-node-zfsstatus',
-    columns: [
-	{
-	    xtype: 'treecolumn',
-	    text: gettext('Name'),
-	    dataIndex: 'name',
-	    flex: 1
-	},
-	{
-	    text: gettext('Health'),
-	    renderer: PVE.Utils.render_zfs_health,
-	    dataIndex: 'state'
-	},
-	{
-	    text: 'READ',
-	    dataIndex: 'read'
-	},
-	{
-	    text: 'WRITE',
-	    dataIndex: 'write'
-	},
-	{
-	    text: 'CKSUM',
-	    dataIndex: 'cksum'
-	},
-	{
-	    text: gettext('Message'),
-	    dataIndex: 'msg'
-	}
-    ],
-
-    rootVisible: true,
-
-    reload: function() {
-	var me = this;
-	var sm = me.getSelectionModel();
-	Proxmox.Utils.API2Request({
-	    url: "/nodes/" + me.nodename + "/disks/zfs/" + me.zpool,
-	    waitMsgTarget: me,
-	    method: 'GET',
-	    failure: function(response, opts) {
-		Proxmox.Utils.setErrorMask(me, response.htmlStatus);
-	    },
-	    success: function(response, opts) {
-		sm.deselectAll();
-		me.setRootNode(response.result.data);
-		me.expandAll();
-	    }
-	});
-    },
-
-    initComponent: function() {
-        var me = this;
-
-	if (!me.nodename) {
-	    throw "no node name specified";
-	}
-
-	if (!me.zpool) {
-	    throw "no zpool specified";
-	}
-
-	var sm = Ext.create('Ext.selection.TreeModel', {});
-
-	Ext.apply(me, {
-	    selModel: sm,
-	    fields: ['name', 'status',
-		{
-		    type: 'string',
-		    name: 'iconCls',
-		    calculate: function(data) {
-			var txt = 'fa x-fa-tree fa-';
-			if (data.leaf) {
-			    return txt + 'hdd-o';
-			}
-		    }
-		}
-	    ],
-	    sorters: 'name'
-	});
-
-	me.callParent();
-
-	me.reload();
-    }
-});
-
-Ext.define('PVE.node.ZFSStatus', {
-    extend: 'Proxmox.grid.ObjectGrid',
-    xtype: 'pveZFSStatus',
-    layout: 'fit',
-    border: false,
-
-    initComponent: function() {
-        var me = this;
-
-	if (!me.nodename) {
-	    throw "no node name specified";
-	}
-
-	if (!me.zpool) {
-	    throw "no zpool specified";
-	}
-
-	me.url = "/api2/extjs/nodes/" + me.nodename + "/disks/zfs/" + me.zpool;
-
-	me.rows = {
-	    scan: {
-		header: gettext('Scan')
-	    },
-	    status: {
-		header: gettext('Status')
-	    },
-	    action: {
-		header: gettext('Action')
-	    },
-	    errors: {
-		header: gettext('Errors')
-	    }
-	};
-
-	me.callParent();
-	me.reload();
     }
 });
 
@@ -347,7 +141,7 @@ Ext.define('PVE.node.ZFSList', {
 	},
 	{
 	    header: gettext('Health'),
-	    renderer: PVE.Utils.render_zfs_health,
+	    renderer: Proxmox.Utils.render_zfs_health,
 	    dataIndex: 'health'
 	},
 	{
@@ -400,46 +194,9 @@ Ext.define('PVE.node.ZFSList', {
     show_detail: function(zpool) {
 	var me = this;
 
-	var detailsgrid = Ext.create('PVE.node.ZFSStatus', {
-	    layout: 'fit',
-	    nodename: me.nodename,
-	    flex: 0,
-	    zpool: zpool
-	});
-
-	var devicetree = Ext.create('PVE.node.ZFSDevices', {
-	    title: gettext('Devices'),
+	Ext.create('Proxmox.window.ZFSDetail', {
+	    zpool: zpool,
 	    nodename: me.nodename,
-	    flex: 1,
-	    zpool: zpool
-	});
-
-
-	var win = Ext.create('Ext.window.Window', {
-	    modal: true,
-	    width: 800,
-	    height: 400,
-	    resizable: true,
-	    layout: 'fit',
-	    title: gettext('Status') + ': ' + zpool,
-	    items:[{
-		xtype: 'panel',
-		region: 'center',
-		layout: {
-		    type: 'vbox',
-		    align: 'stretch'
-		},
-		items: [detailsgrid, devicetree],
-		tbar: [{
-		    text: gettext('Reload'),
-		    iconCls: 'fa fa-refresh',
-		    handler: function() {
-
-			devicetree.reload();
-			detailsgrid.reload();
-		    }
-		}]
-	    }]
 	}).show();
     },
 
-- 
2.20.1





More information about the pve-devel mailing list