opensource/grafana
1
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-08-06 19:39:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(query editors): updated prometheus editor

Browse Source
This commit is contained in:
Torkel Ödegaard
2016-04-27 10:50:29 +02:00
parent 5e6485c210
commit 206cb51219
2 changed files with 49 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
public/app/plugins/datasource/prometheus/partials/query.editor.html
View File

@ -1,80 +1,54 @@
<query-editor-row ctrl="ctrl"> <query-editor-row query-ctrl="ctrl" can-collapse="false">
<li class="tight-form-item" style="width: 94px"> <div class="gf-form-inline">
Query <div class="gf-form gf-form--grow">
</li> <label class="gf-form-label width-8">Query</label>
<li> <input type="text" class="gf-form-input" ng-model="ctrl.target.expr" spellcheck='false' placeholder="query expression" data-min-length=0 data-items=100 ng-model-onblur ng-change="ctrl.refreshMetricData()">
<input type="text" </div>
class="input-xxlarge tight-form-input" <div class="gf-form max-width-22">
ng-model="ctrl.target.expr" <label class="gf-form-label">Metric lookup</label>
spellcheck='false' <input type="text" class="gf-form-input" ng-model="ctrl.target.metric" spellcheck='false' bs-typeahead="ctrl.suggestMetrics" placeholder="metric name" data-min-length=0 data-items=100>
placeholder="query expression" </div>
data-min-length=0 data-items=100 </div>
ng-model-onblur
ng-change="ctrl.refreshMetricData()">
</li>
<li class="tight-form-item">
Metric
</li>
<li>
<input type="text"
class="input-medium tight-form-input"
ng-model="ctrl.target.metric"
spellcheck='false'
bs-typeahead="ctrl.suggestMetrics"
placeholder="metric name"
data-min-length=0 data-items=100>
</li>
</query-editor-row>
<div class="tight-form"> <div class="gf-form-inline">
<ul class="tight-form-list" role="menu"> <div class="gf-form max-width-26">
<li class="tight-form-item tight-form-align" style="width: 94px"> <label class="gf-form-label width-8">Legend format</label>
Legend format <input type="text" class="gf-form-input" ng-model="ctrl.target.legendFormat"
</li>
<li>
<input type="text" class="tight-form-input input-xxlarge" ng-model="ctrl.target.legendFormat"
spellcheck='false' placeholder="legend format" data-min-length=0 data-items=1000 spellcheck='false' placeholder="legend format" data-min-length=0 data-items=1000
ng-model-onblur ng-change="ctrl.refreshMetricData()"> ng-model-onblur ng-change="ctrl.refreshMetricData()">
</input> </input>
</li> </div>
</ul> <div class="gf-form">
<label class="gf-form-label width-5">Step</label>
<input type="text" class="gf-form-input max-width-5" ng-model="ctrl.target.interval"
data-placement="right"
spellcheck='false'
placeholder="{{ctrl.panelCtrl.interval}}"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="ctrl.refreshMetricData()"/>
<info-popover mode="right-absolute">
Leave blank for auto handling based on time range and panel width
</info-popover>
</div>
<div class="gf-form">
<label class="gf-form-label">Resolution</label>
<div class="gf-form-select-wrapper max-width-15">
<select ng-model="ctrl.target.intervalFactor" class="gf-form-input"
ng-options="r.factor as r.label for r in ctrl.resolutions"
ng-change="ctrl.refreshMetricData()">
</select>
</div>
<label class="gf-form-label">
<a href="{{ctrl.linkToPrometheus}}" target="_blank" bs-tooltip="'Link to Graph in Prometheus'">
<i class="fa fa-share-square-o"></i>
</a>
</label>
</div>
<div class="clearfix"></div> <div class="gf-form gf-form--grow">
</div> <div class="gf-form-label gf-form-label--grow"></div>
</div>
</div>
<div class="tight-form"> </query-editor-row>
<ul class="tight-form-list" role="menu">
<li class="tight-form-item tight-form-align" style="width: 94px">
Step
</li>
<li>
<input type="text" class="input-mini tight-form-input" ng-model="ctrl.target.interval"
bs-tooltip="'Leave blank for auto handling based on time range and panel width'"
data-placement="right"
spellcheck='false'
placeholder="{{ctrl.panelCtrl.interval}}"
data-min-length=0 data-items=100
ng-model-onblur
ng-change="ctrl.refreshMetricData()"
/>
</input>
</li>
<li class="tight-form-item">
Resolution
</li>
<li>
<select ng-model="ctrl.target.intervalFactor" class="tight-form-input input-mini"
ng-options="r.factor as r.label for r in ctrl.resolutions"
ng-change="ctrl.refreshMetricData()">
</select>
</li>
<li class="tight-form-item">
<a href="{{ctrl.linkToPrometheus}}" target="_blank" bs-tooltip="'Link to Graph in Prometheus'">
<i class="fa fa-share-square-o"></i>
</a>
</li>
</ul>
<div class="clearfix"></div>
</div>

2
public/sass/utils/_utils.scss
View File

@ -59,7 +59,7 @@ button.close {
// Toggling content // Toggling content
.hide { .hide {
display: none !important; display: none;
} }
.show { .show {