Improved code readability
This commit is contained in:
parent
c7b0732c05
commit
94f5d8a98c
9 changed files with 57 additions and 124 deletions
|
@ -27,10 +27,8 @@
|
|||
},
|
||||
watch: {
|
||||
query () {
|
||||
if (this.list.canSearch()) {
|
||||
this.list.filters = this.getFilterData();
|
||||
this.list.getIssues(true);
|
||||
}
|
||||
this.list.filters = this.getFilterData();
|
||||
this.list.getIssues(true);
|
||||
},
|
||||
filters: {
|
||||
handler () {
|
||||
|
@ -41,12 +39,7 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
clearSearch () {
|
||||
this.query = '';
|
||||
},
|
||||
getFilterData () {
|
||||
if (!this.list.canSearch()) return this.filters;
|
||||
|
||||
const filters = this.filters;
|
||||
let queryData = { search: this.query };
|
||||
|
||||
|
@ -55,11 +48,6 @@
|
|||
return queryData;
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isPreset () {
|
||||
return ['backlog', 'done', 'blank'].indexOf(this.list.type) > -1;
|
||||
}
|
||||
},
|
||||
ready () {
|
||||
const options = gl.issueBoards.getBoardSortableDefaultOptions({
|
||||
disabled: this.disabled,
|
||||
|
|
|
@ -17,11 +17,9 @@
|
|||
},
|
||||
methods: {
|
||||
addDefaultLists () {
|
||||
Store.removeBlankState();
|
||||
|
||||
for (let i = 0, labelsLength = this.predefinedLabels.length; i < labelsLength; i++) {
|
||||
const label = this.predefinedLabels[i];
|
||||
this.clearBlankState();
|
||||
|
||||
this.predefinedLabels.forEach((label, i) => {
|
||||
Store.addList({
|
||||
title: label.title,
|
||||
position: i,
|
||||
|
@ -31,27 +29,21 @@
|
|||
color: label.color
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Save the labels
|
||||
gl.boardService
|
||||
.generateDefaultLists()
|
||||
gl.boardService.generateDefaultLists()
|
||||
.then((resp) => {
|
||||
const data = resp.json();
|
||||
|
||||
for (let i = 0, dataLength = data.length; i < dataLength; i++) {
|
||||
const listObj = data[i],
|
||||
list = Store.findList('title', listObj.title);
|
||||
resp.json().forEach((listObj) => {
|
||||
const list = Store.findList('title', listObj.title);
|
||||
|
||||
list.id = listObj.id;
|
||||
list.label.id = listObj.label.id;
|
||||
list.getIssues();
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
clearBlankState () {
|
||||
Store.removeBlankState();
|
||||
}
|
||||
clearBlankState: Store.removeBlankState.bind(Store)
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
|
|
@ -7,8 +7,7 @@
|
|||
list: Object
|
||||
},
|
||||
methods: {
|
||||
deleteBoard (e) {
|
||||
e.stopImmediatePropagation();
|
||||
deleteBoard () {
|
||||
$(this.$el).tooltip('hide');
|
||||
|
||||
if (confirm('Are you sure you want to delete this list?')) {
|
||||
|
|
|
@ -55,32 +55,22 @@
|
|||
},
|
||||
ready () {
|
||||
const options = gl.issueBoards.getBoardSortableDefaultOptions({
|
||||
group: 'issues',
|
||||
sort: false,
|
||||
disabled: this.disabled,
|
||||
onStart: (e) => {
|
||||
const card = this.$refs.issue[e.oldIndex];
|
||||
group: 'issues',
|
||||
sort: false,
|
||||
disabled: this.disabled,
|
||||
onStart: (e) => {
|
||||
const card = this.$refs.issue[e.oldIndex];
|
||||
|
||||
Store.moving.issue = card.issue;
|
||||
Store.moving.list = card.list;
|
||||
},
|
||||
onAdd: (e) => {
|
||||
const fromList = Store.moving.list,
|
||||
issue = Store.moving.issue;
|
||||
|
||||
gl.issueBoards.BoardsStore.moveIssueToList(fromList, this.list, issue);
|
||||
},
|
||||
onRemove (e) {
|
||||
const card = e.item,
|
||||
list = Store.moving.list,
|
||||
issue = Store.moving.issue;
|
||||
|
||||
// Remove the new dom element & let vue add the element
|
||||
card.parentNode.removeChild(card);
|
||||
|
||||
list.removeIssue(issue);
|
||||
}
|
||||
});
|
||||
Store.moving.issue = card.issue;
|
||||
Store.moving.list = card.list;
|
||||
},
|
||||
onAdd: (e) => {
|
||||
gl.issueBoards.BoardsStore.moveIssueToList(Store.moving.list, this.list, Store.moving.issue);
|
||||
},
|
||||
onRemove: (e) => {
|
||||
this.$refs.issue[e.oldIndex].$destroy(true);
|
||||
}
|
||||
});
|
||||
|
||||
if (bp.getBreakpointSize() === 'xs') {
|
||||
options.handle = '.js-card-drag-handle';
|
||||
|
@ -94,9 +84,6 @@
|
|||
this.loadNextPage();
|
||||
}
|
||||
};
|
||||
},
|
||||
beforeDestroy () {
|
||||
this.sortable.destroy();
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
|
|
@ -8,15 +8,14 @@ $(() => {
|
|||
|
||||
$this.glDropdown({
|
||||
data(term, callback) {
|
||||
$.ajax({
|
||||
url: $this.attr('data-labels')
|
||||
}).then((resp) => {
|
||||
callback(resp);
|
||||
});
|
||||
$.get($this.attr('data-labels'))
|
||||
.then((resp) => {
|
||||
callback(resp);
|
||||
});
|
||||
},
|
||||
renderRow (label) {
|
||||
const active = Store.findList('title', label.title),
|
||||
$li = $('<li />',),
|
||||
$li = $('<li />'),
|
||||
$a = $('<a />', {
|
||||
class: (active ? `is-active js-board-list-${active.id}` : ''),
|
||||
text: label.title,
|
||||
|
|
|
@ -3,17 +3,15 @@ class ListIssue {
|
|||
this.id = obj.iid;
|
||||
this.title = obj.title;
|
||||
this.confidential = obj.confidential;
|
||||
this.labels = [];
|
||||
|
||||
if (obj.assignee) {
|
||||
this.assignee = new ListUser(obj.assignee);
|
||||
}
|
||||
|
||||
this.labels = [];
|
||||
|
||||
for (let i = 0, objLabelsLength = obj.labels.length; i < objLabelsLength; i++) {
|
||||
const label = obj.labels[i];
|
||||
obj.labels.forEach((label) => {
|
||||
this.labels.push(new ListLabel(label));
|
||||
}
|
||||
});
|
||||
|
||||
this.priority = this.labels.reduce((max, label) => {
|
||||
return (label.priority < max) ? label.priority : max;
|
||||
|
@ -21,39 +19,24 @@ class ListIssue {
|
|||
}
|
||||
|
||||
addLabel (label) {
|
||||
if (label) {
|
||||
const hasLabel = this.findLabel(label);
|
||||
|
||||
if (!hasLabel) {
|
||||
this.labels.push(new ListLabel(label));
|
||||
}
|
||||
if (!this.findLabel(label)) {
|
||||
this.labels.push(new ListLabel(label));
|
||||
}
|
||||
}
|
||||
|
||||
findLabel (findLabel) {
|
||||
return this.labels.filter((label) => {
|
||||
return label.title === findLabel.title;
|
||||
})[0];
|
||||
return this.labels.filter( label => label.title === findLabel.title )[0];
|
||||
}
|
||||
|
||||
removeLabel (removeLabel) {
|
||||
if (removeLabel) {
|
||||
this.labels = this.labels.filter((label) => {
|
||||
return removeLabel.title !== label.title;
|
||||
});
|
||||
}
|
||||
this.labels = this.labels.filter( label => removeLabel.title !== label.title );
|
||||
}
|
||||
|
||||
removeLabels (labels) {
|
||||
for (let i = 0, labelsLength = labels.length; i < labelsLength; i++) {
|
||||
const label = labels[i];
|
||||
this.removeLabel(label);
|
||||
}
|
||||
labels.forEach(this.removeLabel.bind(this));
|
||||
}
|
||||
|
||||
getLists () {
|
||||
return gl.issueBoards.BoardsStore.state.lists.filter((list) => {
|
||||
return list.findIssue(this.id);
|
||||
});
|
||||
return gl.issueBoards.BoardsStore.state.lists.filter( list => list.findIssue(this.id) );
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,6 +5,7 @@ class List {
|
|||
this.position = obj.position;
|
||||
this.title = obj.title;
|
||||
this.type = obj.list_type;
|
||||
this.preset = ['backlog', 'done', 'blank'].indexOf(this.type) > -1;
|
||||
this.filters = gl.issueBoards.BoardsStore.state.filters;
|
||||
this.page = 1;
|
||||
this.loading = true;
|
||||
|
@ -21,9 +22,7 @@ class List {
|
|||
}
|
||||
|
||||
guid() {
|
||||
const s4 = () => {
|
||||
return Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
|
||||
}
|
||||
const s4 = () => Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1);
|
||||
return `${s4()}${s4()}-${s4()}-${s4()}-${s4()}-${s4()}${s4()}${s4()}`;
|
||||
}
|
||||
|
||||
|
@ -72,9 +71,7 @@ class List {
|
|||
Object.keys(filters).forEach((key) => { data[key] = filters[key]; });
|
||||
|
||||
if (this.label) {
|
||||
data.label_name = data.label_name.filter((label) => {
|
||||
return label !== this.label.title;
|
||||
});
|
||||
data.label_name = data.label_name.filter( label => label !== this.label.title );
|
||||
}
|
||||
|
||||
if (emptyIssues) {
|
||||
|
@ -95,10 +92,9 @@ class List {
|
|||
}
|
||||
|
||||
createIssues (data) {
|
||||
for (let i = 0, dataLength = data.length; i < dataLength; i++) {
|
||||
const issueObj = data[i];
|
||||
data.forEach((issueObj) => {
|
||||
this.issues.push(new ListIssue(issueObj));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
addIssue (issue, listFrom) {
|
||||
|
@ -110,9 +106,7 @@ class List {
|
|||
}
|
||||
|
||||
findIssue (id) {
|
||||
return this.issues.filter((issue) => {
|
||||
return issue.id === id;
|
||||
})[0];
|
||||
return this.issues.filter( issue => issue.id === id )[0];
|
||||
}
|
||||
|
||||
removeIssue (removeIssue) {
|
||||
|
|
|
@ -10,36 +10,30 @@ class BoardService {
|
|||
});
|
||||
this.issue = Vue.resource(`${root}/issues{/id}`, {});
|
||||
this.issues = Vue.resource(`${root}/lists{/id}/issues`, {});
|
||||
}
|
||||
|
||||
setCSRF () {
|
||||
Vue.http.headers.common['X-CSRF-Token'] = $.rails.csrfToken();
|
||||
Vue.http.interceptors.push((request, next) => {
|
||||
request.headers['X-CSRF-Token'] = $.rails.csrfToken();
|
||||
next();
|
||||
});
|
||||
}
|
||||
|
||||
all () {
|
||||
this.setCSRF();
|
||||
return this.lists.get();
|
||||
}
|
||||
|
||||
generateDefaultLists () {
|
||||
this.setCSRF();
|
||||
|
||||
return this.lists.generate({});
|
||||
}
|
||||
|
||||
createList (labelId) {
|
||||
this.setCSRF();
|
||||
|
||||
createList (label_id) {
|
||||
return this.lists.save({}, {
|
||||
list: {
|
||||
label_id: labelId
|
||||
label_id
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateList (id, position) {
|
||||
this.setCSRF();
|
||||
|
||||
return this.lists.update({ id }, {
|
||||
list: {
|
||||
position
|
||||
|
@ -48,15 +42,12 @@ class BoardService {
|
|||
}
|
||||
|
||||
destroyList (id) {
|
||||
this.setCSRF();
|
||||
|
||||
return this.lists.delete({ id });
|
||||
}
|
||||
|
||||
getIssuesForList (id, filter = {}) {
|
||||
let data = { id };
|
||||
Object.keys(filter).forEach((key) => { data[key] = filter[key]; });
|
||||
this.setCSRF();
|
||||
|
||||
return this.issues.get(data);
|
||||
}
|
||||
|
|
|
@ -6,26 +6,26 @@
|
|||
":disabled" => "disabled",
|
||||
":issue-link-base" => "issueLinkBase",
|
||||
"track-by" => "_uid" }
|
||||
.board{ ":class" => "{ 'is-draggable': !isPreset }",
|
||||
.board{ ":class" => "{ 'is-draggable': !list.preset }",
|
||||
":data-id" => "list.id" }
|
||||
.board-inner
|
||||
%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 && !isPreset) }" }
|
||||
= icon("align-justify", class: "board-mobile-handle js-board-drag-handle", "v-if" => "(!disabled && !isPreset)")
|
||||
%h3.board-title.js-board-handle{ ":class" => "{ 'user-can-drag': (!disabled && !list.preset) }" }
|
||||
= icon("align-justify", class: "board-mobile-handle js-board-drag-handle", "v-if" => "(!disabled && !list.preset)")
|
||||
{{ list.title }}
|
||||
%span.pull-right{ "v-if" => "list.type !== 'blank'" }
|
||||
{{ list.issues.length }}
|
||||
- if can?(current_user, :admin_list, @project)
|
||||
%board-delete{ "inline-template" => true,
|
||||
":list" => "list",
|
||||
"v-if" => "!isPreset && list.id" }
|
||||
"v-if" => "!list.preset && list.id" }
|
||||
%button.board-delete.has-tooltip.pull-right{ type: "button", title: "Delete list", "aria-label" => "Delete list", data: { placement: "bottom" }, "@click.stop" => "deleteBoard" }
|
||||
= icon("trash")
|
||||
= icon("spinner spin", class: "board-header-loading-spinner pull-right", "v-show" => "list.loadingMore")
|
||||
.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" }
|
||||
%button.board-search-clear-btn{ type: "button", role: "button", "aria-label" => "Clear search", "@click" => "query = ''", "v-show" => "query" }
|
||||
= icon("times", class: "board-search-clear")
|
||||
%board-list{ "inline-template" => true,
|
||||
"v-if" => "list.type !== 'blank'",
|
||||
|
|
Loading…
Reference in a new issue