debian-mirror-gitlab/app/assets/javascripts/boards/components/modal/footer.vue
2019-03-02 22:35:43 +05:30

78 lines
2.1 KiB
Vue

<script>
import Flash from '../../../flash';
import { __ } from '../../../locale';
import ListsDropdown from './lists_dropdown.vue';
import { pluralize } from '../../../lib/utils/text_utility';
import ModalStore from '../../stores/modal_store';
import modalMixin from '../../mixins/modal_mixins';
import boardsStore from '../../stores/boards_store';
export default {
components: {
ListsDropdown,
},
mixins: [modalMixin],
data() {
return {
modal: ModalStore.store,
state: boardsStore.state,
};
},
computed: {
submitDisabled() {
return !ModalStore.selectedCount();
},
submitText() {
const count = ModalStore.selectedCount();
return `Add ${count > 0 ? count : ''} ${pluralize('issue', count)}`;
},
},
methods: {
buildUpdateRequest(list) {
return {
add_label_ids: [list.label.id],
};
},
addIssues() {
const firstListIndex = 1;
const list = this.modal.selectedList || this.state.lists[firstListIndex];
const selectedIssues = ModalStore.getSelectedIssues();
const issueIds = selectedIssues.map(issue => issue.id);
const req = this.buildUpdateRequest(list);
// Post the data to the backend
gl.boardService.bulkUpdate(issueIds, req).catch(() => {
Flash(__('Failed to update issues, please try again.'));
selectedIssues.forEach(issue => {
list.removeIssue(issue);
list.issuesSize -= 1;
});
});
// Add the issues on the frontend
selectedIssues.forEach(issue => {
list.addIssue(issue);
list.issuesSize += 1;
});
this.toggleModal(false);
},
},
};
</script>
<template>
<footer class="form-actions add-issues-footer">
<div class="float-left">
<button :disabled="submitDisabled" class="btn btn-success" type="button" @click="addIssues">
{{ submitText }}
</button>
<span class="inline add-issues-footer-to-list"> to list </span>
<lists-dropdown />
</div>
<button class="btn btn-default float-right" type="button" @click="toggleModal(false)">
Cancel
</button>
</footer>
</template>