[pve-devel] [PATCH 1/5] Implement pendinggrid and pendingstore
Alexandre Derumier
aderumier at odiso.com
Wed Dec 31 14:40:49 CET 2014
Signed-off-by: Alexandre Derumier <aderumier at odiso.com>
---
www/manager/Makefile | 2 +
www/manager/data/PVEProxy.js | 6 ++
www/manager/data/PendingObjectStore.js | 29 ++++++++
www/manager/data/reader/JsonObject.js | 48 ++++++++----
www/manager/grid/PendingObjectGrid.js | 128 ++++++++++++++++++++++++++++++++
www/manager/qemu/HardwareView.js | 4 +-
www/manager/qemu/Options.js | 4 +-
7 files changed, 204 insertions(+), 17 deletions(-)
create mode 100644 www/manager/data/PendingObjectStore.js
create mode 100644 www/manager/grid/PendingObjectGrid.js
diff --git a/www/manager/Makefile b/www/manager/Makefile
index 704895d..1742e7a 100644
--- a/www/manager/Makefile
+++ b/www/manager/Makefile
@@ -19,6 +19,7 @@ JSSRC= \
data/UpdateStore.js \
data/DiffStore.js \
data/ObjectStore.js \
+ data/PendingObjectStore.js \
data/ResourceStore.js \
form/VLanField.js \
form/Checkbox.js \
@@ -76,6 +77,7 @@ JSSRC= \
grid/CheckColumn.js \
grid/SelectFeature.js \
grid/ObjectGrid.js \
+ grid/PendingObjectGrid.js \
grid/ResourceGrid.js \
grid/PoolMembers.js \
grid/FirewallRules.js \
diff --git a/www/manager/data/PVEProxy.js b/www/manager/data/PVEProxy.js
index 46cecf6..219a620 100644
--- a/www/manager/data/PVEProxy.js
+++ b/www/manager/data/PVEProxy.js
@@ -67,6 +67,12 @@ Ext.define('PVE.RestProxy', {
idProperty: 'key'
});
+ Ext.define('KeyValuePendingDelete', {
+ extend: "Ext.data.Model",
+ fields: [ 'key', 'value', 'pending', 'delete' ],
+ idProperty: 'key'
+ });
+
Ext.define('pve-string-list', {
extend: 'Ext.data.Model',
fields: [ 'n', 't' ],
diff --git a/www/manager/data/PendingObjectStore.js b/www/manager/data/PendingObjectStore.js
new file mode 100644
index 0000000..c294e9d
--- /dev/null
+++ b/www/manager/data/PendingObjectStore.js
@@ -0,0 +1,29 @@
+Ext.define('PVE.data.PendingObjectStore', {
+ extend: 'PVE.data.UpdateStore',
+
+ constructor: function(config) {
+ var me = this;
+
+ config = config || {};
+
+ if (!config.storeid) {
+ config.storeid = 'pve-store-' + (++Ext.idSeed);
+ }
+
+ Ext.applyIf(config, {
+ model: 'KeyValuePendingDelete',
+ proxy: {
+ type: 'pve',
+ url: config.url,
+ extraParams: config.extraParams,
+ reader: {
+ type: 'jsonobject',
+ rows: config.rows,
+ pending: 1
+ }
+ }
+ });
+
+ me.callParent([config]);
+ }
+});
diff --git a/www/manager/data/reader/JsonObject.js b/www/manager/data/reader/JsonObject.js
index d819c4b..6489376 100644
--- a/www/manager/data/reader/JsonObject.js
+++ b/www/manager/data/reader/JsonObject.js
@@ -37,21 +37,43 @@ Ext.define('PVE.data.reader.JsonObject', {
}
}
- if (me.rows) {
- Ext.Object.each(me.rows, function(key, rowdef) {
- if (Ext.isDefined(root[key])) {
- data.push({key: key, value: root[key]});
- } else if (Ext.isDefined(rowdef.defaultValue)) {
- data.push({key: key, value: rowdef.defaultValue});
- } else if (rowdef.required) {
- data.push({key: key, value: undefined});
- }
- });
+ if (me.pending) {
+
+ if (me.rows) {
+ Ext.Object.each(me.rows, function(key, rowdef) {
+ if (Ext.isDefined(root[key])) {
+ data.push({key: key, value: root[key]["value"], pending: root[key]["pending"], delete: root[key]["delete"]});
+ } else if (Ext.isDefined(rowdef.defaultValue)) {
+ data.push({key: key, value: rowdef.defaultValue, pending: undefined, delete: undefined});
+ } else if (rowdef.required) {
+ data.push({key: key, value: undefined, pending: undefined, delete: undefined});
+ }
+ });
+ } else {
+ Ext.Object.each(root, function(key, value) {
+ data.push({key: key, value: root[key]["value"], pending: root[key]["pending"], delete: root[key]["delete"]});
+ });
+ }
+
} else {
- Ext.Object.each(root, function(key, value) {
- data.push({key: key, value: value });
- });
+
+ if (me.rows) {
+ Ext.Object.each(me.rows, function(key, rowdef) {
+ if (Ext.isDefined(root[key])) {
+ data.push({key: key, value: root[key]});
+ } else if (Ext.isDefined(rowdef.defaultValue)) {
+ data.push({key: key, value: rowdef.defaultValue});
+ } else if (rowdef.required) {
+ data.push({key: key, value: undefined});
+ }
+ });
+ } else {
+ Ext.Object.each(root, function(key, value) {
+ data.push({key: key, value: value });
+ });
+ }
}
+
}
catch (ex) {
Ext.Error.raise({
diff --git a/www/manager/grid/PendingObjectGrid.js b/www/manager/grid/PendingObjectGrid.js
new file mode 100644
index 0000000..40b9bb7
--- /dev/null
+++ b/www/manager/grid/PendingObjectGrid.js
@@ -0,0 +1,128 @@
+Ext.define('PVE.grid.PendingObjectGrid', {
+ extend: 'Ext.grid.GridPanel',
+ alias: ['widget.pvePendingObjectGrid'],
+
+ getObjectValue: function(key, defaultValue) {
+ var me = this;
+ var rec = me.store.getById(key);
+ if (rec) {
+ return rec.data.value;
+ }
+ return defaultValue;
+ },
+
+ renderKey: function(key, metaData, record, rowIndex, colIndex, store) {
+ var me = this;
+ var rows = me.rows;
+ var 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] : {};
+ var renderer = rowdef.renderer;
+ var current = '';
+ var pendingdelete = '';
+ var pending = '';
+
+ if (renderer) {
+ current = renderer(value, metaData, record, rowIndex, colIndex, store);
+ if(record.data['pending']){
+ pending = renderer(record.data['pending'], metaData, record, rowIndex, colIndex, store);
+ }
+ }else{
+ current = value;
+ pending = record.data['pending'];
+ }
+ if(record.data['delete']){
+ pendingdelete = '<div style="text-decoration: line-through;">'+ current +'</div>';
+ }
+
+ value = current;
+ if(pending || pendingdelete){
+ value += '<div style="color:red">' + pending + pendingdelete + '</div>';
+ }
+ return value;
+ },
+
+ initComponent : function() {
+ var me = this;
+
+ var rows = me.rows;
+
+ if (!me.rstore) {
+ if (!me.url) {
+ throw "no url specified";
+ }
+
+
+ me.rstore = Ext.create('PVE.data.PendingObjectStore', {
+ url: me.url,
+ interval: me.interval,
+ extraParams: me.extraParams,
+ rows: me.rows,
+ });
+ }
+
+ var rstore = me.rstore;
+
+ var store = Ext.create('PVE.data.DiffStore', { rstore: rstore });
+
+ if (rows) {
+ Ext.Object.each(rows, function(key, rowdef) {
+ //fixme : add missing options from config file ?
+ if (Ext.isDefined(rowdef.defaultValue)) {
+ store.add({ key: key, value: rowdef.defaultValue, pending: undefined, delete: undefined });
+ } else if (rowdef.required) {
+ store.add({ key: key, value: undefined, pending: undefined, delete: undefined });
+ }
+ });
+ }
+
+ if (me.sorterFn) {
+ store.sorters.add(new Ext.util.Sorter({
+ sorterFn: me.sorterFn
+ }));
+ }
+
+ store.filters.add(new Ext.util.Filter({
+ filterFn: function(item) {
+ if (rows) {
+ var rowdef = rows[item.data.key];
+ if (!rowdef || (rowdef.visible === false)) {
+ return false;
+ }
+ }
+ return true;
+ }
+ }));
+
+ PVE.Utils.monStoreErrors(me, rstore);
+
+
+ Ext.applyIf(me, {
+ store: store,
+ hideHeaders: true,
+ stateful: false,
+ columns: [
+ {
+ header: gettext('Name'),
+ width: me.cwidth1 || 100,
+ dataIndex: 'key',
+ renderer: me.renderKey
+ },
+ {
+ flex: 1,
+ header: gettext('Value'),
+ dataIndex: 'value',
+ renderer: me.renderValue
+ }
+ ]
+ });
+
+ me.callParent();
+ }
+});
diff --git a/www/manager/qemu/HardwareView.js b/www/manager/qemu/HardwareView.js
index f1055e5..5738d9a 100644
--- a/www/manager/qemu/HardwareView.js
+++ b/www/manager/qemu/HardwareView.js
@@ -1,7 +1,7 @@
// fixme: howto avoid jslint type confusion?
/*jslint confusion: true */
Ext.define('PVE.qemu.HardwareView', {
- extend: 'PVE.grid.ObjectGrid',
+ extend: 'PVE.grid.PendingObjectGrid',
alias: ['widget.PVE.qemu.HardwareView'],
renderKey: function(key, metaData, record, rowIndex, colIndex, store) {
@@ -359,7 +359,7 @@ Ext.define('PVE.qemu.HardwareView', {
});
Ext.applyIf(me, {
- url: '/api2/json/' + baseurl,
+ url: '/api2/json/' + 'nodes/' + nodename + '/qemu/' + vmid + '/pending',
selModel: sm,
cwidth1: 170,
tbar: [
diff --git a/www/manager/qemu/Options.js b/www/manager/qemu/Options.js
index 490c475..3faa895 100644
--- a/www/manager/qemu/Options.js
+++ b/www/manager/qemu/Options.js
@@ -1,6 +1,6 @@
/*jslint confusion: true */
Ext.define('PVE.qemu.Options', {
- extend: 'PVE.grid.ObjectGrid',
+ extend: 'PVE.grid.PendingObjectGrid',
alias: ['widget.PVE.qemu.Options'],
initComponent : function() {
@@ -315,7 +315,7 @@ Ext.define('PVE.qemu.Options', {
};
Ext.applyIf(me, {
- url: "/api2/json/nodes/" + nodename + "/qemu/" + vmid + "/config",
+ url: "/api2/json/nodes/" + nodename + "/qemu/" + vmid + "/pending",
cwidth1: 170,
tbar: [ edit_btn ],
rows: rows,
--
1.7.10.4
More information about the pve-devel
mailing list