editor_ctrl.ts 5.4 KB

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