Commit 147d55d2 authored by Mike Greiling's avatar Mike Greiling

extract prometheus graph group elements into their own component

parent 4138c20c
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
import _ from 'underscore'; import _ from 'underscore';
import statusCodes from '../../lib/utils/http_status'; import statusCodes from '../../lib/utils/http_status';
import MonitoringService from '../services/monitoring_service'; import MonitoringService from '../services/monitoring_service';
import GraphGroup from './graph_group.vue';
import GraphRow from './graph_row.vue'; import GraphRow from './graph_row.vue';
import EmptyState from './empty_state.vue'; import EmptyState from './empty_state.vue';
import MonitoringStore from '../stores/monitoring_store'; import MonitoringStore from '../stores/monitoring_store';
...@@ -31,6 +32,7 @@ ...@@ -31,6 +32,7 @@
}, },
components: { components: {
GraphGroup,
GraphRow, GraphRow,
EmptyState, EmptyState,
}, },
...@@ -120,15 +122,11 @@ ...@@ -120,15 +122,11 @@
<template> <template>
<div v-if="!showEmptyState" class="prometheus-graphs"> <div v-if="!showEmptyState" class="prometheus-graphs">
<div <graph-group
v-for="(groupData, index) in store.groups" v-for="(groupData, index) in store.groups"
:key="index" :key="index"
class="panel panel-default prometheus-panel" :name="groupData.group"
> >
<div class="panel-heading">
<h4>{{groupData.group}}</h4>
</div>
<div class="panel-body">
<graph-row <graph-row
v-for="(row, index) in groupData.metrics" v-for="(row, index) in groupData.metrics"
:key="index" :key="index"
...@@ -136,13 +134,12 @@ ...@@ -136,13 +134,12 @@
:update-aspect-ratio="updateAspectRatio" :update-aspect-ratio="updateAspectRatio"
:deployment-data="store.deploymentData" :deployment-data="store.deploymentData"
/> />
</div> </graph-group>
</div>
</div> </div>
<empty-state <empty-state
v-else
:selected-state="state" :selected-state="state"
:documentation-path="documentationPath" :documentation-path="documentationPath"
:settings-path="settingsPath" :settings-path="settingsPath"
v-else
/> />
</template> </template>
<script>
export default {
props: {
name: {
type: String,
required: true,
},
},
};
</script>
<template>
<div class="panel panel-default prometheus-panel">
<div class="panel-heading">
<h4>{{name}}</h4>
</div>
<div class="panel-body">
<slot />
</div>
</div>
</template>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment