fixes #28: expansion for long attendee notes
This commit is contained in:
parent
47a7fd4f1f
commit
46034820ba
1 changed files with 15 additions and 2 deletions
|
@ -3,7 +3,7 @@
|
||||||
<md-icon>person</md-icon>
|
<md-icon>person</md-icon>
|
||||||
<div v-if="!edit" class="md-list-text-container">
|
<div v-if="!edit" class="md-list-text-container">
|
||||||
<span>{{ attendee.name }}</span>
|
<span>{{ attendee.name }}</span>
|
||||||
<vue-markdown v-if="attendee.notes" class="attendee-notes" :source="attendee.notes" :break="false"></vue-markdown>
|
<vue-markdown v-if="attendee.notes" ref="attendeeNotes" @click.native="toggleNotes()" class="attendee-notes" :source="attendee.notes" :break="false"></vue-markdown>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="edit">
|
<div v-if="edit">
|
||||||
<md-input-container md-inline>
|
<md-input-container md-inline>
|
||||||
|
@ -45,7 +45,8 @@ export default {
|
||||||
|
|
||||||
data: function () {
|
data: function () {
|
||||||
return {
|
return {
|
||||||
edit: false
|
edit: false,
|
||||||
|
expandedNote: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -95,6 +96,18 @@ export default {
|
||||||
}).then((json) => {
|
}).then((json) => {
|
||||||
this.$emit('updated');
|
this.$emit('updated');
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
toggleNotes() {
|
||||||
|
if (!this.expandedNote) {
|
||||||
|
$(this.$refs.attendeeNotes.$el).find('p').css('text-overflow', 'initial');
|
||||||
|
$(this.$refs.attendeeNotes.$el).find('p').css('white-space', 'initial');
|
||||||
|
this.expandedNote = true;
|
||||||
|
} else {
|
||||||
|
$(this.$refs.attendeeNotes.$el).find('p').css('text-overflow', 'ellipsis');
|
||||||
|
$(this.$refs.attendeeNotes.$el).find('p').css('white-space', 'nowrap');
|
||||||
|
this.expandedNote = false;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue