mirror of
https://github.com/Luzifer/mondash.git
synced 2024-12-22 20:11:18 +00:00
Add DetailURL and line breaks for descriptions
Signed-off-by: Knut Ahlers <knut@ahlers.me>
This commit is contained in:
parent
e566299571
commit
14a098a037
1 changed files with 42 additions and 16 deletions
|
@ -2,35 +2,56 @@
|
|||
<b-row class="mb-3">
|
||||
<b-col>
|
||||
<b-card :border-variant="variantFromStatus(metric.status)">
|
||||
|
||||
<b-row slot="header">
|
||||
<b-col cols="7">
|
||||
<strong>{{ metric.title }}</strong>
|
||||
<b-btn
|
||||
v-if="metric.detail_url"
|
||||
:href="metric.detail_url"
|
||||
>
|
||||
<i class="fa fa-external-link-alt" />
|
||||
</b-btn>
|
||||
</b-col>
|
||||
<b-col class="d-flex align-items-center" cols="5">
|
||||
<historyBar :metric="metric"></historyBar>
|
||||
<b-col
|
||||
class="d-flex align-items-center"
|
||||
cols="5"
|
||||
>
|
||||
<historyBar :metric="metric" />
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-card-text>
|
||||
{{ description }}
|
||||
</b-card-text>
|
||||
<b-card-text v-html="description" />
|
||||
|
||||
<graph :metric="metric" v-if="!metric.config.hide_mad"></graph>
|
||||
<graph
|
||||
v-if="!metric.config.hide_mad"
|
||||
:metric="metric"
|
||||
/>
|
||||
|
||||
<div slot="footer" class="d-flex justify-content-between">
|
||||
<div
|
||||
slot="footer"
|
||||
class="d-flex justify-content-between"
|
||||
>
|
||||
<span>
|
||||
<b-badge :variant="variantFromStatus(metric.status)" v-if="!metric.config.hide_value">Current value: {{ metric.value.toFixed(3) }}</b-badge>
|
||||
<b-badge
|
||||
v-if="!metric.config.hide_value"
|
||||
:variant="variantFromStatus(metric.status)"
|
||||
>Current value: {{ metric.value.toFixed(3) }}</b-badge>
|
||||
<span v-if="!metric.config.hide_mad">
|
||||
<abbr title="Median Absolute Deviation">MAD</abbr>: {{ metric.mad_multiplier.toFixed(3) }} above the median ({{ metric.median.toFixed(3) }})
|
||||
</span>
|
||||
</span>
|
||||
<small class="text-muted">
|
||||
<span v-b-tooltip.hover :title="moment(metric.last_update).format('lll')">Updated {{ moment(metric.last_update).fromNow() }}</span>
|
||||
<span v-b-tooltip.hover :title="moment(metric.last_ok).format('lll')" v-if="metric.status !== 'OK'"> (Last OK {{ moment(metric.last_ok).fromNow() }})</span>
|
||||
<span
|
||||
v-b-tooltip.hover
|
||||
:title="moment(metric.last_update).format('lll')"
|
||||
>Updated {{ moment(metric.last_update).fromNow() }}</span>
|
||||
<span
|
||||
v-if="metric.status !== 'OK'"
|
||||
v-b-tooltip.hover
|
||||
:title="moment(metric.last_ok).format('lll')"
|
||||
> (Last OK {{ moment(metric.last_ok).fromNow() }})</span>
|
||||
</small>
|
||||
</div>
|
||||
|
||||
</b-card>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
@ -43,8 +64,15 @@ import graph from './graph.vue'
|
|||
import historyBar from './history-bar.vue'
|
||||
|
||||
export default {
|
||||
name: 'metric',
|
||||
props: ['metric'],
|
||||
name: 'Metric',
|
||||
|
||||
components: { graph, historyBar },
|
||||
props: {
|
||||
metric: {
|
||||
required: true,
|
||||
type: Object,
|
||||
},
|
||||
},
|
||||
|
||||
computed: {
|
||||
description() {
|
||||
|
@ -52,8 +80,6 @@ export default {
|
|||
},
|
||||
},
|
||||
|
||||
components: { graph, historyBar },
|
||||
|
||||
methods: {
|
||||
moment,
|
||||
|
||||
|
|
Loading…
Reference in a new issue