Signed-off-by: Dominik Csapak <d.csa...@proxmox.com> --- www/manager6/Makefile | 5 +- www/manager6/dc/AuthEdit.js | 108 +--------------------- www/manager6/form/TFASelector.js | 148 +++++++++++++++++++++++++++++++ 3 files changed, 153 insertions(+), 108 deletions(-) create mode 100644 www/manager6/form/TFASelector.js
diff --git a/www/manager6/Makefile b/www/manager6/Makefile index 3aa2b87b..095c4c08 100644 --- a/www/manager6/Makefile +++ b/www/manager6/Makefile @@ -69,8 +69,9 @@ JSSRC= \ form/CephPoolSelector.js \ form/PermPathSelector.js \ form/SpiceEnhancementSelector.js \ - form/SDNZoneSelector.js \ - form/SDNControllerSelector.js \ + form/SDNZoneSelector.js \ + form/SDNControllerSelector.js \ + form/TFASelector.js \ dc/Tasks.js \ dc/Log.js \ panel/StatusPanel.js \ diff --git a/www/manager6/dc/AuthEdit.js b/www/manager6/dc/AuthEdit.js index fa926ad6..1a62e550 100644 --- a/www/manager6/dc/AuthEdit.js +++ b/www/manager6/dc/AuthEdit.js @@ -123,72 +123,9 @@ Ext.define('PVE.dc.AuthEdit', { ); } - // Two Factor Auth settings - - column2.push({ - xtype: 'proxmoxKVComboBox', - name: 'tfa', - deleteEmpty: !me.isCreate, - value: '', - fieldLabel: gettext('TFA'), - comboItems: [ ['__default__', Proxmox.Utils.noneText], ['oath', 'OATH'], ['yubico', 'Yubico']], - listeners: { - change: function(f, value) { - if (!me.rendered) { - return; - } - me.down('field[name=oath_step]').setVisible(value === 'oath'); - me.down('field[name=oath_digits]').setVisible(value === 'oath'); - me.down('field[name=yubico_api_id]').setVisible(value === 'yubico'); - me.down('field[name=yubico_api_key]').setVisible(value === 'yubico'); - me.down('field[name=yubico_url]').setVisible(value === 'yubico'); - } - } - }); - - column2.push({ - xtype: 'proxmoxintegerfield', - name: 'oath_step', - value: '', - minValue: 10, - emptyText: Proxmox.Utils.defaultText + ' (30)', - submitEmptyText: false, - hidden: true, - fieldLabel: 'OATH time step' - }); - column2.push({ - xtype: 'proxmoxintegerfield', - name: 'oath_digits', - value: '', - minValue: 6, - maxValue: 8, - emptyText: Proxmox.Utils.defaultText + ' (6)', - submitEmptyText: false, - hidden: true, - fieldLabel: 'OATH password length' - }); - - column2.push({ - xtype: 'textfield', - name: 'yubico_api_id', - hidden: true, - fieldLabel: 'Yubico API Id' - }); - - column2.push({ - xtype: 'textfield', - name: 'yubico_api_key', - hidden: true, - fieldLabel: 'Yubico API Key' - }); - - column2.push({ - xtype: 'textfield', - name: 'yubico_url', - hidden: true, - fieldLabel: 'Yubico URL' - }); + xtype: 'pveTFASelector', + }); var ipanel = Ext.create('Proxmox.panel.InputPanel', { column1: column1, @@ -210,31 +147,6 @@ Ext.define('PVE.dc.AuthEdit', { values.type = me.authType; } - if (values.tfa === 'oath') { - values.tfa = "type=oath"; - if (values.oath_step) { - values.tfa += ",step=" + values.oath_step; - } - if (values.oath_digits) { - values.tfa += ",digits=" + values.oath_digits; - } - } else if (values.tfa === 'yubico') { - values.tfa = "type=yubico"; - values.tfa += ",id=" + values.yubico_api_id; - values.tfa += ",key=" + values.yubico_api_key; - if (values.yubico_url) { - values.tfa += ",url=" + values.yubico_url; - } - } else { - delete values.tfa; - } - - delete values.oath_step; - delete values.oath_digits; - delete values.yubico_api_id; - delete values.yubico_api_key; - delete values.yubico_url; - return values; } }); @@ -260,22 +172,6 @@ Ext.define('PVE.dc.AuthEdit', { throw "got wrong auth type"; } - if (data.tfa) { - var tfacfg = PVE.Parser.parseTfaConfig(data.tfa); - data.tfa = tfacfg.type; - if (tfacfg.type === 'yubico') { - data.yubico_api_key = tfacfg.key; - data.yubico_api_id = tfacfg.id; - data.yubico_url = tfacfg.url; - } else if (tfacfg.type === 'oath') { - // step is a number before - /*jslint confusion: true*/ - data.oath_step = tfacfg.step; - data.oath_digits = tfacfg.digits; - /*jslint confusion: false*/ - } - } - me.setValues(data); } }); diff --git a/www/manager6/form/TFASelector.js b/www/manager6/form/TFASelector.js new file mode 100644 index 00000000..d5334f8a --- /dev/null +++ b/www/manager6/form/TFASelector.js @@ -0,0 +1,148 @@ +Ext.define('PVE.form.TFASelector', { + extend: 'Ext.container.Container', + xtype: 'pveTFASelector', + + viewModel: { + data: { + type: '__default__', + step: null, + digits: null, + id: null, + key: null, + url: null, + }, + + formulas: { + isOath: (get) => get('type') === 'oath', + isYubico: (get) => get('type') === 'yubico', + tfavalue: { + get: function(get) { + let val = { + type: get('type'), + }; + if (get('isOath')) { + let step = get('step'); + let digits = get('digits'); + if (step) { + val.step = step; + } + if (digits) { + val.digits = digits; + } + } else if (get('isYubico')) { + let id = get('id'); + let key = get('key'); + let url = get('url'); + val.id = id; + val.key = key; + if (url) { + val.url = url; + } + } else if (val.type === '__default__') { + return ""; + } + + return PVE.Parser.printPropertyString(val); + }, + set: function(value) { + let val = PVE.Parser.parseTfaConfig(value); + this.set(val); + this.notify(); + // we need to reset the original values, so that + // we can reliably track the state of the form + let form = this.getView().up('form'); + if (form.trackResetOnLoad) { + let fields = this.getView().query('field[name!="tfa"]'); + fields.forEach((field) => field.resetOriginalValue()); + } + }, + }, + }, + }, + + items: [ + { + xtype: 'proxmoxtextfield', + name: 'tfa', + hidden: true, + submitValue: true, + deleteEmpty: true, + bind: { + value: "{tfavalue}", + }, + }, + { + xtype: 'proxmoxKVComboBox', + value: '__default__', + deleteEmpty: false, + submitValue: false, + fieldLabel: gettext('TFA'), + comboItems: [['__default__', Proxmox.Utils.noneText], ['oath', 'OATH'], ['yubico', 'Yubico']], + bind: { + value: "{type}", + }, + }, + { + xtype: 'proxmoxintegerfield', + hidden: true, + minValue: 10, + submitValue: false, + emptyText: Proxmox.Utils.defaultText + ' (30)', + fieldLabel: 'OATH time step', + bind: { + value: "{step}", + hidden: "{!isOath}", + disabled: "{!isOath}", + }, + }, + { + xtype: 'proxmoxintegerfield', + hidden: true, + submitValue: false, + fieldLabel: 'OATH password length', + minValue: 6, + maxValue: 8, + emptyText: Proxmox.Utils.defaultText + ' (6)', + bind: { + value: "{digits}", + hidden: "{!isOath}", + disabled: "{!isOath}", + }, + }, + { + xtype: 'textfield', + hidden: true, + submitValue: false, + allowBlank: false, + fieldLabel: 'Yubico API Id', + bind: { + value: "{id}", + hidden: "{!isYubico}", + disabled: "{!isYubico}", + }, + }, + { + xtype: 'textfield', + hidden: true, + submitValue: false, + allowBlank: false, + fieldLabel: 'Yubico API Key', + bind: { + value: "{key}", + hidden: "{!isYubico}", + disabled: "{!isYubico}", + }, + }, + { + xtype: 'textfield', + hidden: true, + submitValue: false, + fieldLabel: 'Yubico URL', + bind: { + value: "{url}", + hidden: "{!isYubico}", + disabled: "{!isYubico}", + }, + }, + ], +}); -- 2.20.1 _______________________________________________ pve-devel mailing list pve-devel@pve.proxmox.com https://pve.proxmox.com/cgi-bin/mailman/listinfo/pve-devel