ui: refactor DataStoreConfig and Edit
split them into two files and put them into the respective directory refactor the DataStoreConfigPanel to controller/view and the DataStoreEdit window/inputpanel to simply an editwindow (there is no need to have a seperate inputpanel) which also prepares the window for edit (by using pmxDisplayEditFields) Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
Dominik Csapak
Dietmar Maurer
parent
98bb3b9016
commit
98ad58fbd2
@ -1,166 +0,0 @@
|
||||
Ext.define('pbs-datastore-list', {
|
||||
extend: 'Ext.data.Model',
|
||||
fields: [ 'name', 'comment' ],
|
||||
proxy: {
|
||||
type: 'proxmox',
|
||||
url: "/api2/json/admin/datastore"
|
||||
},
|
||||
idProperty: 'store'
|
||||
});
|
||||
|
||||
Ext.define('pbs-data-store-config', {
|
||||
extend: 'Ext.data.Model',
|
||||
fields: [ 'name', 'path', 'comment' ],
|
||||
proxy: {
|
||||
type: 'proxmox',
|
||||
url: "/api2/json/config/datastore"
|
||||
},
|
||||
idProperty: 'name'
|
||||
});
|
||||
|
||||
Ext.define('PBS.DataStoreConfig', {
|
||||
extend: 'Ext.grid.GridPanel',
|
||||
alias: 'widget.pbsDataStoreConfig',
|
||||
|
||||
title: gettext('Data Store Configuration'),
|
||||
|
||||
initComponent : function() {
|
||||
var me = this;
|
||||
|
||||
var store = new Ext.data.Store({
|
||||
model: 'pbs-data-store-config',
|
||||
sorters: 'name',
|
||||
});
|
||||
|
||||
var reload = function() {
|
||||
store.load();
|
||||
};
|
||||
|
||||
var sm = Ext.create('Ext.selection.RowModel', {});
|
||||
|
||||
var gc_btn = new Proxmox.button.Button({
|
||||
text: gettext('Start GC'),
|
||||
disabled: true,
|
||||
selModel: sm,
|
||||
handler: function() {
|
||||
var rec = sm.getSelection()[0];
|
||||
Proxmox.Utils.API2Request({
|
||||
url: '/admin/datastore/' + rec.data.name + '/gc',
|
||||
method: 'POST',
|
||||
failure: function(response) {
|
||||
Ext.Msg.alert(gettext('Error'), response.htmlStatus);
|
||||
},
|
||||
success: function(response, options) {
|
||||
var upid = response.result.data;
|
||||
|
||||
var win = Ext.create('Proxmox.window.TaskViewer', {
|
||||
upid: upid
|
||||
});
|
||||
win.show();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
var tbar = [
|
||||
{
|
||||
text: gettext('Create'),
|
||||
handler: function() {
|
||||
let win = Ext.create('PBS.DataStoreEdit', {});
|
||||
win.on('destroy', reload);
|
||||
win.show();
|
||||
}
|
||||
},
|
||||
'-',
|
||||
gc_btn
|
||||
//edit_btn, remove_btn
|
||||
];
|
||||
|
||||
Proxmox.Utils.monStoreErrors(me, store);
|
||||
|
||||
Ext.apply(me, {
|
||||
store: store,
|
||||
selModel: sm,
|
||||
tbar: tbar,
|
||||
columns: [
|
||||
{
|
||||
header: gettext('Name'),
|
||||
sortable: true,
|
||||
dataIndex: 'name',
|
||||
flex: 1
|
||||
},
|
||||
{
|
||||
header: gettext('Path'),
|
||||
sortable: true,
|
||||
dataIndex: 'path',
|
||||
flex: 1
|
||||
},
|
||||
{
|
||||
header: gettext('Comment'),
|
||||
sortable: false,
|
||||
dataIndex: 'comment',
|
||||
renderer: Ext.String.htmlEncode,
|
||||
flex: 2
|
||||
}
|
||||
],
|
||||
listeners: {
|
||||
activate: reload
|
||||
}
|
||||
});
|
||||
|
||||
me.callParent();
|
||||
|
||||
store.load();
|
||||
}
|
||||
});
|
||||
|
||||
Ext.define('PBS.DataStoreInputPanel', {
|
||||
extend: 'Proxmox.panel.InputPanel',
|
||||
alias: 'widget.pbsDataStoreInputPanel',
|
||||
|
||||
onGetValues: function(values) {
|
||||
var me = this;
|
||||
|
||||
return values;
|
||||
},
|
||||
|
||||
column1: [
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'name',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Name'),
|
||||
},
|
||||
],
|
||||
|
||||
column2: [
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'path',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Backing Path'),
|
||||
emptyText: gettext('An absolute path'),
|
||||
},
|
||||
],
|
||||
|
||||
columnB: [
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'comment',
|
||||
fieldLabel: gettext('Comment'),
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
Ext.define('PBS.DataStoreEdit', {
|
||||
extend: 'Proxmox.window.Edit',
|
||||
|
||||
url: '/api2/extjs/config/datastore',
|
||||
method: 'POST',
|
||||
|
||||
subject: gettext('Datastore'),
|
||||
isAdd: true,
|
||||
items: [{
|
||||
xtype: 'pbsDataStoreInputPanel',
|
||||
}],
|
||||
});
|
||||
@ -12,17 +12,18 @@ JSSRC= \
|
||||
config/RemoteView.js \
|
||||
config/ACLView.js \
|
||||
config/SyncView.js \
|
||||
config/DataStoreConfig.js \
|
||||
window/UserEdit.js \
|
||||
window/RemoteEdit.js \
|
||||
window/SyncJobEdit.js \
|
||||
window/ACLEdit.js \
|
||||
window/DataStoreEdit.js \
|
||||
Utils.js \
|
||||
LoginView.js \
|
||||
VersionInfo.js \
|
||||
SystemConfiguration.js \
|
||||
Subscription.js \
|
||||
DataStorePrune.js \
|
||||
DataStoreConfig.js \
|
||||
DataStoreStatistic.js \
|
||||
DataStoreContent.js \
|
||||
DataStorePanel.js \
|
||||
|
||||
125
www/config/DataStoreConfig.js
Normal file
125
www/config/DataStoreConfig.js
Normal file
@ -0,0 +1,125 @@
|
||||
Ext.define('pbs-datastore-list', {
|
||||
extend: 'Ext.data.Model',
|
||||
fields: [ 'name', 'comment' ],
|
||||
proxy: {
|
||||
type: 'proxmox',
|
||||
url: "/api2/json/admin/datastore"
|
||||
},
|
||||
idProperty: 'store'
|
||||
});
|
||||
|
||||
Ext.define('pbs-data-store-config', {
|
||||
extend: 'Ext.data.Model',
|
||||
fields: [ 'name', 'path', 'comment' ],
|
||||
proxy: {
|
||||
type: 'proxmox',
|
||||
url: "/api2/json/config/datastore"
|
||||
},
|
||||
idProperty: 'name'
|
||||
});
|
||||
|
||||
Ext.define('PBS.DataStoreConfig', {
|
||||
extend: 'Ext.grid.GridPanel',
|
||||
alias: 'widget.pbsDataStoreConfig',
|
||||
|
||||
title: gettext('Data Store Configuration'),
|
||||
|
||||
controller: {
|
||||
xclass: 'Ext.app.ViewController',
|
||||
|
||||
createDataStore: function() {
|
||||
let me = this;
|
||||
Ext.create('PBS.DataStoreEdit', {
|
||||
listeners: {
|
||||
destroy: function() {
|
||||
me.reload();
|
||||
},
|
||||
},
|
||||
}).show();
|
||||
},
|
||||
|
||||
garbageCollect: function() {
|
||||
let me = this;
|
||||
let view = me.getView();
|
||||
let selection = view.getSelection();
|
||||
if (selection.length < 1) return;
|
||||
|
||||
let name = encodeURIComponent(selection[0].data.name);
|
||||
Proxmox.Utils.API2Request({
|
||||
url: `/admin/datastore/${name}/gc`,
|
||||
method: 'POST',
|
||||
failure: function(response) {
|
||||
Ext.Msg.alert(gettext('Error'), response.htmlStatus);
|
||||
},
|
||||
success: function(response, options) {
|
||||
Ext.create('Proxmox.window.TaskViewer', {
|
||||
upid: response.result.data,
|
||||
}).show();
|
||||
},
|
||||
});
|
||||
},
|
||||
|
||||
reload: function() { this.getView().getStore().rstore.load(); },
|
||||
|
||||
init: function(view) {
|
||||
Proxmox.Utils.monStoreErrors(view, view.getStore().rstore);
|
||||
},
|
||||
},
|
||||
|
||||
store: {
|
||||
type: 'diff',
|
||||
autoDestroy: true,
|
||||
autoDestroyRstore: true,
|
||||
sorters: 'name',
|
||||
rstore: {
|
||||
type: 'update',
|
||||
storeid: 'pbs-data-store-config',
|
||||
model: 'pbs-data-store-config',
|
||||
autoStart: true,
|
||||
interval: 10000,
|
||||
},
|
||||
},
|
||||
|
||||
tbar: [
|
||||
{
|
||||
xtype: 'proxmoxButton',
|
||||
selModel: false,
|
||||
text: gettext('Create'),
|
||||
handler: 'createDataStore',
|
||||
},
|
||||
// edit/remove button
|
||||
'-',
|
||||
{
|
||||
xtype: 'proxmoxButton',
|
||||
text: gettext('Start GC'),
|
||||
disabled: true,
|
||||
handler: 'garbageCollect',
|
||||
},
|
||||
],
|
||||
|
||||
columns: [
|
||||
{
|
||||
header: gettext('Name'),
|
||||
sortable: true,
|
||||
dataIndex: 'name',
|
||||
flex: 1,
|
||||
},
|
||||
{
|
||||
header: gettext('Path'),
|
||||
sortable: true,
|
||||
dataIndex: 'path',
|
||||
flex: 1,
|
||||
},
|
||||
{
|
||||
header: gettext('Comment'),
|
||||
sortable: false,
|
||||
dataIndex: 'comment',
|
||||
renderer: Ext.String.htmlEncode,
|
||||
flex: 2,
|
||||
},
|
||||
],
|
||||
|
||||
listeners: {
|
||||
activate: 'reload',
|
||||
},
|
||||
});
|
||||
59
www/window/DataStoreEdit.js
Normal file
59
www/window/DataStoreEdit.js
Normal file
@ -0,0 +1,59 @@
|
||||
Ext.define('PBS.DataStoreEdit', {
|
||||
extend: 'Proxmox.window.Edit',
|
||||
alias: 'widget.pbsDataStoreEdit',
|
||||
mixins: ['Proxmox.Mixin.CBind'],
|
||||
|
||||
subject: gettext('Datastore'),
|
||||
isAdd: true,
|
||||
|
||||
cbindData: function(initialConfig) {
|
||||
var me = this;
|
||||
|
||||
let name = initialConfig.name;
|
||||
let baseurl = '/api2/extjs/config/datastore';
|
||||
|
||||
me.isCreate = !name;
|
||||
me.url = name ? baseurl + '/' + name : baseurl;
|
||||
me.method = name ? 'PUT' : 'POST';
|
||||
me.autoLoad = !!name;
|
||||
return {};
|
||||
},
|
||||
|
||||
items: [
|
||||
{
|
||||
xtype: 'inputpanel',
|
||||
column1: [
|
||||
{
|
||||
xtype: 'pmxDisplayEditField',
|
||||
cbind: {
|
||||
editable: '{isCreate}',
|
||||
},
|
||||
name: 'name',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Name'),
|
||||
},
|
||||
],
|
||||
|
||||
column2: [
|
||||
{
|
||||
xtype: 'pmxDisplayEditField',
|
||||
cbind: {
|
||||
editable: '{isCreate}',
|
||||
},
|
||||
name: 'path',
|
||||
allowBlank: false,
|
||||
fieldLabel: gettext('Backing Path'),
|
||||
emptyText: gettext('An absolute path'),
|
||||
},
|
||||
],
|
||||
|
||||
columnB: [
|
||||
{
|
||||
xtype: 'textfield',
|
||||
name: 'comment',
|
||||
fieldLabel: gettext('Comment'),
|
||||
},
|
||||
],
|
||||
}
|
||||
],
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user