diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-12-19 21:09:34 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-12-19 21:09:34 +0300 |
commit | d4e22f4ade1ce4dfd54f4d1740f074b2be441705 (patch) | |
tree | 5f1f1bbe3c7673905804170bfd1becf665d4b0b5 /app/assets/javascripts/work_items | |
parent | c18599314d98c0aa4dfe7d56423469f0b641d066 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/work_items')
3 files changed, 45 insertions, 10 deletions
diff --git a/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child.vue b/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child.vue index 763f2f338a3..14d2512ffc8 100644 --- a/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child.vue +++ b/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child.vue @@ -10,6 +10,7 @@ import { STATE_OPEN, TASK_TYPE_NAME, WORK_ITEM_TYPE_VALUE_OBJECTIVE, + WIDGET_TYPE_PROGRESS, WIDGET_TYPE_MILESTONE, WIDGET_TYPE_HIERARCHY, WIDGET_TYPE_ASSIGNEES, @@ -113,7 +114,15 @@ export default { return this.isExpanded ? __('Collapse') : __('Expand'); }, hasMetadata() { - return this.milestone || this.assignees.length > 0 || this.labels.length > 0; + return ( + this.progress !== undefined || + this.milestone !== undefined || + this.assignees.length > 0 || + this.labels.length > 0 + ); + }, + progress() { + return this.getWidgetByType(this.childItem, WIDGET_TYPE_PROGRESS)?.progress; }, milestone() { return this.getWidgetByType(this.childItem, WIDGET_TYPE_MILESTONE)?.milestone; @@ -231,6 +240,7 @@ export default { <work-item-link-child-metadata v-if="hasMetadata" :allows-scoped-labels="allowsScopedLabels" + :progress="progress" :milestone="milestone" :assignees="assignees" :labels="labels" diff --git a/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child_metadata.vue b/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child_metadata.vue index 7be7e1f3496..a7660dc4f25 100644 --- a/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child_metadata.vue +++ b/app/assets/javascripts/work_items/components/work_item_links/work_item_link_child_metadata.vue @@ -1,5 +1,12 @@ <script> -import { GlLabel, GlAvatar, GlAvatarLink, GlAvatarsInline, GlTooltipDirective } from '@gitlab/ui'; +import { + GlIcon, + GlLabel, + GlAvatar, + GlAvatarLink, + GlAvatarsInline, + GlTooltipDirective, +} from '@gitlab/ui'; import { s__, sprintf } from '~/locale'; import { isScopedLabel } from '~/lib/utils/common_utils'; @@ -8,6 +15,7 @@ import ItemMilestone from '~/issuable/components/issue_milestone.vue'; export default { components: { + GlIcon, GlLabel, GlAvatar, GlAvatarLink, @@ -23,6 +31,11 @@ export default { required: false, default: false, }, + progress: { + type: Number, + required: false, + default: 0, + }, milestone: { type: Object, required: false, @@ -40,6 +53,9 @@ export default { }, }, computed: { + hasProgress() { + return !(this.progress === null || this.progress === undefined); + }, assigneesCollapsedTooltip() { if (this.assignees.length > 2) { return sprintf(s__('WorkItem|%{count} more assignees'), { @@ -56,12 +72,6 @@ export default { } return ''; }, - labelsContainerClass() { - if (this.milestone || this.assignees.length) { - return 'gl-sm-ml-5'; - } - return ''; - }, }, methods: { showScopedLabel(label) { @@ -73,6 +83,16 @@ export default { <template> <div class="gl-display-flex gl-flex-wrap gl-align-items-center"> + <div + v-if="hasProgress" + v-gl-tooltip.bottom + :title="__('Progress')" + class="gl-display-flex gl-align-items-center gl-mr-5 gl-cursor-help gl-line-height-normal" + data-testid="item-progress" + > + <gl-icon name="progress" /> + <span class="gl-text-primary gl-ml-2">{{ progress }}%</span> + </div> <item-milestone v-if="milestone" :milestone="milestone" @@ -87,6 +107,7 @@ export default { badge-tooltip-prop="name" :badge-sr-only-text="assigneesCollapsedTooltip" :class="assigneesContainerClass" + class="gl-mr-5" > <template #avatar="{ avatar }"> <gl-avatar-link v-gl-tooltip target="blank" :href="avatar.webUrl" :title="avatar.name"> @@ -94,7 +115,7 @@ export default { </gl-avatar-link> </template> </gl-avatars-inline> - <div v-if="labels.length" class="gl-display-flex gl-flex-wrap" :class="labelsContainerClass"> + <div v-if="labels.length" class="gl-display-flex gl-flex-wrap"> <gl-label v-for="label in labels" :key="label.id" @@ -102,7 +123,7 @@ export default { :background-color="label.color" :description="label.description" :scoped="showScopedLabel(label)" - class="gl-mt-2 gl-sm-mt-0 gl-mr-2 gl-mb-auto gl-label-sm" + class="gl-mt-3 gl-sm-mt-0 gl-mr-2 gl-mb-auto gl-label-sm" tooltip-placement="top" /> </div> diff --git a/app/assets/javascripts/work_items/graphql/work_item_metadata_widgets.fragment.graphql b/app/assets/javascripts/work_items/graphql/work_item_metadata_widgets.fragment.graphql index baefcdaea93..6e2acba5b92 100644 --- a/app/assets/javascripts/work_items/graphql/work_item_metadata_widgets.fragment.graphql +++ b/app/assets/javascripts/work_items/graphql/work_item_metadata_widgets.fragment.graphql @@ -3,6 +3,10 @@ #import "~/work_items/graphql/milestone.fragment.graphql" fragment WorkItemMetadataWidgets on WorkItemWidget { + ... on WorkItemWidgetProgress { + type + progress + } ... on WorkItemWidgetMilestone { type milestone { |