diff options
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue new file mode 100644 index 00000000000..695af775750 --- /dev/null +++ b/app/assets/javascripts/vue_shared/components/sidebar/labels_select_vue/dropdown_value.vue @@ -0,0 +1,53 @@ +<script> +import { mapState } from 'vuex'; +import { GlLabel } from '@gitlab/ui'; + +import { isScopedLabel } from '~/lib/utils/common_utils'; + +export default { + components: { + GlLabel, + }, + computed: { + ...mapState([ + 'selectedLabels', + 'allowScopedLabels', + 'labelsFilterBasePath', + 'scopedLabelsDocumentationPath', + ]), + }, + methods: { + labelFilterUrl(label) { + return `${this.labelsFilterBasePath}?label_name[]=${encodeURIComponent(label.title)}`; + }, + scopedLabel(label) { + return this.allowScopedLabels && isScopedLabel(label); + }, + }, +}; +</script> + +<template> + <div + :class="{ + 'has-labels': selectedLabels.length, + }" + class="hide-collapsed value issuable-show-labels js-value" + > + <span v-if="!selectedLabels.length" class="text-secondary"> + <slot></slot> + </span> + <template v-for="label in selectedLabels" v-else> + <gl-label + :key="label.id" + :title="label.title" + :description="label.description" + :background-color="label.color" + :target="labelFilterUrl(label)" + :scoped="scopedLabel(label)" + :scoped-labels-documentation-link="scopedLabelsDocumentationPath" + tooltip-placement="top" + /> + </template> + </div> +</template> |