pve-manager/www/manager6/dc/StorageView.js
Thomas Lamprecht 0d1ac958bc ui: storage: combine RBD external and hyperconverged add dialog
Combine both dialogues. This reduces storage choices from the
Storage -> Add menu, and thus improves usability.

We make the whole dialog also more intelligent by querying the
monitors, so that we can show them for the hyper converged case
keeping a similar interface for both cases. Further we can use this
to decide if a hyperconverged setup is possible at all.
While this information would also be available through the fact if
the pool selector has entries I wanted to show them anyway and could
make logic a bit easier using it.
2018-07-31 14:04:57 +02:00

183 lines
3.7 KiB
JavaScript

Ext.define('PVE.dc.StorageView', {
extend: 'Ext.grid.GridPanel',
alias: ['widget.pveStorageView'],
onlineHelp: 'chapter_storage',
stateful: true,
stateId: 'grid-dc-storage',
createStorageEditWindow: function(type, sid) {
var schema = PVE.Utils.storageSchema[type];
if (!schema || !schema.ipanel) {
throw "no editor registered for storage type: " + type;
}
Ext.create('PVE.storage.BaseEdit', {
paneltype: 'PVE.storage.' + schema.ipanel,
type: type,
storageId: sid,
autoShow: true,
listeners: {
destroy: this.reloadStore
}
});
},
initComponent : function() {
var me = this;
var store = new Ext.data.Store({
model: 'pve-storage',
proxy: {
type: 'proxmox',
url: "/api2/json/storage"
},
sorters: {
property: 'storage',
order: 'DESC'
}
});
var reload = function() {
store.load();
};
var sm = Ext.create('Ext.selection.RowModel', {});
var run_editor = function() {
var rec = sm.getSelection()[0];
if (!rec) {
return;
}
var type = rec.data.type,
sid = rec.data.storage;
me.createStorageEditWindow(type, sid);
};
var edit_btn = new Proxmox.button.Button({
text: gettext('Edit'),
disabled: true,
selModel: sm,
handler: run_editor
});
var remove_btn = Ext.create('Proxmox.button.StdRemoveButton', {
selModel: sm,
baseurl: '/storage/',
callback: reload
});
// else we cannot dynamically generate the add menu handlers
var addHandleGenerator = function(type) {
return function() { me.createStorageEditWindow(type); };
};
var addMenuItems = [], type;
/*jslint forin: true */
for (type in PVE.Utils.storageSchema) {
var storage = PVE.Utils.storageSchema[type];
if (storage.hideAdd) {
continue;
}
addMenuItems.push({
text: PVE.Utils.format_storage_type(type),
iconCls: 'fa fa-fw fa-' + storage.faIcon,
handler: addHandleGenerator(type)
});
}
Ext.apply(me, {
store: store,
reloadStore: reload,
selModel: sm,
viewConfig: {
trackOver: false
},
tbar: [
{
text: gettext('Add'),
menu: new Ext.menu.Menu({
items: addMenuItems
})
},
remove_btn,
edit_btn
],
columns: [
{
header: 'ID',
flex: 2,
sortable: true,
dataIndex: 'storage'
},
{
header: gettext('Type'),
flex: 1,
sortable: true,
dataIndex: 'type',
renderer: PVE.Utils.format_storage_type
},
{
header: gettext('Content'),
flex: 3,
sortable: true,
dataIndex: 'content',
renderer: PVE.Utils.format_content_types
},
{
header: gettext('Path') + '/' + gettext('Target'),
flex: 2,
sortable: true,
dataIndex: 'path',
renderer: function(value, metaData, record) {
if (record.data.target) {
return record.data.target;
}
return value;
}
},
{
header: gettext('Shared'),
flex: 1,
sortable: true,
dataIndex: 'shared',
renderer: Proxmox.Utils.format_boolean
},
{
header: gettext('Enabled'),
flex: 1,
sortable: true,
dataIndex: 'disable',
renderer: Proxmox.Utils.format_neg_boolean
},
{
header: gettext('Bandwidth Limit'),
flex: 2,
sortable: true,
dataIndex: 'bwlimit'
}
],
listeners: {
activate: reload,
itemdblclick: run_editor
}
});
me.callParent();
}
}, function() {
Ext.define('pve-storage', {
extend: 'Ext.data.Model',
fields: [
'path', 'type', 'content', 'server', 'portal', 'target', 'export', 'storage',
{ name: 'shared', type: 'boolean'},
{ name: 'disable', type: 'boolean'}
],
idProperty: 'storage'
});
});