diff options
author | George Tsiolis <tsiolis.g@gmail.com> | 2018-02-27 19:44:10 +0200 |
---|---|---|
committer | George Tsiolis <tsiolis.g@gmail.com> | 2018-03-09 20:04:57 +0200 |
commit | b3152bf245611d71416ac85371ad1245d6702daa (patch) | |
tree | 353fa2c4ea410010708e4c9073d815613afd8491 /app/assets/javascripts/sidebar/components/assignees/assignee_title.vue | |
parent | 0dea3dc85117e7fccfb36e31bdb5dd6cedb5dbad (diff) | |
download | gitlab-ce-b3152bf245611d71416ac85371ad1245d6702daa.tar.gz |
Move AssigneeTitle vue component
Diffstat (limited to 'app/assets/javascripts/sidebar/components/assignees/assignee_title.vue')
-rw-r--r-- | app/assets/javascripts/sidebar/components/assignees/assignee_title.vue | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue new file mode 100644 index 00000000000..5eeb2a41bae --- /dev/null +++ b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue @@ -0,0 +1,64 @@ +<script> +export default { + name: 'AssigneeTitle', + props: { + loading: { + type: Boolean, + required: false, + default: false, + }, + numberOfAssignees: { + type: Number, + required: true, + }, + editable: { + type: Boolean, + required: true, + }, + showToggle: { + type: Boolean, + required: false, + default: false, + }, + }, + computed: { + assigneeTitle() { + const assignees = this.numberOfAssignees; + return assignees > 1 ? `${assignees} Assignees` : 'Assignee'; + }, + }, +}; +</script> +<template> + <div class="title hide-collapsed"> + {{ assigneeTitle }} + <i + v-if="loading" + aria-hidden="true" + class="fa fa-spinner fa-spin block-loading" + > + + </i> + <a + v-if="editable" + class="js-sidebar-dropdown-toggle edit-link pull-right" + href="#" + > + {{ __('Edit') }} + </a> + <a + v-if="showToggle" + aria-label="Toggle sidebar" + class="gutter-toggle pull-right js-sidebar-toggle" + href="#" + role="button" + > + <i + aria-hidden="true" + data-hidden="true" + class="fa fa-angle-double-right" + > + </i> + </a> + </div> +</template> |