2015-05-29 01:21:44 -05:00
|
|
|
<div class="variable-link-wrapper">
|
2019-12-17 23:13:58 -06:00
|
|
|
<a
|
2019-11-25 00:29:01 -06:00
|
|
|
ng-click="vm.show()"
|
|
|
|
class="variable-value-link"
|
2019-12-17 23:13:58 -06:00
|
|
|
aria-label="{{vm.selectors.submenuItemValueDropDownValueLinkTexts(vm.linkText)}}"
|
2019-11-25 00:29:01 -06:00
|
|
|
>
|
2019-12-17 23:13:58 -06:00
|
|
|
{{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">
|
|
|
|
<i class="fa fa-tag"></i> {{tag.text}}
|
|
|
|
</span>
|
|
|
|
</span>
|
|
|
|
<i class="fa fa-caret-down" style="font-size:12px"></i>
|
|
|
|
</a>
|
2015-05-29 01:21:44 -05:00
|
|
|
|
2019-12-17 23:13:58 -06:00
|
|
|
<input
|
|
|
|
type="text"
|
|
|
|
class="gf-form-input"
|
|
|
|
style="display: none"
|
|
|
|
ng-keydown="vm.keyDown($event)"
|
|
|
|
ng-model="vm.search.query"
|
|
|
|
ng-change="vm.debouncedQueryChanged()"
|
|
|
|
/>
|
2015-04-30 04:15:26 -05:00
|
|
|
|
2019-12-17 23:13:58 -06:00
|
|
|
<div
|
2019-11-25 00:29:01 -06:00
|
|
|
class="variable-value-dropdown"
|
|
|
|
ng-if="vm.dropdownVisible"
|
|
|
|
ng-class="{'multi': vm.variable.multi, 'single': !vm.variable.multi}"
|
2019-12-17 23:13:58 -06:00
|
|
|
aria-label="{{::vm.selectors.submenuItemValueDropDownDropDown}}"
|
2019-11-25 00:29:01 -06:00
|
|
|
>
|
2019-12-17 23:13:58 -06:00
|
|
|
<div class="variable-options-wrapper">
|
|
|
|
<div class="variable-options-column">
|
|
|
|
<a
|
2019-11-25 00:29:01 -06:00
|
|
|
class="variable-options-column-header"
|
|
|
|
ng-if="vm.variable.multi"
|
|
|
|
ng-class="{'many-selected': vm.selectedValues.length > 1}"
|
|
|
|
bs-tooltip="'Clear selections'"
|
|
|
|
data-placement="top"
|
|
|
|
ng-click="vm.clearSelections()"
|
|
|
|
>
|
2019-12-17 23:13:58 -06:00
|
|
|
<span class="variable-option-icon"></span>
|
|
|
|
Selected ({{vm.selectedValues.length}})
|
|
|
|
</a>
|
|
|
|
<a
|
2019-11-25 00:29:01 -06:00
|
|
|
class="variable-option pointer"
|
|
|
|
ng-repeat="option in vm.search.options"
|
|
|
|
ng-class="{'selected': option.selected, 'highlighted': $index === vm.highlightIndex}"
|
|
|
|
ng-click="vm.selectValue(option, $event)"
|
|
|
|
>
|
2019-12-17 23:13:58 -06:00
|
|
|
<span class="variable-option-icon"></span>
|
|
|
|
<span aria-label="{{vm.selectors.submenuItemValueDropDownOptionTexts(option.text)}}">{{option.text}}</span>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
<div class="variable-options-column" ng-if="vm.tags.length">
|
|
|
|
<div class="variable-options-column-header text-center">
|
|
|
|
Tags
|
|
|
|
</div>
|
|
|
|
<a
|
|
|
|
class="variable-option-tag pointer"
|
|
|
|
ng-repeat="tag in vm.tags"
|
|
|
|
ng-click="vm.selectTag(tag, $event)"
|
|
|
|
ng-class="{'selected': tag.selected}"
|
|
|
|
>
|
|
|
|
<span class="fa fa-fw variable-option-icon"></span>
|
|
|
|
<span class="label-tag" tag-color-from-name="tag.text"
|
|
|
|
>{{tag.text}} <i class="fa fa-tag"></i> </span
|
|
|
|
>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2015-04-27 06:59:20 -05:00
|
|
|
</div>
|