From 5909f9ef924371a7cf2e423e433ee991c4152725 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 19 May 2017 21:32:23 +0200 Subject: [PATCH] feat: more work on metrics tab reworkings --- docker/blocks/graphite/fig | 1 - .../app/core/directives/plugin_component.ts | 4 +- public/app/features/panel/all.js | 1 - .../app/features/panel/metrics_panel_ctrl.ts | 3 +- ...{metrics_ds_selector.ts => metrics_tab.ts} | 83 ++++++------------- public/app/partials/metrics.html | 58 +++++++++++-- 6 files changed, 80 insertions(+), 70 deletions(-) rename public/app/features/panel/{metrics_ds_selector.ts => metrics_tab.ts} (50%) diff --git a/docker/blocks/graphite/fig b/docker/blocks/graphite/fig index 60acb8c1131..b7e030e388e 100644 --- a/docker/blocks/graphite/fig +++ b/docker/blocks/graphite/fig @@ -4,7 +4,6 @@ graphite: - "8080:80" - "2003:2003" volumes: - - /var/docker/gfdev/graphite:/opt/graphite/storage/whisper - /etc/localtime:/etc/localtime:ro - /etc/timezone:/etc/timezone:ro diff --git a/public/app/core/directives/plugin_component.ts b/public/app/core/directives/plugin_component.ts index 4c098f60a4c..3c797aede3e 100644 --- a/public/app/core/directives/plugin_component.ts +++ b/public/app/core/directives/plugin_component.ts @@ -109,7 +109,7 @@ function pluginDirectiveLoader($compile, datasourceSrv, $rootScope, $q, $http, $ baseUrl: ds.meta.baseUrl, name: 'query-ctrl-' + ds.meta.id, bindings: {target: "=", panelCtrl: "=", datasource: "="}, - attrs: {"target": "target", "panel-ctrl": "ctrl", datasource: "datasource"}, + attrs: {"target": "target", "panel-ctrl": "ctrl.panelCtrl", datasource: "datasource"}, Component: dsModule.QueryCtrl }; }); @@ -127,7 +127,7 @@ function pluginDirectiveLoader($compile, datasourceSrv, $rootScope, $q, $http, $ baseUrl: ds.meta.baseUrl, name: 'query-options-ctrl-' + ds.meta.id, bindings: {panelCtrl: "="}, - attrs: {"panel-ctrl": "ctrl"}, + attrs: {"panel-ctrl": "ctrl.panelCtrl"}, Component: dsModule.QueryOptionsCtrl }; }); diff --git a/public/app/features/panel/all.js b/public/app/features/panel/all.js index b4afba4da1b..cba296643ef 100644 --- a/public/app/features/panel/all.js +++ b/public/app/features/panel/all.js @@ -5,6 +5,5 @@ define([ './query_ctrl', './panel_editor_tab', './query_editor_row', - './metrics_ds_selector', './query_troubleshooter', ], function () {}); diff --git a/public/app/features/panel/metrics_panel_ctrl.ts b/public/app/features/panel/metrics_panel_ctrl.ts index 000705d74d5..ee1b45b4abf 100644 --- a/public/app/features/panel/metrics_panel_ctrl.ts +++ b/public/app/features/panel/metrics_panel_ctrl.ts @@ -10,6 +10,7 @@ import * as rangeUtil from 'app/core/utils/rangeutil'; import * as dateMath from 'app/core/utils/datemath'; import {Subject} from 'vendor/npm/rxjs/Subject'; +import {metricsTabDirective} from './metrics_tab'; class MetricsPanelCtrl extends PanelCtrl { scope: any; @@ -61,7 +62,7 @@ class MetricsPanelCtrl extends PanelCtrl { } private onInitMetricsPanelEditMode() { - this.addEditorTab('Metrics', 'public/app/partials/metrics.html'); + this.addEditorTab('Metrics', metricsTabDirective); this.addEditorTab('Time range', 'public/app/features/panel/partials/panelTime.html'); } diff --git a/public/app/features/panel/metrics_ds_selector.ts b/public/app/features/panel/metrics_tab.ts similarity index 50% rename from public/app/features/panel/metrics_ds_selector.ts rename to public/app/features/panel/metrics_tab.ts index 523268953a0..4fe96be052b 100644 --- a/public/app/features/panel/metrics_ds_selector.ts +++ b/public/app/features/panel/metrics_tab.ts @@ -1,59 +1,26 @@ /// -import angular from 'angular'; import _ from 'lodash'; -import appEvents from 'app/core/app_events'; +import {DashboardModel} from '../dashboard/model'; -var module = angular.module('grafana.directives'); - -var template = ` - -
-
-
- - - - -
- -
- - -
- -
-
- -
-
-`; - - -export class MetricsDsSelectorCtrl { +export class MetricsTabCtrl { dsSegment: any; mixedDsSegment: any; dsName: string; + panel: any; panelCtrl: any; datasources: any[]; current: any; - lastResponse: any; - responseData: any; - showResponse: boolean; + nextRefId: string; + dashboard: DashboardModel; /** @ngInject */ constructor($scope, private uiSegmentSrv, datasourceSrv) { + this.panelCtrl = $scope.ctrl; + $scope.ctrl = this; + + this.panel = this.panelCtrl.panel; + this.dashboard = this.panelCtrl.dashboard; this.datasources = datasourceSrv.getMetricSources(); var dsValue = this.panelCtrl.panel.datasource || null; @@ -70,9 +37,9 @@ export class MetricsDsSelectorCtrl { this.dsSegment = uiSegmentSrv.newSegment({value: this.current.name, selectMode: true}); this.mixedDsSegment = uiSegmentSrv.newSegment({value: 'Add Query', selectMode: true}); + this.nextRefId = this.getNextQueryLetter(); } - getOptions(includeBuiltin) { return Promise.resolve(this.datasources.filter(value => { return includeBuiltin || !value.meta.builtIn; @@ -86,7 +53,6 @@ export class MetricsDsSelectorCtrl { if (ds) { this.current = ds; this.panelCtrl.setDatasource(ds); - this.responseData = null; } } @@ -100,22 +66,27 @@ export class MetricsDsSelectorCtrl { } } + getNextQueryLetter() { + return this.dashboard.getNextQueryLetter(this.panel); + } + addDataQuery() { - var target: any = {isNew: true}; + var target: any = { + isNew: true, + refId: this.getNextQueryLetter() + }; this.panelCtrl.panel.targets.push(target); + this.nextRefId = this.getNextQueryLetter(); } } -module.directive('metricsDsSelector', function() { +/** @ngInject **/ +export function metricsTabDirective() { + 'use strict'; return { restrict: 'E', - template: template, - controller: MetricsDsSelectorCtrl, - bindToController: true, - controllerAs: 'ctrl', - transclude: true, - scope: { - panelCtrl: "=" - } + scope: true, + templateUrl: 'public/app/partials/metrics.html', + controller: MetricsTabCtrl, }; -}); +} diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html index d3c6e6bcfc4..131c85996ae 100644 --- a/public/app/partials/metrics.html +++ b/public/app/partials/metrics.html @@ -1,5 +1,21 @@ - +
+
+
+ + + + + +
+
+
@@ -7,16 +23,40 @@ -
+
+ +
+
+ + + +
+ +
+
+
- + -
- - - - -
+ + + +
+ + + + +
+ + +