editor_ctrl.ts 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. import _ from 'lodash';
  2. import coreModule from 'app/core/core_module';
  3. import { variableTypes } from './variable';
  4. import appEvents from 'app/core/app_events';
  5. import DatasourceSrv from '../plugins/datasource_srv';
  6. import { VariableSrv } from './all';
  7. import { TemplateSrv } from './template_srv';
  8. export class VariableEditorCtrl {
  9. /** @ngInject */
  10. constructor($scope: any, datasourceSrv: DatasourceSrv, variableSrv: VariableSrv, templateSrv: TemplateSrv) {
  11. $scope.variableTypes = variableTypes;
  12. $scope.ctrl = {};
  13. $scope.namePattern = /^(?!__).*$/;
  14. $scope._ = _;
  15. $scope.optionsLimit = 20;
  16. $scope.refreshOptions = [
  17. { value: 0, text: 'Never' },
  18. { value: 1, text: 'On Dashboard Load' },
  19. { value: 2, text: 'On Time Range Change' },
  20. ];
  21. $scope.sortOptions = [
  22. { value: 0, text: 'Disabled' },
  23. { value: 1, text: 'Alphabetical (asc)' },
  24. { value: 2, text: 'Alphabetical (desc)' },
  25. { value: 3, text: 'Numerical (asc)' },
  26. { value: 4, text: 'Numerical (desc)' },
  27. { value: 5, text: 'Alphabetical (case-insensitive, asc)' },
  28. { value: 6, text: 'Alphabetical (case-insensitive, desc)' },
  29. ];
  30. $scope.hideOptions = [{ value: 0, text: '' }, { value: 1, text: 'Label' }, { value: 2, text: 'Variable' }];
  31. $scope.init = () => {
  32. $scope.mode = 'list';
  33. $scope.variables = variableSrv.variables;
  34. $scope.reset();
  35. $scope.$watch('mode', (val: string) => {
  36. if (val === 'new') {
  37. $scope.reset();
  38. }
  39. });
  40. };
  41. $scope.setMode = (mode: any) => {
  42. $scope.mode = mode;
  43. };
  44. $scope.add = () => {
  45. if ($scope.isValid()) {
  46. variableSrv.addVariable($scope.current);
  47. $scope.update();
  48. }
  49. };
  50. $scope.isValid = () => {
  51. if (!$scope.ctrl.form.$valid) {
  52. return false;
  53. }
  54. if (!$scope.current.name.match(/^\w+$/)) {
  55. appEvents.emit('alert-warning', ['Validation', 'Only word and digit characters are allowed in variable names']);
  56. return false;
  57. }
  58. const sameName: any = _.find($scope.variables, { name: $scope.current.name });
  59. if (sameName && sameName !== $scope.current) {
  60. appEvents.emit('alert-warning', ['Validation', 'Variable with the same name already exists']);
  61. return false;
  62. }
  63. if (
  64. $scope.current.type === 'query' &&
  65. _.isString($scope.current.query) &&
  66. $scope.current.query.match(new RegExp('\\$' + $scope.current.name + '(/| |$)'))
  67. ) {
  68. appEvents.emit('alert-warning', [
  69. 'Validation',
  70. 'Query cannot contain a reference to itself. Variable: $' + $scope.current.name,
  71. ]);
  72. return false;
  73. }
  74. return true;
  75. };
  76. $scope.validate = () => {
  77. $scope.infoText = '';
  78. if ($scope.current.type === 'adhoc' && $scope.current.datasource !== null) {
  79. $scope.infoText = 'Adhoc filters are applied automatically to all queries that target this datasource';
  80. datasourceSrv.get($scope.current.datasource).then(ds => {
  81. if (!ds.getTagKeys) {
  82. $scope.infoText = 'This datasource does not support adhoc filters yet.';
  83. }
  84. });
  85. }
  86. };
  87. $scope.runQuery = () => {
  88. $scope.optionsLimit = 20;
  89. return variableSrv.updateOptions($scope.current).catch((err: { data: { message: any }; message: string }) => {
  90. if (err.data && err.data.message) {
  91. err.message = err.data.message;
  92. }
  93. appEvents.emit('alert-error', ['Templating', 'Template variables could not be initialized: ' + err.message]);
  94. });
  95. };
  96. $scope.onQueryChange = (query: any, definition: any) => {
  97. $scope.current.query = query;
  98. $scope.current.definition = definition;
  99. $scope.runQuery();
  100. };
  101. $scope.edit = (variable: any) => {
  102. $scope.current = variable;
  103. $scope.currentIsNew = false;
  104. $scope.mode = 'edit';
  105. $scope.validate();
  106. datasourceSrv.get($scope.current.datasource).then(ds => {
  107. $scope.currentDatasource = ds;
  108. });
  109. };
  110. $scope.duplicate = (variable: { getSaveModel: () => void; name: string }) => {
  111. const clone = _.cloneDeep(variable.getSaveModel());
  112. $scope.current = variableSrv.createVariableFromModel(clone);
  113. $scope.current.name = 'copy_of_' + variable.name;
  114. variableSrv.addVariable($scope.current);
  115. };
  116. $scope.update = () => {
  117. if ($scope.isValid()) {
  118. $scope.runQuery().then(() => {
  119. $scope.reset();
  120. $scope.mode = 'list';
  121. templateSrv.updateIndex();
  122. });
  123. }
  124. };
  125. $scope.reset = () => {
  126. $scope.currentIsNew = true;
  127. $scope.current = variableSrv.createVariableFromModel({ type: 'query' });
  128. // this is done here in case a new data source type variable was added
  129. $scope.datasources = _.filter(datasourceSrv.getMetricSources(), ds => {
  130. return !ds.meta.mixed && ds.value !== null;
  131. });
  132. $scope.datasourceTypes = _($scope.datasources)
  133. .uniqBy('meta.id')
  134. .map((ds: any) => {
  135. return { text: ds.meta.name, value: ds.meta.id };
  136. })
  137. .value();
  138. };
  139. $scope.typeChanged = function() {
  140. const old = $scope.current;
  141. $scope.current = variableSrv.createVariableFromModel({
  142. type: $scope.current.type,
  143. });
  144. $scope.current.name = old.name;
  145. $scope.current.label = old.label;
  146. const oldIndex = _.indexOf(this.variables, old);
  147. if (oldIndex !== -1) {
  148. this.variables[oldIndex] = $scope.current;
  149. }
  150. $scope.validate();
  151. };
  152. $scope.removeVariable = (variable: any) => {
  153. variableSrv.removeVariable(variable);
  154. };
  155. $scope.showMoreOptions = () => {
  156. $scope.optionsLimit += 20;
  157. };
  158. $scope.datasourceChanged = async () => {
  159. datasourceSrv.get($scope.current.datasource).then(ds => {
  160. $scope.current.query = '';
  161. $scope.currentDatasource = ds;
  162. });
  163. };
  164. }
  165. }
  166. coreModule.controller('VariableEditorCtrl', VariableEditorCtrl);