editor.ts 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. ///<reference path="../../../headers/common.d.ts" />
  2. import _ from 'lodash';
  3. import {transformers} from './transformers';
  4. export class TablePanelEditorCtrl {
  5. panel: any;
  6. panelCtrl: any;
  7. transformers: any;
  8. fontSizes: any;
  9. addColumnSegment: any;
  10. getColumnNames: any;
  11. canSetColumns: boolean;
  12. columnsHelpMessage: string;
  13. /** @ngInject */
  14. constructor($scope, private $q, private uiSegmentSrv) {
  15. $scope.editor = this;
  16. this.panelCtrl = $scope.ctrl;
  17. this.panel = this.panelCtrl.panel;
  18. this.transformers = transformers;
  19. this.fontSizes = ['80%', '90%', '100%', '110%', '120%', '130%', '150%', '160%', '180%', '200%', '220%', '250%'];
  20. this.addColumnSegment = uiSegmentSrv.newPlusButton();
  21. this.updateTransformHints();
  22. }
  23. updateTransformHints() {
  24. this.canSetColumns = false;
  25. this.columnsHelpMessage = '';
  26. switch (this.panel.transform) {
  27. case "timeseries_aggregations": {
  28. this.canSetColumns = true;
  29. break;
  30. }
  31. case "json": {
  32. this.canSetColumns = true;
  33. break;
  34. }
  35. case "table": {
  36. this.columnsHelpMessage = "Columns and their order are determined by the data query";
  37. }
  38. }
  39. }
  40. getColumnOptions() {
  41. if (!this.panelCtrl.dataRaw) {
  42. return this.$q.when([]);
  43. }
  44. var columns = this.transformers[this.panel.transform].getColumns(this.panelCtrl.dataRaw);
  45. var segments = _.map(columns, (c: any) => this.uiSegmentSrv.newSegment({value: c.text}));
  46. return this.$q.when(segments);
  47. }
  48. addColumn() {
  49. var columns = transformers[this.panel.transform].getColumns(this.panelCtrl.dataRaw);
  50. var column = _.find(columns, {text: this.addColumnSegment.value});
  51. if (column) {
  52. this.panel.columns.push(column);
  53. this.render();
  54. }
  55. var plusButton = this.uiSegmentSrv.newPlusButton();
  56. this.addColumnSegment.html = plusButton.html;
  57. this.addColumnSegment.value = plusButton.value;
  58. }
  59. transformChanged() {
  60. this.panel.columns = [];
  61. if (this.panel.transform === 'timeseries_aggregations') {
  62. this.panel.columns.push({text: 'Avg', value: 'avg'});
  63. }
  64. this.updateTransformHints();
  65. this.render();
  66. }
  67. render() {
  68. this.panelCtrl.render();
  69. }
  70. removeColumn(column) {
  71. this.panel.columns = _.without(this.panel.columns, column);
  72. this.panelCtrl.render();
  73. }
  74. }
  75. /** @ngInject */
  76. export function tablePanelEditor($q, uiSegmentSrv) {
  77. 'use strict';
  78. return {
  79. restrict: 'E',
  80. scope: true,
  81. templateUrl: 'public/app/plugins/panel/table/editor.html',
  82. controller: TablePanelEditorCtrl,
  83. };
  84. }