debian-mirror-gitlab/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue

108 lines
2.8 KiB
Vue
Raw Normal View History

2018-03-27 19:54:05 +05:30
<script>
2018-10-15 14:42:47 +05:30
import Flash from '~/flash';
import eventHub from '~/sidebar/event_hub';
import Store from '~/sidebar/stores/sidebar_store';
2019-09-30 21:07:59 +05:30
import { refreshUserMergeRequestCounts } from '~/commons/nav/user_merge_requests';
2018-05-09 12:01:36 +05:30
import AssigneeTitle from './assignee_title.vue';
2018-03-27 19:54:05 +05:30
import Assignees from './assignees.vue';
2019-09-30 21:07:59 +05:30
import { __ } from '~/locale';
2017-08-17 22:00:37 +05:30
export default {
name: 'SidebarAssignees',
2018-03-27 19:54:05 +05:30
components: {
AssigneeTitle,
Assignees,
2017-08-17 22:00:37 +05:30
},
2018-03-17 18:26:18 +05:30
props: {
mediator: {
type: Object,
required: true,
},
field: {
type: String,
required: true,
},
signedIn: {
type: Boolean,
required: false,
default: false,
},
2018-10-15 14:42:47 +05:30
issuableType: {
type: String,
require: true,
default: 'issue',
},
2018-03-17 18:26:18 +05:30
},
2018-03-27 19:54:05 +05:30
data() {
return {
store: new Store(),
loading: false,
};
},
created() {
this.removeAssignee = this.store.removeAssignee.bind(this.store);
this.addAssignee = this.store.addAssignee.bind(this.store);
this.removeAllAssignees = this.store.removeAllAssignees.bind(this.store);
// Get events from glDropdown
eventHub.$on('sidebar.removeAssignee', this.removeAssignee);
eventHub.$on('sidebar.addAssignee', this.addAssignee);
eventHub.$on('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$on('sidebar.saveAssignees', this.saveAssignees);
},
beforeDestroy() {
eventHub.$off('sidebar.removeAssignee', this.removeAssignee);
eventHub.$off('sidebar.addAssignee', this.addAssignee);
eventHub.$off('sidebar.removeAllAssignees', this.removeAllAssignees);
eventHub.$off('sidebar.saveAssignees', this.saveAssignees);
2017-08-17 22:00:37 +05:30
},
methods: {
assignSelf() {
// Notify gl dropdown that we are now assigning to current user
this.$el.parentElement.dispatchEvent(new Event('assignYourself'));
this.mediator.assignYourself();
this.saveAssignees();
},
saveAssignees() {
this.loading = true;
function setLoadingFalse() {
this.loading = false;
}
2018-12-13 13:39:08 +05:30
this.mediator
.saveAssignees(this.field)
2017-08-17 22:00:37 +05:30
.then(setLoadingFalse.bind(this))
2019-09-30 21:07:59 +05:30
.then(() => {
refreshUserMergeRequestCounts();
})
2017-08-17 22:00:37 +05:30
.catch(() => {
setLoadingFalse();
2019-09-30 21:07:59 +05:30
return new Flash(__('Error occurred when saving assignees'));
2017-08-17 22:00:37 +05:30
});
},
},
};
2018-03-27 19:54:05 +05:30
</script>
<template>
<div>
<assignee-title
:number-of-assignees="store.assignees.length"
:loading="loading || store.isFetching.assignees"
:editable="store.editable"
:show-toggle="!signedIn"
/>
<assignees
v-if="!store.isFetching.assignees"
:root-path="store.rootPath"
:users="store.assignees"
:editable="store.editable"
2018-10-15 14:42:47 +05:30
:issuable-type="issuableType"
2018-11-08 19:23:39 +05:30
class="value"
@assign-self="assignSelf"
2018-03-27 19:54:05 +05:30
/>
</div>
</template>