editor.html 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <div class="gf-form-group">
  2. <div class="grafana-info-box">
  3. <h5>Table migration</h5>
  4. <p>
  5. This panel is deprecated. Please migrate to the new Table panel.
  6. </p>
  7. <p>
  8. <button class="btn btn-primary" ng-click="ctrl.migrateToPanel('table')">
  9. Migrate to Table panel
  10. </button>
  11. </p>
  12. <p><b>NOTE:</b> Sorting is not persisted after migration.</p>
  13. <p ng-if="ctrl.panelHasRowColorMode">
  14. <b>NOTE:</b> Row color mode is no longer supported and will fallback to cell color mode.
  15. </p>
  16. <p ng-if="ctrl.panelHasLinks">
  17. <b>NOTE:</b> Links that specify cell values will need to be updated manually after migration.
  18. </p>
  19. </div>
  20. <h5 class="section-heading">Data</h5>
  21. <div class="gf-form gf-form--grow">
  22. <label class="gf-form-label width-8">Table Transform</label>
  23. <div class="gf-form-select-wrapper">
  24. <select
  25. class="gf-form-input"
  26. ng-model="editor.panel.transform"
  27. ng-options="k as v.description for (k, v) in editor.transformers"
  28. ng-change="editor.transformChanged()"
  29. ></select>
  30. </div>
  31. </div>
  32. <div class="gf-form-inline">
  33. <div class="gf-form">
  34. <label class="gf-form-label width-8">Columns</label>
  35. </div>
  36. <div class="gf-form" ng-repeat="column in editor.panel.columns">
  37. <label class="gf-form-label">
  38. <icon name="'times'" ng-click="editor.removeColumn(column)"></icon>
  39. <span>{{ column.text }}</span>
  40. </label>
  41. </div>
  42. <div class="gf-form" ng-show="editor.canSetColumns">
  43. <metric-segment
  44. segment="editor.addColumnSegment"
  45. get-options="editor.getColumnOptions()"
  46. on-change="editor.addColumn()"
  47. ></metric-segment>
  48. </div>
  49. <div class="gf-form" ng-hide="editor.canSetColumns">
  50. <label class="gf-form-label">
  51. Auto
  52. <info-popover mode="right-normal" ng-if="editor.columnsHelpMessage">
  53. {{ editor.columnsHelpMessage }}
  54. </info-popover>
  55. </label>
  56. </div>
  57. </div>
  58. </div>
  59. <div class="gf-form-group">
  60. <h5 class="section-heading">Paging</h5>
  61. <div class="gf-form">
  62. <label class="gf-form-label width-8">Rows per page</label>
  63. <input
  64. type="number"
  65. class="gf-form-input width-7"
  66. placeholder="100"
  67. data-placement="right"
  68. ng-model="editor.panel.pageSize"
  69. ng-change="editor.render()"
  70. ng-model-onblur
  71. />
  72. </div>
  73. <div class="gf-form max-width-17">
  74. <label class="gf-form-label width-8">Font size</label>
  75. <div class="gf-form-select-wrapper width-7">
  76. <select
  77. class="gf-form-input"
  78. ng-model="editor.panel.fontSize"
  79. ng-options="f for f in editor.fontSizes"
  80. ng-change="editor.render()"
  81. ></select>
  82. </div>
  83. </div>
  84. </div>