debian-mirror-gitlab/app/assets/javascripts/boards/components/board_content_sidebar.vue

160 lines
5.5 KiB
Vue
Raw Normal View History

2021-04-29 21:17:54 +05:30
<script>
import { GlDrawer } from '@gitlab/ui';
import { mapState, mapActions, mapGetters } from 'vuex';
2021-09-04 01:27:46 +05:30
import SidebarDropdownWidget from 'ee_else_ce/sidebar/components/sidebar_dropdown_widget.vue';
2021-04-29 21:17:54 +05:30
import BoardSidebarLabelsSelect from '~/boards/components/sidebar/board_sidebar_labels_select.vue';
import BoardSidebarTimeTracker from '~/boards/components/sidebar/board_sidebar_time_tracker.vue';
import BoardSidebarTitle from '~/boards/components/sidebar/board_sidebar_title.vue';
import { ISSUABLE } from '~/boards/constants';
import { contentTop } from '~/lib/utils/common_utils';
import SidebarAssigneesWidget from '~/sidebar/components/assignees/sidebar_assignees_widget.vue';
2021-06-08 01:23:25 +05:30
import SidebarConfidentialityWidget from '~/sidebar/components/confidential/sidebar_confidentiality_widget.vue';
2021-09-04 01:27:46 +05:30
import SidebarDateWidget from '~/sidebar/components/date/sidebar_date_widget.vue';
2021-06-08 01:23:25 +05:30
import SidebarSubscriptionsWidget from '~/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue';
2021-09-04 01:27:46 +05:30
import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
2021-04-29 21:17:54 +05:30
export default {
headerHeight: `${contentTop()}px`,
components: {
GlDrawer,
BoardSidebarTitle,
SidebarAssigneesWidget,
2021-09-04 01:27:46 +05:30
SidebarDateWidget,
2021-06-08 01:23:25 +05:30
SidebarConfidentialityWidget,
2021-04-29 21:17:54 +05:30
BoardSidebarTimeTracker,
BoardSidebarLabelsSelect,
2021-06-08 01:23:25 +05:30
SidebarSubscriptionsWidget,
2021-09-04 01:27:46 +05:30
SidebarDropdownWidget,
2021-04-29 21:17:54 +05:30
BoardSidebarWeightInput: () =>
import('ee_component/boards/components/sidebar/board_sidebar_weight_input.vue'),
2021-09-04 01:27:46 +05:30
IterationSidebarDropdownWidget: () =>
import('ee_component/sidebar/components/iteration_sidebar_dropdown_widget.vue'),
2021-04-29 21:17:54 +05:30
},
2021-09-04 01:27:46 +05:30
mixins: [glFeatureFlagMixin()],
2021-06-08 01:23:25 +05:30
inject: {
multipleAssigneesFeatureAvailable: {
default: false,
},
epicFeatureAvailable: {
default: false,
},
iterationFeatureAvailable: {
default: false,
},
weightFeatureAvailable: {
default: false,
},
},
2021-04-29 21:17:54 +05:30
computed: {
...mapGetters([
'isSidebarOpen',
'activeBoardItem',
'groupPathForActiveIssue',
'projectPathForActiveIssue',
]),
...mapState(['sidebarType', 'issuableType']),
isIssuableSidebar() {
return this.sidebarType === ISSUABLE;
},
showSidebar() {
return this.isIssuableSidebar && this.isSidebarOpen;
},
fullPath() {
return this.activeBoardItem?.referencePath?.split('#')[0] || '';
},
},
methods: {
2021-06-08 01:23:25 +05:30
...mapActions(['toggleBoardItem', 'setAssignees', 'setActiveItemConfidential']),
2021-04-29 21:17:54 +05:30
handleClose() {
this.toggleBoardItem({ boardItem: this.activeBoardItem, sidebarType: this.sidebarType });
},
},
};
</script>
<template>
<gl-drawer
v-if="showSidebar"
:open="isSidebarOpen"
:header-height="$options.headerHeight"
@close="handleClose"
>
<template #header>{{ __('Issue details') }}</template>
<template #default>
<board-sidebar-title />
<sidebar-assignees-widget
:iid="activeBoardItem.iid"
:full-path="fullPath"
:initial-assignees="activeBoardItem.assignees"
2021-06-08 01:23:25 +05:30
:allow-multiple-assignees="multipleAssigneesFeatureAvailable"
2021-04-29 21:17:54 +05:30
@assignees-updated="setAssignees"
/>
2021-09-04 01:27:46 +05:30
<sidebar-dropdown-widget
v-if="epicFeatureAvailable"
:iid="activeBoardItem.iid"
issuable-attribute="epic"
:workspace-path="projectPathForActiveIssue"
:attr-workspace-path="groupPathForActiveIssue"
:issuable-type="issuableType"
data-testid="sidebar-epic"
/>
2021-04-29 21:17:54 +05:30
<div>
2021-09-04 01:27:46 +05:30
<sidebar-dropdown-widget
2021-04-29 21:17:54 +05:30
:iid="activeBoardItem.iid"
2021-09-04 01:27:46 +05:30
issuable-attribute="milestone"
2021-04-29 21:17:54 +05:30
:workspace-path="projectPathForActiveIssue"
2021-09-04 01:27:46 +05:30
:attr-workspace-path="projectPathForActiveIssue"
2021-04-29 21:17:54 +05:30
:issuable-type="issuableType"
2021-09-04 01:27:46 +05:30
data-testid="sidebar-milestones"
2021-04-29 21:17:54 +05:30
/>
2021-09-04 01:27:46 +05:30
<template v-if="!glFeatures.iterationCadences">
<sidebar-dropdown-widget
v-if="iterationFeatureAvailable"
:iid="activeBoardItem.iid"
issuable-attribute="iteration"
:workspace-path="projectPathForActiveIssue"
:attr-workspace-path="groupPathForActiveIssue"
:issuable-type="issuableType"
class="gl-mt-5"
data-testid="iteration-edit"
data-qa-selector="iteration_container"
/>
</template>
<template v-else>
<iteration-sidebar-dropdown-widget
v-if="iterationFeatureAvailable"
:iid="activeBoardItem.iid"
:workspace-path="projectPathForActiveIssue"
:attr-workspace-path="groupPathForActiveIssue"
:issuable-type="issuableType"
class="gl-mt-5"
data-testid="iteration-edit"
data-qa-selector="iteration_container"
/>
</template>
2021-04-29 21:17:54 +05:30
</div>
<board-sidebar-time-tracker class="swimlanes-sidebar-time-tracker" />
2021-09-04 01:27:46 +05:30
<sidebar-date-widget
:iid="activeBoardItem.iid"
:full-path="fullPath"
:issuable-type="issuableType"
data-testid="sidebar-due-date"
/>
2021-04-29 21:17:54 +05:30
<board-sidebar-labels-select class="labels" />
2021-06-08 01:23:25 +05:30
<board-sidebar-weight-input v-if="weightFeatureAvailable" class="weight" />
<sidebar-confidentiality-widget
:iid="activeBoardItem.iid"
:full-path="fullPath"
:issuable-type="issuableType"
@confidentialityUpdated="setActiveItemConfidential($event)"
/>
<sidebar-subscriptions-widget
:iid="activeBoardItem.iid"
:full-path="fullPath"
:issuable-type="issuableType"
data-testid="sidebar-notifications"
/>
2021-04-29 21:17:54 +05:30
</template>
</gl-drawer>
</template>