feat(adhoc fiters): began work on ad-hoc filters, refactored submenu filters to use gf-form styles, #6038

pull/6108/head
Torkel Ödegaard 9 years ago
parent babab7677c
commit 0a44add6c9
  1. 17
      public/app/features/dashboard/submenu/submenu.html
  2. 1
      public/app/features/templating/editorCtrl.js
  3. 7
      public/app/features/templating/templateValuesSrv.js
  4. 4
      public/app/partials/valueSelectDropdown.html
  5. 5
      public/sass/components/_submenu.scss

@ -1,10 +1,19 @@
<div class="submenu-controls">
<div class="submenu-controls gf-form-query">
<ul ng-if="ctrl.dashboard.templating.list.length > 0">
<li ng-repeat="variable in ctrl.variables" ng-hide="variable.hide === 2" class="submenu-item">
<span class="submenu-item-label template-variable " ng-hide="variable.hide === 1">
{{variable.label || variable.name}}:
<div class="gf-form">
<label class="gf-form-label template-variable " ng-hide="variable.hide === 1">
{{variable.label || variable.name}}:
</label>
<value-select-dropdown ng-if="variable.type !== 'adhoc'" variable="variable" on-updated="ctrl.variableUpdated(variable)" get-values-for-tag="ctrl.getValuesForTag(variable, tagKey)"></value-select-dropdown>
</div>
<span ng-if="variable.type === 'adhoc'">
<div class="gf-form">
<label class="gf-form-label">hostname</label>
<label class="gf-form-label query-operator">=</label>
<label class="gf-form-label">server1</label>
</div>
</span>
<value-select-dropdown variable="variable" on-updated="ctrl.variableUpdated(variable)" get-values-for-tag="ctrl.getValuesForTag(variable, tagKey)"></value-select-dropdown>
</li>
</ul>

@ -23,6 +23,7 @@ function (angular, _) {
$scope.variableTypes = [
{value: "query", text: "Query"},
{value: "adhoc", text: "Ad hoc filters"},
{value: "interval", text: "Interval"},
{value: "datasource", text: "Data source"},
{value: "custom", text: "Custom"},

@ -188,6 +188,11 @@ function (angular, _, $, kbn) {
return;
}
if (variable.type === 'adhoc') {
variable.options = [];
return;
}
// extract options in comma separated string
variable.options = _.map(variable.query.split(/[,]+/), function(text) {
return { text: text.trim(), value: text.trim() };
@ -271,7 +276,7 @@ function (angular, _, $, kbn) {
this.validateVariableSelectionState = function(variable) {
if (!variable.current) {
if (!variable.options.length) { return; }
if (!variable.options.length) { return $q.when(); }
return self.setVariableValue(variable, variable.options[0], false);
}

@ -1,5 +1,5 @@
<div class="variable-link-wrapper">
<a ng-click="vm.show()" class="variable-value-link">
<a ng-click="vm.show()" class="gf-form-label variable-value-link">
{{vm.linkText}}
<span ng-repeat="tag in vm.selectedTags" bs-tooltip='tag.valuesText' data-placement="bottom">
<span class="label-tag"tag-color-from-name="tag.text">
@ -10,7 +10,7 @@
<i class="fa fa-caret-down"></i>
</a>
<input type="text" class="hidden-input input-small" style="display: none" ng-keydown="vm.keyDown($event)" ng-model="vm.search.query" ng-change="vm.queryChanged()" ></input>
<input type="text" class="hidden-input input-small gf-form-input" style="display: none" ng-keydown="vm.keyDown($event)" ng-model="vm.search.query" ng-change="vm.queryChanged()" ></input>
<div class="variable-value-dropdown" ng-if="vm.dropdownVisible" ng-class="{'multi': vm.variable.multi, 'single': !vm.variable.multi}">
<div class="variable-options-wrapper">

@ -18,10 +18,7 @@
.submenu-item {
margin-right: 20px;
display: inline-block;
border-radius: 3px;
background-color: $panel-bg;
border: $panel-border;
margin-right: 10px;
margin-right: 15px;
display: inline-block;
float: left;

Loading…
Cancel
Save