david
/
falcon-dashboard
peilaus alkaen https://github.com/open-falcon/dashboard.git


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
							
{% extends "base.html" %}

{%block title%}Falcon-Dashboard{%endblock%}

{% block more_head %}
{{super()}}

<script src="/static/js/jquery.shiftcheckbox.js" type= "text/javascript" ></script>
<script src="/static/js/xperf.js?_v=0.1.0"></script>
<script>

        $(function(){
            $(document).ready (function() {
                $('.shiftCheckbox').shiftcheckbox();
            });
            $("#check_all_endpoints").bind("click", fn_check_all_hosts);
            $("#check_all_counters").bind("click", fn_check_all_items);
            $("#endpoint-search").keydown(function(event){
                if(event.keyCode == 13){
                    fn_list_endpoints();
                    event.preventDefault();
                    return false;
                }
            });
            $("#counter-search").keydown(function(event){
                if(event.keyCode == 13){
                    fn_list_counters();
                    event.preventDefault();
                    return false;
                }
            });
            $("#counter-filter").keydown(function(event){
                if(event.keyCode == 13){
                    filter_counter();
                    event.preventDefault();
                    return false;
                }
            });
            $("#tag-search").tokenfield();

            $("#service-search").select2({
                minimumInputLength: 3
            });

        })

</script>
{% endblock %}

{%block body_head%} <body> {%endblock%}


{%block navbar%}
  {%include "navbar.html"%}
{%endblock%}

{% block container %}

<div class="row">
    {% block main_section%}
    <div class="col-md-4">
        <div class="row">
            <div class="col-md-12" id="endpoints">
                    <div class="panel panel-info">
                        <div class="panel-heading">
                            <img class="loading pull-right" src="/static/img/loading.gif" style="display:none;"></img>
                            搜索Endpoints
                        </div>

                        <div class="panel-body">
                            <form role="form">
                                <div class="form-group">
                                    <label>Endpoint</label>
                                    <input id="endpoint-search" name="endpoint_search" type="text" class="form-control input-sm">
                                    <p class="help-block"><span class="text-warning">可以用空格分割多个搜索关键字</span></p>
                                </div>
                                <div class="form-group">
                                    <label>标签( eg: job=appstore-web)</label>
                                    <input id="tag-search" name="tag_search" type="text" class="form-control input-sm">
                                </div>
                            </form>
                            <form class="form-inline" role="form">
                                <div class="form-group">
                                    <button type="button" id="btn-search-endpoints" class="btn btn-default btn-sm btn-success" onclick="fn_list_endpoints();return false;">全局搜索</button>
                                    <select class="form-control input-sm" id="endpoint-limit" onchange="fn_list_endpoints();return false;">
                                        <option value="50"> Limit 50</option>
                                        <option value="100">Limit 100</option>
                                        <option value="500">Limit 500</option>
                                    </select>
                                </div>
                            </form>
                            <hr/>
                            <form class="form-inline" role="form">
                                <div class="form-group">
                                    <input id="endpoint-filter" type="text" class="form-control input-sm">
                                    <button class="btn btn-default btn-sm btn-info" onclick="filter_endpoint();return false;">快速过滤</button>
                                </div>
                            </form>

                        </div>

                        <table class="table table-striped">
                            <thead> <tr> <p class="help-block"><span class="text-warning">支持shift多选</span></p>
                                <th width="30px" colspan=2><input type="checkbox" id="check_all_endpoints"></th>
                                <th><button class="btn btn-link btn-xs pull-right" onclick="fn_list_counters();return false;">刷新counter列表</button></th>
                            </tr></thead>
                            <tbody id="tbody-endpoints"> </tbody>
                        </table>

                    </div>
                </div>

            </div>
        </div>
    {%endblock%}

    {% block right_section%}
    <div class="col-md-8">
        <div class="row">
                <div class="col-md-12" id="counters">

                    <div class="panel panel-info">
                        <div class="panel-heading">
                            <img class="loading pull-right" src="/static/img/loading.gif" style="display:none;"></img>
                            搜索Counters
                        </div>

                        <div class="panel-body">
                            <form role="form">
                                <div class="form-group">
                                    <label>Counter</label>
                                    <input id="counter-search" type="text" class="form-control input-sm">
                                    <p class="help-block"><span class="text-warning">可以用空格分割多个搜索关键字</span></p>
                                </div>
                            </form>

                            <form class="form-inline" role="form">
                                <button class="btn btn-default btn-sm btn-success" onclick="fn_list_counters();return false;">搜索</button>
                                <div class="form-group">
                                    <select class="form-control input-sm" id="counter-limit" onchange="fn_list_counters();return false;">
                                        <option value="50"> Limit 50</option>
                                        <option value="100">Limit 100</option>
                                        <option value="500">Limit 500</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <input id="counter-filter" type="text" class="form-control input-sm">
                                    <button class="btn btn-default btn-sm btn-info" onclick="filter_counter();return false;">快速过滤</button>
                                </div>

                                <div class="dropdown form-group pull-right">
                                    <a class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" href="#"> 看图 <span class="caret"></span></a>
                                    <ul class="dropdown-menu" role="menu">
                                      <li><a href="#" class="btn btn-link btn-xs" onclick="fn_show_all('h');return false;">Endpoint视角</a></li>
                                      <li><a href="#" class="btn btn-link btn-xs" onclick="fn_show_all('k');return false;">Counter视角</a></li>
                                      <li><a href="#" class="btn btn-link btn-xs" onclick="fn_show_all('a');return false;">组合视角</a></li>
                                    </ul>
                                </div>

                            </form>

                        </div>

                        <table class="table table-striped">
                            <thead> <tr>
                                <th width="30px"><input type="checkbox" id="check_all_counters"></th>
                                <th >Counters</th>
                                <th width="60px">类型</th>
                                <th width="60px">频率</th>
                            </tr></thead>

                            <tbody id="tbody-counters"> </tbody>
                        </table>
                    </div>

                </div>
        </div>
    </div>
    {% endblock %}

</div>
{% endblock %}