query_ctrl.ts 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393
  1. import angular from 'angular';
  2. import _ from 'lodash';
  3. import { InfluxQueryBuilder } from './query_builder';
  4. import InfluxQuery from './influx_query';
  5. import queryPart from './query_part';
  6. import { QueryCtrl } from 'app/plugins/sdk';
  7. export class InfluxQueryCtrl extends QueryCtrl {
  8. static templateUrl = 'partials/query.editor.html';
  9. queryModel: InfluxQuery;
  10. queryBuilder: any;
  11. groupBySegment: any;
  12. resultFormats: any[];
  13. orderByTime: any[];
  14. policySegment: any;
  15. tagSegments: any[];
  16. selectMenu: any;
  17. measurementSegment: any;
  18. removeTagFilterSegment: any;
  19. /** @ngInject */
  20. constructor($scope, $injector, private templateSrv, private $q, private uiSegmentSrv) {
  21. super($scope, $injector);
  22. this.target = this.target;
  23. this.queryModel = new InfluxQuery(this.target, templateSrv, this.panel.scopedVars);
  24. this.queryBuilder = new InfluxQueryBuilder(this.target, this.datasource.database);
  25. this.groupBySegment = this.uiSegmentSrv.newPlusButton();
  26. this.resultFormats = [{ text: 'Time series', value: 'time_series' }, { text: 'Table', value: 'table' }];
  27. this.policySegment = uiSegmentSrv.newSegment(this.target.policy);
  28. if (!this.target.measurement) {
  29. this.measurementSegment = uiSegmentSrv.newSelectMeasurement();
  30. } else {
  31. this.measurementSegment = uiSegmentSrv.newSegment(this.target.measurement);
  32. }
  33. this.tagSegments = [];
  34. for (const tag of this.target.tags) {
  35. if (!tag.operator) {
  36. if (/^\/.*\/$/.test(tag.value)) {
  37. tag.operator = '=~';
  38. } else {
  39. tag.operator = '=';
  40. }
  41. }
  42. if (tag.condition) {
  43. this.tagSegments.push(uiSegmentSrv.newCondition(tag.condition));
  44. }
  45. this.tagSegments.push(uiSegmentSrv.newKey(tag.key));
  46. this.tagSegments.push(uiSegmentSrv.newOperator(tag.operator));
  47. this.tagSegments.push(uiSegmentSrv.newKeyValue(tag.value));
  48. }
  49. this.fixTagSegments();
  50. this.buildSelectMenu();
  51. this.removeTagFilterSegment = uiSegmentSrv.newSegment({
  52. fake: true,
  53. value: '-- remove tag filter --',
  54. });
  55. }
  56. removeOrderByTime() {
  57. this.target.orderByTime = 'ASC';
  58. }
  59. buildSelectMenu() {
  60. const categories = queryPart.getCategories();
  61. this.selectMenu = _.reduce(
  62. categories,
  63. (memo, cat, key) => {
  64. const menu = {
  65. text: key,
  66. submenu: cat.map(item => {
  67. return { text: item.type, value: item.type };
  68. }),
  69. };
  70. memo.push(menu);
  71. return memo;
  72. },
  73. []
  74. );
  75. }
  76. getGroupByOptions() {
  77. const query = this.queryBuilder.buildExploreQuery('TAG_KEYS');
  78. return this.datasource
  79. .metricFindQuery(query)
  80. .then(tags => {
  81. const options = [];
  82. if (!this.queryModel.hasFill()) {
  83. options.push(this.uiSegmentSrv.newSegment({ value: 'fill(null)' }));
  84. }
  85. if (!this.target.limit) {
  86. options.push(this.uiSegmentSrv.newSegment({ value: 'LIMIT' }));
  87. }
  88. if (!this.target.slimit) {
  89. options.push(this.uiSegmentSrv.newSegment({ value: 'SLIMIT' }));
  90. }
  91. if (!this.target.tz) {
  92. options.push(this.uiSegmentSrv.newSegment({ value: 'tz' }));
  93. }
  94. if (this.target.orderByTime === 'ASC') {
  95. options.push(this.uiSegmentSrv.newSegment({ value: 'ORDER BY time DESC' }));
  96. }
  97. if (!this.queryModel.hasGroupByTime()) {
  98. options.push(this.uiSegmentSrv.newSegment({ value: 'time($interval)' }));
  99. }
  100. for (const tag of tags) {
  101. options.push(this.uiSegmentSrv.newSegment({ value: 'tag(' + tag.text + ')' }));
  102. }
  103. return options;
  104. })
  105. .catch(this.handleQueryError.bind(this));
  106. }
  107. groupByAction() {
  108. switch (this.groupBySegment.value) {
  109. case 'LIMIT': {
  110. this.target.limit = 10;
  111. break;
  112. }
  113. case 'SLIMIT': {
  114. this.target.slimit = 10;
  115. break;
  116. }
  117. case 'tz': {
  118. this.target.tz = 'UTC';
  119. break;
  120. }
  121. case 'ORDER BY time DESC': {
  122. this.target.orderByTime = 'DESC';
  123. break;
  124. }
  125. default: {
  126. this.queryModel.addGroupBy(this.groupBySegment.value);
  127. }
  128. }
  129. const plusButton = this.uiSegmentSrv.newPlusButton();
  130. this.groupBySegment.value = plusButton.value;
  131. this.groupBySegment.html = plusButton.html;
  132. this.panelCtrl.refresh();
  133. }
  134. addSelectPart(selectParts, cat, subitem) {
  135. this.queryModel.addSelectPart(selectParts, subitem.value);
  136. this.panelCtrl.refresh();
  137. }
  138. handleSelectPartEvent(selectParts, part, evt) {
  139. switch (evt.name) {
  140. case 'get-param-options': {
  141. const fieldsQuery = this.queryBuilder.buildExploreQuery('FIELDS');
  142. return this.datasource
  143. .metricFindQuery(fieldsQuery)
  144. .then(this.transformToSegments(true))
  145. .catch(this.handleQueryError.bind(this));
  146. }
  147. case 'part-param-changed': {
  148. this.panelCtrl.refresh();
  149. break;
  150. }
  151. case 'action': {
  152. this.queryModel.removeSelectPart(selectParts, part);
  153. this.panelCtrl.refresh();
  154. break;
  155. }
  156. case 'get-part-actions': {
  157. return this.$q.when([{ text: 'Remove', value: 'remove-part' }]);
  158. }
  159. }
  160. }
  161. handleGroupByPartEvent(part, index, evt) {
  162. switch (evt.name) {
  163. case 'get-param-options': {
  164. const tagsQuery = this.queryBuilder.buildExploreQuery('TAG_KEYS');
  165. return this.datasource
  166. .metricFindQuery(tagsQuery)
  167. .then(this.transformToSegments(true))
  168. .catch(this.handleQueryError.bind(this));
  169. }
  170. case 'part-param-changed': {
  171. this.panelCtrl.refresh();
  172. break;
  173. }
  174. case 'action': {
  175. this.queryModel.removeGroupByPart(part, index);
  176. this.panelCtrl.refresh();
  177. break;
  178. }
  179. case 'get-part-actions': {
  180. return this.$q.when([{ text: 'Remove', value: 'remove-part' }]);
  181. }
  182. }
  183. }
  184. fixTagSegments() {
  185. const count = this.tagSegments.length;
  186. const lastSegment = this.tagSegments[Math.max(count - 1, 0)];
  187. if (!lastSegment || lastSegment.type !== 'plus-button') {
  188. this.tagSegments.push(this.uiSegmentSrv.newPlusButton());
  189. }
  190. }
  191. measurementChanged() {
  192. this.target.measurement = this.measurementSegment.value;
  193. this.panelCtrl.refresh();
  194. }
  195. getPolicySegments() {
  196. const policiesQuery = this.queryBuilder.buildExploreQuery('RETENTION POLICIES');
  197. return this.datasource
  198. .metricFindQuery(policiesQuery)
  199. .then(this.transformToSegments(false))
  200. .catch(this.handleQueryError.bind(this));
  201. }
  202. policyChanged() {
  203. this.target.policy = this.policySegment.value;
  204. this.panelCtrl.refresh();
  205. }
  206. toggleEditorMode() {
  207. try {
  208. this.target.query = this.queryModel.render(false);
  209. } catch (err) {
  210. console.log('query render error');
  211. }
  212. this.target.rawQuery = !this.target.rawQuery;
  213. }
  214. getMeasurements(measurementFilter) {
  215. const query = this.queryBuilder.buildExploreQuery('MEASUREMENTS', undefined, measurementFilter);
  216. return this.datasource
  217. .metricFindQuery(query)
  218. .then(this.transformToSegments(true))
  219. .catch(this.handleQueryError.bind(this));
  220. }
  221. handleQueryError(err) {
  222. this.error = err.message || 'Failed to issue metric query';
  223. return [];
  224. }
  225. transformToSegments(addTemplateVars) {
  226. return results => {
  227. const segments = _.map(results, segment => {
  228. return this.uiSegmentSrv.newSegment({
  229. value: segment.text,
  230. expandable: segment.expandable,
  231. });
  232. });
  233. if (addTemplateVars) {
  234. for (const variable of this.templateSrv.variables) {
  235. segments.unshift(
  236. this.uiSegmentSrv.newSegment({
  237. type: 'value',
  238. value: '/^$' + variable.name + '$/',
  239. expandable: true,
  240. })
  241. );
  242. }
  243. }
  244. return segments;
  245. };
  246. }
  247. getTagsOrValues(segment, index) {
  248. if (segment.type === 'condition') {
  249. return this.$q.when([this.uiSegmentSrv.newSegment('AND'), this.uiSegmentSrv.newSegment('OR')]);
  250. }
  251. if (segment.type === 'operator') {
  252. const nextValue = this.tagSegments[index + 1].value;
  253. if (/^\/.*\/$/.test(nextValue)) {
  254. return this.$q.when(this.uiSegmentSrv.newOperators(['=~', '!~']));
  255. } else {
  256. return this.$q.when(this.uiSegmentSrv.newOperators(['=', '!=', '<>', '<', '>']));
  257. }
  258. }
  259. let query, addTemplateVars;
  260. if (segment.type === 'key' || segment.type === 'plus-button') {
  261. query = this.queryBuilder.buildExploreQuery('TAG_KEYS');
  262. addTemplateVars = false;
  263. } else if (segment.type === 'value') {
  264. query = this.queryBuilder.buildExploreQuery('TAG_VALUES', this.tagSegments[index - 2].value);
  265. addTemplateVars = true;
  266. }
  267. return this.datasource
  268. .metricFindQuery(query)
  269. .then(this.transformToSegments(addTemplateVars))
  270. .then(results => {
  271. if (segment.type === 'key') {
  272. results.splice(0, 0, angular.copy(this.removeTagFilterSegment));
  273. }
  274. return results;
  275. })
  276. .catch(this.handleQueryError.bind(this));
  277. }
  278. getFieldSegments() {
  279. const fieldsQuery = this.queryBuilder.buildExploreQuery('FIELDS');
  280. return this.datasource
  281. .metricFindQuery(fieldsQuery)
  282. .then(this.transformToSegments(false))
  283. .catch(this.handleQueryError);
  284. }
  285. tagSegmentUpdated(segment, index) {
  286. this.tagSegments[index] = segment;
  287. // handle remove tag condition
  288. if (segment.value === this.removeTagFilterSegment.value) {
  289. this.tagSegments.splice(index, 3);
  290. if (this.tagSegments.length === 0) {
  291. this.tagSegments.push(this.uiSegmentSrv.newPlusButton());
  292. } else if (this.tagSegments.length > 2) {
  293. this.tagSegments.splice(Math.max(index - 1, 0), 1);
  294. if (this.tagSegments[this.tagSegments.length - 1].type !== 'plus-button') {
  295. this.tagSegments.push(this.uiSegmentSrv.newPlusButton());
  296. }
  297. }
  298. } else {
  299. if (segment.type === 'plus-button') {
  300. if (index > 2) {
  301. this.tagSegments.splice(index, 0, this.uiSegmentSrv.newCondition('AND'));
  302. }
  303. this.tagSegments.push(this.uiSegmentSrv.newOperator('='));
  304. this.tagSegments.push(this.uiSegmentSrv.newFake('select tag value', 'value', 'query-segment-value'));
  305. segment.type = 'key';
  306. segment.cssClass = 'query-segment-key';
  307. }
  308. if (index + 1 === this.tagSegments.length) {
  309. this.tagSegments.push(this.uiSegmentSrv.newPlusButton());
  310. }
  311. }
  312. this.rebuildTargetTagConditions();
  313. }
  314. rebuildTargetTagConditions() {
  315. const tags = [];
  316. let tagIndex = 0;
  317. let tagOperator = '';
  318. _.each(this.tagSegments, (segment2, index) => {
  319. if (segment2.type === 'key') {
  320. if (tags.length === 0) {
  321. tags.push({});
  322. }
  323. tags[tagIndex].key = segment2.value;
  324. } else if (segment2.type === 'value') {
  325. tagOperator = this.getTagValueOperator(segment2.value, tags[tagIndex].operator);
  326. if (tagOperator) {
  327. this.tagSegments[index - 1] = this.uiSegmentSrv.newOperator(tagOperator);
  328. tags[tagIndex].operator = tagOperator;
  329. }
  330. tags[tagIndex].value = segment2.value;
  331. } else if (segment2.type === 'condition') {
  332. tags.push({ condition: segment2.value });
  333. tagIndex += 1;
  334. } else if (segment2.type === 'operator') {
  335. tags[tagIndex].operator = segment2.value;
  336. }
  337. });
  338. this.target.tags = tags;
  339. this.panelCtrl.refresh();
  340. }
  341. getTagValueOperator(tagValue, tagOperator): string {
  342. if (tagOperator !== '=~' && tagOperator !== '!~' && /^\/.*\/$/.test(tagValue)) {
  343. return '=~';
  344. } else if ((tagOperator === '=~' || tagOperator === '!~') && /^(?!\/.*\/$)/.test(tagValue)) {
  345. return '=';
  346. }
  347. return null;
  348. }
  349. getCollapsedText() {
  350. return this.queryModel.render(false);
  351. }
  352. }