metrics_panel_ctrl.ts 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. ///<reference path="../../headers/common.d.ts" />
  2. import config from 'app/core/config';
  3. import $ from 'jquery';
  4. import _ from 'lodash';
  5. import kbn from 'app/core/utils/kbn';
  6. import {PanelCtrl} from './panel_ctrl';
  7. import * as rangeUtil from 'app/core/utils/rangeutil';
  8. import * as dateMath from 'app/core/utils/datemath';
  9. class MetricsPanelCtrl extends PanelCtrl {
  10. error: boolean;
  11. loading: boolean;
  12. datasource: any;
  13. $q: any;
  14. $timeout: any;
  15. datasourceSrv: any;
  16. timeSrv: any;
  17. templateSrv: any;
  18. timing: any;
  19. range: any;
  20. rangeRaw: any;
  21. interval: any;
  22. resolution: any;
  23. timeInfo: any;
  24. skipDataOnInit: boolean;
  25. datasources: any[];
  26. constructor($scope, $injector) {
  27. super($scope, $injector);
  28. // make metrics tab the default
  29. this.editorTabIndex = 1;
  30. this.$q = $injector.get('$q');
  31. this.datasourceSrv = $injector.get('datasourceSrv');
  32. this.timeSrv = $injector.get('timeSrv');
  33. this.templateSrv = $injector.get('templateSrv');
  34. if (!this.panel.targets) {
  35. this.panel.targets = [{}];
  36. }
  37. }
  38. initEditMode() {
  39. super.initEditMode();
  40. this.addEditorTab('Metrics', 'public/app/partials/metrics.html');
  41. this.addEditorTab('Time range', 'public/app/features/panel/partials/panelTime.html');
  42. this.datasources = this.datasourceSrv.getMetricSources();
  43. }
  44. refreshData(data) {
  45. // null op
  46. return this.$q.when(data);
  47. }
  48. loadSnapshot(data) {
  49. // null op
  50. return data;
  51. }
  52. refresh() {
  53. // ignore fetching data if another panel is in fullscreen
  54. if (this.otherPanelInFullscreenMode()) { return; }
  55. // if we have snapshot data use that
  56. if (this.panel.snapshotData) {
  57. if (this.loadSnapshot) {
  58. this.updateTimeRange();
  59. this.loadSnapshot(this.panel.snapshotData);
  60. }
  61. return;
  62. }
  63. // clear loading/error state
  64. delete this.error;
  65. this.loading = true;
  66. // load datasource service
  67. this.datasourceSrv.get(this.panel.datasource).then(datasource => {
  68. this.datasource = datasource;
  69. return this.refreshData(this.datasource);
  70. }).then(() => {
  71. this.loading = false;
  72. }).catch(err => {
  73. console.log('Panel data error:', err);
  74. this.loading = false;
  75. this.error = err.message || "Timeseries data request error";
  76. this.inspector = {error: err};
  77. });
  78. }
  79. setTimeQueryStart() {
  80. this.timing = {};
  81. this.timing.queryStart = new Date().getTime();
  82. }
  83. setTimeQueryEnd() {
  84. this.timing.queryEnd = new Date().getTime();
  85. }
  86. updateTimeRange() {
  87. this.range = this.timeSrv.timeRange();
  88. this.rangeRaw = this.timeSrv.timeRange(false);
  89. this.applyPanelTimeOverrides();
  90. if (this.panel.maxDataPoints) {
  91. this.resolution = this.panel.maxDataPoints;
  92. } else {
  93. this.resolution = Math.ceil($(window).width() * (this.panel.span / 12));
  94. }
  95. var panelInterval = this.panel.interval;
  96. var datasourceInterval = (this.datasource || {}).interval;
  97. this.interval = kbn.calculateInterval(this.range, this.resolution, panelInterval || datasourceInterval);
  98. };
  99. applyPanelTimeOverrides() {
  100. this.timeInfo = '';
  101. // check panel time overrrides
  102. if (this.panel.timeFrom) {
  103. var timeFromInterpolated = this.templateSrv.replace(this.panel.timeFrom, this.panel.scopedVars);
  104. var timeFromInfo = rangeUtil.describeTextRange(timeFromInterpolated);
  105. if (timeFromInfo.invalid) {
  106. this.timeInfo = 'invalid time override';
  107. return;
  108. }
  109. if (_.isString(this.rangeRaw.from)) {
  110. var timeFromDate = dateMath.parse(timeFromInfo.from);
  111. this.timeInfo = timeFromInfo.display;
  112. this.rangeRaw.from = timeFromInfo.from;
  113. this.rangeRaw.to = timeFromInfo.to;
  114. this.range.from = timeFromDate;
  115. this.range.to = dateMath.parse(timeFromInfo.to);
  116. }
  117. }
  118. if (this.panel.timeShift) {
  119. var timeShiftInterpolated = this.templateSrv.replace(this.panel.timeShift, this.panel.scopedVars);
  120. var timeShiftInfo = rangeUtil.describeTextRange(timeShiftInterpolated);
  121. if (timeShiftInfo.invalid) {
  122. this.timeInfo = 'invalid timeshift';
  123. return;
  124. }
  125. var timeShift = '-' + timeShiftInterpolated;
  126. this.timeInfo += ' timeshift ' + timeShift;
  127. this.range.from = dateMath.parseDateMath(timeShift, this.range.from, false);
  128. this.range.to = dateMath.parseDateMath(timeShift, this.range.to, true);
  129. this.rangeRaw = this.range;
  130. }
  131. if (this.panel.hideTimeOverride) {
  132. this.timeInfo = '';
  133. }
  134. };
  135. issueQueries(datasource) {
  136. this.updateTimeRange();
  137. if (!this.panel.targets || this.panel.targets.length === 0) {
  138. return this.$q.when([]);
  139. }
  140. var metricsQuery = {
  141. range: this.range,
  142. rangeRaw: this.rangeRaw,
  143. interval: this.interval,
  144. targets: this.panel.targets,
  145. format: this.panel.renderer === 'png' ? 'png' : 'json',
  146. maxDataPoints: this.resolution,
  147. scopedVars: this.panel.scopedVars,
  148. cacheTimeout: this.panel.cacheTimeout
  149. };
  150. this.setTimeQueryStart();
  151. try {
  152. return datasource.query(metricsQuery).then(results => {
  153. this.setTimeQueryEnd();
  154. if (this.dashboard.snapshot) {
  155. this.panel.snapshotData = results;
  156. }
  157. return results;
  158. });
  159. } catch (err) {
  160. return this.$q.reject(err);
  161. }
  162. }
  163. setDatasource(datasource) {
  164. // switching to mixed
  165. if (datasource.meta.mixed) {
  166. _.each(this.panel.targets, target => {
  167. target.datasource = this.panel.datasource;
  168. if (target.datasource === null) {
  169. target.datasource = config.defaultDatasource;
  170. }
  171. });
  172. } else if (this.datasource && this.datasource.meta.mixed) {
  173. _.each(this.panel.targets, target => {
  174. delete target.datasource;
  175. });
  176. }
  177. this.panel.datasource = datasource.value;
  178. this.datasource = null;
  179. this.refresh();
  180. }
  181. addDataQuery(datasource) {
  182. var target = {
  183. datasource: datasource ? datasource.name : undefined
  184. };
  185. this.panel.targets.push(target);
  186. }
  187. }
  188. export {MetricsPanelCtrl};