0d1ac958bc
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.
183 lines
3.7 KiB
JavaScript
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'
|
|
});
|
|
|
|
});
|