From 912301fe24ee3c24405434ed96bae108523e7d28 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sat, 20 May 2017 10:14:41 +0200 Subject: [PATCH] query: more work on metrics tab changes --- .../app/features/panel/metrics_panel_ctrl.ts | 21 +++++++++++++++++++ public/app/features/panel/metrics_tab.ts | 21 +++++++------------ public/app/features/panel/panel_ctrl.ts | 12 ++++++++++- public/app/features/panel/query_editor_row.ts | 21 ++++--------------- public/app/partials/metrics.html | 8 ++----- public/sass/components/_gf-form.scss | 1 + public/sass/components/edit_sidemenu.scss | 1 - 7 files changed, 46 insertions(+), 39 deletions(-) diff --git a/public/app/features/panel/metrics_panel_ctrl.ts b/public/app/features/panel/metrics_panel_ctrl.ts index ee1b45b4abf..e3b4e9c77cf 100644 --- a/public/app/features/panel/metrics_panel_ctrl.ts +++ b/public/app/features/panel/metrics_panel_ctrl.ts @@ -1,5 +1,6 @@ /// +import angular from 'angular'; import config from 'app/core/config'; import $ from 'jquery'; import _ from 'lodash'; @@ -33,6 +34,7 @@ class MetricsPanelCtrl extends PanelCtrl { dataStream: any; dataSubscription: any; dataList: any; + nextRefId: string; constructor($scope, $injector) { super($scope, $injector); @@ -307,6 +309,25 @@ class MetricsPanelCtrl extends PanelCtrl { this.datasource = null; this.refresh(); } + + addQuery(target) { + target.refId = this.dashboard.getNextQueryLetter(this.panel); + + this.panel.targets.push(target); + this.nextRefId = this.dashboard.getNextQueryLetter(this.panel); + } + + removeQuery(target) { + var index = _.indexOf(this.panel.targets, target); + this.panel.targets.splice(index, 1); + this.nextRefId = this.dashboard.getNextQueryLetter(this.panel); + this.refresh(); + } + + moveQuery(target, direction) { + var index = _.indexOf(this.panel.targets, target); + _.move(this.panel.targets, index, index + direction); + } } export {MetricsPanelCtrl}; diff --git a/public/app/features/panel/metrics_tab.ts b/public/app/features/panel/metrics_tab.ts index 4fe96be052b..375c20b0ae0 100644 --- a/public/app/features/panel/metrics_tab.ts +++ b/public/app/features/panel/metrics_tab.ts @@ -36,8 +36,10 @@ export class MetricsTabCtrl { } this.dsSegment = uiSegmentSrv.newSegment({value: this.current.name, selectMode: true}); - this.mixedDsSegment = uiSegmentSrv.newSegment({value: 'Add Query', selectMode: true}); - this.nextRefId = this.getNextQueryLetter(); + this.mixedDsSegment = uiSegmentSrv.newSegment({value: 'Add Query', selectMode: true, fake: true}); + + // update next ref id + this.panelCtrl.nextRefId = this.dashboard.getNextQueryLetter(this.panel); } getOptions(includeBuiltin) { @@ -61,22 +63,13 @@ export class MetricsTabCtrl { var ds = _.find(this.datasources, {name: this.mixedDsSegment.value}); if (ds) { target.datasource = ds.name; - this.panelCtrl.panel.targets.push(target); + this.panelCtrl.addDataQuery(target); this.mixedDsSegment.value = ''; } } - getNextQueryLetter() { - return this.dashboard.getNextQueryLetter(this.panel); - } - - addDataQuery() { - var target: any = { - isNew: true, - refId: this.getNextQueryLetter() - }; - this.panelCtrl.panel.targets.push(target); - this.nextRefId = this.getNextQueryLetter(); + addQuery() { + this.panelCtrl.addQuery({isNew: true}); } } diff --git a/public/app/features/panel/panel_ctrl.ts b/public/app/features/panel/panel_ctrl.ts index 8de78291baa..a0645af43de 100644 --- a/public/app/features/panel/panel_ctrl.ts +++ b/public/app/features/panel/panel_ctrl.ts @@ -76,8 +76,18 @@ export class PanelCtrl { profiler.renderingCompleted(this.panel.id, this.timing); } + shouldSkipRefresh() { + // some scenarios we should never ignore refresh + if (this.fullscreen || this.dashboard.meta.soloMode || this.dashboard.snapshot) { + return false; + } + + return !this.isPanelVisible(); + } + refresh() { - if (!this.isPanelVisible() && !this.dashboard.meta.soloMode && !this.dashboard.snapshot) { + // somet + if (this.shouldSkipRefresh()) { this.skippedLastRefresh = true; return; } diff --git a/public/app/features/panel/query_editor_row.ts b/public/app/features/panel/query_editor_row.ts index 8249d84774f..1241d45db69 100644 --- a/public/app/features/panel/query_editor_row.ts +++ b/public/app/features/panel/query_editor_row.ts @@ -21,7 +21,7 @@ export class QueryRowCtrl { this.panel = this.panelCtrl.panel; if (!this.target.refId) { - this.target.refId = this.getNextQueryLetter(); + this.target.refId = this.panelCtrl.dashboard.getNextQueryLetter(this.panel); } this.toggleCollapse(true); @@ -40,16 +40,6 @@ export class QueryRowCtrl { this.panelCtrl.refresh(); } - getNextQueryLetter() { - var letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; - - return _.find(letters, refId => { - return _.every(this.panel.targets, function(other) { - return other.refId !== refId; - }); - }); - } - toggleCollapse(init) { if (!this.canCollapse) { return; @@ -87,19 +77,16 @@ export class QueryRowCtrl { delete this.panelCtrl.__collapsedQueryCache[this.target.refId]; } - this.panel.targets = _.without(this.panel.targets, this.target); - this.panelCtrl.refresh(); + this.panelCtrl.removeQuery(this.target); } duplicateQuery() { var clone = angular.copy(this.target); - clone.refId = this.getNextQueryLetter(); - this.panel.targets.push(clone); + this.panelCtrl.addQuery(clone); } moveQuery(direction) { - var index = _.indexOf(this.panel.targets, this.target); - _.move(this.panel.targets, index, index + direction); + this.panelCtrl.moveQuery(this.target, direction); } } diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html index 131c85996ae..46f690bd775 100644 --- a/public/app/partials/metrics.html +++ b/public/app/partials/metrics.html @@ -2,10 +2,6 @@
- - @@ -31,9 +27,9 @@ - {{ctrl.nextRefId}} + {{ctrl.panelCtrl.nextRefId}} - diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 9c88435fcc2..313f4ced3ed 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -118,6 +118,7 @@ $gf-form-margin: 0.25rem; padding: $input-padding-y $input-padding-x; margin-right: $gf-form-margin; font-size: $font-size-base; + margin-right: $gf-form-margin; line-height: $input-line-height; color: $input-color; background-color: $input-bg; diff --git a/public/sass/components/edit_sidemenu.scss b/public/sass/components/edit_sidemenu.scss index 5da2f6a21ce..e84ae2c1914 100644 --- a/public/sass/components/edit_sidemenu.scss +++ b/public/sass/components/edit_sidemenu.scss @@ -10,7 +10,6 @@ } .edit-sidemenu-aside { - min-width: 6rem; margin-right: $spacer*2; }