Added blank state
This commit is contained in:
parent
fcc88e52fe
commit
ae0049a8b9
|
@ -17,7 +17,18 @@ $(function () {
|
||||||
ready: function () {
|
ready: function () {
|
||||||
service.all()
|
service.all()
|
||||||
.then((resp) => {
|
.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);
|
BoardsStore.new(board);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -37,4 +37,4 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
Vue.component('board', Board)
|
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);
|
Vue.component('board-delete', BoardDelete);
|
||||||
}());
|
})();
|
||||||
|
|
|
@ -88,4 +88,4 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
Vue.component('board-list', BoardList);
|
Vue.component('board-list', BoardList);
|
||||||
}());
|
})();
|
||||||
|
|
|
@ -30,7 +30,9 @@
|
||||||
return list.id === id;
|
return list.id === id;
|
||||||
});
|
});
|
||||||
|
|
||||||
this.getDoneList().index = this.state.lists.length - 1;
|
if (id !== 'blank') {
|
||||||
|
this.getDoneList().index = this.state.lists.length - 1;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
moveList: function (oldIndex, newIndex) {
|
moveList: function (oldIndex, newIndex) {
|
||||||
const listFrom = _.find(this.state.lists, (list) => {
|
const listFrom = _.find(this.state.lists, (list) => {
|
||||||
|
|
|
@ -34,9 +34,12 @@
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
var clipboard;
|
var clipboard;
|
||||||
clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
|
|
||||||
clipboard.on('success', genericSuccess);
|
if ($('body').attr('data-page') !== 'projects:boards:index') {
|
||||||
return clipboard.on('error', genericError);
|
clipboard = new Clipboard('[data-clipboard-target], [data-clipboard-text]');
|
||||||
|
clipboard.on('success', genericSuccess);
|
||||||
|
return clipboard.on('error', genericError);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
}).call(this);
|
}).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 {
|
.board-list {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
|
@ -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")
|
= 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" }
|
%button.board-search-clear-btn{ type: "button", role: "button", "aria-label" => "Clear search", "@click" => "clearSearch", "v-show" => "query" }
|
||||||
= icon("times", class: "board-search-clear")
|
= 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" }
|
%ul.board-list{ "v-el:list" => true, ":data-board" => "boardId" }
|
||||||
= render "projects/boards/components/card"
|
= 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
|
%h4.card-title
|
||||||
%a{ href: "#", ":title" => "issue.title" }
|
%a{ href: "#", ":title" => "issue.title" }
|
||||||
{{ issue.title }}
|
{{ issue.title }}
|
||||||
|
|
Loading…
Reference in New Issue