settings.html 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  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', 'Permissions']">
  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. <folder-picker ng-if="!dashboardMeta.isFolder"
  43. initial-title="dashboardMeta.folderTitle"
  44. on-change="onFolderChange($folder)"
  45. label-class="width-7">
  46. </folder-picker>
  47. </div>
  48. <div class="section">
  49. <h5 class="section-heading">Toggles</h5>
  50. <div class="gf-form-group">
  51. <gf-form-switch class="gf-form"
  52. label="Editable"
  53. tooltip="Uncheck, then save and reload to disable all dashboard editing"
  54. checked="dashboard.editable"
  55. label-class="width-11">
  56. </gf-form-switch>
  57. <gf-form-switch class="gf-form"
  58. label="Hide Controls"
  59. tooltip="Hide row controls. Shortcut: CTRL+H or CMD+H"
  60. checked="dashboard.hideControls"
  61. label-class="width-11">
  62. </gf-form-switch>
  63. </div>
  64. </div>
  65. <div class="section">
  66. <h5 class="section-heading">Panel Options</h5>
  67. <div class="gf-form">
  68. <label class="gf-form-label width-11">
  69. Graph Tooltip
  70. <info-popover mode="right-normal">
  71. Cycle between options using Shortcut: CTRL+O or CMD+O
  72. </info-popover>
  73. </label>
  74. <div class="gf-form-select-wrapper">
  75. <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>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80. <div ng-if="editor.index == 1">
  81. <h5 class="section-heading">Rows settings</h5>
  82. <div class="gf-form-group">
  83. <div class="gf-form-inline" ng-repeat="row in dashboard.rows">
  84. <div class="gf-form">
  85. <span class="gf-form-label">Title</span>
  86. <input type="text" class="gf-form-input max-width-14" ng-model='row.title'></input>
  87. </div>
  88. <gf-form-switch class="gf-form" label="Show title" checked="row.showTitle" switch-class="max-width-6"></gf-form-switch>
  89. <div class="gf-form">
  90. <button class="btn btn-inverse gf-form-btn" ng-click="_.move(dashboard.rows,$index,$index-1)">
  91. <i ng-class="{'invisible': $first}" class="fa fa-arrow-up"></i>
  92. </button>
  93. <button class="btn btn-inverse gf-from-btn" ng-click="_.move(dashboard.rows,$index,$index+1)">
  94. <i ng-class="{'invisible': $last}" class="fa fa-arrow-down"></i>
  95. </button>
  96. <button class="btn btn-inverse gf-form-btn" ng-click="dashboard.rows = _.without(dashboard.rows,row)">
  97. <i class="fa fa-trash"></i>
  98. </button>
  99. </div>
  100. </div>
  101. </div>
  102. </div>
  103. <div ng-if="editor.index == 2">
  104. <dash-links-editor></dash-links-editor>
  105. </div>
  106. <div ng-if="editor.index == 3">
  107. <gf-time-picker-settings dashboard="dashboard"></gf-time-picker-settings>
  108. </div>
  109. <div ng-if="editor.index == 4">
  110. <acl-settings dashboard="dashboard"></acl-settings>
  111. </div>
  112. </div>