ext6migrate: fix most ceph subtabs

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@proxmox.com>
This commit is contained in:
Dominik Csapak 2016-03-04 09:28:30 +01:00 committed by Dietmar Maurer
parent 115d172742
commit 5e0fd1b9d0
5 changed files with 90 additions and 89 deletions

View File

@ -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

View File

@ -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();
}
}

View File

@ -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();

View File

@ -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
}

View File

@ -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',