diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-07-02 15:08:31 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-07-02 15:08:31 +0300 |
commit | afbfbfc87abfa006f1d369fdf9c740eb1c826808 (patch) | |
tree | 39f6be835193c63660961d536a185711625fe160 /app/assets/javascripts/analytics | |
parent | 26eb09cbe9c3cc9fc78ad1be7e66e85b5645844b (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/analytics')
-rw-r--r-- | app/assets/javascripts/analytics/shared/components/metric_card.vue | 80 |
1 files changed, 0 insertions, 80 deletions
diff --git a/app/assets/javascripts/analytics/shared/components/metric_card.vue b/app/assets/javascripts/analytics/shared/components/metric_card.vue deleted file mode 100644 index e6e12821bec..00000000000 --- a/app/assets/javascripts/analytics/shared/components/metric_card.vue +++ /dev/null @@ -1,80 +0,0 @@ -<script> -import { - GlCard, - GlDeprecatedSkeletonLoading as GlSkeletonLoading, - GlLink, - GlIcon, - GlTooltipDirective, -} from '@gitlab/ui'; - -export default { - name: 'MetricCard', - components: { - GlCard, - GlSkeletonLoading, - GlLink, - GlIcon, - }, - directives: { - GlTooltip: GlTooltipDirective, - }, - props: { - title: { - type: String, - required: true, - }, - metrics: { - type: Array, - required: true, - }, - isLoading: { - type: Boolean, - required: false, - default: false, - }, - }, - methods: { - valueText(metric) { - const { value = null, unit = null } = metric; - if (!value || value === '-') return '-'; - return unit && value ? `${value} ${unit}` : value; - }, - }, -}; -</script> -<template> - <gl-card class="gl-mb-5"> - <template #header> - <strong ref="title">{{ title }}</strong> - </template> - <template #default> - <gl-skeleton-loading v-if="isLoading" class="gl-h-auto gl-py-3" /> - <div v-else ref="metricsWrapper" class="gl-display-flex"> - <div - v-for="metric in metrics" - :key="metric.key" - ref="metricItem" - class="js-metric-card-item gl-flex-grow-1 gl-text-center" - > - <gl-link v-if="metric.link" :href="metric.link"> - <h3 class="gl-my-2 gl-text-blue-700">{{ valueText(metric) }}</h3> - </gl-link> - <h3 v-else class="gl-my-2">{{ valueText(metric) }}</h3> - <p class="text-secondary gl-font-sm gl-mb-2"> - {{ metric.label }} - <span v-if="metric.tooltipText"> - - <gl-icon - v-gl-tooltip="{ title: metric.tooltipText }" - :size="14" - class="gl-vertical-align-middle" - name="question" - data-testid="tooltip" - /> - </span> - </p> - </div> - </div> - </template> - </gl-card> -</template> |