From 1b66fd71fb99474a265f679ebc8f1e6dc58852fb Mon Sep 17 00:00:00 2001 From: Dietmar Maurer Date: Fri, 3 Apr 2015 11:21:22 +0200 Subject: [PATCH] implement GUI to manage ha groups --- www/manager/Makefile | 1 + www/manager/ha/GroupEdit.js | 110 ++++++++++++++++++++++++++++++++++++ www/manager/ha/Groups.js | 53 ++++++++++++++++- 3 files changed, 162 insertions(+), 2 deletions(-) create mode 100644 www/manager/ha/GroupEdit.js diff --git a/www/manager/Makefile b/www/manager/Makefile index 719dced8..bb7736ca 100644 --- a/www/manager/Makefile +++ b/www/manager/Makefile @@ -167,6 +167,7 @@ JSSRC= \ storage/ZFSPoolEdit.js \ ha/StatusView.js \ ha/Resources.js \ + ha/GroupEdit.js \ ha/Groups.js \ ha/Fencing.js \ ha/Config.js \ diff --git a/www/manager/ha/GroupEdit.js b/www/manager/ha/GroupEdit.js new file mode 100644 index 00000000..4cdc51be --- /dev/null +++ b/www/manager/ha/GroupEdit.js @@ -0,0 +1,110 @@ +Ext.define('PVE.ha.GroupInputPanel', { + extend: 'PVE.panel.InputPanel', + + groupId: undefined, + + onGetValues: function(values) { + var me = this; + + if (me.create) { + values.type = 'group'; + } + + return values; + }, + + initComponent : function() { + var me = this; + + me.column1 = [ + { + xtype: me.create ? 'textfield' : 'displayfield', + name: 'group', + height: 22, // hack: set same height as text fields + value: me.groupId || '', + fieldLabel: 'ID', + vtype: 'StorageId', + allowBlank: false + }, + { + xtype: 'PVE.form.NodeSelector', + name: 'nodes', + fieldLabel: gettext('Nodes'), + allowBlank: false, + multiSelect: true, + autoSelect: false + } + ]; + + me.column2 = [ + { + xtype: 'pvecheckbox', + name: 'restricted', + uncheckedValue: 0, + fieldLabel: gettext('restricted') + }, + { + xtype: 'pvecheckbox', + name: 'nofailback', + uncheckedValue: 0, + fieldLabel: gettext('nofailback') + }, + ]; + + me.columnB = [ + { + xtype: 'textfield', + name: 'comment', + fieldLabel: gettext('Comment') + } + ]; + + me.callParent(); + } +}); + +Ext.define('PVE.ha.GroupEdit', { + extend: 'PVE.window.Edit', + + groupId: undefined, + + initComponent : function() { + var me = this; + + me.create = !me.groupId; + + if (me.create) { + me.url = '/api2/extjs/cluster/ha/groups'; + me.method = 'POST'; + } else { + me.url = '/api2/extjs/cluster/ha/groups/' + me.groupId; + me.method = 'PUT'; + } + + var ipanel = Ext.create('PVE.ha.GroupInputPanel', { + create: me.create, + groupId: me.groupId + }); + + Ext.apply(me, { + subject: gettext('HA Groups'), + items: [ ipanel ] + }); + + me.callParent(); + + if (!me.create) { + me.load({ + success: function(response, options) { + var values = response.result.data; + + if (values.nodes) { + values.nodes = values.nodes.split(','); + } + + ipanel.setValues(values); + } + }); + } + } +}); diff --git a/www/manager/ha/Groups.js b/www/manager/ha/Groups.js index acfc46bf..edee6364 100644 --- a/www/manager/ha/Groups.js +++ b/www/manager/ha/Groups.js @@ -23,6 +23,44 @@ Ext.define('PVE.ha.GroupsView', { var sm = Ext.create('Ext.selection.RowModel', {}); + var run_editor = function() { + var rec = sm.getSelection()[0]; + + var win = Ext.create('PVE.ha.GroupEdit',{ + groupId: rec.data.group + }); + win.on('destroy', reload); + win.show(); + }; + + var remove_btn = new PVE.button.Button({ + text: gettext('Remove'), + disabled: true, + selModel: sm, + handler: function(btn, event, rec) { + var group = rec.data.group; + + PVE.Utils.API2Request({ + url: '/cluster/ha/groups/' + group, + method: 'DELETE', + waitMsgTarget: me, + callback: function() { + reload(); + }, + failure: function (response, opts) { + Ext.Msg.alert(gettext('Error'), response.htmlStatus); + } + }); + } + }); + + var edit_btn = new PVE.button.Button({ + text: gettext('Edit'), + disabled: true, + selModel: sm, + handler: run_editor + }); + Ext.apply(me, { store: store, selModel: sm, @@ -30,6 +68,17 @@ Ext.define('PVE.ha.GroupsView', { viewConfig: { trackOver: false }, + tbar: [ + { + text: gettext('Create'), + handler: function() { + var win = Ext.create('PVE.ha.GroupEdit',{}); + win.on('destroy', reload); + win.show(); + } + }, + edit_btn, remove_btn + ], columns: [ { header: gettext('Group'), @@ -53,12 +102,12 @@ Ext.define('PVE.ha.GroupsView', { }, { header: gettext('Nodes'), - width: 500, + flex: 1, sortable: false, dataIndex: 'nodes' }, { - header: gettext('Description'), + header: gettext('Comment'), flex: 1, dataIndex: 'comment' }