BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Commit ff7bab37 by Phil Hughes
Options

When moving to done & the issue belongs to more than 1 board it asks if user…

When moving to done & the issue belongs to more than 1 board it asks if user wants to remove from all the boards Can filter issues by author, assignee & milestones
parent f330585a
Showing with 150 additions and 19 deletions
app/assets/javascripts/boards/boards_bundle.js.coffee
......@@ -11,9 +11,9 @@ $ =>
new Vue
el: '#board-app'
data:
boards: BoardsStore.state
state: BoardsStore.state
ready: ->
service
.all()
.then (resp) ->
BoardsStore.state.push(board) for board in resp.data
BoardsStore.state.boards.push(board) for board in resp.data
app/assets/javascripts/boards/components/board.js.coffee
......@@ -2,7 +2,7 @@ Board = Vue.extend
props:
board: Object
data: ->
dragging: BoardsStore.dragging
filters: BoardsStore.state.filters
methods:
clearSearch: ->
this.query = ''
......
app/assets/javascripts/boards/components/board_delete.js.coffee 0 → 100644
BoardDelete = Vue.extend
props:
boardId: Number
Vue.component 'board-delete', BoardDelete
app/assets/javascripts/boards/components/board_list.js.coffee
......@@ -2,8 +2,38 @@ BoardList = Vue.extend
props:
disabled: Boolean
boardId: [Number, String]
filters: Object
issues: Array
query: String
data: ->
scrollOffset: 20
loadMore: false
computed:
newDone: -> BoardsStore.state.done
methods:
listHeight: -> this.$els.list.getBoundingClientRect().height
scrollHeight: -> this.$els.list.scrollHeight
scrollTop: -> this.$els.list.scrollTop + this.listHeight()
loadFromLastId: ->
this.loadMore = true
setTimeout =>
this.loadMore = false
, 2000
customFilter: (issue) ->
returnIssue = issue
if this.filters.author?.id
if not issue.author? or issue.author?.id != this.filters.author.id
returnIssue = null
if this.filters.assignee?.id
if not issue.assignee? or issue.assignee?.id != this.filters.assignee.id
returnIssue = null
if this.filters.milestone?.id
if not issue.milestone? or issue.milestone?.id != this.filters.milestone.id
returnIssue = null
return returnIssue
ready: ->
Sortable.create this.$els.list,
group: 'issues'
......@@ -26,4 +56,9 @@ BoardList = Vue.extend
onUpdate: (e) ->
console.log e.newIndex, e.oldIndex
# Scroll event on list to load more
this.$els.list.onscroll = =>
if (this.scrollTop() > this.scrollHeight() - this.scrollOffset) and !this.loadMore
this.loadFromLastId()
Vue.component('board-list', BoardList)
app/assets/javascripts/boards/components/issue_done.js.coffee 0 → 100644
IssueDone = Vue.extend
props:
done: Object
Vue.component('issue-done', IssueDone)
app/assets/javascripts/boards/stores/boards_store.js.coffee
@BoardsStore =
state: []
state:
boards: []
done: {}
filters:
author: {}
assignee: {}
milestone: {}
moveBoard: (oldIndex, newIndex) ->
boardFrom = _.find BoardsStore.state, (board) ->
boardFrom = _.find BoardsStore.state.boards, (board) ->
board.index is oldIndex
service.updateBoard(boardFrom.id, newIndex)
boardTo = _.find BoardsStore.state, (board) ->
boardTo = _.find BoardsStore.state.boards, (board) ->
board.index is newIndex
boardFrom.index = newIndex
......@@ -15,12 +21,13 @@
else
boardTo.index++
moveCardToBoard: (boardFromId, boardToId, issueId, toIndex) ->
boardFrom = _.find BoardsStore.state, (board) ->
boardFrom = _.find BoardsStore.state.boards, (board) ->
board.id is boardFromId
boardTo = _.find BoardsStore.state, (board) ->
boardTo = _.find BoardsStore.state.boards, (board) ->
board.id is boardToId
issue = _.find boardFrom.issues, (issue) ->
issue.id is issueId
issueBoards = BoardsStore.getBoardsForIssue(issue)
# Remove the issue from old board
boardFrom.issues = _.reject boardFrom.issues, (issue) ->
......@@ -29,13 +36,22 @@
# Add to new boards issues
boardTo.issues.splice(toIndex, 0, issue)
# If going to done - remove label
if boardTo.id is 'done' and boardFrom.id != 'backlog'
if boardTo.id is 'done'
Vue.set(BoardsStore.state.done, 'board', boardFrom)
Vue.set(BoardsStore.state.done, 'issue', issue)
Vue.set(BoardsStore.state.done, 'boards', issueBoards)
else if boardTo.id is 'done' and boardFrom.id != 'backlog'
issue.labels = _.reject issue.labels, (label) ->
label.title is boardFrom.title
else if boardTo.label?
foundLabel = _.find issue.labels, (label) ->
label.title is boardTo.label.title
else
if boardTo.label?
foundLabel = _.find issue.labels, (label) ->
label.title is boardTo.label.title
unless foundLabel?
issue.labels.push(boardTo.label)
unless foundLabel?
issue.labels.push(boardTo.label)
getBoardsForIssue: (issue) ->
_.filter BoardsStore.state.boards, (board) ->
foundIssue = _.find board.issues, (boardIssue) ->
issue?.id == boardIssue?.id
foundIssue?
app/assets/stylesheets/pages/boards.scss
......@@ -33,6 +33,7 @@
.board {
min-width: 400px;
max-width: 400px;
height: 100%;
padding-right: ($gl-padding / 2);
padding-left: ($gl-padding / 2);
......@@ -103,11 +104,27 @@
}
}
.board-delete {
margin-right: 10px;
padding: 0;
color: $gray-darkest;
background-color: transparent;
border: 0;
&:hover {
color: $gl-link-color;
}
}
.board-list {
flex: 1;
margin: 0;
padding: 5px;
overflow: scroll;
&.is-marking-done {
flex: 0 0 auto;
}
}
.is-ghost {
......@@ -154,3 +171,37 @@
margin-right: 8px;
font-weight: 500;
}
.board-done {
flex: 1;
padding: 10px 18px;
color: #8c8c8c;
background-color: #fff;
border-top: 1px solid $border-color;
> p {
margin: 0;
font-size: 1em;
}
}
.board-done-label-list {
margin: 10px 0 10px 30px;
padding: 0;
color: #333;
list-style: none;
> li:not(:last-child) {
margin-bottom: 5px;
}
.label {
display: inline-block;
position: relative;
top: 2px;
width: 16px;
height: 16px;
margin-right: 5px;
border-radius: $border-radius-default;
}
}
app/views/projects/boards/components/_board.html.haml
%board{ "inline-template" => true, "v-cloak" => true, "v-for" => "board in boards | orderBy 'index'", ":board" => "board" }
%board{ "inline-template" => true, "v-cloak" => true, "v-for" => "board in state.boards | orderBy 'index'", ":board" => "board" }
.board{ ":class" => "{ 'is-draggable': !isPreset }" }
.board-inner
%header.board-inner-container.board-header{ ":class" => "{ 'has-border': board.label }", ":style" => "{ borderTopColor: board.label.backgroundColor }" }
......@@ -6,6 +6,11 @@
{{ board.title }}
%span.pull-right
{{ board.issues.length }}
%board-delete{ "inline-template" => true, "v-if" => "!isPreset" }
%button.board-delete.has-tooltip.pull-right{ type: "button", title: "Delete board", data: { placement: "bottom" } }
%span.sr-only
Delete board
= icon("trash")
.board-inner-container.board-search-container{ "v-if" => "board.search" }
%input.form-control{ type: "text", placeholder: "Search issues", "v-model" => "query" }
= icon("search", class: "board-search-icon", "v-show" => "!query")
......@@ -13,6 +18,20 @@
%span.sr-only
Clear search
= icon("times", class: "board-search-clear")
%board-list{ "inline-template" => true, ":board-id" => "board.id", ":issues" => "board.issues", ":disabled" => "#{current_user.nil?}", ":query" => "query" }
%ul.board-list{ "v-el:list" => true, ":data-board" => "boardId" }
%board-list{ "inline-template" => true, ":board-id" => "board.id", ":issues" => "board.issues", ":disabled" => "#{current_user.nil?}", ":query" => "query", ":filters" => "filters" }
%ul.board-list{ "v-el:list" => true, ":data-board" => "boardId", ":class" => "{ 'is-marking-done': boardId == 'done' && newDone.board }" }
= render "projects/boards/components/card"
%issue-done{ "inline-template" => true, ":done" => "newDone", "v-if" => "boardId == 'done' && newDone.board" }
.board-done
%p
This issue is currently in the following lists:
%ul.board-done-label-list
%li{ "v-for" => "board in done.boards" }
%span.label{ ":style" => "{ 'background-color': board.label.backgroundColor, 'color': board.label.color }" }
{{ board.title }}
%p
Moving it to Done will remove it from all lists and close the issue.
%button.btn.btn-gray.btn-block.prepend-top-10{ type: "button" }
Remove from all lists and close
%button.btn.btn-gray.btn-block{ type: "button" }
Remove from {{ done.board.title }} list
app/views/projects/boards/components/_card.html.haml
%li.card{ ":data-issue" => "issue.id", "v-for" => "issue in issues | filterBy query in 'title'" }
%li.card{ ":data-issue" => "issue.id", "v-for" => "issue in issues | filterBy query in 'title' | filterBy customFilter" }
%h4.card-title
%a{ href: "#", ":title" => "issue.title" }
{{ issue.title }}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment