query_ctrl.ts 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
  1. import './add_graphite_func';
  2. import './func_editor';
  3. import _ from 'lodash';
  4. import GraphiteQuery from './graphite_query';
  5. import { QueryCtrl } from 'app/plugins/sdk';
  6. import appEvents from 'app/core/app_events';
  7. const GRAPHITE_TAG_OPERATORS = ['=', '!=', '=~', '!=~'];
  8. const TAG_PREFIX = 'tag: ';
  9. export class GraphiteQueryCtrl extends QueryCtrl {
  10. static templateUrl = 'partials/query.editor.html';
  11. queryModel: GraphiteQuery;
  12. segments: any[];
  13. addTagSegments: any[];
  14. removeTagValue: string;
  15. supportsTags: boolean;
  16. paused: boolean;
  17. /** @ngInject **/
  18. constructor($scope, $injector, private uiSegmentSrv, private templateSrv, $timeout) {
  19. super($scope, $injector);
  20. this.supportsTags = this.datasource.supportsTags;
  21. this.paused = false;
  22. this.target.target = this.target.target || '';
  23. this.datasource.waitForFuncDefsLoaded().then(() => {
  24. this.queryModel = new GraphiteQuery(this.datasource, this.target, templateSrv);
  25. this.buildSegments();
  26. });
  27. this.removeTagValue = '-- remove tag --';
  28. }
  29. parseTarget() {
  30. this.queryModel.parseTarget();
  31. this.buildSegments();
  32. }
  33. toggleEditorMode() {
  34. this.target.textEditor = !this.target.textEditor;
  35. this.parseTarget();
  36. }
  37. buildSegments() {
  38. this.segments = _.map(this.queryModel.segments, segment => {
  39. return this.uiSegmentSrv.newSegment(segment);
  40. });
  41. const checkOtherSegmentsIndex = this.queryModel.checkOtherSegmentsIndex || 0;
  42. this.checkOtherSegments(checkOtherSegmentsIndex);
  43. if (this.queryModel.seriesByTagUsed) {
  44. this.fixTagSegments();
  45. }
  46. }
  47. addSelectMetricSegment() {
  48. this.queryModel.addSelectMetricSegment();
  49. this.segments.push(this.uiSegmentSrv.newSelectMetric());
  50. }
  51. checkOtherSegments(fromIndex) {
  52. if (this.queryModel.segments.length === 1 && this.queryModel.segments[0].type === 'series-ref') {
  53. return;
  54. }
  55. if (fromIndex === 0) {
  56. this.addSelectMetricSegment();
  57. return;
  58. }
  59. const path = this.queryModel.getSegmentPathUpTo(fromIndex + 1);
  60. if (path === '') {
  61. return Promise.resolve();
  62. }
  63. return this.datasource
  64. .metricFindQuery(path)
  65. .then(segments => {
  66. if (segments.length === 0) {
  67. if (path !== '') {
  68. this.queryModel.segments = this.queryModel.segments.splice(0, fromIndex);
  69. this.segments = this.segments.splice(0, fromIndex);
  70. this.addSelectMetricSegment();
  71. }
  72. } else if (segments[0].expandable) {
  73. if (this.segments.length === fromIndex) {
  74. this.addSelectMetricSegment();
  75. } else {
  76. return this.checkOtherSegments(fromIndex + 1);
  77. }
  78. }
  79. })
  80. .catch(err => {
  81. appEvents.emit('alert-error', ['Error', err]);
  82. });
  83. }
  84. setSegmentFocus(segmentIndex) {
  85. _.each(this.segments, (segment, index) => {
  86. segment.focus = segmentIndex === index;
  87. });
  88. }
  89. getAltSegments(index, prefix) {
  90. let query = prefix && prefix.length > 0 ? '*' + prefix + '*' : '*';
  91. if (index > 0) {
  92. query = this.queryModel.getSegmentPathUpTo(index) + '.' + query;
  93. }
  94. const options = {
  95. range: this.panelCtrl.range,
  96. requestId: 'get-alt-segments',
  97. };
  98. return this.datasource
  99. .metricFindQuery(query, options)
  100. .then(segments => {
  101. const altSegments = _.map(segments, segment => {
  102. return this.uiSegmentSrv.newSegment({
  103. value: segment.text,
  104. expandable: segment.expandable,
  105. });
  106. });
  107. if (index > 0 && altSegments.length === 0) {
  108. return altSegments;
  109. }
  110. // add query references
  111. if (index === 0) {
  112. _.eachRight(this.panelCtrl.panel.targets, target => {
  113. if (target.refId === this.queryModel.target.refId) {
  114. return;
  115. }
  116. altSegments.unshift(
  117. this.uiSegmentSrv.newSegment({
  118. type: 'series-ref',
  119. value: '#' + target.refId,
  120. expandable: false,
  121. })
  122. );
  123. });
  124. }
  125. // add template variables
  126. _.eachRight(this.templateSrv.variables, variable => {
  127. altSegments.unshift(
  128. this.uiSegmentSrv.newSegment({
  129. type: 'template',
  130. value: '$' + variable.name,
  131. expandable: true,
  132. })
  133. );
  134. });
  135. // add wildcard option
  136. altSegments.unshift(this.uiSegmentSrv.newSegment('*'));
  137. if (this.supportsTags && index === 0) {
  138. this.removeTaggedEntry(altSegments);
  139. return this.addAltTagSegments(prefix, altSegments);
  140. } else {
  141. return altSegments;
  142. }
  143. })
  144. .catch(err => {
  145. return [];
  146. });
  147. }
  148. addAltTagSegments(prefix, altSegments) {
  149. return this.getTagsAsSegments(prefix).then(tagSegments => {
  150. tagSegments = _.map(tagSegments, segment => {
  151. segment.value = TAG_PREFIX + segment.value;
  152. return segment;
  153. });
  154. return altSegments.concat(...tagSegments);
  155. });
  156. }
  157. removeTaggedEntry(altSegments) {
  158. altSegments = _.remove(altSegments, s => s.value === '_tagged');
  159. }
  160. segmentValueChanged(segment, segmentIndex) {
  161. this.error = null;
  162. this.queryModel.updateSegmentValue(segment, segmentIndex);
  163. if (this.queryModel.functions.length > 0 && this.queryModel.functions[0].def.fake) {
  164. this.queryModel.functions = [];
  165. }
  166. if (segment.type === 'tag') {
  167. const tag = removeTagPrefix(segment.value);
  168. this.pause();
  169. this.addSeriesByTagFunc(tag);
  170. return;
  171. }
  172. if (segment.expandable) {
  173. return this.checkOtherSegments(segmentIndex + 1).then(() => {
  174. this.setSegmentFocus(segmentIndex + 1);
  175. this.targetChanged();
  176. });
  177. } else {
  178. this.spliceSegments(segmentIndex + 1);
  179. }
  180. this.setSegmentFocus(segmentIndex + 1);
  181. this.targetChanged();
  182. }
  183. spliceSegments(index) {
  184. this.segments = this.segments.splice(0, index);
  185. this.queryModel.segments = this.queryModel.segments.splice(0, index);
  186. }
  187. emptySegments() {
  188. this.queryModel.segments = [];
  189. this.segments = [];
  190. }
  191. targetTextChanged() {
  192. this.updateModelTarget();
  193. this.refresh();
  194. }
  195. updateModelTarget() {
  196. this.queryModel.updateModelTarget(this.panelCtrl.panel.targets);
  197. }
  198. targetChanged() {
  199. if (this.queryModel.error) {
  200. return;
  201. }
  202. const oldTarget = this.queryModel.target.target;
  203. this.updateModelTarget();
  204. if (this.queryModel.target !== oldTarget && !this.paused) {
  205. this.panelCtrl.refresh();
  206. }
  207. }
  208. addFunction(funcDef) {
  209. const newFunc = this.datasource.createFuncInstance(funcDef, {
  210. withDefaultParams: true,
  211. });
  212. newFunc.added = true;
  213. this.queryModel.addFunction(newFunc);
  214. this.smartlyHandleNewAliasByNode(newFunc);
  215. if (this.segments.length === 1 && this.segments[0].fake) {
  216. this.emptySegments();
  217. }
  218. if (!newFunc.params.length && newFunc.added) {
  219. this.targetChanged();
  220. }
  221. if (newFunc.def.name === 'seriesByTag') {
  222. this.parseTarget();
  223. }
  224. }
  225. removeFunction(func) {
  226. this.queryModel.removeFunction(func);
  227. this.targetChanged();
  228. }
  229. addSeriesByTagFunc(tag) {
  230. const newFunc = this.datasource.createFuncInstance('seriesByTag', {
  231. withDefaultParams: false,
  232. });
  233. const tagParam = `${tag}=`;
  234. newFunc.params = [tagParam];
  235. this.queryModel.addFunction(newFunc);
  236. newFunc.added = true;
  237. this.emptySegments();
  238. this.targetChanged();
  239. this.parseTarget();
  240. }
  241. smartlyHandleNewAliasByNode(func) {
  242. if (func.def.name !== 'aliasByNode') {
  243. return;
  244. }
  245. for (let i = 0; i < this.segments.length; i++) {
  246. if (this.segments[i].value.indexOf('*') >= 0) {
  247. func.params[0] = i;
  248. func.added = false;
  249. this.targetChanged();
  250. return;
  251. }
  252. }
  253. }
  254. getAllTags() {
  255. return this.datasource.getTags().then(values => {
  256. const altTags = _.map(values, 'text');
  257. altTags.splice(0, 0, this.removeTagValue);
  258. return mapToDropdownOptions(altTags);
  259. });
  260. }
  261. getTags(index, tagPrefix) {
  262. const tagExpressions = this.queryModel.renderTagExpressions(index);
  263. return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then(values => {
  264. const altTags = _.map(values, 'text');
  265. altTags.splice(0, 0, this.removeTagValue);
  266. return mapToDropdownOptions(altTags);
  267. });
  268. }
  269. getTagsAsSegments(tagPrefix) {
  270. const tagExpressions = this.queryModel.renderTagExpressions();
  271. return this.datasource.getTagsAutoComplete(tagExpressions, tagPrefix).then(values => {
  272. return _.map(values, val => {
  273. return this.uiSegmentSrv.newSegment({
  274. value: val.text,
  275. type: 'tag',
  276. expandable: false,
  277. });
  278. });
  279. });
  280. }
  281. getTagOperators() {
  282. return mapToDropdownOptions(GRAPHITE_TAG_OPERATORS);
  283. }
  284. getAllTagValues(tag) {
  285. const tagKey = tag.key;
  286. return this.datasource.getTagValues(tagKey).then(values => {
  287. const altValues = _.map(values, 'text');
  288. return mapToDropdownOptions(altValues);
  289. });
  290. }
  291. getTagValues(tag, index, valuePrefix) {
  292. const tagExpressions = this.queryModel.renderTagExpressions(index);
  293. const tagKey = tag.key;
  294. return this.datasource.getTagValuesAutoComplete(tagExpressions, tagKey, valuePrefix).then(values => {
  295. const altValues = _.map(values, 'text');
  296. // Add template variables as additional values
  297. _.eachRight(this.templateSrv.variables, variable => {
  298. altValues.push('${' + variable.name + ':regex}');
  299. });
  300. return mapToDropdownOptions(altValues);
  301. });
  302. }
  303. tagChanged(tag, tagIndex) {
  304. this.queryModel.updateTag(tag, tagIndex);
  305. this.targetChanged();
  306. }
  307. addNewTag(segment) {
  308. const newTagKey = segment.value;
  309. const newTag = { key: newTagKey, operator: '=', value: '' };
  310. this.queryModel.addTag(newTag);
  311. this.targetChanged();
  312. this.fixTagSegments();
  313. }
  314. removeTag(index) {
  315. this.queryModel.removeTag(index);
  316. this.targetChanged();
  317. }
  318. fixTagSegments() {
  319. // Adding tag with the same name as just removed works incorrectly if single segment is used (instead of array)
  320. this.addTagSegments = [this.uiSegmentSrv.newPlusButton()];
  321. }
  322. showDelimiter(index) {
  323. return index !== this.queryModel.tags.length - 1;
  324. }
  325. pause() {
  326. this.paused = true;
  327. }
  328. unpause() {
  329. this.paused = false;
  330. this.panelCtrl.refresh();
  331. }
  332. }
  333. function mapToDropdownOptions(results) {
  334. return _.map(results, value => {
  335. return { text: value, value: value };
  336. });
  337. }
  338. function removeTagPrefix(value: string): string {
  339. return value.replace(TAG_PREFIX, '');
  340. }