diff --git a/www/Makefile b/www/Makefile index cf551b31..46c7e7bc 100644 --- a/www/Makefile +++ b/www/Makefile @@ -7,8 +7,10 @@ IMAGES := \ JSSRC= \ form/UserSelector.js \ config/UserView.js \ + config/RemoteView.js \ config/ACLView.js \ window/UserEdit.js \ + window/RemoteEdit.js \ window/ACLEdit.js \ Utils.js \ LoginView.js \ diff --git a/www/NavigationTree.js b/www/NavigationTree.js index 9a653fcf..6d4d2455 100644 --- a/www/NavigationTree.js +++ b/www/NavigationTree.js @@ -30,6 +30,12 @@ Ext.define('PBS.store.NavigationStore', { path: 'pbsACLView', leaf: true }, + { + text: gettext('Remotes'), + iconCls: 'fa fa-server', + path: 'pbsRemoteView', + leaf: true, + }, { text: gettext('Data Store'), iconCls: 'fa fa-archive', diff --git a/www/config/RemoteView.js b/www/config/RemoteView.js new file mode 100644 index 00000000..cbc3601a --- /dev/null +++ b/www/config/RemoteView.js @@ -0,0 +1,129 @@ +Ext.define('pmx-remotes', { + extend: 'Ext.data.Model', + fields: [ 'name', 'host', 'userid', 'fingerprint' ], + idProperty: 'name', + proxy: { + type: 'proxmox', + url: '/api2/json/config/remote', + }, +}); + +Ext.define('PBS.config.RemoteView', { + extend: 'Ext.grid.GridPanel', + alias: 'widget.pbsRemoteView', + + stateful: true, + stateId: 'grid-remotes', + + title: gettext('Remotes'), + + controller: { + xclass: 'Ext.app.ViewController', + + addRemote: function() { + let me = this; + Ext.create('PBS.window.RemoteEdit', { + listeners: { + destroy: function() { + me.reload(); + }, + }, + }).show(); + }, + + editRemote: function() { + let me = this; + let view = me.getView(); + let selection = view.getSelection(); + if (selection.length < 1) return; + + Ext.create('PBS.window.RemoteEdit', { + name: selection[0].data.name, + listeners: { + destroy: function() { + me.reload(); + }, + }, + }).show(); + }, + + reload: function() { this.getView().getStore().rstore.load(); }, + + init: function(view) { + Proxmox.Utils.monStoreErrors(view, view.getStore().rstore); + }, + }, + + listeners: { + activate: 'reload', + itemdblclick: 'editRemote', + }, + + store: { + type: 'diff', + autoDestroy: true, + autoDestroyRstore: true, + sorters: 'name', + rstore: { + type: 'update', + storeid: 'pmx-remotes', + model: 'pmx-remotes', + autoStart: true, + interval: 5000, + }, + }, + + tbar: [ + { + xtype: 'proxmoxButton', + text: gettext('Add'), + handler: 'addRemote', + selModel: false, + }, + { + xtype: 'proxmoxButton', + text: gettext('Edit'), + handler: 'editRemote', + disabled: true, + }, + { + xtype: 'proxmoxStdRemoveButton', + baseurl: '/access/users/', + callback: 'reload', + }, + ], + + viewConfig: { + trackOver: false, + }, + + columns: [ + { + header: gettext('Remote'), + width: 200, + sortable: true, + renderer: Ext.String.htmlEncode, + dataIndex: 'name', + }, + { + header: gettext('Host'), + width: 200, + sortable: true, + dataIndex: 'host', + }, + { + header: gettext('User name'), + width: 100, + sortable: true, + renderer: Ext.String.htmlEncode, + dataIndex: 'userid', + }, + { + header: gettext('Fingerprint'), + sortable: false, + renderer: Ext.String.htmlEncode, + dataIndex: 'fingerprint', + flex: 1, + }, + ], +}); diff --git a/www/window/RemoteEdit.js b/www/window/RemoteEdit.js new file mode 100644 index 00000000..2c593dd4 --- /dev/null +++ b/www/window/RemoteEdit.js @@ -0,0 +1,78 @@ +Ext.define('PBS.window.RemoteEdit', { + extend: 'Proxmox.window.Edit', + alias: 'widget.pbsRemoteEdit', + mixins: ['Proxmox.Mixin.CBind'], + + userid: undefined, + + isAdd: true, + + subject: gettext('Remote'), + + fieldDefaults: { labelWidth: 120 }, + + cbindData: function(initialConfig) { + let me = this; + + let baseurl = '/api2/extjs/config/remote'; + let name = initialConfig.name; + + me.isCreate = !name; + me.url = name ? `${baseurl}/${name}` : baseurl; + me.method = name ? 'PUT' : 'POST'; + me.autoLoad = !!name; + return { + passwordEmptyText: me.isCreate ? '' : gettext('Unchanged'), + }; + }, + + items: { + xtype: 'inputpanel', + column1: [ + { + xtype: 'pmxDisplayEditField', + name: 'name', + fieldLabel: gettext('Remote'), + renderer: Ext.htmlEncode, + allowBlank: false, + minLength: 4, + cbind: { + editable: '{isCreate}', + }, + }, + { + xtype: 'proxmoxtextfield', + allowBlank: false, + name: 'host', + fieldLabel: gettext('Host'), + }, + ], + + column2: [ + { + xtype: 'proxmoxtextfield', + allowBlank: false, + name: 'userid', + fieldLabel: gettext('Userid'), + }, + { + xtype: 'textfield', + inputType: 'password', + fieldLabel: gettext('Password'), + name: 'password', + cbind: { + emptyText: '{passwordEmptyText}', + allowBlank: '{!isCreate}', + }, + }, + ], + + columnB: [ + { + xtype: 'proxmoxtextfield', + name: 'fingerprint', + fieldLabel: gettext('Fingerprint'), + }, + ], + }, +});