search.html 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <div ng-controller="SearchCtrl" ng-init="init()">
  2. <div class="dashboard-editor-header">
  3. <div class="dashboard-editor-title" style="border: 0; line-height: 41px;">
  4. <i class="icon icon-search"></i>
  5. Search
  6. </div>
  7. <div class="grafana-search-panel">
  8. <div class="search-field-wrapper">
  9. <button class="btn btn-success pull-right" dash-editor-link="app/partials/playlist.html" editor-scope="isolated">
  10. <i class="icon-play"></i>
  11. Playlist
  12. </button>
  13. <button class="btn btn-success pull-right" ng-click="toggleImport($event)">
  14. <i class="icon-download-alt"></i>
  15. Import
  16. </button>
  17. <button class="btn btn-success pull-right" ng-click="newDashboard()">
  18. <i class="icon-th-large"></i>
  19. New
  20. </button>
  21. <span style="position: relative;">
  22. <input type="text" placeholder="search dashboards, metrics, or graphs" xng-focus="giveSearchFocus"
  23. ng-keydown="keyDown($event)" ng-model="query.query" ng-model-options="{ debounce: 500 }" spellcheck='false' ng-change="search()" />
  24. <a class="search-tagview-switch" href="javascript:void(0);" ng-class="{'active': tagsOnly}" ng-click="showTags($event)">tags</a>
  25. </span>
  26. </div>
  27. </div>
  28. </div>
  29. <div ng-if="!showImport">
  30. <h6 ng-hide="results.dashboards.length">No dashboards matching your query were found.</h6>
  31. <div class="search-results-container" ng-if="tagsOnly">
  32. <div class="row">
  33. <div class="span6 offset1">
  34. <div ng-repeat="tag in results.tags" class="pointer" style="width: 180px; float: left;"
  35. ng-class="{'selected': $index === selectedIndex }"
  36. ng-click="filterByTag(tag.term, $event)">
  37. <a class="search-result-tag label label-tag" tag-color-from-name>
  38. <i class="icon icon-tag"></i>
  39. <span>{{tag.term}} &nbsp;({{tag.count}})</span>
  40. </a>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. <div class="search-results-container" ng-if="!tagsOnly">
  46. <div class="search-result-item pointer" bindonce ng-repeat="row in results.dashboards"
  47. ng-class="{'selected': $index === selectedIndex }" ng-click="goToDashboard(row.id)">
  48. <div class="search-result-actions small">
  49. <a ng-click="shareDashboard(row.id, row.id, $event)" config-modal="app/partials/dashLoaderShare.html">
  50. <i class="icon-share"></i> share &nbsp;&nbsp;&nbsp;
  51. </a>
  52. <a ng-click="deleteDashboard(row, $event)">
  53. <i class="icon-remove"></i> delete
  54. </a>
  55. </div>
  56. <div class="search-result-tags">
  57. <a ng-click="filterByTag(tag, $event)" ng-repeat="tag in row.tags" tag-color-from-name class="label label-tag">
  58. {{tag}}
  59. </a>
  60. </div>
  61. <a class="search-result-link">
  62. <i class="icon icon-th-large"></i>
  63. <span bo-text="row.title"></span>
  64. </a>
  65. </div>
  66. </div>
  67. </div>
  68. <div class="editor-row" ng-if="showImport">
  69. <div class="section">
  70. <div class="editor-option">
  71. <h5>Local File <tip>Load dashboard JSON layout from file</tip></h5>
  72. <form>
  73. <input type="file" id="dashupload" dash-upload/><br>
  74. </form>
  75. </div>
  76. </div>
  77. </div>
  78. </div>