diff options
author | Phil Hughes <me@iamphill.com> | 2017-01-24 10:27:41 +0000 |
---|---|---|
committer | Fatih Acet <acetfatih@gmail.com> | 2017-02-03 17:02:43 +0300 |
commit | a132b7d8ce0d962272de5932568a46b64b6dfc5e (patch) | |
tree | 604f29503d77d7317050a7b262977110141c07e8 /app/assets/javascripts/boards/components/issue_card_inner.js.es6 | |
parent | 52ea505126da19717c9137e6bb301f55965eb6e4 (diff) | |
download | gitlab-ce-a132b7d8ce0d962272de5932568a46b64b6dfc5e.tar.gz |
Add issues to boards list
This removes the backlog list & instead creates a modal window that will
list all issues that are not part of a list for easy adding onto the
board
Closes #26205
Diffstat (limited to 'app/assets/javascripts/boards/components/issue_card_inner.js.es6')
-rw-r--r-- | app/assets/javascripts/boards/components/issue_card_inner.js.es6 | 89 |
1 files changed, 89 insertions, 0 deletions
diff --git a/app/assets/javascripts/boards/components/issue_card_inner.js.es6 b/app/assets/javascripts/boards/components/issue_card_inner.js.es6 new file mode 100644 index 00000000000..6a7e9419503 --- /dev/null +++ b/app/assets/javascripts/boards/components/issue_card_inner.js.es6 @@ -0,0 +1,89 @@ +/* global Vue */ +(() => { + const Store = gl.issueBoards.BoardsStore; + + window.gl = window.gl || {}; + window.gl.issueBoards = window.gl.issueBoards || {}; + + gl.issueBoards.IssueCardInner = Vue.extend({ + props: [ + 'issue', 'issueLinkBase', 'list', + ], + methods: { + showLabel(label) { + if (!this.list) return true; + + return !this.list.label || label.id !== this.list.label.id; + }, + filterByLabel(label, e) { + let labelToggleText = label.title; + const labelIndex = Store.state.filters.label_name.indexOf(label.title); + $(e.target).tooltip('hide'); + + if (labelIndex === -1) { + Store.state.filters.label_name.push(label.title); + $('.labels-filter').prepend(`<input type="hidden" name="label_name[]" value="${label.title}" />`); + } else { + Store.state.filters.label_name.splice(labelIndex, 1); + labelToggleText = Store.state.filters.label_name[0]; + $(`.labels-filter input[name="label_name[]"][value="${label.title}"]`).remove(); + } + + const selectedLabels = Store.state.filters.label_name; + if (selectedLabels.length === 0) { + labelToggleText = 'Label'; + } else if (selectedLabels.length > 1) { + labelToggleText = `${selectedLabels[0]} + ${selectedLabels.length - 1} more`; + } + + $('.labels-filter .dropdown-toggle-text').text(labelToggleText); + + Store.updateFiltersUrl(); + }, + }, + template: ` + <div> + <h4 class="card-title"> + <i + class="fa fa-eye-flash" + v-if="issue.confidential"></i> + <a + :href="issueLinkBase + '/' + issue.id" + :title="issue.title"> + {{ issue.title }} + </a> + </h4> + <div class="card-footer"> + <span + class="card-number" + v-if="issue.id"> + #{{issue.id}} + </span> + <a + class="has-tooltip" + :href="issue.assignee.username" + :title="'Assigned to ' + issue.assignee.name" + v-if="issue.assignee" + data-container="body"> + <img + class="avatar avatar-inline s20" + :src="issue.assignee.avatar" + width="20" + height="20" /> + </a> + <button + class="label color-label has-tooltip" + v-for="label in issue.labels" + type="button" + v-if="showLabel(label)" + @click="filterByLabel(label, $event)" + :style="{ backgroundColor: label.color, color: label.textColor }" + :title="label.description" + data-container="body"> + {{ label.title }} + </button> + </div> + </div> + `, + }); +})(); |