Commit acd86c12 authored by Phil Hughes's avatar Phil Hughes Committed by Fatih Acet

Search bar now returns data

Selected data is added into a different array
parent 38d84c13
......@@ -28,7 +28,7 @@
},
addIssues() {
const list = this.store.selectedList;
const issueIds = this.store.issues.filter(issue => issue.selected).map(issue => issue.id);
const issueIds = this.store.selectedIssues.map(issue => issue.id);
// Post the data to the backend
gl.boardService.addMultipleIssues(list, issueIds);
......
......@@ -25,8 +25,8 @@
<modal-dismiss></modal-dismiss>
</h2>
</header>
<modal-tabs v-if="issues.length"></modal-tabs>
<modal-search v-if="issues.length"></modal-search>
<modal-tabs v-if="!loading"></modal-tabs>
<modal-search v-if="!loading"></modal-search>
</div>
`,
});
......
......@@ -22,9 +22,7 @@
issues: {
handler() {
this.$nextTick(() => {
if (this.activeTab === 'selected') {
listMasonry.layout();
}
});
},
deep: true,
......@@ -37,12 +35,26 @@
selectedCount() {
return Store.modalSelectedCount();
},
loopIssues() {
if (this.activeTab === 'all') {
return this.issues;
}
return this.selectedIssues;
},
},
methods: {
toggleIssue(issueObj) {
const issue = issueObj;
issue.selected = !issue.selected;
if (issue.selected) {
this.selectedIssues.push(issue);
} else {
// Remove this issue
const index = this.selectedIssues.indexOf(issue);
this.selectedIssues.splice(index, 1);
}
},
showIssue(issue) {
if (this.activeTab === 'all') return true;
......@@ -64,7 +76,6 @@
this.initMasonry();
},
destroyed() {
this.issues = [];
this.destroyMasonry();
},
components: {
......@@ -77,7 +88,7 @@
ref="list"
v-show="!loading">
<div
v-for="issue in issues"
v-for="issue in loopIssues"
v-if="showIssue(issue)"
class="card-parent">
<div
......
......@@ -12,16 +12,41 @@
data() {
return Store.modal;
},
watch: {
searchTerm() {
this.searchOperation();
},
},
mounted() {
gl.boardService.getBacklog()
.then((res) => {
this.loading = true;
this.loadIssues()
.then(() => {
this.loading = false;
});
},
methods: {
searchOperation: _.debounce(function() {
this.loadIssues();
}, 500),
loadIssues() {
return gl.boardService.getBacklog({
search: this.searchTerm,
}).then((res) => {
const data = res.json();
this.issues = [];
data.forEach((issueObj) => {
this.issues.push(new ListIssue(issueObj));
const issue = new ListIssue(issueObj);
const foundSelectedIssue = this.selectedIssues
.filter(filteredIssue => filteredIssue.id === issue.id)[0];
issue.selected = foundSelectedIssue !== undefined;
this.issues.push(issue);
});
});
},
},
components: {
'modal-header': gl.issueBoards.IssuesModalHeader,
'modal-list': gl.issueBoards.ModalList,
......@@ -33,10 +58,10 @@
v-if="showAddIssuesModal">
<div class="add-issues-container">
<modal-header></modal-header>
<modal-list v-if="issues.length"></modal-list>
<modal-list v-if="!loading"></modal-list>
<section
class="add-issues-list"
v-if="issues.length == 0">
v-if="loading">
<div class="add-issues-list-loading">
<i class="fa fa-spinner fa-spin"></i>
</div>
......
......@@ -24,7 +24,17 @@
this.issues.forEach((issue) => {
const issueUpdate = issue;
if (issueUpdate.selected !== select) {
issueUpdate.selected = select;
if (select) {
this.selectedIssues.push(issueUpdate);
} else {
const index = this.selectedIssues.indexOf(issue);
this.selectedIssues.splice(index, 1);
}
}
});
},
},
......@@ -35,7 +45,8 @@
<input
placeholder="Search issues..."
class="form-control"
type="search" />
type="search"
v-model="searchTerm" />
<button
type="button"
class="btn btn-success btn-inverted"
......
......@@ -76,8 +76,8 @@ class BoardService {
});
}
getBacklog() {
return this.boards.backlog();
getBacklog(data) {
return this.boards.backlog(data);
}
addMultipleIssues(list, issue_ids) {
......
......@@ -14,9 +14,12 @@
},
modal: {
issues: [],
selectedIssues: [],
showAddIssuesModal: false,
activeTab: 'all',
selectedList: {}
selectedList: {},
searchTerm: '',
loading: false,
},
moving: {
issue: {},
......@@ -40,15 +43,10 @@
},
new (listObj) {
const list = this.addList(listObj);
const backlogList = this.findList('type', 'backlog', 'backlog');
list
.save()
.then(() => {
// Remove any new issues from the backlog
// as they will be visible in the new list
list.issues.forEach(backlogList.removeIssue.bind(backlogList));
this.state.lists = _.sortBy(this.state.lists, 'position');
});
this.removeBlankState();
......@@ -58,7 +56,7 @@
},
shouldAddBlankState () {
// Decide whether to add the blank state
return !(this.state.lists.filter(list => list.type !== 'backlog' && list.type !== 'done')[0]);
return !(this.state.lists.filter(list => list.type !== 'done')[0]);
},
addBlankState () {
if (!this.shouldAddBlankState() || this.welcomeIsHidden() || this.disabled) return;
......@@ -108,7 +106,7 @@
listTo.addIssue(issue, listFrom, newIndex);
}
if (listTo.type === 'done' && listFrom.type !== 'backlog') {
if (listTo.type === 'done') {
issueLists.forEach((list) => {
list.removeIssue(issue);
});
......@@ -128,15 +126,7 @@
history.pushState(null, null, `?${$.param(this.state.filters)}`);
},
modalSelectedCount() {
let count = 0;
this.modal.issues.forEach((issue) => {
if (issue.selected) {
count += 1;
}
});
return count;
return this.modal.selectedIssues.length;
},
};
})();
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