[pve-devel] [PATCH manager 3/7] ext6migrate: fix most ceph subtabs
Dominik Csapak
d.csapak at proxmox.com
Fri Mar 4 09:28:30 CET 2016
this fixed the ceph subtabs: Status,Config,Crush,Disks,Monitor
with the usual fixes:
* moving static configuration to class definition
* change deprecated fields
* make xtypes consistent
* change "show" event to "activated"
special note: i moved the subtabs to the left (like the firewall),
because the alternatives are really bad (top looks not good, bottom
is not obvious)
i also changed the width of some headers in gridpanels when the
title was too long
Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
www/manager6/ceph/Config.js | 12 ++--
www/manager6/ceph/Crush.js | 10 +--
www/manager6/ceph/Disks.js | 146 +++++++++++++++++++++----------------------
www/manager6/ceph/Monitor.js | 6 +-
www/manager6/ceph/Status.js | 5 +-
5 files changed, 90 insertions(+), 89 deletions(-)
diff --git a/www/manager6/ceph/Config.js b/www/manager6/ceph/Config.js
index 66cc5cb..de40501 100644
--- a/www/manager6/ceph/Config.js
+++ b/www/manager6/ceph/Config.js
@@ -2,6 +2,9 @@ Ext.define('PVE.node.CephConfig', {
extend: 'Ext.panel.Panel',
alias: ['widget.pveNodeCephConfig'],
+ bodyStyle: 'white-space:pre',
+ bodyPadding: 5,
+ scrollable: true,
load: function() {
var me = this;
@@ -28,9 +31,6 @@ Ext.define('PVE.node.CephConfig', {
Ext.apply(me, {
url: '/nodes/' + nodename + '/ceph/config',
- bodyStyle: 'white-space:pre',
- bodyPadding: 5,
- autoScroll: true,
listeners: {
show: function() {
me.load();
@@ -48,6 +48,10 @@ Ext.define('PVE.node.Ceph', {
extend: 'Ext.tab.Panel',
alias: ['widget.pveNodeCeph'],
+ tabPosition: 'left',
+ tabRotation: 0,
+ minTabWidth: 80,
+
getHState: function(itemId) {
/*jslint confusion: true */
var me = this;
@@ -93,8 +97,6 @@ Ext.define('PVE.node.Ceph', {
}
Ext.apply(me, {
- plain: true,
- tabPosition: 'bottom',
defaults: {
border: false,
pveSelNode: me.pveSelNode
diff --git a/www/manager6/ceph/Crush.js b/www/manager6/ceph/Crush.js
index c1c498d..1ecea4e 100644
--- a/www/manager6/ceph/Crush.js
+++ b/www/manager6/ceph/Crush.js
@@ -1,7 +1,9 @@
Ext.define('PVE.node.CephCrushMap', {
extend: 'Ext.panel.Panel',
alias: ['widget.pveNodeCephCrushMap'],
-
+ bodyStyle: 'white-space:pre',
+ bodyPadding: 5,
+ scrollable: true,
load: function() {
var me = this;
@@ -28,11 +30,9 @@ Ext.define('PVE.node.CephCrushMap', {
Ext.apply(me, {
url: '/nodes/' + nodename + '/ceph/crush',
- bodyStyle: 'white-space:pre',
- bodyPadding: 5,
- autoScroll: true,
+
listeners: {
- show: function() {
+ activate: function() {
me.load();
}
}
diff --git a/www/manager6/ceph/Disks.js b/www/manager6/ceph/Disks.js
index 61083da..9d9242d 100644
--- a/www/manager6/ceph/Disks.js
+++ b/www/manager6/ceph/Disks.js
@@ -2,7 +2,52 @@
Ext.define('PVE.node.CephDiskList', {
extend: 'Ext.grid.GridPanel',
alias: ['widget.pveNodeCephDiskList'],
-
+ columns: [
+ {
+ header: gettext('Device'),
+ width: 100,
+ sortable: true,
+ dataIndex: 'dev'
+ },
+ {
+ header: gettext('Usage'),
+ width: 80,
+ sortable: false,
+ renderer: function(v, metaData, rec) {
+ if (rec && (rec.data.osdid >= 0)) {
+ return "osd." + rec.data.osdid;
+ }
+ return v || PVE.Utils.noText;
+ },
+ dataIndex: 'used'
+ },
+ {
+ header: gettext('Size'),
+ width: 100,
+ align: 'right',
+ sortable: false,
+ renderer: PVE.Utils.format_size,
+ dataIndex: 'size'
+ },
+ {
+ header: gettext('Vendor'),
+ width: 100,
+ sortable: true,
+ dataIndex: 'vendor'
+ },
+ {
+ header: gettext('Model'),
+ width: 200,
+ sortable: true,
+ dataIndex: 'model'
+ },
+ {
+ header: gettext('Serial'),
+ flex: 1,
+ sortable: true,
+ dataIndex: 'serial'
+ }
+ ],
initComponent: function() {
/*jslint confusion: true */
var me = this;
@@ -57,54 +102,9 @@ Ext.define('PVE.node.CephDiskList', {
selModel: sm,
stateful: false,
tbar: [ create_btn ],
- columns: [
- {
- header: gettext('Device'),
- width: 100,
- sortable: true,
- dataIndex: 'dev'
- },
- {
- header: gettext('Usage'),
- width: 80,
- sortable: false,
- renderer: function(v, metaData, rec) {
- if (rec && (rec.data.osdid >= 0)) {
- return "osd." + rec.data.osdid;
- }
- return v || PVE.Utils.noText;
- },
- dataIndex: 'used'
- },
- {
- header: gettext('Size'),
- width: 100,
- align: 'right',
- sortable: false,
- renderer: PVE.Utils.format_size,
- dataIndex: 'size'
- },
- {
- header: gettext('Vendor'),
- width: 100,
- sortable: true,
- dataIndex: 'vendor'
- },
- {
- header: gettext('Model'),
- width: 200,
- sortable: true,
- dataIndex: 'model'
- },
- {
- header: gettext('Serial'),
- flex: 1,
- sortable: true,
- dataIndex: 'serial'
- }
- ],
+
listeners: {
- show: rstore.startUpdate,
+ activate: rstore.startUpdate,
hide: rstore.stopUpdate,
destroy: rstore.stopUpdate
}
@@ -129,6 +129,31 @@ Ext.define('PVE.form.CephDiskSelector', {
diskType: 'journal_disks',
+ valueField: 'dev',
+ displayField: 'dev',
+ listConfig: {
+ columns: [
+ {
+ header: gettext('Device'),
+ width: 80,
+ sortable: true,
+ dataIndex: 'dev'
+ },
+ {
+ header: gettext('Size'),
+ width: 60,
+ sortable: false,
+ renderer: PVE.Utils.format_size,
+ dataIndex: 'size'
+ },
+ {
+ header: gettext('Serial'),
+ flex: 1,
+ sortable: true,
+ dataIndex: 'serial'
+ }
+ ]
+ },
initComponent: function() {
var me = this;
@@ -155,31 +180,6 @@ Ext.define('PVE.form.CephDiskSelector', {
Ext.apply(me, {
store: store,
- valueField: 'dev',
- displayField: 'dev',
- listConfig: {
- columns: [
- {
- header: gettext('Device'),
- width: 80,
- sortable: true,
- dataIndex: 'dev'
- },
- {
- header: gettext('Size'),
- width: 60,
- sortable: false,
- renderer: PVE.Utils.format_size,
- dataIndex: 'size'
- },
- {
- header: gettext('Serial'),
- flex: 1,
- sortable: true,
- dataIndex: 'serial'
- }
- ]
- }
});
me.callParent();
diff --git a/www/manager6/ceph/Monitor.js b/www/manager6/ceph/Monitor.js
index f92a761..5732130 100644
--- a/www/manager6/ceph/Monitor.js
+++ b/www/manager6/ceph/Monitor.js
@@ -29,7 +29,7 @@ Ext.define('PVE.CephCreateMon', {
method: 'POST',
items: [
{
- xtype: 'PVE.form.NodeSelector',
+ xtype: 'pveNodeSelector',
submitValue: false,
fieldLabel: gettext('Host'),
selectCurNode: true,
@@ -176,7 +176,7 @@ Ext.define('PVE.node.CephMonList', {
},
{
header: gettext('Quorum'),
- width: 50,
+ width: 70,
sortable: false,
renderer: PVE.Utils.format_boolean,
dataIndex: 'quorum'
@@ -189,7 +189,7 @@ Ext.define('PVE.node.CephMonList', {
}
],
listeners: {
- show: rstore.startUpdate,
+ activate: rstore.startUpdate,
hide: rstore.stopUpdate,
destroy: rstore.stopUpdate
}
diff --git a/www/manager6/ceph/Status.js b/www/manager6/ceph/Status.js
index c82e949..692fe15 100644
--- a/www/manager6/ceph/Status.js
+++ b/www/manager6/ceph/Status.js
@@ -1,7 +1,8 @@
Ext.define('PVE.node.CephStatus', {
extend: 'PVE.grid.ObjectGrid',
alias: ['widget.pveNodeCephStatus'],
-
+ cwidth1: 150,
+ interval: 3000,
initComponent: function() {
/*jslint confusion: true */
var me = this;
@@ -85,8 +86,6 @@ Ext.define('PVE.node.CephStatus', {
Ext.applyIf(me, {
url: "/api2/json/nodes/" + nodename + "/ceph/status",
- cwidth1: 150,
- interval: 3000,
rows: {
health: {
header: 'health',
--
2.1.4
More information about the pve-devel
mailing list