IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(query_editors): more work

Browse Source
This commit is contained in:
Torkel Ödegaard 2016-04-28 10:13:18 +02:00
parent f1d4fd3e67
commit 0e4b70a4a8
5 changed files with 65 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/app/features/panel/metrics_ds_selector.ts
View File

@ -55,8 +55,10 @@ export class MetricsDsSelectorCtrl {
constructor(private uiSegmentSrv, datasourceSrv) {
this.datasources = datasourceSrv.getMetricSources();
var dsValue = this.panelCtrl.panel.datasource || null;
for (let ds of this.datasources) {
if (ds.value === this.panelCtrl.panel.datasource) {
if (ds.value === dsValue) {
this.current = ds;
}
}

14
public/app/features/panel/partials/query_editor_row.html
View File

@ -1,12 +1,14 @@
<div class="gf-form-query">
<div class="gf-form">
<label class="gf-form-label">
<a class="pointer query-keyword" tabindex="1" ng-click="ctrl.toggleCollapse()" ng-class="{muted: !ctrl.canCollapse}">
<i class="fa fa-caret-down" ng-hide="ctrl.collapsed"></i>
<i class="fa fa-caret-right" ng-show="ctrl.collapsed"></i>
{{ctrl.target.refId}}
<em ng-show="ctrl.target.datasource">{{ctrl.target.datasource}}&nbsp;</em>
<label class="gf-form-label gf-form-query-letter-cell">
<a class="pointer" tabindex="1" ng-click="ctrl.toggleCollapse()">
<span ng-class="{muted: !ctrl.canCollapse}" class="gf-form-query-letter-cell-carret">
<i class="fa fa-caret-down" ng-hide="ctrl.collapsed"></i>
<i class="fa fa-caret-right" ng-show="ctrl.collapsed"></i>
</span>
<span class="gf-form-query-letter-cell-letter">{{ctrl.target.refId}}</span>
<em class="gf-form-query-letter-cell-ds" ng-show="ctrl.target.datasource">({{ctrl.target.datasource}})</em>
</a>
</label>
</div>

2
public/app/plugins/datasource/opentsdb/partials/query.editor.html
View File

@ -219,7 +219,7 @@
</div>
<div class="gf-form-inline">
<gf-form-switch class="gf-form" label="Rate" label-class="width-8" checked="ctrl.target.shouldComputeRate" on-change="ctrl.targetBlur()">
<gf-form-switch class="gf-form" label="Rate" label-class="width-8 query-keyword" checked="ctrl.target.shouldComputeRate" on-change="ctrl.targetBlur()">
</gf-form-switch>
<gf-form-switch ng-hide="!ctrl.target.shouldComputeRate"

37
public/sass/components/_gf-form.scss
View File

@ -223,43 +223,6 @@ $gf-form-margin: 0.25rem;
}
}
.gf-form-query {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: flex-start;
align-items: flex-start;
.gf-form,
.gf-form-filler {
margin-bottom: 2px;
}
.gf-form-switch,
.gf-form-switch label,
.gf-form-input,
.gf-form-select-wrapper,
.gf-form-filler,
.gf-form-label {
margin-right: 2px;
}
}
.gf-form-query-content {
flex-grow: 2;
&--collapsed {
overflow: hidden;
.gf-form-label {
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
white-space: nowrap;
}
}
}
.gf-form-help-icon {
flex-grow: 0;
padding-left: $spacer;

53
public/sass/components/_query_editor.scss
View File

@ -14,3 +14,56 @@
color: $orange;
}
.gf-form-query {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-content: flex-start;
align-items: flex-start;
.gf-form,
.gf-form-filler {
margin-bottom: 2px;
}
.gf-form-switch,
.gf-form-switch label,
.gf-form-input,
.gf-form-select-wrapper,
.gf-form-filler,
.gf-form-label {
margin-right: 2px;
}
}
.gf-form-query-content {
flex-grow: 2;
&--collapsed {
overflow: hidden;
.gf-form-label {
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
white-space: nowrap;
}
}
}
.gf-form-query-letter-cell {
.gf-form-query-letter-cell-carret {
display: inline-block;
width: 0.7rem;
position: relative;
left: -2px;
}
.gf-form-query-letter-cell-letter {
font-weight: bold;
color: $blue;
}
.gf-form-query-letter-cell-ds {
color: $text-color-weak;
}
}