[pve-devel] [PATCH manager 1/2] fix #5093: webui: acme: custom directory option
Folke Gleumes
f.gleumes at proxmox.com
Tue Jan 16 15:33:37 CET 2024
This patch allows the user to set a custom ACME directory by providing
a 'Custom' option in the directory dropdown. This in turn reveals an
input for the url. When using a custom directory the directory has to
be manually queried via button press to prevent from spamming the
directory on every input.
Signed-off-by: Folke Gleumes <f.gleumes at proxmox.com>
---
www/manager6/node/ACME.js | 140 +++++++++++++++++++++++++++++---------
1 file changed, 107 insertions(+), 33 deletions(-)
diff --git a/www/manager6/node/ACME.js b/www/manager6/node/ACME.js
index 21137b1a..5b71778a 100644
--- a/www/manager6/node/ACME.js
+++ b/www/manager6/node/ACME.js
@@ -10,6 +10,14 @@ Ext.define('PVE.node.ACMEAccountCreate', {
url: '/cluster/acme/account',
showTaskViewer: true,
defaultExists: false,
+ referenceHolder: true,
+ onlineHelp: "sysadmin_certs_acme_account",
+
+ viewModel: {
+ data: {
+ customDirectory: false,
+ },
+ },
items: [
{
@@ -30,12 +38,17 @@ Ext.define('PVE.node.ACMEAccountCreate', {
},
{
xtype: 'proxmoxComboGrid',
- name: 'directory',
- allowBlank: false,
+ notFoundIsValid: true,
+ isFormField: false,
valueField: 'url',
displayField: 'name',
fieldLabel: gettext('ACME Directory'),
store: {
+ listeners: {
+ 'load': function() {
+ this.add({ name: gettext("Custom"), url: '' });
+ },
+ },
autoLoad: true,
fields: ['name', 'url'],
idProperty: ['name'],
@@ -43,10 +56,6 @@ Ext.define('PVE.node.ACMEAccountCreate', {
type: 'proxmox',
url: '/api2/json/cluster/acme/directories',
},
- sorters: {
- property: 'name',
- direction: 'ASC',
- },
},
listConfig: {
columns: [
@@ -64,41 +73,93 @@ Ext.define('PVE.node.ACMEAccountCreate', {
},
listeners: {
change: function(combogrid, value) {
- var me = this;
- if (!value) {
- return;
- }
+ let me = this;
- var disp = me.up('window').down('#tos_url_display');
- var field = me.up('window').down('#tos_url');
- var checkbox = me.up('window').down('#tos_checkbox');
+ let vm = me.up('window').getViewModel();
+ let dirField = me.up('window').lookupReference('directoryInput');
+ let tosButton = me.up('window').lookupReference('queryTos');
- disp.setValue(gettext('Loading'));
- field.setValue(undefined);
- checkbox.setValue(undefined);
- checkbox.setHidden(true);
+ let isCustom = combogrid.getSelection().get('name') === gettext("Custom");
+ vm.set('customDirectory', isCustom);
- Proxmox.Utils.API2Request({
- url: '/cluster/acme/meta',
- method: 'GET',
- params: {
- directory: value,
+ dirField.setValue(value);
+
+ if (!isCustom) {
+ tosButton.click();
+ } else {
+ me.up('window').clearToSFields();
+ }
+ },
+ },
+ },
+ {
+ xtype: 'fieldcontainer',
+ layout: 'hbox',
+ fieldLabel: gettext('URL'),
+ bind: {
+ hidden: '{!customDirectory}',
+ },
+ items: [
+ {
+ xtype: 'proxmoxtextfield',
+ name: 'directory',
+ reference: 'directoryInput',
+ flex: 1,
+ allowBlank: false,
+ listeners: {
+ change: function(textbox, value) {
+ let me = this;
+ me.up('window').clearToSFields();
},
- success: function(response, opt) {
- if (response.result.data.termsOfService) {
- field.setValue(response.result.data.termsOfService);
- disp.setValue(response.result.data.termsOfService);
- checkbox.setHidden(false);
+ },
+ },
+ {
+ xtype: 'proxmoxButton',
+ margin: '0 0 0 5',
+ reference: 'queryTos',
+ text: gettext('Query URL'),
+ listeners: {
+ click: function(button) {
+ let me = this;
+
+ let w = me.up('window');
+ let disp = w.down('#tos_url_display');
+ let field = w.down('#tos_url');
+ let checkbox = w.down('#tos_checkbox');
+ let value = w.lookupReference('directoryInput').getValue();
+ w.clearToSFields();
+
+ if (!value) {
+ return;
} else {
- disp.setValue(undefined);
+ disp.setValue(gettext("Loading"));
}
+
+ Proxmox.Utils.API2Request({
+ url: '/cluster/acme/meta',
+ method: 'GET',
+ params: {
+ directory: value,
+ },
+ success: function(response, opt) {
+ if (response.result.data.termsOfService) {
+ field.setValue(response.result.data.termsOfService);
+ disp.setValue(response.result.data.termsOfService);
+ checkbox.setHidden(false);
+ } else {
+ checkbox.setValue(false);
+ disp.setValue("No terms of service agreement required");
+ }
+ },
+ failure: function(response, opt) {
+ disp.setValue(undefined);
+ Ext.Msg.alert(gettext('Error'), response.htmlStatus);
+ },
+ });
},
- failure: function(response, opt) {
- Ext.Msg.alert(gettext('Error'), response.htmlStatus);
- },
- });
+ },
},
- },
+ ],
},
{
xtype: 'displayfield',
@@ -125,6 +186,19 @@ Ext.define('PVE.node.ACMEAccountCreate', {
},
],
+ clearToSFields: function() {
+ let me = this;
+
+ let disp = me.down('#tos_url_display');
+ let field = me.down('#tos_url');
+ let checkbox = me.down('#tos_checkbox');
+
+ disp.setValue("Terms of service not fetched yet");
+ field.setValue(undefined);
+ checkbox.setValue(undefined);
+ checkbox.setHidden(true);
+ },
+
});
Ext.define('PVE.node.ACMEAccountView', {
--
2.39.2
More information about the pve-devel
mailing list