Correctly uses search query in backlog

This commit is contained in:
Phil Hughes 2016-08-08 11:24:57 +01:00
parent ff5fd4eb01
commit e00b56d048
4 changed files with 25 additions and 20 deletions

View file

@ -1,23 +1,25 @@
(() => {
const Board = Vue.extend({
props: {
board: Object,
list: Object,
disabled: Boolean
},
data: function () {
return {
query: '',
filters: BoardsStore.state.filters
};
},
watch: {
'query': function () {
if (this.board.canSearch()) {
this.board.getIssues(true);
if (this.list.canSearch()) {
this.list.filters = this.getFilterData();
this.list.getIssues(true);
}
},
'filters': {
handler: function () {
this.board.getIssues(true);
this.list.getIssues(true);
},
deep: true
}
@ -27,14 +29,14 @@
this.query = '';
},
getFilterData: function () {
const queryData = this.board.canSearch() ? { search: this.query } : {};
const queryData = this.list.canSearch() ? { search: this.query } : {};
return _.extend(queryData, this.filters);
}
},
computed: {
isPreset: function () {
return this.board.type === 'backlog' || this.board.type === 'done' || this.board.type === 'blank';
return this.list.type === 'backlog' || this.list.type === 'done' || this.list.type === 'blank';
}
},
ready: function () {

View file

@ -113,7 +113,9 @@
}
if (listTo.type === 'done' && listFrom.type !== 'backlog') {
_.each(issueLists, list.removeIssue.bind(list));
_.each(issueLists, function (list) {
list.removeIssue(issue);
});
issue.removeLabels(listLabels);
} else {
listFrom.removeIssue(issue);

View file

@ -1,4 +1,5 @@
%board-blank-state{ "inline-template" => true, "v-if" => "board.id == 'blank'" }
%board-blank-state{ "inline-template" => true,
"v-if" => "list.id == 'blank'" }
.board-blank-state
%p
Add the following default lists to your Issue Board with one click:

View file

@ -1,29 +1,29 @@
%board{ "inline-template" => true,
"v-cloak" => true,
"v-for" => "board in state.lists | orderBy 'position'",
":board" => "board",
"v-for" => "list in state.lists | orderBy 'position'",
":list" => "list",
":disabled" => "#{current_user.nil?}" }
.board{ ":class" => "{ 'is-draggable': !isPreset }" }
.board-inner
%header.board-header{ ":class" => "{ 'has-border': board.label }", ":style" => "{ borderTopColor: (board.label ? board.label.color : null) }" }
%header.board-header{ ":class" => "{ 'has-border': list.label }", ":style" => "{ borderTopColor: (list.label ? list.label.color : null) }" }
%h3.board-title.js-board-handle{ ":class" => "{ 'user-can-drag': !disabled }" }
{{ board.title }}
%span.pull-right{ "v-if" => "board.type !== 'blank'" }
{{ board.issues.length }}
{{ list.title }}
%span.pull-right{ "v-if" => "list.type !== 'blank'" }
{{ list.issues.length }}
- if current_user
%board-delete{ "inline-template" => true, "v-if" => "!isPreset", ":board-id" => "board.id" }
%board-delete{ "inline-template" => true, "v-if" => "!isPreset", ":board-id" => "list.id" }
%button.board-delete.has-tooltip.pull-right{ type: "button", title: "Delete list", "aria-label" => "Delete list", data: { placement: "bottom" }, "@click" => "deleteBoard" }
= icon("trash")
.board-inner-container.board-search-container{ "v-if" => "board.canSearch()" }
.board-inner-container.board-search-container{ "v-if" => "list.canSearch()" }
%input.form-control{ type: "text", placeholder: "Search issues", "v-model" => "query", "debounce" => "250" }
= 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,
"v-if" => "board.type !== 'blank'",
":list" => "board",
":issues" => "board.issues",
":loading" => "board.loading",
"v-if" => "list.type !== 'blank'",
":list" => "list",
":issues" => "list.issues",
":loading" => "list.loading",
":disabled" => "disabled",
":issue-link-base" => "'#{namespace_project_issues_path(@project.namespace, @project)}'" }
.board-list-loading.text-center{ "v-if" => "loading" }