Skip to content

Commit 0ebd921

Browse files
torkelotorkelo
committed
feat(query editors): updated cloudwatch to new form styles
1 parent 206cb51 commit 0ebd921

File tree

2 files changed

+53
-52
lines changed

2 files changed

+53
-52
lines changed

‎public/app/plugins/datasource/cloudwatch/partials/query.editor.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<query-editor-row ctrl="ctrl">
1+
<query-editor-row query-ctrl="ctrl" can-collapse="false">
2+
<cloudwatch-query-parameter target="ctrl.target" datasource="ctrl.datasource" on-change="ctrl.refresh()"></cloudwatch-query-parameter>
23
</query-editor-row>
34

4-
<cloudwatch-query-parameter target="ctrl.target" datasource="ctrl.datasource" on-change="ctrl.refresh()"></cloudwatch-query-parameter>

‎public/app/plugins/datasource/cloudwatch/partials/query.parameter.html

Lines changed: 51 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,59 @@
1-
<div class="tight-form">
2-
<ul class="tight-form-list" role="menu">
3-
<li class="tight-form-item query-keyword tight-form-align" style="width: 100px">
4-
Metric
5-
</li>
6-
<li>
7-
<metric-segment segment="regionSegment" get-options="getRegions()" on-change="regionChanged()"></metric-segment>
8-
</li>
9-
<li>
10-
<metric-segment segment="namespaceSegment" get-options="getNamespaces()" on-change="namespaceChanged()"></metric-segment>
11-
</li>
12-
<li>
13-
<metric-segment segment="metricSegment" get-options="getMetrics()" on-change="metricChanged()"></metric-segment>
14-
</li>
15-
<li class="tight-form-item query-keyword">
16-
Stats
17-
</li>
18-
<li ng-repeat="segment in statSegments">
19-
<metric-segment segment="segment" get-options="getStatSegments(segment, $index)" on-change="statSegmentChanged(segment, $index)"></metric-segment>
20-
</li>
21-
</ul>
1+
<div class="gf-form-inline">
2+
<div class="gf-form">
3+
<label class="gf-form-label query-keyword width-7">Metric</label>
224

23-
<div class="clearfix"></div>
5+
<metric-segment segment="regionSegment" get-options="getRegions()" on-change="regionChanged()"></metric-segment>
6+
<metric-segment segment="namespaceSegment" get-options="getNamespaces()" on-change="namespaceChanged()"></metric-segment>
7+
<metric-segment segment="metricSegment" get-options="getMetrics()" on-change="metricChanged()"></metric-segment>
8+
</div>
9+
10+
<div class="gf-form">
11+
<label class="gf-form-label query-keyword">Stats</label>
12+
</div>
13+
14+
<div class="gf-form" ng-repeat="segment in statSegments">
15+
<metric-segment segment="segment" get-options="getStatSegments(segment, $index)" on-change="statSegmentChanged(segment, $index)"></metric-segment>
16+
</div>
17+
18+
<div class="gf-form gf-form--grow">
19+
<div class="gf-form-label gf-form-label--grow"></div>
20+
</div>
2421
</div>
2522

26-
<div class="tight-form">
27-
<ul class="tight-form-list" role="menu">
28-
<li class="tight-form-item query-keyword tight-form-align" style="width: 100px">
29-
Dimensions
30-
</li>
31-
<li ng-repeat="segment in dimSegments">
32-
<metric-segment segment="segment" get-options="getDimSegments(segment, $index)" on-change="dimSegmentChanged(segment, $index)"></metric-segment>
33-
</li>
34-
</ul>
23+
<div class="gf-form-inline">
24+
<div class="gf-form">
25+
<label class="gf-form-label query-keyword width-7">Dimensions</label>
26+
<metric-segment ng-repeat="segment in dimSegments" segment="segment" get-options="getDimSegments(segment, $index)" on-change="dimSegmentChanged(segment, $index)"></metric-segment>
27+
</div>
3528

36-
<div class="clearfix"></div>
29+
<div class="gf-form gf-form--grow">
30+
<div class="gf-form-label gf-form-label--grow"></div>
31+
</div>
3732
</div>
3833

39-
<div class="tight-form">
40-
<ul class="tight-form-list" role="menu">
41-
<li class="tight-form-item query-keyword tight-form-align" style="width: 100px">
34+
<div class="gf-form-inline">
35+
<div class="gf-form">
36+
<label class="gf-form-label query-keyword width-7">
4237
Period
43-
<tip>Interval between points in seconds</tip>
44-
</li>
45-
<li>
46-
<input type="text" class="input-mini tight-form-input" ng-model="target.period" spellcheck='false' placeholder="auto" ng-model-onblur ng-change="onChange()" />
47-
</li>
48-
<li class="tight-form-item query-keyword">
49-
Alias
50-
<tip>{{metric}} {{stat}} {{namespace}} {{region}} {{DIMENSION_NAME}}</tip>
51-
</li>
52-
<li>
53-
<input type="text" class="input-xlarge tight-form-input" ng-model="target.alias" spellcheck='false' ng-model-onblur ng-change="onChange()">
54-
</li>
55-
</ul>
56-
<div class="clearfix"></div>
38+
<info-popover mode="right-normal">Interval between points in seconds</info-popover>
39+
</label>
40+
<input type="text" class="gf-form-input" ng-model="target.period" spellcheck='false' placeholder="auto" ng-model-onblur ng-change="onChange()" />
41+
</div>
42+
<div class="gf-form max-width-30">
43+
<label class="gf-form-label query-keyword width-7">Alias</label>
44+
<input type="text" class="gf-form-input" ng-model="target.alias" spellcheck='false' ng-model-onblur ng-change="onChange()">
45+
<info-popover mode="right-absolute">
46+
Alias replacement variables:
47+
<ul ng-non-bindable>
48+
<li>{{metric}}</li>
49+
<li>{{stat}}</li>
50+
<li>{{namespace}}</li>
51+
<li>{{region}}</li>
52+
<li>{{DIMENSION_NAME}}</li>
53+
</ul>
54+
</info-popover>
55+
</div>
56+
<div class="gf-form gf-form--grow">
57+
<div class="gf-form-label gf-form-label--grow"></div>
58+
</div>
5759
</div>
58-

0 commit comments

Comments
 (0)