editor.ts 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  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. }