query_ctrl.ts 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. import _ from 'lodash';
  2. import { QueryCtrl } from 'app/plugins/sdk';
  3. import './query_aggregation_ctrl';
  4. import './query_filter_ctrl';
  5. import { StackdriverPicker } from './components/StackdriverPicker';
  6. import { react2AngularDirective } from 'app/core/utils/react2angular';
  7. export interface QueryMeta {
  8. alignmentPeriod: string;
  9. rawQuery: string;
  10. rawQueryString: string;
  11. metricLabels: { [key: string]: string[] };
  12. resourceLabels: { [key: string]: string[] };
  13. }
  14. export class StackdriverQueryCtrl extends QueryCtrl {
  15. static templateUrl = 'partials/query.editor.html';
  16. target: {
  17. defaultProject: string;
  18. unit: string;
  19. metricType: string;
  20. service: string;
  21. refId: string;
  22. aggregation: {
  23. crossSeriesReducer: string;
  24. alignmentPeriod: string;
  25. perSeriesAligner: string;
  26. groupBys: string[];
  27. };
  28. filters: string[];
  29. aliasBy: string;
  30. metricKind: any;
  31. valueType: any;
  32. };
  33. defaults = {
  34. defaultProject: 'loading project...',
  35. metricType: '',
  36. service: '',
  37. metric: '',
  38. unit: '',
  39. aggregation: {
  40. crossSeriesReducer: 'REDUCE_MEAN',
  41. alignmentPeriod: 'stackdriver-auto',
  42. perSeriesAligner: 'ALIGN_MEAN',
  43. groupBys: [],
  44. },
  45. filters: [],
  46. showAggregationOptions: false,
  47. aliasBy: '',
  48. metricKind: '',
  49. valueType: '',
  50. };
  51. showHelp: boolean;
  52. showLastQuery: boolean;
  53. lastQueryMeta: QueryMeta;
  54. lastQueryError?: string;
  55. /** @ngInject */
  56. constructor($scope, $injector) {
  57. super($scope, $injector);
  58. _.defaultsDeep(this.target, this.defaults);
  59. this.panelCtrl.events.on('data-received', this.onDataReceived.bind(this), $scope);
  60. this.panelCtrl.events.on('data-error', this.onDataError.bind(this), $scope);
  61. react2AngularDirective('stackdriverPicker', StackdriverPicker, [
  62. 'options',
  63. 'onChange',
  64. 'value',
  65. 'isSearchable',
  66. 'className',
  67. 'placeholder',
  68. 'groupName',
  69. ['templateVariables', { watchDepth: 'reference' }],
  70. ]);
  71. }
  72. onDataReceived(dataList) {
  73. this.lastQueryError = null;
  74. this.lastQueryMeta = null;
  75. const anySeriesFromQuery: any = _.find(dataList, { refId: this.target.refId });
  76. if (anySeriesFromQuery) {
  77. this.lastQueryMeta = anySeriesFromQuery.meta;
  78. this.lastQueryMeta.rawQueryString = decodeURIComponent(this.lastQueryMeta.rawQuery);
  79. }
  80. }
  81. onDataError(err) {
  82. if (err.data && err.data.results) {
  83. const queryRes = err.data.results[this.target.refId];
  84. if (queryRes && queryRes.error) {
  85. this.lastQueryMeta = queryRes.meta;
  86. this.lastQueryMeta.rawQueryString = decodeURIComponent(this.lastQueryMeta.rawQuery);
  87. let jsonBody;
  88. try {
  89. jsonBody = JSON.parse(queryRes.error);
  90. } catch {
  91. this.lastQueryError = queryRes.error;
  92. }
  93. this.lastQueryError = jsonBody.error.message;
  94. }
  95. }
  96. }
  97. }