diff --git a/public/app/core/directives/plugin_component.ts b/public/app/core/directives/plugin_component.ts index 1405af3ad3b..3b18ac62acf 100644 --- a/public/app/core/directives/plugin_component.ts +++ b/public/app/core/directives/plugin_component.ts @@ -35,8 +35,8 @@ function pluginDirectiveLoader($compile, datasourceSrv) { return System.import(ds.meta.module).then(dsModule => { return { name: 'metrics-query-editor-' + ds.meta.id, - bindings: {target: "=", panelCtrl: "="}, - attrs: {"target": "target", "panel-ctrl": "ctrl"}, + bindings: {target: "=", panelCtrl: "=", datasource: "="}, + attrs: {"target": "target", "panel-ctrl": "ctrl", datasource: "datasource"}, Component: dsModule.MetricsQueryEditor }; }); diff --git a/public/app/core/directives/plugin_directive_loader.ts b/public/app/core/directives/plugin_directive_loader.ts deleted file mode 100644 index 4c0d1092a09..00000000000 --- a/public/app/core/directives/plugin_directive_loader.ts +++ /dev/null @@ -1,92 +0,0 @@ -/// - -import angular from 'angular'; -import _ from 'lodash'; - -import coreModule from '../core_module'; - -/** @ngInject */ -function pluginComponentLoader($compile, datasourceSrv) { - - function getPluginComponentDirective(options) { - return function() { - return { - templateUrl: options.Component.templateUrl, - restrict: 'E', - controller: options.Component, - controllerAs: 'ctrl', - bindToController: true, - scope: options.bindings, - link: (scope, elem, attrs, ctrl) => { - if (ctrl.link) { - ctrl.link(scope, elem, attrs, ctrl); - } - } - }; - }; - } - - function getModule(scope, attrs) { - switch (attrs.type) { - case "metrics-query-editor": - let datasource = scope.target.datasource || scope.ctrl.panel.datasource; - return datasourceSrv.get(datasource).then(ds => { - if (!scope.target.refId) { - scope.target.refId = 'A'; - } - - return System.import(ds.meta.module).then(dsModule => { - return { - name: 'metrics-query-editor-' + ds.meta.id, - bindings: {target: "=", panelCtrl: "="}, - attrs: {"target": "target", "panel-ctrl": "ctrl"}, - Component: dsModule.MetricsQueryEditor - }; - }); - }); - case 'datasource-config-view': - return System.import(scope.datasourceMeta.module).then(function(dsModule) { - return { - name: 'ds-config-' + scope.datasourceMeta.id, - bindings: {meta: "=", current: "="}, - attrs: {meta: "datasourceMeta", current: "current"}, - Component: dsModule.ConfigView, - }; - }); - } - } - - function appendAndCompile(scope, elem, componentInfo) { - var child = angular.element(document.createElement(componentInfo.name)); - _.each(componentInfo.attrs, (value, key) => { - child.attr(key, value); - }); - - $compile(child)(scope); - - elem.empty(); - elem.append(child); - } - - function registerPluginComponent(scope, elem, attrs, componentInfo) { - if (!componentInfo.Component.registered) { - var directiveName = attrs.$normalize(componentInfo.name); - var directiveFn = getPluginComponentDirective(componentInfo); - coreModule.directive(directiveName, directiveFn); - componentInfo.Component.registered = true; - } - - appendAndCompile(scope, elem, componentInfo); - } - - return { - restrict: 'E', - link: function(scope, elem, attrs) { - getModule(scope, attrs).then(function (componentInfo) { - registerPluginComponent(scope, elem, attrs, componentInfo); - }); - } - }; -} - -coreModule.directive('pluginComponent', pluginComponentLoader); diff --git a/public/app/features/datasources/partials/edit.html b/public/app/features/datasources/partials/edit.html index c27be475bd5..520515907d5 100644 --- a/public/app/features/datasources/partials/edit.html +++ b/public/app/features/datasources/partials/edit.html @@ -42,8 +42,8 @@
- - + +
diff --git a/public/app/features/panel/query_editor.ts b/public/app/features/panel/query_editor.ts index 47c201fee5d..a186266ecaf 100644 --- a/public/app/features/panel/query_editor.ts +++ b/public/app/features/panel/query_editor.ts @@ -9,9 +9,8 @@ export class QueryEditorCtrl { panelCtrl: any; panel: any; - constructor(private $scope, private $injector) { + constructor(public $scope, private $injector) { this.panel = this.panelCtrl.panel; - this.datasource = $scope.datasource; if (!this.target.refId) { this.target.refId = this.getNextQueryLetter(); @@ -44,8 +43,8 @@ export class QueryEditorCtrl { _.move(this.panel.targets, index, index + direction); } - toggleHideQuery(target) { - target.hide = !target.hide; + toggleHideQuery() { + this.target.hide = !this.target.hide; this.panelCtrl.refresh(); } } diff --git a/public/app/plugins/datasource/prometheus/partials/query.editor.html b/public/app/plugins/datasource/prometheus/partials/query.editor.html index ccb67887164..5a5a468ece7 100644 --- a/public/app/plugins/datasource/prometheus/partials/query.editor.html +++ b/public/app/plugins/datasource/prometheus/partials/query.editor.html @@ -1,6 +1,6 @@
    -
  • +
  • {{ctrl.target.datasource}}
  • @@ -27,7 +27,7 @@ {{ctrl.target.refId}}
  • - +
    • @@ -40,12 +40,12 @@
  • + ng-change="ctrl.refreshMetricData()">
  • Metric @@ -53,9 +53,9 @@
    • @@ -70,9 +70,9 @@ Legend format
  • - + ng-model-onblur ng-change="ctrl.refreshMetricData()">
@@ -86,14 +86,14 @@ Step
  • -
    • @@ -102,13 +102,13 @@ Resolution
  • -
  • - +
    • diff --git a/public/app/plugins/datasource/prometheus/query_ctrl.ts b/public/app/plugins/datasource/prometheus/query_ctrl.ts index 6535e16c599..08da9e76735 100644 --- a/public/app/plugins/datasource/prometheus/query_ctrl.ts +++ b/public/app/plugins/datasource/prometheus/query_ctrl.ts @@ -13,6 +13,8 @@ class PrometheusQueryCtrl extends QueryEditorCtrl { metric: any; resolutions: any; oldTarget: any; + suggestMetrics: any; + linkToPrometheus: any; constructor($scope, $injector, private templateSrv) { super($scope, $injector); @@ -27,28 +29,33 @@ class PrometheusQueryCtrl extends QueryEditorCtrl { }); $scope.$on('typeahead-updated', () => { - $scope.$apply(this.inputMetric); - this.refreshMetricData(); + this.$scope.$apply(() => { + + this.target.expr += this.target.metric; + this.metric = ''; + this.refreshMetricData(); + }); }); + + // called from typeahead so need this + // here in order to ensure this ref + this.suggestMetrics = (query, callback) => { + console.log(this); + this.datasource.performSuggestQuery(query).then(callback); + }; + + this.updateLink(); } refreshMetricData() { if (!_.isEqual(this.oldTarget, this.target)) { this.oldTarget = angular.copy(this.target); this.panelCtrl.refresh(); + this.updateLink(); } } - inputMetric() { - this.target.expr += this.target.metric; - this.metric = ''; - } - - suggestMetrics(query, callback) { - this.datasource.performSuggestQuery(query).then(callback); - } - - linkToPrometheus() { + updateLink() { var range = this.panelCtrl.range; var rangeDiff = Math.ceil((range.to.valueOf() - range.from.valueOf()) / 1000); var endTime = range.to.utc().format('YYYY-MM-DD HH:mm'); @@ -61,8 +68,8 @@ class PrometheusQueryCtrl extends QueryEditorCtrl { tab: 0 }; var hash = encodeURIComponent(JSON.stringify([expr])); - return this.datasource.directUrl + '/graph#' + hash; - }; + this.linkToPrometheus = this.datasource.directUrl + '/graph#' + hash; + } } export {PrometheusQueryCtrl};