ui: add crud for remotes

listing/adding/editing/removing

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
Dominik Csapak 2020-05-26 12:23:25 +02:00 committed by Dietmar Maurer
parent de4db62c57
commit 9e2a4653b4
4 changed files with 215 additions and 0 deletions

View File

@ -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 \

View File

@ -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',

129
www/config/RemoteView.js Normal file
View File

@ -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,
},
],
});

78
www/window/RemoteEdit.js Normal file
View File

@ -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'),
},
],
},
});