Add onBrush functionality to APM monitoring ui graphs (#24840)

This commit is contained in:
Chris Roberson 2018-10-30 12:25:34 -04:00 committed by GitHub
parent bd688bab87
commit b80ab1cd83
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 4 deletions

View file

@ -11,12 +11,14 @@
*/ */
import React from 'react'; import React from 'react';
import moment from 'moment';
import { find, get } from 'lodash'; import { find, get } from 'lodash';
import uiRoutes from'ui/routes'; import uiRoutes from'ui/routes';
import { routeInitProvider } from 'plugins/monitoring/lib/route_init'; import { routeInitProvider } from 'plugins/monitoring/lib/route_init';
import template from './index.html'; import template from './index.html';
import { MonitoringViewBaseController } from '../../base_controller'; import { MonitoringViewBaseController } from '../../base_controller';
import { ApmServerInstance } from '../../../components/apm/instance'; import { ApmServerInstance } from '../../../components/apm/instance';
import { timefilter } from 'ui/timefilter';
uiRoutes.when('/apm/instances/:uuid', { uiRoutes.when('/apm/instances/:uuid', {
template, template,
@ -45,17 +47,26 @@ uiRoutes.when('/apm/instances/:uuid', {
$injector $injector
}); });
function onBrush({ xaxis }) {
timefilter.setTime({
from: moment(xaxis.from),
to: moment(xaxis.to),
mode: 'absolute',
});
}
$scope.$watch(() => this.data, data => { $scope.$watch(() => this.data, data => {
title($scope.cluster, `APM - ${get(data, 'apmSummary.name')}`); title($scope.cluster, `APM - ${get(data, 'apmSummary.name')}`);
this.renderReact(data); this.renderReact(data, onBrush);
}); });
} }
renderReact(data) { renderReact(data, onBrush) {
const component = ( const component = (
<ApmServerInstance <ApmServerInstance
summary={data.apmSummary || {}} summary={data.apmSummary || {}}
metrics={data.metrics || {}} metrics={data.metrics || {}}
onBrush={onBrush}
/> />
); );
super.renderReact(component); super.renderReact(component);

View file

@ -5,12 +5,14 @@
*/ */
import React from 'react'; import React from 'react';
import moment from 'moment';
import { find } from 'lodash'; import { find } from 'lodash';
import uiRoutes from'ui/routes'; import uiRoutes from'ui/routes';
import { routeInitProvider } from 'plugins/monitoring/lib/route_init'; import { routeInitProvider } from 'plugins/monitoring/lib/route_init';
import template from './index.html'; import template from './index.html';
import { MonitoringViewBaseController } from '../../base_controller'; import { MonitoringViewBaseController } from '../../base_controller';
import { ApmOverview } from '../../../components/apm/overview'; import { ApmOverview } from '../../../components/apm/overview';
import { timefilter } from 'ui/timefilter';
uiRoutes.when('/apm', { uiRoutes.when('/apm', {
template, template,
@ -37,15 +39,24 @@ uiRoutes.when('/apm', {
$injector $injector
}); });
function onBrush({ xaxis }) {
timefilter.setTime({
from: moment(xaxis.from),
to: moment(xaxis.to),
mode: 'absolute',
});
}
$scope.$watch(() => this.data, data => { $scope.$watch(() => this.data, data => {
this.renderReact(data); this.renderReact(data, onBrush);
}); });
} }
renderReact(data) { renderReact(data, onBrush) {
const component = ( const component = (
<ApmOverview <ApmOverview
{...data} {...data}
onBrush={onBrush}
/> />
); );
super.renderReact(component); super.renderReact(component);