X-Git-Url: https://git.proxmox.com/?a=blobdiff_plain;f=grid%2FObjectGrid.js;h=541cf1dddd14090e6ba4fae73fd8d2fd12787e6a;hb=c898b490c713f8aad9085836e519c76157af55ac;hp=73a0469e0feeec7f7c51129f5d5984a08e1cdfd7;hpb=5dea30d0814af0ab3d83c7a575a663954e3789f9;p=proxmox-widget-toolkit.git diff --git a/grid/ObjectGrid.js b/grid/ObjectGrid.js index 73a0469..541cf1d 100644 --- a/grid/ObjectGrid.js +++ b/grid/ObjectGrid.js @@ -2,7 +2,7 @@ mandatory config parameters: rows: an object container where each propery is a key-value object we want to render - var rows = { + let rows = { keyboard: { header: gettext('Keyboard Layout'), editor: 'Your.KeyboardEdit', @@ -22,12 +22,46 @@ Ext.define('Proxmox.grid.ObjectGrid', { disabled: false, hideHeaders: true, - rows: {}, + monStoreErrors: false, + + add_combobox_row: function(name, text, opts) { + let me = this; + + opts = opts || {}; + me.rows = me.rows || {}; + + me.rows[name] = { + required: true, + defaultValue: opts.defaultValue, + header: text, + renderer: opts.renderer, + editor: { + xtype: 'proxmoxWindowEdit', + subject: text, + onlineHelp: opts.onlineHelp, + fieldDefaults: { + labelWidth: opts.labelWidth || 100, + }, + items: { + xtype: 'proxmoxKVComboBox', + name: name, + comboItems: opts.comboItems, + value: opts.defaultValue, + deleteEmpty: !!opts.deleteEmpty, + emptyText: opts.defaultValue, + labelWidth: Proxmox.Utils.compute_min_label_width( + text, opts.labelWidth), + fieldLabel: text, + }, + }, + }; + }, add_text_row: function(name, text, opts) { - var me = this; + let me = this; opts = opts || {}; + me.rows = me.rows || {}; me.rows[name] = { required: true, @@ -37,23 +71,29 @@ Ext.define('Proxmox.grid.ObjectGrid', { editor: { xtype: 'proxmoxWindowEdit', subject: text, + onlineHelp: opts.onlineHelp, + fieldDefaults: { + labelWidth: opts.labelWidth || 100, + }, items: { xtype: 'proxmoxtextfield', name: name, - deleteEmpty: true, + deleteEmpty: !!opts.deleteEmpty, emptyText: opts.defaultValue, labelWidth: Proxmox.Utils.compute_min_label_width( text, opts.labelWidth), - fieldLabel: text - } - } + vtype: opts.vtype, + fieldLabel: text, + }, + }, }; }, add_boolean_row: function(name, text, opts) { - var me = this; + let me = this; opts = opts || {}; + me.rows = me.rows || {}; me.rows[name] = { required: true, @@ -63,77 +103,87 @@ Ext.define('Proxmox.grid.ObjectGrid', { editor: { xtype: 'proxmoxWindowEdit', subject: text, + onlineHelp: opts.onlineHelp, + fieldDefaults: { + labelWidth: opts.labelWidth || 100, + }, items: { xtype: 'proxmoxcheckbox', name: name, uncheckedValue: 0, - defaultValue: opts.defaultValue || 0, - checked: opts.defaultValue ? true : false, - deleteDefaultValue: opts.deleteDefaultValue ? true : false, + defaultValue: opts.defaultValue || 0, + checked: !!opts.defaultValue, + deleteDefaultValue: !!opts.deleteDefaultValue, labelWidth: Proxmox.Utils.compute_min_label_width( text, opts.labelWidth), - fieldLabel: text - } - } + fieldLabel: text, + }, + }, }; }, add_integer_row: function(name, text, opts) { - var me = this; + let me = this; - opts = opts || {} + opts = opts || {}; + me.rows = me.rows || {}; me.rows[name] = { required: true, defaultValue: opts.defaultValue, header: text, + renderer: opts.renderer, editor: { xtype: 'proxmoxWindowEdit', subject: text, + onlineHelp: opts.onlineHelp, + fieldDefaults: { + labelWidth: opts.labelWidth || 100, + }, items: { xtype: 'proxmoxintegerfield', name: name, minValue: opts.minValue, maxValue: opts.maxValue, emptyText: gettext('Default'), - deleteEmpty: true, + deleteEmpty: !!opts.deleteEmpty, value: opts.defaultValue, labelWidth: Proxmox.Utils.compute_min_label_width( text, opts.labelWidth), - fieldLabel: text - } - } + fieldLabel: text, + }, + }, }; }, editorConfig: {}, // default config passed to editor run_editor: function() { - var me = this; + let me = this; - var sm = me.getSelectionModel(); - var rec = sm.getSelection()[0]; + let sm = me.getSelectionModel(); + let rec = sm.getSelection()[0]; if (!rec) { return; } - var rows = me.rows; - var rowdef = rows[rec.data.key]; + let rows = me.rows; + let rowdef = rows[rec.data.key]; if (!rowdef.editor) { return; } - var win; - var config; + let win; + let config; if (Ext.isString(rowdef.editor)) { config = Ext.apply({ confid: rec.data.key, - }, me.editorConfig); + }, me.editorConfig); win = Ext.create(rowdef.editor, config); } else { config = Ext.apply({ confid: rec.data.key, - }, me.editorConfig); + }, me.editorConfig); Ext.apply(config, rowdef.editor); win = Ext.createWidget(rowdef.editor.xtype, config); win.load(); @@ -144,13 +194,13 @@ Ext.define('Proxmox.grid.ObjectGrid', { }, reload: function() { - var me = this; + let me = this; me.rstore.load(); }, getObjectValue: function(key, defaultValue) { - var me = this; - var rec = me.store.getById(key); + let me = this; + let rec = me.store.getById(key); if (rec) { return rec.data.value; } @@ -158,19 +208,19 @@ Ext.define('Proxmox.grid.ObjectGrid', { }, renderKey: function(key, metaData, record, rowIndex, colIndex, store) { - var me = this; - var rows = me.rows; - var rowdef = (rows && rows[key]) ? rows[key] : {}; + let me = this; + let rows = me.rows; + let rowdef = rows && rows[key] ? rows[key] : {}; return rowdef.header || key; }, renderValue: function(value, metaData, record, rowIndex, colIndex, store) { - var me = this; - var rows = me.rows; - var key = record.data.key; - var rowdef = (rows && rows[key]) ? rows[key] : {}; + let me = this; + let rows = me.rows; + let key = record.data.key; + let rowdef = rows && rows[key] ? rows[key] : {}; - var renderer = rowdef.renderer; + let renderer = rowdef.renderer; if (renderer) { return renderer(value, metaData, record, rowIndex, colIndex, store); } @@ -178,10 +228,25 @@ Ext.define('Proxmox.grid.ObjectGrid', { return value; }, - initComponent : function() { - var me = this; + listeners: { + itemkeydown: function(view, record, item, index, e) { + if (e.getKey() === e.ENTER) { + this.pressedIndex = index; + } + }, + itemkeyup: function(view, record, item, index, e) { + if (e.getKey() === e.ENTER && index === this.pressedIndex) { + this.run_editor(); + } + + this.pressedIndex = undefined; + }, + }, + + initComponent: function() { + let me = this; - var rows = me.rows; + let rows = me.rows; if (!me.rstore) { if (!me.url) { @@ -192,15 +257,15 @@ Ext.define('Proxmox.grid.ObjectGrid', { url: me.url, interval: me.interval, extraParams: me.extraParams, - rows: me.rows + rows: me.rows, }); } - var rstore = me.rstore; - - var store = Ext.create('Proxmox.data.DiffStore', { rstore: rstore, + let rstore = me.rstore; + let store = Ext.create('Proxmox.data.DiffStore', { + rstore: rstore, sorters: [], - filters: [] + filters: [], }); if (rows) { @@ -215,20 +280,20 @@ Ext.define('Proxmox.grid.ObjectGrid', { if (me.sorterFn) { store.sorters.add(Ext.create('Ext.util.Sorter', { - sorterFn: me.sorterFn + sorterFn: me.sorterFn, })); } store.filters.add(Ext.create('Ext.util.Filter', { filterFn: function(item) { if (rows) { - var rowdef = rows[item.data.key]; - if (!rowdef || (rowdef.visible === false)) { + let rowdef = rows[item.data.key]; + if (!rowdef || rowdef.visible === false) { return false; } } return true; - } + }, })); Proxmox.Utils.monStoreErrors(me, rstore); @@ -241,17 +306,21 @@ Ext.define('Proxmox.grid.ObjectGrid', { header: gettext('Name'), width: me.cwidth1 || 200, dataIndex: 'key', - renderer: me.renderKey + renderer: me.renderKey, }, { flex: 1, header: gettext('Value'), dataIndex: 'value', - renderer: me.renderValue - } - ] + renderer: me.renderValue, + }, + ], }); me.callParent(); - } + + if (me.monStoreErrors) { + Proxmox.Utils.monStoreErrors(me, me.store); + } + }, });