[pve-devel] [PATCH manager 3/4] add LVMThin list/create gui

[Dominik Csapak]

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 www/manager6/Makefile        |   1 +
 www/manager6/node/Config.js  |   7 ++
 www/manager6/node/LVMThin.js | 198 +++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 206 insertions(+)
 create mode 100644 www/manager6/node/LVMThin.js

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index f1ffe427..0077c873 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -99,6 +99,7 @@ JSSRC= 				                 	\
 	ceph/Config.js					\
 	node/Disks.js					\
 	node/LVM.js					\
+	node/LVMThin.js					\
 	node/StatusView.js				\
 	node/Summary.js					\
 	node/Subscription.js				\
diff --git a/www/manager6/node/Config.js b/www/manager6/node/Config.js
index c08398fc..fb70f39a 100644
--- a/www/manager6/node/Config.js
+++ b/www/manager6/node/Config.js
@@ -274,6 +274,13 @@ Ext.define('PVE.node.Config', {
 		    xtype: 'pveLVMList'
 		},
 		{
+		    title: 'LVM-Thin',
+		    itemId: 'lvmthin',
+		    iconCls: 'fa fa-square-o',
+		    groups: ['storage'],
+		    xtype: 'pveLVMThinList'
+		},
+		{
 		    title: 'Ceph',
 		    itemId: 'ceph',
 		    iconCls: 'fa fa-ceph',
diff --git a/www/manager6/node/LVMThin.js b/www/manager6/node/LVMThin.js
new file mode 100644
index 00000000..5edc8e8f
--- /dev/null
+++ b/www/manager6/node/LVMThin.js
@@ -0,0 +1,198 @@
+Ext.define('PVE.node.CreateLVMThin', {
+    extend: 'Proxmox.window.Edit',
+    xtype: 'pveCreateLVMThin',
+
+    subject: 'LVM Thinpool',
+
+    showProgress: true,
+
+    onlineHelp: 'chapter_storage',
+
+    initComponent : function() {
+        var me = this;
+
+	if (!me.nodename) {
+	    throw "no node name specified";
+	}
+
+	me.isCreate = true;
+
+        Ext.applyIf(me, {
+	    url: "/nodes/" + me.nodename + "/disks/lvmthin",
+	    method: 'POST',
+	    items: [
+		{
+		    xtype: 'pveDiskSelector',
+		    name: 'device',
+		    nodename: me.nodename,
+		    diskType: 'unused',
+		    fieldLabel: gettext('Disk'),
+		    allowBlank: false
+		},
+		{
+		    xtype: 'proxmoxtextfield',
+		    name: 'name',
+		    fieldLabel: gettext('Name'),
+		    allowBlank: false
+		},
+		{
+		    xtype: 'proxmoxcheckbox',
+		    name: 'add_storage',
+		    fieldLabel: gettext('Add Storage'),
+		    value: '1'
+		}
+            ]
+        });
+
+        me.callParent();
+    }
+});
+
+Ext.define('PVE.node.LVMThinList', {
+    extend: 'Ext.grid.Panel',
+    xtype: 'pveLVMThinList',
+
+    emptyText: gettext('No thinpools found'),
+    stateful: true,
+    stateId: 'grid-node-lvmthin',
+    columns: [
+	{
+	    text: gettext('Name'),
+	    dataIndex: 'lv',
+	    flex: 1
+	},
+	{
+	    header: gettext('Usage'),
+	    width: 110,
+	    dataIndex: 'usage',
+	    tdCls: 'x-progressbar-default-cell',
+	    xtype: 'widgetcolumn',
+	    widget: {
+		xtype: 'pveProgressBar'
+	    }
+	},
+	{
+	    header: gettext('Size'),
+	    width: 100,
+	    align: 'right',
+	    sortable: true,
+	    renderer: Proxmox.Utils.format_size,
+	    dataIndex: 'lv_size'
+	},
+	{
+	    header: gettext('Used'),
+	    width: 100,
+	    align: 'right',
+	    sortable: true,
+	    renderer: Proxmox.Utils.format_size,
+	    dataIndex: 'used'
+	},
+	{
+	    header: gettext('Metadata Usage'),
+	    width: 120,
+	    dataIndex: 'metadata_usage',
+	    tdCls: 'x-progressbar-default-cell',
+	    xtype: 'widgetcolumn',
+	    widget: {
+		xtype: 'pveProgressBar'
+	    }
+	},
+	{
+	    header: gettext('Metadata Size'),
+	    width: 120,
+	    align: 'right',
+	    sortable: true,
+	    renderer: Proxmox.Utils.format_size,
+	    dataIndex: 'metadata_size'
+	},
+	{
+	    header: gettext('Metadata Used'),
+	    width: 125,
+	    align: 'right',
+	    sortable: true,
+	    renderer: Proxmox.Utils.format_size,
+	    dataIndex: 'metadata_used'
+	}
+    ],
+
+    rootVisible: false,
+    useArrows: true,
+
+    tbar: [
+	{
+	    text: gettext('Reload'),
+	    iconCls: 'fa fa-refresh',
+	    handler: function() {
+		var me = this.up('panel');
+		me.reload();
+	    }
+	},
+	{
+	    text: gettext('Create') + ': Thinpool',
+	    handler: function() {
+		var me = this.up('panel');
+		var win = Ext.create('PVE.node.CreateLVMThin', {
+		    nodename: me.nodename,
+		    taskDone: function() {
+			me.reload();
+		    }
+		}).show();
+	    }
+	}
+    ],
+
+    reload: function() {
+	var me = this;
+	me.store.load();
+	me.store.sort();
+    },
+
+    listeners: {
+	activate: function() {
+	    var me = this;
+	    me.reload();
+	}
+    },
+
+    initComponent: function() {
+	 /*jslint confusion: true */
+        var me = this;
+
+	me.nodename = me.pveSelNode.data.node;
+	if (!me.nodename) {
+	    throw "no node name specified";
+	}
+
+	Ext.apply(me, {
+	    store: {
+		fields: ['lv', 'lv_size', 'used', 'metadata_size', 'metadata_used',
+		    {
+			type: 'number',
+			name: 'usage',
+			calculate: function(data) {
+			    return data.used/data.lv_size;
+			}
+		    },
+		    {
+			type: 'number',
+			name: 'metadata_usage',
+			calculate: function(data) {
+			    return data.metadata_used/data.metadata_size;
+			}
+		    }
+		],
+		proxy: {
+		    type: 'proxmox',
+		    url: "/api2/json/nodes/" + me.nodename + '/disks/lvmthin'
+		},
+		sorters: 'lv'
+	    }
+	});
+
+	me.callParent();
+
+	Proxmox.Utils.monStoreErrors(me, me.getStore(), true);
+	me.reload();
+    }
+});
+
-- 
2.11.0