mirror of
https://github.com/grafana/grafana.git
synced 2025-02-20 11:48:34 -06:00
e76655df43
Makes changes to dropdown-typeahead2 so that a css class for the button can be passed in. Means it can be used instead of dropdown-typeahead. Switches to using dropdown-typeahead2 for series_overrides directive and for the influxdb, mysql and postgres datasources as it already contains a fix for this issue. This commit also fixes the index property which was set using an incorrectly spelled length property in the series_overrides directive. Closes #15621
232 lines
7.3 KiB
HTML
232 lines
7.3 KiB
HTML
<query-editor-row query-ctrl="ctrl" can-collapse="true" has-text-edit-mode="true">
|
|
<div ng-if="ctrl.target.rawQuery">
|
|
<div class="gf-form">
|
|
<textarea
|
|
rows="3"
|
|
class="gf-form-input"
|
|
ng-model="ctrl.target.query"
|
|
spellcheck="false"
|
|
placeholder="InfluxDB Query"
|
|
ng-model-onblur
|
|
ng-change="ctrl.refresh()"
|
|
></textarea>
|
|
</div>
|
|
<div class="gf-form-inline">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword">FORMAT AS</label>
|
|
<div class="gf-form-select-wrapper">
|
|
<select
|
|
class="gf-form-input gf-size-auto"
|
|
ng-model="ctrl.target.resultFormat"
|
|
ng-options="f.value as f.text for f in ctrl.resultFormats"
|
|
ng-change="ctrl.refresh()"
|
|
></select>
|
|
</div>
|
|
</div>
|
|
<div class="gf-form max-width-25" ng-hide="ctrl.target.resultFormat === 'table'">
|
|
<label class="gf-form-label query-keyword">ALIAS BY</label>
|
|
<input
|
|
type="text"
|
|
class="gf-form-input"
|
|
ng-model="ctrl.target.alias"
|
|
spellcheck="false"
|
|
placeholder="Naming pattern"
|
|
ng-blur="ctrl.refresh()"
|
|
/>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div ng-if="!ctrl.target.rawQuery">
|
|
<div class="gf-form-inline">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">FROM</label>
|
|
|
|
<metric-segment
|
|
segment="ctrl.policySegment"
|
|
get-options="ctrl.getPolicySegments()"
|
|
on-change="ctrl.policyChanged()"
|
|
></metric-segment>
|
|
<metric-segment
|
|
segment="ctrl.measurementSegment"
|
|
get-options="ctrl.getMeasurements($query)"
|
|
on-change="ctrl.measurementChanged()"
|
|
></metric-segment>
|
|
</div>
|
|
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword">WHERE</label>
|
|
</div>
|
|
|
|
<div class="gf-form" ng-repeat="segment in ctrl.tagSegments">
|
|
<metric-segment
|
|
segment="segment"
|
|
get-options="ctrl.getTagsOrValues(segment, $index)"
|
|
on-change="ctrl.tagSegmentUpdated(segment, $index)"
|
|
></metric-segment>
|
|
</div>
|
|
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-repeat="selectParts in ctrl.queryModel.selectModels">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7"> <span ng-show="$index === 0">SELECT</span> </label>
|
|
</div>
|
|
|
|
<div class="gf-form" ng-repeat="part in selectParts">
|
|
<query-part-editor
|
|
class="gf-form-label query-part"
|
|
part="part"
|
|
handle-event="ctrl.handleSelectPartEvent(selectParts, part, $event)"
|
|
>
|
|
</query-part-editor>
|
|
</div>
|
|
|
|
<div class="gf-form">
|
|
<label
|
|
class="dropdown"
|
|
dropdown-typeahead2="ctrl.selectMenu"
|
|
dropdown-typeahead-on-select="ctrl.addSelectPart(selectParts, $item, $subItem)"
|
|
button-template-class="gf-form-label query-part"
|
|
>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">
|
|
<span>GROUP BY</span>
|
|
</label>
|
|
|
|
<query-part-editor
|
|
ng-repeat="part in ctrl.queryModel.groupByParts"
|
|
part="part"
|
|
class="gf-form-label query-part"
|
|
handle-event="ctrl.handleGroupByPartEvent(part, $index, $event)"
|
|
>
|
|
</query-part-editor>
|
|
</div>
|
|
|
|
<div class="gf-form">
|
|
<metric-segment
|
|
segment="ctrl.groupBySegment"
|
|
get-options="ctrl.getGroupByOptions()"
|
|
on-change="ctrl.groupByAction(part, $index)"
|
|
></metric-segment>
|
|
</div>
|
|
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-if="ctrl.target.orderByTime === 'DESC'">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">ORDER BY</label>
|
|
<label class="gf-form-label pointer" ng-click="ctrl.removeOrderByTime()"
|
|
>time <span class="query-keyword">DESC</span> <i class="fa fa-remove"></i
|
|
></label>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-if="ctrl.target.limit">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">LIMIT</label>
|
|
<input
|
|
type="text"
|
|
class="gf-form-input width-9"
|
|
ng-model="ctrl.target.limit"
|
|
spellcheck="false"
|
|
placeholder="No Limit"
|
|
ng-blur="ctrl.refresh()"
|
|
/>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-if="ctrl.target.slimit">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">SLIMIT</label>
|
|
<input
|
|
type="text"
|
|
class="gf-form-input width-9"
|
|
ng-model="ctrl.target.slimit"
|
|
spellcheck="false"
|
|
placeholder="No Limit"
|
|
ng-blur="ctrl.refresh()"
|
|
/>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-if="ctrl.target.tz">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">tz</label>
|
|
<input
|
|
type="text"
|
|
class="gf-form-input width-9"
|
|
ng-model="ctrl.target.tz"
|
|
spellcheck="false"
|
|
placeholder="No Timezone"
|
|
ng-blur="ctrl.refresh()"
|
|
/>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline">
|
|
<div class="gf-form">
|
|
<label class="gf-form-label query-keyword width-7">FORMAT AS</label>
|
|
<div class="gf-form-select-wrapper">
|
|
<select
|
|
class="gf-form-input gf-size-auto"
|
|
ng-model="ctrl.target.resultFormat"
|
|
ng-options="f.value as f.text for f in ctrl.resultFormats"
|
|
ng-change="ctrl.refresh()"
|
|
></select>
|
|
</div>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="gf-form-inline" ng-hide="ctrl.target.resultFormat === 'table'">
|
|
<div class="gf-form max-width-30">
|
|
<label class="gf-form-label query-keyword width-7">ALIAS BY</label>
|
|
<input
|
|
type="text"
|
|
class="gf-form-input"
|
|
ng-model="ctrl.target.alias"
|
|
spellcheck="false"
|
|
placeholder="Naming pattern"
|
|
ng-blur="ctrl.refresh()"
|
|
/>
|
|
</div>
|
|
<div class="gf-form gf-form--grow">
|
|
<div class="gf-form-label gf-form-label--grow"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</query-editor-row>
|