Added blank state
This commit is contained in:
parent
fcc88e52fe
commit
ae0049a8b9
11 changed files with 79 additions and 10 deletions
|
@ -17,7 +17,18 @@ $(function () {
|
|||
ready: function () {
|
||||
service.all()
|
||||
.then((resp) => {
|
||||
resp.json().forEach((board) => {
|
||||
const boards = resp.json();
|
||||
|
||||
// Add blank state board
|
||||
if (boards.length === 2) {
|
||||
boards.splice(1, 0, {
|
||||
id: 'blank',
|
||||
title: 'Welcome to your Issue Board!',
|
||||
index: 1
|
||||
});
|
||||
}
|
||||
|
||||
boards.forEach((board) => {
|
||||
BoardsStore.new(board);
|
||||
});
|
||||
});
|
||||
|
|
|
@ -37,4 +37,4 @@
|
|||
});
|
||||
|
||||
Vue.component('board', Board)
|
||||
}());
|
||||
})();
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
(() => {
|
||||
const BoardBlankState = Vue.extend({
|
||||
methods: {
|
||||
addDefaultLists: function () {
|
||||
|
||||
},
|
||||
clearBlankState: function () {
|
||||
BoardsStore.removeList('blank');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('board-blank-state', BoardBlankState);
|
||||
})();
|
|
@ -15,4 +15,4 @@
|
|||
});
|
||||
|
||||
Vue.component('board-delete', BoardDelete);
|
||||
}());
|
||||
})();
|
||||
|
|
|
@ -88,4 +88,4 @@
|
|||
});
|
||||
|
||||
Vue.component('board-list', BoardList);
|
||||
}());
|
||||
})();
|
||||
|
|
|
@ -30,7 +30,9 @@
|
|||
return list.id === id;
|
||||
});
|
||||
|
||||
if (id !== 'blank') {
|
||||
this.getDoneList().index = this.state.lists.length - 1;
|
||||
}
|
||||
},
|
||||
moveList: function (oldIndex, newIndex) {
|
||||
const listFrom = _.find(this.state.lists, (list) => {
|
||||
|
|
|
@ -34,9 +34,12 @@
|
|||
|
||||
$(function() {
|
||||
var clipboard;
|
||||
|
||||
if ($('body').attr('data-page') !== 'projects:boards:index') {
|
||||
clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
|
||||
clipboard.on('success', genericSuccess);
|
||||
return clipboard.on('error', genericError);
|
||||
}
|
||||
});
|
||||
|
||||
}).call(this);
|
||||
|
|
|
@ -137,6 +137,30 @@
|
|||
}
|
||||
}
|
||||
|
||||
.board-blank-state {
|
||||
height: 100%;
|
||||
padding: $gl-padding;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.board-blank-state-list {
|
||||
list-style: none;
|
||||
|
||||
> li:not(:last-child) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.label-color {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-right: 3px;
|
||||
border-radius: $border-radius-default;
|
||||
}
|
||||
}
|
||||
|
||||
.board-list {
|
||||
flex: 1;
|
||||
margin: 0;
|
||||
|
|
14
app/views/projects/boards/components/_blank_state.html.haml
Normal file
14
app/views/projects/boards/components/_blank_state.html.haml
Normal file
|
@ -0,0 +1,14 @@
|
|||
%board-blank-state{ "inline-template" => true, "v-if" => "board.id == 'blank'" }
|
||||
.board-blank-state
|
||||
%p
|
||||
Add the following default lists to your Issue Board with one click:
|
||||
%ul.board-blank-state-list
|
||||
%li
|
||||
%span.label-color{ style: "background-color: red;" }
|
||||
Development
|
||||
%p
|
||||
Starting out with the default set of lists will get you right on the way to making the most of your board.
|
||||
%button.btn.btn-create.btn-inverted.btn-block{ type: "button", "@click" => "addDefaultLists" }
|
||||
Add default lists
|
||||
%button.btn.btn-default.btn-block{ type: "button", "@click" => "clearBlankState" }
|
||||
Nevermind, i'll use my own
|
|
@ -14,6 +14,7 @@
|
|||
= icon("search", class: "board-search-icon", "v-show" => "!query")
|
||||
%button.board-search-clear-btn{ type: "button", role: "button", "aria-label" => "Clear search", "@click" => "clearSearch", "v-show" => "query" }
|
||||
= icon("times", class: "board-search-clear")
|
||||
%board-list{ "inline-template" => true, ":board-id" => "board.id", ":issues" => "board.issues", ":disabled" => "#{current_user.nil?}", ":query" => "query", ":filters" => "filters" }
|
||||
%board-list{ "inline-template" => true, "v-if" => "board.id != 'blank'", ":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" }
|
||||
= render "projects/boards/components/card"
|
||||
= render "projects/boards/components/blank_state"
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
%li.card{ ":data-issue" => "issue.id", "v-for" => "issue in issues | filterBy query in 'title' | filterBy customFilter" }
|
||||
%li.card{ ":data-issue" => "issue.id", "v-for" => "issue in issues | filterBy query in 'title' | filterBy customFilter", "track-by" => "id" }
|
||||
%h4.card-title
|
||||
%a{ href: "#", ":title" => "issue.title" }
|
||||
{{ issue.title }}
|
||||
|
|
Loading…
Reference in a new issue