multi-select.directive.html 1.3 KB

123456789101112131415161718192021222324
  1. <div class="variable-link-wrapper">
  2. <a ng-click="vm.show()" class="variable-value-link">
  3. {{vm.linkText}}
  4. <i class="fa fa-caret-down" style="font-size:12px"></i>
  5. </a>
  6. <input type="text" class="gf-form-input width-11" ng-model="vm.linkText" ng-change="vm.queryChanged()" ></input>
  7. <div class="variable-value-dropdown multi" ng-if="vm.dropdownVisible">
  8. <div class="variable-options-wrapper">
  9. <div class="variable-options-column">
  10. <a ng-if="vm.options.length > 1" class="variable-options-column-header" ng-class="{'many-selected': vm.selectedValues.length > 1}" bs-tooltip="'Clear selections'" data-placement="top" ng-click="vm.clearSelections()">
  11. <span class="variable-option-icon"></span>
  12. Selected ({{vm.selectedValues.length}})
  13. </a>
  14. <a class="variable-option pointer" ng-repeat="option in vm.options" ng-class="{'selected': option.selected, 'highlighted': $index === vm.highlightIndex}" ng-click="vm.selectValue(option, $event)">
  15. <span class="variable-option-icon"></span>
  16. <span>{{option.text}}</span>
  17. </a>
  18. </div>
  19. </div>
  20. </div>
  21. </div>