zabbix前端代码浅析之dashboard.php

 

      上次说了下index.php,这次我们聊聊dashboard.php吧。

 

1.整体结构:

 

     如果是index是整个zabbix的入口的话,那dashboard才是名副其实的zabbix的核心、骨干。dashboard是登陆进来默认的操作界面,大部分的操作也是通过dashboard完成的。

   dashboard大致可以分为三部分内容,配置项的设置、数据刷新和页面展示。其实我个人最感兴趣的是页面展示这部分。

 

2.配项设置:

 

require_once('include/config.inc.php');
require_once('include/hosts.inc.php');
require_once('include/triggers.inc.php');
require_once('include/items.inc.php');
require_once('include/actions.inc.php');
require_once('include/discovery.inc.php');
require_once('include/html.inc.php');
require_once('include/blocks.inc.php');

$page['title'] = 'S_DASHBOARD';
$page['file'] = 'dashboard.php';
$page['hist_arg'] = array();
$page['scripts'] = array('class.pmaster.js');

$page['type'] = detect_page_type(PAGE_TYPE_HTML);

include_once('include/page_header.php');

//        VAR                TYPE    OPTIONAL FLAGS    VALIDATION    EXCEPTION
    $fields=array(
        'groupid'=>        array(T_ZBX_INT, O_OPT,    P_SYS,    DB_ID,            NULL),
        'view_style'=>    array(T_ZBX_INT, O_OPT,    P_SYS,    IN('0,1'),        NULL),
        'type'=>        array(T_ZBX_INT, O_OPT,    P_SYS,    IN('0,1'),        NULL),

        'output'=>        array(T_ZBX_STR, O_OPT, P_SYS,    NULL,            NULL),
        'jsscriptid'=>    array(T_ZBX_STR, O_OPT, P_SYS,    NULL,            NULL),
        'fullscreen'=>    array(T_ZBX_INT, O_OPT,    P_SYS,    IN('0,1'),        NULL),

//ajax
        'favobj'=>        array(T_ZBX_STR, O_OPT, P_ACT,    NULL,            NULL),
        'favref'=>        array(T_ZBX_STR, O_OPT, P_ACT,    NULL,            NULL),
        'favid'=>        array(T_ZBX_INT, O_OPT, P_ACT,  NULL,            NULL),
        'favcnt'=>        array(T_ZBX_INT, O_OPT,    null,    null,            NULL),
        'pmasterid'=>    array(T_ZBX_STR, O_OPT,    P_SYS,    null,            NULL),

        'action'=>        array(T_ZBX_STR, O_OPT, P_ACT,     IN("'add','remove','refresh','flop'"),    NULL),
        'state'=>        array(T_ZBX_INT, O_OPT, P_ACT,  NOT_EMPTY,        'isset({action}) && ("flop"=={action})'),
    );

    check_fields($fields);

// FILTER
    $dashconf = array();
    $dashconf['groupids'] = null;
    $dashconf['maintenance'] = null;
    $dashconf['severity'] = null;
    $dashconf['extAck'] = 0;

    $dashconf['filterEnable'] = CProfile::get('web.dashconf.filter.enable', 0);
    if($dashconf['filterEnable'] == 1){
// groups
        $dashconf['grpswitch'] = CProfile::get('web.dashconf.groups.grpswitch', 0);

        if($dashconf['grpswitch'] == 0){
            $dashconf['groupids'] = null;
        }
        else{
            $groupids = get_favorites('web.dashconf.groups.groupids');
            $dashconf['groupids'] = zbx_objectValues($groupids, 'value');
        }

// hosts
        $maintenance = CProfile::get('web.dashconf.hosts.maintenance', 1);
        $dashconf['maintenance'] = ($maintenance == 0)?0:null;

// triggers
        $severity = CProfile::get('web.dashconf.triggers.severity', null);
        $dashconf['severity'] = zbx_empty($severity)?null:explode(';', $severity);
        $dashconf['severity'] = zbx_toHash($dashconf['severity']);

        $config = select_config();
        $dashconf['extAck'] = $config['event_ack_enable'] ? CProfile::get('web.dashconf.events.extAck', 0) : 0;
    }

// ------

          不好意思,上来直接就一段代码砸过来了。不过我们还是来看下吧,也没啥特别的。

      include就不说了,大家都明白的。$page设置了页面的一些title呀、type呀,这些。注意type其实很重要的,是detect_page_type这个函数去判定的,后面会根据type的类型进行不同的操作的,如json、html等不同的类型脚本返回结果都是不同的。

      fields数组则和Index.php中的相同,咨询了一个同事,他说这个是用户检测表格提交的数据的,如果一个变量在fields数组中没有定义,那提交的时候你在脚本中是无法获取的。

      dashconf数组同样是设置了很多的参数,具体我其实也没有仔细研究,后续有时间慢慢看吧。

 

3.页面展示:

 

        1.右边菜单

    if(isset($_REQUEST['favobj'])){
        $_REQUEST['pmasterid'] = get_request('pmasterid','mainpage');

        if('hat' == $_REQUEST['favobj']){
            if('flop' == $_REQUEST['action']){
                CProfile::update('web.dashboard.hats.'.$_REQUEST['favref'].'.state',$_REQUEST['state'], PROFILE_TYPE_INT);
            }
            else if('refresh' == $_REQUEST['action']){
                switch($_REQUEST['favref']){
                    case 'hat_syssum':
                        $syssum = make_system_status($dashconf);
                        $syssum->show();
                        break;
                    case 'hat_hoststat':
                        $hoststat = make_hoststat_summary($dashconf);
                        $hoststat->show();
                        break;
                    case 'hat_stszbx':
                        $stszbx = make_status_of_zbx();
                        $stszbx->show();
                        break;
                    case 'hat_lastiss':
                        $lastiss = make_latest_issues($dashconf);
                        $lastiss->show();
                        break;
                    case 'hat_webovr':
                        $webovr = make_webmon_overview($dashconf);
                        $webovr->show();
                        break;
                    case 'hat_dscvry':
                        $dscvry = make_discovery_status();
                        $dscvry->show();
                        break;
                }
            }
        }

其实这部分就是页面的一些展示了,主要都是右边菜单的部分。

$_REQUEST[‘action’]) 这里比较牛的就是根据请求的动作脚本执行相应的刷新或者折叠。

if(‘flop’ == $_REQUEST[‘action’] 如果是flop动作则进行小图标的折叠,不然就执行这部分表单的数据刷新操作。

我们开firebug看下:

 

                                   image

        

找到了对应的 ‘hat_stszbx’,同时确定现在的状态是折叠的。切换到firebug的网络选项,我们点击小图标,同时观察响应的请求:

 

                                      image

 

看到了吧,action为floop。小图标的点击动作会发起一次action为floop的请求,dashboard收到该类型的请求就执行相应的操作,将小图标进行折叠。

make_status_of_zbx 等函数实际是生成了一个表格,同时赋予了一些属性,如title等,大致看下吧:

 

function make_status_of_zbx(){
    global $USER_DETAILS, $ZBX_SERVER, $ZBX_SERVER_PORT;

    $table = new CTableInfo();
    $table->setHeader(array(
        S_PARAMETER,
        S_VALUE,
        S_DETAILS
    ));

    show_messages(); //because in function get_status(); function clear_messages() is called when fsockopen() fails.
    $status = get_status();

    $table->addRow(array(
        S_ZABBIX_SERVER_IS_RUNNING,
        new CSpan($status['zabbix_server'], ($status['zabbix_server'] == S_YES ? 'off' : 'on')),
        isset($ZBX_SERVER, $ZBX_SERVER_PORT) ? $ZBX_SERVER.':'.$ZBX_SERVER_PORT : S_ZABBIX_SERVER_IP_OR_PORT_IS_NOT_SET
    ));
    $title = new CSpan(S_NUMBER_OF_HOSTS);
    $title->setAttribute('title', 'asdad');
    $table->addRow(array(S_NUMBER_OF_HOSTS ,$status['hosts_count'],
        array(
            new CSpan($status['hosts_count_monitored'],'off'),' / ',
            new CSpan($status['hosts_count_not_monitored'],'on'),' / ',
            new CSpan($status['hosts_count_template'],'unknown')
        )
    ));
    $title = new CSpan(S_NUMBER_OF_ITEMS);
    $title->setAttribute('title', S_NUMBER_OF_ITEMS_TOOLTIP);
    $table->addRow(array($title, $status['items_count'],
        array(
            new CSpan($status['items_count_monitored'],'off'),' / ',
            new CSpan($status['items_count_disabled'],'on'),' / ',
            new CSpan($status['items_count_not_supported'],'unknown')
        )
    ));
    $title = new CSpan(S_NUMBER_OF_TRIGGERS);
    $title->setAttribute('title', S_NUMBER_OF_TRIGGERS_TOOLTIP);
    $table->addRow(array($title,$status['triggers_count'],
        array(
            $status['triggers_count_enabled'],' / ',
            $status['triggers_count_disabled'].SPACE.SPACE.'[',
            new CSpan($status['triggers_count_on'],'on'),' / ',
            new CSpan($status['triggers_count_unknown'],'unknown'),' / ',
            new CSpan($status['triggers_count_off'],'off'),']'
        )
    ));

/*
    $table->addRow(array(S_NUMBER_OF_EVENTS,$status['events_count'],' - '));
    $table->addRow(array(S_NUMBER_OF_ALERTS,$status['alerts_count'],' - '));
//*/

    $table->addRow(array(S_NUMBER_OF_USERS, $status['users_count'], new CSpan($status['users_online'],'green')));
    $table->addRow(array(S_REQUIRED_SERVER_PERFORMANCE_NVPS, $status['qps_total'],' - '));


// CHECK REQUIREMENTS {{{
    if($USER_DETAILS['type'] == USER_TYPE_SUPER_ADMIN){
        $reqs = check_php_requirements();
        foreach($reqs as $req){
            if($req['result'] == false){
                $table->addRow(array(
                    new CSpan($req['name'], 'red'),
                    new CSpan($req['current'], 'red'),
                    new CSpan($req['error'], 'red')
                ));
            }
        }
    }
// }}}CHECK REQUIREMENTS


    $table->setFooter(new CCol(S_UPDATED.': '.zbx_date2str(S_BLOCKS_ZBX_STATUS_TIME_FORMAT)));

return $table;
}

       CSpan函数实际是生成了一个<span>标签去格式化文本,setHeader、addRow这些就是你理解的那个意思了。

 

        if('set_rf_rate' == $_REQUEST['favobj']){
            if(str_in_array($_REQUEST['favref'],array('hat_syssum','hat_stszbx','hat_lastiss','hat_webovr','hat_dscvry','hat_hoststat'))){

                CProfile::update('web.dahsboard.rf_rate.'.$_REQUEST['favref'],$_REQUEST['favcnt'], PROFILE_TYPE_INT);
                $_REQUEST['favcnt'] = CProfile::get('web.dahsboard.rf_rate.'.$_REQUEST['favref'], 60);

                $script = get_update_doll_script('mainpage', $_REQUEST['favref'], 'frequency', $_REQUEST['favcnt']);
                $script.= get_update_doll_script('mainpage', $_REQUEST['favref'], 'stopDoll');
                $script.= get_update_doll_script('mainpage', $_REQUEST['favref'], 'startDoll');
                echo $script;

                $menu = array();
                $submenu = array();

                make_refresh_menu('mainpage',$_REQUEST['favref'],$_REQUEST['favcnt'],null,$menu,$submenu);

                echo 'page_menu["menu_'.$_REQUEST['favref'].'"] = '.zbx_jsvalue($menu['menu_'.$_REQUEST['favref']]).';';
            }
        }

   这部分是用来获取菜单的刷新频率的,具体的后续深挖吧。

 

 

if('sysmapid' == $_REQUEST['favobj']){
            $result = false;
            if('add' == $_REQUEST['action']){
                zbx_value2array($_REQUEST['favid']);

                foreach($_REQUEST['favid'] as  $num => $sourceid){
                    $result = add2favorites('web.favorite.sysmapids',$sourceid,$_REQUEST['favobj']);
                }
            }
            else if('remove' == $_REQUEST['action']){
                $result = rm4favorites('web.favorite.sysmapids',$_REQUEST['favid'],$_REQUEST['favobj']);
            }

            if((PAGE_TYPE_JS == $page['type']) && $result){
                $innerHTML = make_favorite_maps();
                $innerHTML = $innerHTML->toString();
                echo '$("hat_favmap").update('.zbx_jsvalue($innerHTML).');';

                $menu = array();
                $submenu = array();
                echo 'page_submenu["menu_sysmaps"] = '.zbx_jsvalue(make_sysmap_submenu()).';';
            }
        }

        if(str_in_array($_REQUEST['favobj'],array('screenid','slideshowid'))){
            $result = false;
            if('add' == $_REQUEST['action']){
                zbx_value2array($_REQUEST['favid']);

                foreach($_REQUEST['favid'] as  $num => $sourceid){
                    $result = add2favorites('web.favorite.screenids',$sourceid,$_REQUEST['favobj']);
                }
            }
            else if('remove' == $_REQUEST['action']){
                $result = rm4favorites('web.favorite.screenids',$_REQUEST['favid'],$_REQUEST['favobj']);
            }

            if(PAGE_TYPE_JS == $page['type'] && $result){
                $innerHTML = make_favorite_screens();
                $innerHTML = $innerHTML->toString();
                echo '$("hat_favscr").update('.zbx_jsvalue($innerHTML).');';

                $menu = array();
                $submenu = array();
                echo 'page_submenu["menu_screens"] = '.zbx_jsvalue(make_screen_submenu()).';';
            }
        }
    }

    if((PAGE_TYPE_JS == $page['type']) || (PAGE_TYPE_HTML_BLOCK == $page['type'])){
        include_once('include/page_footer.php');
        exit();
    }

//    $time = new CSpan(date("[H:i:s]",time()));
//    $time->setAttribute('id','refreshed');

 

           这三部分对应的dashboard左侧表格的展示。add、remove实际对应的动作是:

                                     

                    image

     当然你如果remove掉了,那这部分表单就不显示了。

    我们来看下rm4favorites函数:

function rm4favorites($favobj, $favid=0, $source=null){
    global $USER_DETAILS;

    $sql = 'DELETE FROM profiles '.
        ' WHERE userid='.$USER_DETAILS['userid'].
            ' AND idx='.zbx_dbstr($favobj).
            (($favid > 0) ? ' AND value_id='.zbx_dbstr($favid) : '').
            (is_null($source) ? '' : ' AND source='.zbx_dbstr($source));

    return DBexecute($sql);

       主要就是在数据库中执行了一个delete的操作,这意味着如果点击了remove那相应的配置项都会丢失。当然对应的add操作也会将配置项插入到数据中去。

 

      2.全屏图标的展示

    if((PAGE_TYPE_JS == $page['type']) || (PAGE_TYPE_HTML_BLOCK == $page['type'])){
        include_once('include/page_footer.php');
        exit();
    }

//    $time = new CSpan(date("[H:i:s]",time()));
//    $time->setAttribute('id','refreshed');

    $dashboard_wdgt = new CWidget('dashboard_wdgt');
// Header

    $fs_icon = get_icon('fullscreen', array('fullscreen' => $_REQUEST['fullscreen']));

    $style = $dashconf['filterEnable']? 'iconconfig_hl':'iconconfig';
    $state = S_CONFIGURE.' ('.S_FILTER.' '.($dashconf['filterEnable']?S_ENABLED:S_DISABLED).')';
    $dc_icon = new CIcon($state, $style, "document.location = 'dashconf.php';");

    $dashboard_wdgt->setClass('header');
    $dashboard_wdgt->addHeader(S_DASHBOARD_BIG, array($dc_icon, $fs_icon));
//-------------

    $left_tab = new CTable();
    $left_tab->setCellPadding(3);
    $left_tab->setCellSpacing(3);

    $left_tab->setAttribute('border',0);

    $menu = array();
    $submenu = array();

// js menu arrays
    make_graph_menu($menu,$submenu);
    make_sysmap_menu($menu,$submenu);
    make_screen_menu($menu,$submenu);

    make_refresh_menu('mainpage','hat_syssum',CProfile::get('web.dahsboard.rf_rate.hat_syssum',60),null,$menu,$submenu);
    make_refresh_menu('mainpage','hat_hoststat',CProfile::get('web.dahsboard.rf_rate.hat_hoststat',60),null,$menu,$submenu);
    make_refresh_menu('mainpage','hat_stszbx',CProfile::get('web.dahsboard.rf_rate.hat_stszbx',60),null,$menu,$submenu);
    make_refresh_menu('mainpage','hat_lastiss',CProfile::get('web.dahsboard.rf_rate.hat_lastiss',60),null,$menu,$submenu);
    make_refresh_menu('mainpage','hat_webovr',CProfile::get('web.dahsboard.rf_rate.hat_webovr',60),null,$menu,$submenu);
    make_refresh_menu('mainpage','hat_dscvry',CProfile::get('web.dahsboard.rf_rate.hat_dscvry',60),null,$menu,$submenu);

    insert_js('var page_menu='.zbx_jsvalue($menu).";\n".
            'var page_submenu='.zbx_jsvalue($submenu).";\n"
        );

if((PAGE_TYPE_JS == $page[‘type’]) 这块就是前面说的根据页面类型返回针对的内容。

       $dashboard_wdgt = new CWidget(‘dashboard_wdgt’);  这个比较关键,整个dashboard的展示都是这货负责的,不信的话你注释掉看看。

$fs_icon = get_icon(‘fullscreen’, array(‘fullscreen’ => $_REQUEST[‘fullscreen’]));

这部分代码其实是生成了dashboard上的fullscreen按钮,这里调用了get_icon函数:

    function get_icon($name, $params=array()){

        switch($name){
            case 'favourite':
                if(infavorites($params['fav'], $params['elid'], $params['elname'])){
                    $icon = new CIcon(
                        S_REMOVE_FROM.' '.S_FAVOURITES,
                        'iconminus',
                        'rm4favorites("'.$params['elname'].'","'.$params['elid'].'", 0);'
                    );
                }
                else{
                    $icon = new CIcon(
                        S_ADD_TO.' '.S_FAVOURITES,
                        'iconplus',
                        'add2favorites("'.$params['elname'].'","'.$params['elid'].'");'
                    );
                }
                $icon->setAttribute('id','addrm_fav');
            break;
            case 'fullscreen':
                $url = new Curl();
                $url->setArgument('fullscreen', $params['fullscreen'] ? '0' : '1');
                $icon = new CIcon(
                    $_REQUEST['fullscreen'] ? S_NORMAL.' '.S_VIEW : S_FULLSCREEN,
                    'fullscreen',
                    "document.location = '".$url->getUrl()."';"
                );
            break;
            case 'menu':
                $icon = new CIcon(S_MENU, 'iconmenu', 'create_page_menu(event, "'.$params['menu'].'");');
            break;
            case 'reset':
                $icon = new CIcon(S_RESET, 'iconreset', 'timeControl.objectReset("'.$params['id'].'");');
            break;
        }

        return $icon;
    }

 

          对应的fullscreen分支就是用来展示这个fullscreen图标的。

          当然了fullscreen旁边的这个configur图标也是类似的形式去实现的,大家有兴趣的自行研究下吧,即dc_icon这部分代码。

          js这部分不说了,原谅我不懂js…

 

   3.整个页面的展示:

// Favorite graphs
    $graph_menu = get_icon('menu', array('menu' => 'graphs'));
    $fav_grph = new CWidget('hat_favgrph',
                        make_favorite_graphs(),
                        CProfile::get('web.dashboard.hats.hat_favgrph.state',1)
                        );
    $fav_grph->addHeader(S_FAVOURITE_GRAPHS,array($graph_menu));
    $left_tab->addRow($fav_grph);
//----------------

// favorite screens
    $screen_menu = get_icon('menu', array('menu' => 'screens'));
    $fav_scr = new CWidget('hat_favscr',
                        make_favorite_screens(),
                        CProfile::get('web.dashboard.hats.hat_favscr.state',1)
                        );
    $fav_scr->addHeader(S_FAVOURITE_SCREENS,array($screen_menu));
    $left_tab->addRow($fav_scr);
//----------------

....

    $left_tab->addRow(SPACE);

    $right_tab = new CTable();
    $right_tab->setCellPadding(3);
    $right_tab->setCellSpacing(3);

    $right_tab->setAttribute('border',0);

// Refresh tab

    $refresh_tab = array(
        array('id' => 'hat_syssum',
                'frequency' => CProfile::get('web.dahsboard.rf_rate.hat_syssum',120)
            ),
        array('id' => 'hat_stszbx',
                'frequency' => CProfile::get('web.dahsboard.rf_rate.hat_stszbx',120)
            ),
        array('id' => 'hat_lastiss',
                'frequency'  => CProfile::get('web.dahsboard.rf_rate.hat_lastiss',60)
            ),
        array('id' => 'hat_webovr',
                'frequency'  => CProfile::get('web.dahsboard.rf_rate.hat_webovr',60)
            ),
        array('id' => 'hat_hoststat',
                'frequency'  => CProfile::get('web.dahsboard.rf_rate.hat_hoststat',60)
            )
/*        array('id' => 'hat_custom',
                'frequency'  =>    CProfile::get('web.dahsboard.rf_rate.hat_custom',60),
                'url'=>    'charts.php?groupid=4&hostid=10017&graphid=5&output=html&fullscreen=1'
            )*/
    );


...

// Discovery Info
    $drules = DBfetch(DBselect('SELECT COUNT(d.druleid) as cnt FROM drules d WHERE '.DBin_node('d.druleid').' AND d.status='.DRULE_STATUS_ACTIVE));

    if(($drules['cnt'] > 0) && check_right_on_discovery(PERM_READ_ONLY)){

        $refresh_tab[] = array(    'id' => 'hat_dscvry','frequency'  => CProfile::get('web.dahsboard.rf_rate.hat_dscvry',60));

        $refresh_menu = get_icon('menu', array('menu' => 'hat_dscvry'));
        $web_mon = new CWidget('hat_dscvry',
                            new CSpan(S_LOADING_P,'textcolorstyles'),//make_discovery_status()
                            CProfile::get('web.dashboard.hats.hat_dscvry.state',1)
                            );
        $web_mon->addHeader(S_DISCOVERY_STATUS,array($refresh_menu));
        $right_tab->addRow($web_mon);
//----------------
    }

 

          left_tab、right_tab这两部分代码是页面展示的核心,主要是生成了左、右两个大的表单。

             你看到在左边的内容都扔到了left_tab中,右边的同理。

              

      这部分其实就是left_tab里面的元素的具体实现、展示这些。前面说了left_tab是一个大的表单包含着这些元素,而具体的Favorite Sysmaps 这些是一些小的表单。

    add_doll_objects($refresh_tab);

/*
    $right_tab->addRow(create_hat(
            S_GRAPH,
            null,//make_webmon_overview(),
            null,
            'hat_custom',
            CProfile::get('web.dashboard.hats.hat_custom.state',1)
        ));
*/
    $td_l = new CCol($left_tab);
    $td_l->setAttribute('valign','top');

    $td_r = new CCol($right_tab);
    $td_r->setAttribute('valign','top');

    $outer_table = new CTable();
    $outer_table->setAttribute('border',0);
    $outer_table->setCellPadding(1);
    $outer_table->setCellSpacing(1);
    $outer_table->addRow(array($td_l,$td_r));

    $dashboard_wdgt->addItem($outer_table);
    $dashboard_wdgt->show();
?>

           td_1,td_r 调用了CCol函数,其实这部分是设置了col标签,装饰表格用的。

<?php
class CCol extends CTag{
    public function __construct($item=NULL,$class=NULL){
        parent::__construct('td','yes');

        $this->addItem($item);
        $this->setClass($class);
    }

    public function setAlign($value){
        return $this->attributes['align'] = $value;
    }

    public function setRowSpan($value){
        return $this->attributes['rowspan'] = strval($value);
    }

    public function setColSpan($value){
        return $this->attributes['colspan'] =strval($value);
    }

    public function setWidth($value){
        if(is_string($value))$this->setAttribute('width',$value);
    }
}
?> 

  

           很简单,这里就简单了垂直对其(valign)和边框(border)值。

      outer_table又是一个大的表格,比left_tab、right_tab更大的表格,用来包含left_tab和right_tab的,当然了你也可以不用。

      最后将outer_table放到了更大的dashboard_wdgt中,一层套着一层。

      最后的js不解释。。

4.实践:

       

            代码又是代码,看多了能催眠的,为了验证前面的结论(大表套下表),我们动手实验下。

 

           我们新建一个furion.php的文件:

<?php

include_once('include/page_header.php');

    $dashboard_wdgt = new CWidget('dashboard_wdgt');

    $left_tab = new CTable();
    $left_tab->setCellPadding(3);
    $left_tab->setCellSpacing(3);

    $left_tab->setAttribute('border',0);

    $menu = array();
    $submenu = array();


    $refresh_menu3 = get_icon('menu', array('menu' => 'furion_furion'));
    $web_mon3 = new CWidget('furion_furion',
                        new CSpan('furion_furion','textcolorstyles'),//make_webmon_overview()
                                                //CProfile::get('web.dashboard.hats.hat_webovr.state',1)
                                                CProfile::get('hero',0)
                        );
    $web_mon3->addHeader('furion_furionmunu',array($refresh_menu3));
    //$web_mon3->addHeader('furion_furionmunu');
    $left_tab->addRow($web_mon3);

    $right_tab = new CTable();
    $right_tab->setCellPadding(3);
    $right_tab->setCellSpacing(3);

    $right_tab->setAttribute('border',0);


// Web monioring
    $refresh_menu = get_icon('menu', array('menu' => 'hat_webovr'));
    $web_mon = new CWidget('hat_webovr',
                        new CSpan(S_LOADING_P,'textcolorstyles'),//make_webmon_overview()
                        CProfile::get('web.dashboard.hats.hat_webovr.state',1)
                        );
    $web_mon->addHeader(S_WEB_MONITORING,array($refresh_menu));
    $right_tab->addRow($web_mon);

// Test 
    $refresh_menu2 = get_icon('menu', array('menu' => 'test'));
    $web_mon2 = new CWidget('test',
                        new CSpan('hero','textcolorstyles'),//make_webmon_overview()
                                                CProfile::get('web.dashboard.hats.hat_webovr.state',1)
                        );
    $web_mon2->addHeader('furion_test munu',array($refresh_menu2));
    //$web_mon2->addHeader('furion_test munu');
    $right_tab->addRow($web_mon2);


    $td_l = new CCol($left_tab);
    $td_l->setAttribute('valign','top');

    $td_r = new CCol($right_tab);
    $td_r->setAttribute('valign','top');

    $outer_table = new CTable();
    $outer_table->setAttribute('border',0);
    $outer_table->setCellPadding(1);
    $outer_table->setCellSpacing(1);
    $outer_table->addRow(array($td_l,$td_r));

    $dashboard_wdgt->addItem($outer_table);
#    $dashboard_wdgt->addItem($right_tab);
#    $dashboard_wdgt->addItem($left_tab);
    $dashboard_wdgt->show();
?>
<?php

include_once('include/page_footer.php');

?>

 

                  访问下试试看:

 

                      image

             

              清楚了吧,我这里就是定义了dashboard_wdgt,里面包含了left_tab、right_tab,具体的left_tab、right_tab你随意填充就是了。

5.总结:

     dashboard的代码写的异常复杂,比index要复杂很多,涉及了一些ajax的东西,后续还得仔细琢磨呀。

One Response to “zabbix前端代码浅析之dashboard.php”

  1. 少林功夫好 says:

    一步步分析,很有意思。

Leave a Reply

Your email address will not be published. Required fields are marked *


To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax