[pve-devel] [PATCH manager 6/6] ui: add ACMEClusterView

[Dominik Csapak]

to show the list of accounts and defined plugins
for now we ignore 'standalone' plugins here and only show 'dns' ones

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

diff --git a/www/manager6/Makefile b/www/manager6/Makefile
index fb4c51bb..4deb7990 100644
--- a/www/manager6/Makefile
+++ b/www/manager6/Makefile
@@ -217,6 +217,7 @@ JSSRC= 				                 	\
 	ha/GroupEdit.js					\
 	ha/Groups.js					\
 	ha/Fencing.js					\
+	dc/ACMEClusterView.js					\
 	dc/ACMEPluginEdit.js				\
 	dc/Summary.js					\
 	grid/Replication.js				\
diff --git a/www/manager6/dc/ACMEClusterView.js b/www/manager6/dc/ACMEClusterView.js
new file mode 100644
index 00000000..a0bbd8a5
--- /dev/null
+++ b/www/manager6/dc/ACMEClusterView.js
@@ -0,0 +1,206 @@
+Ext.define('pve-acme-accounts', {
+    extend: 'Ext.data.Model',
+    fields: ['name'],
+    proxy: {
+	type: 'proxmox',
+	    url: "/api2/json/cluster/acme/account",
+    },
+    idProperty: 'name',
+});
+
+Ext.define('pve-acme-plugins', {
+    extend: 'Ext.data.Model',
+    fields: ['type', 'plugin'],
+    proxy: {
+	type: 'proxmox',
+	url: "/api2/json/cluster/acme/plugins",
+    },
+    idProperty: 'plugin',
+});
+
+Ext.define('PVE.dc.ACMEAccountView', {
+    extend: 'Ext.grid.Panel',
+    alias: 'widget.pveACMEAccountView',
+
+    title: gettext('Accounts'),
+
+    controller: {
+	xclass: 'Ext.app.ViewController',
+
+	addAccount: function() {
+	    let me = this;
+	    Ext.create('PVE.node.ACMEAccountCreate', {
+		taskDone: function() {
+		    me.reload();
+		},
+	    }).show();
+	},
+
+	viewAccount: function() {
+	    let me = this;
+	    let view = me.getView();
+	    let selection = view.getSelection();
+	    if (selection.length < 1) return;
+	    Ext.create('PVE.node.ACMEAccountView', {
+		accountname: selection[0].data.name,
+	    }).show();
+	},
+
+	reload: function() {
+	    let me = this;
+	    let view = me.getView();
+	    view.getStore().load();
+	},
+    },
+
+    columns: [
+	{
+	    dataIndex: 'name',
+	    text: gettext('Name'),
+	    renderer: Ext.String.htmlEncode,
+	    flex: 1,
+	},
+    ],
+
+    tbar: [
+	{
+	    xtype: 'proxmoxButton',
+	    text: gettext('Add'),
+	    selModel: false,
+	    handler: 'addAccount',
+	},
+	{
+	    xtype: 'proxmoxButton',
+	    text: gettext('View'),
+	    handler: 'viewAccount',
+	    disabled: true,
+	},
+	{
+	    xtype: 'proxmoxStdRemoveButton',
+	    baseurl: '/cluster/acme/account',
+	    callback: 'reload',
+	},
+    ],
+
+    listeners: {
+	itemdblclick: 'viewAccount',
+    },
+
+    store: {
+	model: 'pve-acme-accounts',
+	autoLoad: true,
+	sorters: 'name',
+    },
+});
+
+Ext.define('PVE.dc.ACMEPluginView', {
+    extend: 'Ext.grid.Panel',
+    alias: 'widget.pveACMEPluginView',
+
+    title: gettext('Plugins'),
+
+    controller: {
+	xclass: 'Ext.app.ViewController',
+
+	addPlugin: function() {
+	    let me = this;
+	    Ext.create('PVE.dc.ACMEPluginEditor', {
+		isCreate: true,
+		apiCallDone: function() {
+		    me.reload();
+		},
+	    }).show();
+	},
+
+	editPlugin: function() {
+	    let me = this;
+	    let view = me.getView();
+	    let selection = view.getSelection();
+	    if (selection.length < 1) return;
+	    let plugin = selection[0].data.plugin;
+	    Ext.create('PVE.dc.ACMEPluginEditor', {
+		url: `/cluster/acme/plugins/${plugin}`,
+		apiCallDone: function() {
+		    me.reload();
+		},
+	    }).show();
+	},
+
+	reload: function() {
+	    let me = this;
+	    let view = me.getView();
+	    view.getStore().load();
+	},
+    },
+
+    columns: [
+	{
+	    dataIndex: 'plugin',
+	    text: gettext('Plugin'),
+	    renderer: Ext.String.htmlEncode,
+	    flex: 1,
+	},
+	{
+	    dataIndex: 'api',
+	    text: gettext('API'),
+	    renderer: Ext.String.htmlEncode,
+	    flex: 1,
+	},
+    ],
+
+    tbar: [
+	{
+	    xtype: 'proxmoxButton',
+	    text: gettext('Add'),
+	    handler: 'addPlugin',
+	    selModel: false,
+	},
+	{
+	    xtype: 'proxmoxButton',
+	    text: gettext('Edit'),
+	    handler: 'editPlugin',
+	    disabled: true,
+	},
+	{
+	    xtype: 'proxmoxStdRemoveButton',
+	    baseurl: '/cluster/acme/plugins',
+	    callback: 'reload',
+	},
+    ],
+
+    listeners: {
+	itemdblclick: 'editPlugin',
+    },
+
+    store: {
+	model: 'pve-acme-plugins',
+	autoLoad: true,
+	filters: item => !!item.data.api,
+	sorters: 'plugin',
+    },
+});
+
+Ext.define('PVE.dc.ACMEClusterView', {
+    extend: 'Ext.panel.Panel',
+    alias: 'widget.pveACMEClusterView',
+
+    stateful: true,
+    stateId: 'grid-acme',
+
+    layout: 'border',
+
+    items: [
+	{
+	    region: 'west',
+	    width: '25%',
+	    border: false,
+	    split: true,
+	    xtype: 'pveACMEAccountView',
+	},
+	{
+	    region: 'center',
+	    border: false,
+	    xtype: 'pveACMEPluginView',
+	},
+    ],
+});
diff --git a/www/manager6/dc/Config.js b/www/manager6/dc/Config.js
index ec099494..905c3dc0 100644
--- a/www/manager6/dc/Config.js
+++ b/www/manager6/dc/Config.js
@@ -178,6 +178,16 @@ Ext.define('PVE.dc.Config', {
 		    itemId: 'sdnvnet'
 		});
 	    }
+
+	    if (Proxmox.UserName === 'root at pam') {
+		me.items.push({
+		    xtype: 'pveACMEClusterView',
+		    title: gettext('ACME'),
+		    iconCls: 'fa fa-certificate',
+		    itemId: 'acme'
+		});
+	    }
+
 	    me.items.push({
 		xtype: 'pveFirewallRules',
 		title: gettext('Firewall'),
-- 
2.20.1