settings.html 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. <div class="tabbed-view-header">
  2. <h2 class="tabbed-view-title">
  3. Settings
  4. </h2>
  5. <ul class="gf-tabs">
  6. <li class="gf-tabs-item" ng-repeat="tab in ::['General', 'Rows', 'Links', 'Time picker', 'Metadata']">
  7. <a class="gf-tabs-link" ng-click="editor.index = $index" ng-class="{active: editor.index === $index}">
  8. {{::tab}}
  9. </a>
  10. </li>
  11. </ul>
  12. <button class="tabbed-view-close-btn" ng-click="dismiss();">
  13. <i class="fa fa-remove"></i>
  14. </button>
  15. </div>
  16. <div class="tabbed-view-body">
  17. <div ng-if="editor.index == 0">
  18. <div class="gf-form-group section">
  19. <h5 class="section-heading">Details</h5>
  20. <div class="gf-form">
  21. <label class="gf-form-label width-7">Name</label>
  22. <input type="text" class="gf-form-input width-30" ng-model='dashboard.title'></input>
  23. </div>
  24. <div class="gf-form">
  25. <label class="gf-form-label width-7">Description</label>
  26. <input type="text" class="gf-form-input width-30" ng-model='dashboard.description'></input>
  27. </div>
  28. <div class="gf-form">
  29. <label class="gf-form-label width-7">
  30. Tags
  31. <info-popover mode="right-normal">Press enter to add a tag</info-popover>
  32. </label>
  33. <bootstrap-tagsinput ng-model="dashboard.tags" tagclass="label label-tag" placeholder="add tags">
  34. </bootstrap-tagsinput>
  35. </div>
  36. <div class="gf-form">
  37. <label class="gf-form-label width-7">Timezone</label>
  38. <div class="gf-form-select-wrapper">
  39. <select ng-model="dashboard.timezone" class='gf-form-input' ng-options="f.value as f.text for f in [{value: '', text: 'Default'}, {value: 'browser', text: 'Local browser time'},{value: 'utc', text: 'UTC'}]" ng-change="timezoneChanged()"></select>
  40. </div>
  41. </div>
  42. </div>
  43. <div class="section">
  44. <h5 class="section-heading">Toggles</h5>
  45. <div class="gf-form-group">
  46. <gf-form-switch class="gf-form"
  47. label="Editable"
  48. tooltip="Uncheck, then save and reload to disable all dashboard editing"
  49. checked="dashboard.editable"
  50. label-class="width-11">
  51. </gf-form-switch>
  52. <gf-form-switch class="gf-form"
  53. label="Hide Controls"
  54. tooltip="Hide row controls. Shortcut: CTRL+H or CMD+H"
  55. checked="dashboard.hideControls"
  56. label-class="width-11">
  57. </gf-form-switch>
  58. </div>
  59. </div>
  60. <div class="section">
  61. <h5 class="section-heading">Panel Options</h5>
  62. <div class="gf-form">
  63. <label class="gf-form-label width-11">
  64. Graph Tooltip
  65. <info-popover mode="right-normal">
  66. Cycle between options using Shortcut: CTRL+O or CMD+O
  67. </info-popover>
  68. </label>
  69. <div class="gf-form-select-wrapper">
  70. <select ng-model="dashboard.graphTooltip" class='gf-form-input' ng-options="f.value as f.text for f in [{value: 0, text: 'Default'}, {value: 1, text: 'Shared crosshair'},{value: 2, text: 'Shared Tooltip'}]"></select>
  71. </div>
  72. </div>
  73. </div>
  74. </div>
  75. <div ng-if="editor.index == 1">
  76. <h5 class="section-heading">Rows settings</h5>
  77. <div class="gf-form-group">
  78. <div class="gf-form-inline" ng-repeat="row in dashboard.rows">
  79. <div class="gf-form">
  80. <span class="gf-form-label">Title</span>
  81. <input type="text" class="gf-form-input max-width-14" ng-model='row.title'></input>
  82. </div>
  83. <gf-form-switch class="gf-form" label="Show title" checked="row.showTitle" switch-class="max-width-6"></gf-form-switch>
  84. <div class="gf-form">
  85. <button class="btn btn-inverse gf-form-btn" ng-click="_.move(dashboard.rows,$index,$index-1)">
  86. <i ng-class="{'invisible': $first}" class="fa fa-arrow-up"></i>
  87. </button>
  88. <button class="btn btn-inverse gf-from-btn" ng-click="_.move(dashboard.rows,$index,$index+1)">
  89. <i ng-class="{'invisible': $last}" class="fa fa-arrow-down"></i>
  90. </button>
  91. <button class="btn btn-inverse gf-form-btn" ng-click="dashboard.rows = _.without(dashboard.rows,row)">
  92. <i class="fa fa-trash"></i>
  93. </button>
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. <div ng-if="editor.index == 2">
  99. <dash-links-editor></dash-links-editor>
  100. </div>
  101. <div ng-if="editor.index == 3">
  102. <gf-time-picker-settings dashboard="dashboard"></gf-time-picker-settings>
  103. </div>
  104. <div ng-if="editor.index == 4">
  105. <h5 class="section-heading">Dashboard info</h5>
  106. <div class="gf-form-group">
  107. <div class="gf-form">
  108. <span class="gf-form-label width-10">Last updated at:</span>
  109. <span class="gf-form-label width-18">{{dashboard.formatDate(dashboardMeta.updated)}}</span>
  110. </div>
  111. <div class="gf-form">
  112. <span class="gf-form-label width-10">Last updated by:</span>
  113. <span class="gf-form-label width-18">{{dashboardMeta.updatedBy}}&nbsp;</span>
  114. </div>
  115. <div class="gf-form">
  116. <span class="gf-form-label width-10">Created at:</span>
  117. <span class="gf-form-label width-18">{{dashboard.formatDate(dashboardMeta.created)}}&nbsp;</span>
  118. </div>
  119. <div class="gf-form">
  120. <span class="gf-form-label width-10">Created by:</span>
  121. <span class="gf-form-label width-18">{{dashboardMeta.createdBy}}&nbsp;</span>
  122. </div>
  123. <div class="gf-form">
  124. <span class="gf-form-label width-10">Current version:</span>
  125. <span class="gf-form-label width-18">{{dashboardMeta.version}}&nbsp;</span>
  126. </div>
  127. </div>
  128. </div>
  129. </div>