diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-04-22 15:08:38 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-04-22 15:08:38 +0300 |
commit | ae567e129f79b561404fee0f99082975a8ece087 (patch) | |
tree | 06a9f9bff1a51c26dd2b2cf28ae68c48730f68b0 /app/assets/javascripts/vue_shared | |
parent | 748ab12e20f438ce1e72a35225dd59751d553cd5 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/vue_shared')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue | 10 | ||||
-rw-r--r-- | app/assets/javascripts/vue_shared/components/segmented_control_button_group.vue | 35 |
2 files changed, 42 insertions, 3 deletions
diff --git a/app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue b/app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue index 8b76af05ffe..6a03e38a31d 100644 --- a/app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue +++ b/app/assets/javascripts/vue_shared/components/ci_cd_analytics/ci_cd_analytics_charts.vue @@ -1,12 +1,12 @@ <script> -import { GlSegmentedControl } from '@gitlab/ui'; import { s__, sprintf } from '~/locale'; +import SegmentedControlButtonGroup from '~/vue_shared/components/segmented_control_button_group.vue'; import CiCdAnalyticsAreaChart from './ci_cd_analytics_area_chart.vue'; export default { components: { - GlSegmentedControl, CiCdAnalyticsAreaChart, + SegmentedControlButtonGroup, }, props: { charts: { @@ -38,7 +38,11 @@ export default { </script> <template> <div> - <gl-segmented-control v-model="selectedChart" :options="chartRanges" class="gl-mb-4" /> + <segmented-control-button-group + v-model="selectedChart" + :options="chartRanges" + class="gl-mb-4" + /> <ci-cd-analytics-area-chart v-if="chart" v-bind="$attrs" diff --git a/app/assets/javascripts/vue_shared/components/segmented_control_button_group.vue b/app/assets/javascripts/vue_shared/components/segmented_control_button_group.vue new file mode 100644 index 00000000000..f50706b6de8 --- /dev/null +++ b/app/assets/javascripts/vue_shared/components/segmented_control_button_group.vue @@ -0,0 +1,35 @@ +<script> +import { GlButtonGroup, GlButton } from '@gitlab/ui'; + +// TODO: We're planning to move this component to GitLab UI +// https://gitlab.com/gitlab-org/gitlab-ui/-/issues/1787 +export default { + components: { + GlButtonGroup, + GlButton, + }, + props: { + options: { + type: Array, + required: true, + }, + value: { + type: [String, Number, Boolean], + required: true, + }, + }, +}; +</script> +<template> + <gl-button-group> + <gl-button + v-for="opt in options" + :key="opt.value" + :disabled="!!opt.disabled" + :selected="value === opt.value" + @click="$emit('input', opt.value)" + > + <slot name="button-content" v-bind="opt">{{ opt.text }}</slot> + </gl-button> + </gl-button-group> +</template> |