diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2018-06-21 13:39:09 +0100 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2018-06-21 13:39:09 +0100 |
commit | decd7d951b6de25c3b06ff84146ce16fd3588e70 (patch) | |
tree | 41d61ef3ec74d84803e7f72c30a148a732197e18 /app/assets | |
parent | 06df012818a292a0c3f6e510acfc8f62cc384547 (diff) | |
download | gitlab-ce-decd7d951b6de25c3b06ff84146ce16fd3588e70.tar.gz |
Moves tabs.js component into a vue file
Diffstat (limited to 'app/assets')
4 files changed, 96 insertions, 94 deletions
diff --git a/app/assets/javascripts/boards/components/modal/header.js b/app/assets/javascripts/boards/components/modal/header.js index 5e511bb8935..cc9848058ca 100644 --- a/app/assets/javascripts/boards/components/modal/header.js +++ b/app/assets/javascripts/boards/components/modal/header.js @@ -1,12 +1,12 @@ import Vue from 'vue'; import modalFilters from './filters'; -import './tabs'; +import modalTabs from './tabs.vue'; import ModalStore from '../../stores/modal_store'; import modalMixin from '../../mixins/modal_mixins'; gl.issueBoards.ModalHeader = Vue.extend({ components: { - 'modal-tabs': gl.issueBoards.ModalTabs, + modalTabs, modalFilters, }, mixins: [modalMixin], diff --git a/app/assets/javascripts/boards/components/modal/tabs.js b/app/assets/javascripts/boards/components/modal/tabs.js deleted file mode 100644 index 9d331de8e22..00000000000 --- a/app/assets/javascripts/boards/components/modal/tabs.js +++ /dev/null @@ -1,46 +0,0 @@ -import Vue from 'vue'; -import ModalStore from '../../stores/modal_store'; -import modalMixin from '../../mixins/modal_mixins'; - -gl.issueBoards.ModalTabs = Vue.extend({ - mixins: [modalMixin], - data() { - return ModalStore.store; - }, - computed: { - selectedCount() { - return ModalStore.selectedCount(); - }, - }, - destroyed() { - this.activeTab = 'all'; - }, - template: ` - <div class="top-area prepend-top-10 append-bottom-10"> - <ul class="nav-links issues-state-filters"> - <li :class="{ 'active': activeTab == 'all' }"> - <a - href="#" - role="button" - @click.prevent="changeTab('all')"> - Open issues - <span class="badge badge-pill"> - {{ issuesCount }} - </span> - </a> - </li> - <li :class="{ 'active': activeTab == 'selected' }"> - <a - href="#" - role="button" - @click.prevent="changeTab('selected')"> - Selected issues - <span class="badge badge-pill"> - {{ selectedCount }} - </span> - </a> - </li> - </ul> - </div> - `, -}); diff --git a/app/assets/javascripts/boards/components/modal/tabs.vue b/app/assets/javascripts/boards/components/modal/tabs.vue new file mode 100644 index 00000000000..d926b080094 --- /dev/null +++ b/app/assets/javascripts/boards/components/modal/tabs.vue @@ -0,0 +1,49 @@ +<script> + import ModalStore from '../../stores/modal_store'; + import modalMixin from '../../mixins/modal_mixins'; + + export default { + mixins: [modalMixin], + data() { + return ModalStore.store; + }, + computed: { + selectedCount() { + return ModalStore.selectedCount(); + }, + }, + destroyed() { + this.activeTab = 'all'; + }, + }; +</script> +<template> + <div class="top-area prepend-top-10 append-bottom-10"> + <ul class="nav-links issues-state-filters"> + <li :class="{ 'active': activeTab == 'all' }"> + <a + href="#" + role="button" + @click.prevent="changeTab('all')" + > + Open issues + <span class="badge badge-pill"> + {{ issuesCount }} + </span> + </a> + </li> + <li :class="{ 'active': activeTab == 'selected' }"> + <a + href="#" + role="button" + @click.prevent="changeTab('selected')" + > + Selected issues + <span class="badge badge-pill"> + {{ selectedCount }} + </span> + </a> + </li> + </ul> + </div> +</template> diff --git a/app/assets/javascripts/boards/components/sidebar/remove_issue.vue b/app/assets/javascripts/boards/components/sidebar/remove_issue.vue index 4ccfe503ef4..806e038a95f 100644 --- a/app/assets/javascripts/boards/components/sidebar/remove_issue.vue +++ b/app/assets/javascripts/boards/components/sidebar/remove_issue.vue @@ -1,62 +1,61 @@ <script> -import Flash from '../../../flash'; -import { __ } from '../../../locale'; + import Vue from 'vue'; + import Flash from '../../../flash'; + import { __ } from '../../../locale'; -const Store = gl.issueBoards.BoardsStore; + const Store = gl.issueBoards.BoardsStore; -export default { - props: { - issue: { - type: Object, - required: true, + export default { + props: { + issue: { + type: Object, + required: true, + }, + list: { + type: Object, + required: true, + }, }, - list: { - type: Object, - required: true, + computed: { + updateUrl() { + return this.issue.path; + }, }, - }, - computed: { - updateUrl() { - return this.issue.path; - }, - }, - methods: { - removeIssue() { - const issue = this.issue; - const lists = issue.getLists(); - const listLabelIds = lists.map(list => list.label.id); + methods: { + removeIssue() { + const issue = this.issue; + const lists = issue.getLists(); + const listLabelIds = lists.map(list => list.label.id); - let labelIds = issue.labels - .map(label => label.id) - .filter(id => !listLabelIds.includes(id)); - if (labelIds.length === 0) { - labelIds = ['']; - } + let labelIds = issue.labels.map(label => label.id).filter(id => !listLabelIds.includes(id)); + if (labelIds.length === 0) { + labelIds = ['']; + } - const data = { - issue: { - label_ids: labelIds, - }, - }; + const data = { + issue: { + label_ids: labelIds, + }, + }; - // Post the remove data - Vue.http.patch(this.updateUrl, data).catch(() => { - Flash(__('Failed to remove issue from board, please try again.')); + // Post the remove data + Vue.http.patch(this.updateUrl, data).catch(() => { + Flash(__('Failed to remove issue from board, please try again.')); - lists.forEach((list) => { - list.addIssue(issue); + lists.forEach(list => { + list.addIssue(issue); + }); }); - }); - // Remove from the frontend store - lists.forEach((list) => { - list.removeIssue(issue); - }); + // Remove from the frontend store + lists.forEach(list => { + list.removeIssue(issue); + }); - Store.detail.issue = {}; + Store.detail.issue = {}; + }, }, - }, -}; + }; </script> <template> <div |