diff options
9 files changed, 63 insertions, 44 deletions
diff --git a/app/assets/javascripts/boards/components/modal/footer.js.es6 b/app/assets/javascripts/boards/components/modal/footer.js.es6 index e9f400952b7..978900c866a 100644 --- a/app/assets/javascripts/boards/components/modal/footer.js.es6 +++ b/app/assets/javascripts/boards/components/modal/footer.js.es6 @@ -10,13 +10,10 @@ data() { return { store: Store.modal, - disabled: false, }; }, computed: { submitDisabled() { - if (this.disabled) return true; - return !Store.modalSelectedCount(); }, submitText() { @@ -30,15 +27,19 @@ this.store.showAddIssuesModal = false; }, addIssues() { + const list = this.store.selectedList; const issueIds = this.store.issues.filter(issue => issue.selected).map(issue => issue.id); + // Post the data to the backend + gl.boardService.addMultipleIssues(list, issueIds); + + // Add the issues on the frontend issueIds.forEach((id) => { const issue = this.store.issues.filter(issue => issue.id == id)[0]; - this.store.selectedList.addIssue(issue); - this.store.selectedList.issuesSize += 1; + list.addIssue(issue); + list.issuesSize += 1; }); - this.disabled = true; this.hideModal(); }, }, diff --git a/app/assets/javascripts/boards/components/modal/header.js.es6 b/app/assets/javascripts/boards/components/modal/header.js.es6 index 74681fa4bcf..f4c722c0974 100644 --- a/app/assets/javascripts/boards/components/modal/header.js.es6 +++ b/app/assets/javascripts/boards/components/modal/header.js.es6 @@ -18,14 +18,16 @@ 'modal-search': gl.issueBoards.ModalSearch, }, template: ` - <header class="add-issues-header"> - <h2> - Add issues to board - <modal-dismiss></modal-dismiss> - </h2> - <modal-tabs></modal-tabs> - <modal-search></modal-search> - </header> + <div> + <header class="add-issues-header form-actions"> + <h2> + Add issues + <modal-dismiss></modal-dismiss> + </h2> + </header> + <modal-tabs v-if="issues.length"></modal-tabs> + <modal-search v-if="issues.length"></modal-search> + </div> `, }); })(); diff --git a/app/assets/javascripts/boards/components/modal/list.js.es6 b/app/assets/javascripts/boards/components/modal/list.js.es6 index 067a6322bca..e2056f1ada3 100644 --- a/app/assets/javascripts/boards/components/modal/list.js.es6 +++ b/app/assets/javascripts/boards/components/modal/list.js.es6 @@ -21,11 +21,11 @@ }, issues: { handler() { - if (this.activeTab === 'selected') { - this.$nextTick(() => { + this.$nextTick(() => { + if (this.activeTab === 'selected') { listMasonry.layout(); - }); - } + } + }); }, deep: true, } @@ -61,18 +61,7 @@ }, }, mounted() { - gl.boardService.getBacklog() - .then((res) => { - const data = res.json(); - - data.forEach((issueObj) => { - this.issues.push(new ListIssue(issueObj)); - }); - - this.$nextTick(() => { - this.initMasonry(); - }); - }); + this.initMasonry(); }, destroyed() { this.issues = []; @@ -84,11 +73,6 @@ template: ` <section class="add-issues-list"> <div - class="add-issues-list-loading" - v-if="loading"> - <i class="fa fa-spinner fa-spin"></i> - </div> - <div class="add-issues-list-columns list-unstyled" ref="list" v-show="!loading"> @@ -112,11 +96,6 @@ </div> </div> </div> - <p - class="all-issues-selected-empty" - v-if="activeTab == 'selected' && selectedCount == 0"> - You don't have any issues selected, <a href="#" @click="activeTab = 'all'">select some</a>. - </p> </section> `, }); diff --git a/app/assets/javascripts/boards/components/modal/modal.es6 b/app/assets/javascripts/boards/components/modal/modal.es6 index bedd7c9735a..7a15beb10f0 100644 --- a/app/assets/javascripts/boards/components/modal/modal.es6 +++ b/app/assets/javascripts/boards/components/modal/modal.es6 @@ -12,6 +12,16 @@ data() { return Store.modal; }, + mounted() { + gl.boardService.getBacklog() + .then((res) => { + const data = res.json(); + + data.forEach((issueObj) => { + this.issues.push(new ListIssue(issueObj)); + }); + }); + }, components: { 'modal-header': gl.issueBoards.IssuesModalHeader, 'modal-list': gl.issueBoards.ModalList, @@ -23,7 +33,14 @@ v-if="showAddIssuesModal"> <div class="add-issues-container"> <modal-header></modal-header> - <modal-list></modal-list> + <modal-list v-if="issues.length"></modal-list> + <section + class="add-issues-list" + v-if="issues.length == 0"> + <div class="add-issues-list-loading"> + <i class="fa fa-spinner fa-spin"></i> + </div> + </section> <modal-footer></modal-footer> </div> </div> diff --git a/app/assets/javascripts/boards/services/board_service.js.es6 b/app/assets/javascripts/boards/services/board_service.js.es6 index 4625b13d5f3..335950caf10 100644 --- a/app/assets/javascripts/boards/services/board_service.js.es6 +++ b/app/assets/javascripts/boards/services/board_service.js.es6 @@ -13,7 +13,11 @@ class BoardService { generate: { method: 'POST', url: `${root}/${boardId}/lists/generate.json` - } + }, + multiple: { + method: 'POST', + url: `${root}/${boardId}/lists{/id}/multiple` + }, }); this.issue = Vue.resource(`${root}/${boardId}/issues{/id}`, {}); this.issues = Vue.resource(`${root}/${boardId}/lists{/id}/issues`, {}); @@ -75,6 +79,12 @@ class BoardService { getBacklog() { return this.boards.backlog(); } + + addMultipleIssues(list, issue_ids) { + return this.lists.multiple(list.id, { + issue_ids, + }); + } } window.BoardService = BoardService; diff --git a/app/assets/stylesheets/pages/boards.scss b/app/assets/stylesheets/pages/boards.scss index bf1c0d1842b..683ef9f2388 100644 --- a/app/assets/stylesheets/pages/boards.scss +++ b/app/assets/stylesheets/pages/boards.scss @@ -383,6 +383,10 @@ } .add-issues-header { + margin: -25px -15px -5px; + border-top: 0; + border-bottom: 1px solid $border-color; + > h2 { margin: 0; font-size: 18px; @@ -396,6 +400,7 @@ .add-issues-search { display: flex; margin-bottom: 10px; + margin-top: 10px; .btn { margin-left: 10px; diff --git a/app/controllers/projects/boards/lists_controller.rb b/app/controllers/projects/boards/lists_controller.rb index 67e3c9add81..ed65cae82dc 100644 --- a/app/controllers/projects/boards/lists_controller.rb +++ b/app/controllers/projects/boards/lists_controller.rb @@ -50,6 +50,10 @@ module Projects end end + def multiple + head :ok + end + private def authorize_admin_list! diff --git a/app/controllers/projects/boards_controller.rb b/app/controllers/projects/boards_controller.rb index 7a2e2324323..9e699fb9b3b 100644 --- a/app/controllers/projects/boards_controller.rb +++ b/app/controllers/projects/boards_controller.rb @@ -33,7 +33,7 @@ class Projects::BoardsController < Projects::ApplicationController LabelLink.where("label_links.target_type = 'Issue' AND label_links.target_id = issues.id") .where(label_id: board.lists.movable.pluck(:label_id)).limit(1).arel.exists ) - @issues = @issues.page(params[:page]) + @issues = @issues.page(params[:page]).per(50) render json: @issues.as_json( labels: true, diff --git a/config/routes/project.rb b/config/routes/project.rb index 5c33bb4a6ca..afd895a5a1e 100644 --- a/config/routes/project.rb +++ b/config/routes/project.rb @@ -267,13 +267,14 @@ constraints(ProjectUrlConstrainer.new) do resources :boards, only: [:index, :show] do get :backlog, on: :member - + scope module: :boards do resources :issues, only: [:update] resources :lists, only: [:index, :create, :update, :destroy] do collection do post :generate + post :multiple end resources :issues, only: [:index, :create] |