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/RemoteView.js \
|
||||||
config/ACLView.js \
|
config/ACLView.js \
|
||||||
config/SyncView.js \
|
config/SyncView.js \
|
||||||
|
config/DataStoreConfig.js \
|
||||||
window/UserEdit.js \
|
window/UserEdit.js \
|
||||||
window/RemoteEdit.js \
|
window/RemoteEdit.js \
|
||||||
window/SyncJobEdit.js \
|
window/SyncJobEdit.js \
|
||||||
window/ACLEdit.js \
|
window/ACLEdit.js \
|
||||||
|
window/DataStoreEdit.js \
|
||||||
Utils.js \
|
Utils.js \
|
||||||
LoginView.js \
|
LoginView.js \
|
||||||
VersionInfo.js \
|
VersionInfo.js \
|
||||||
SystemConfiguration.js \
|
SystemConfiguration.js \
|
||||||
Subscription.js \
|
Subscription.js \
|
||||||
DataStorePrune.js \
|
DataStorePrune.js \
|
||||||
DataStoreConfig.js \
|
|
||||||
DataStoreStatistic.js \
|
DataStoreStatistic.js \
|
||||||
DataStoreContent.js \
|
DataStoreContent.js \
|
||||||
DataStorePanel.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