Device Overview Panels

From Zenoss Wiki
This is the approved revision of this page, as well as being the most recent.
Jump to: navigation, search

If you want to modify the device overview page in a ZenPack, the best way is do use JavaScript code like the following. This will wait for the page to be ready, then wait for the panel of your choice to be available before adding or removing fields.

Ext.onReady(function() {
    var DEVICE_OVERVIEW_ID = 'deviceoverviewpanel_summary';
    Ext.ComponentMgr.onAvailable(DEVICE_OVERVIEW_ID, function(){
        var overview = Ext.getCmp(DEVICE_OVERVIEW_ID);
 
        overview.addListener("afterrender", function(){
            overview.removeField('memory');
 
            overview.addField({
                name: 'temp_sensor_count',
                fieldLabel: _t('# Temperature Sensors')
            });
        });
    });
});

This example shows the deviceoverpanel_summary being modified. That's the top-left of the five panels. See the following list for all of the overview panel IDs.

  • deviceoverviewpanel_summary (top-left)
  • deviceoverviewpanel_idsummary (top-middle)
  • deviceoverviewpanel_descriptionsummary (top-right)
  • deviceoverviewpanel_customsummary (bottom-left)
  • deviceoverviewpanel_systemsummary (inner panel in bottom-left)
  • deviceoverviewpanel_snmpsummary (bottom-right)

ZenPacks.example.CustomOverview is a working example of a ZenPack that adds a new contact field to the bottom-left panel on the overview page for all devices.