2018-11-08 19:23:39 +05:30
|
|
|
<script>
|
2020-11-24 15:15:51 +05:30
|
|
|
import { GlButton } from '@gitlab/ui';
|
2019-09-30 21:07:59 +05:30
|
|
|
import footerEEMixin from 'ee_else_ce/boards/mixins/modal_footer';
|
2020-10-24 23:57:45 +05:30
|
|
|
import { deprecatedCreateFlash as Flash } from '../../../flash';
|
2019-09-30 21:07:59 +05:30
|
|
|
import { __, n__ } from '../../../locale';
|
2018-10-15 14:42:47 +05:30
|
|
|
import modalMixin from '../../mixins/modal_mixins';
|
2018-12-13 13:39:08 +05:30
|
|
|
import boardsStore from '../../stores/boards_store';
|
2021-03-11 19:13:27 +05:30
|
|
|
import ModalStore from '../../stores/modal_store';
|
|
|
|
import ListsDropdown from './lists_dropdown.vue';
|
2017-08-17 22:00:37 +05:30
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
export default {
|
|
|
|
components: {
|
|
|
|
ListsDropdown,
|
2020-11-24 15:15:51 +05:30
|
|
|
GlButton,
|
2018-11-08 19:23:39 +05:30
|
|
|
},
|
2019-09-30 21:07:59 +05:30
|
|
|
mixins: [modalMixin, footerEEMixin],
|
2017-08-17 22:00:37 +05:30
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
modal: ModalStore.store,
|
2018-12-13 13:39:08 +05:30
|
|
|
state: boardsStore.state,
|
2017-08-17 22:00:37 +05:30
|
|
|
};
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
submitDisabled() {
|
|
|
|
return !ModalStore.selectedCount();
|
|
|
|
},
|
|
|
|
submitText() {
|
|
|
|
const count = ModalStore.selectedCount();
|
2019-09-30 21:07:59 +05:30
|
|
|
if (!count) return __('Add issues');
|
|
|
|
return n__(`Add %d issue`, `Add %d issues`, count);
|
2017-08-17 22:00:37 +05:30
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
2018-11-08 19:23:39 +05:30
|
|
|
buildUpdateRequest(list) {
|
|
|
|
return {
|
|
|
|
add_label_ids: [list.label.id],
|
|
|
|
};
|
|
|
|
},
|
2017-08-17 22:00:37 +05:30
|
|
|
addIssues() {
|
2017-09-10 17:25:29 +05:30
|
|
|
const firstListIndex = 1;
|
|
|
|
const list = this.modal.selectedList || this.state.lists[firstListIndex];
|
2017-08-17 22:00:37 +05:30
|
|
|
const selectedIssues = ModalStore.getSelectedIssues();
|
2021-03-08 18:12:59 +05:30
|
|
|
const issueIds = selectedIssues.map((issue) => issue.id);
|
2018-11-08 19:23:39 +05:30
|
|
|
const req = this.buildUpdateRequest(list);
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
// Post the data to the backend
|
2019-09-30 21:07:59 +05:30
|
|
|
boardsStore.bulkUpdate(issueIds, req).catch(() => {
|
2018-12-13 13:39:08 +05:30
|
|
|
Flash(__('Failed to update issues, please try again.'));
|
2017-08-17 22:00:37 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
selectedIssues.forEach((issue) => {
|
2018-12-13 13:39:08 +05:30
|
|
|
list.removeIssue(issue);
|
|
|
|
list.issuesSize -= 1;
|
2017-08-17 22:00:37 +05:30
|
|
|
});
|
2018-12-13 13:39:08 +05:30
|
|
|
});
|
2017-08-17 22:00:37 +05:30
|
|
|
|
|
|
|
// Add the issues on the frontend
|
2021-03-08 18:12:59 +05:30
|
|
|
selectedIssues.forEach((issue) => {
|
2017-08-17 22:00:37 +05:30
|
|
|
list.addIssue(issue);
|
|
|
|
list.issuesSize += 1;
|
|
|
|
});
|
|
|
|
|
|
|
|
this.toggleModal(false);
|
|
|
|
},
|
|
|
|
},
|
2018-11-08 19:23:39 +05:30
|
|
|
};
|
|
|
|
</script>
|
|
|
|
<template>
|
2019-02-15 15:39:39 +05:30
|
|
|
<footer class="form-actions add-issues-footer">
|
2018-11-08 19:23:39 +05:30
|
|
|
<div class="float-left">
|
2020-11-24 15:15:51 +05:30
|
|
|
<gl-button :disabled="submitDisabled" category="primary" variant="success" @click="addIssues">
|
2018-11-08 19:23:39 +05:30
|
|
|
{{ submitText }}
|
2020-11-24 15:15:51 +05:30
|
|
|
</gl-button>
|
2019-09-30 21:07:59 +05:30
|
|
|
<span class="inline add-issues-footer-to-list">{{ __('to list') }}</span>
|
2019-02-15 15:39:39 +05:30
|
|
|
<lists-dropdown />
|
2018-11-08 19:23:39 +05:30
|
|
|
</div>
|
2020-11-24 15:15:51 +05:30
|
|
|
<gl-button class="float-right" @click="toggleModal(false)">
|
2019-09-30 21:07:59 +05:30
|
|
|
{{ __('Cancel') }}
|
2020-11-24 15:15:51 +05:30
|
|
|
</gl-button>
|
2018-11-08 19:23:39 +05:30
|
|
|
</footer>
|
|
|
|
</template>
|