search.html 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <div class="search-backdrop" ng-if="ctrl.isOpen"></div>
  2. <div class="search-container" ng-if="ctrl.isOpen">
  3. <div class="search-field-wrapper">
  4. <div class="search-field-icon pointer" ng-click="ctrl.closeSearch()"><i class="fa fa-search"></i></div>
  5. <input type="text" placeholder="Find dashboards by name" give-focus="ctrl.giveSearchFocus" tabindex="1"
  6. ng-keydown="ctrl.keyDown($event)"
  7. ng-model="ctrl.query.query"
  8. ng-model-options="{ debounce: 500 }"
  9. spellcheck='false'
  10. ng-change="ctrl.search()"
  11. />
  12. <div class="search-field-spacer"></div>
  13. </div>
  14. <div class="search-dropdown">
  15. <div class="search-dropdown__col_1">
  16. <div class="search-results-container" grafana-scrollbar>
  17. <h6 ng-show="!ctrl.isLoading && ctrl.results.length === 0">No dashboards matching your query were found.</h6>
  18. <dashboard-search-results
  19. results="ctrl.results"
  20. on-tag-selected="ctrl.filterByTag($tag)"
  21. on-folder-expanding="ctrl.folderExpanding()"
  22. on-folder-expanded="ctrl.folderExpanded($folder)" />
  23. </div>
  24. </div>
  25. <div class="search-dropdown__col_2">
  26. <div class="search-filter-box" ng-click="ctrl.onFilterboxClick()">
  27. <div class="search-filter-box__header">
  28. <i class="fa fa-filter"></i>
  29. Filter by:
  30. <a class="pointer pull-right small" ng-click="ctrl.clearSearchFilter()">
  31. <i class="fa fa-remove"></i> Clear
  32. </a>
  33. </div>
  34. <tag-filter tags="ctrl.query.tag" tagOptions="ctrl.getTags" onSelect="ctrl.onTagSelect">
  35. </tag-filter>
  36. </div>
  37. <div class="search-filter-box" ng-if="ctrl.isEditor">
  38. <a href="dashboard/new" class="search-filter-box-link">
  39. <i class="gicon gicon-dashboard-new"></i> New dashboard
  40. </a>
  41. <a href="dashboards/folder/new" class="search-filter-box-link">
  42. <i class="gicon gicon-folder-new"></i> New folder
  43. </a>
  44. <a href="dashboard/import" class="search-filter-box-link">
  45. <i class="gicon gicon-dashboard-import"></i> Import dashboard
  46. </a>
  47. <a class="search-filter-box-link" target="_blank" href="https://grafana.com/dashboards?utm_source=grafana_search">
  48. <img src="public/img/icn-dashboard-tiny.svg" width="20" /> Find dashboards on Grafana.com
  49. </a>
  50. </div>
  51. </div>
  52. </div>
  53. </div>