alberanid/ibt2
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

#7: notes for attendees

Browse source
This commit is contained in:
Davide Alberani 2017-01-23 23:47:28 +01:00
parent dc6db6b6b0
commit 4a52f37333
2 changed files with 89 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
src/Attendee.vue
View file

@ -1,12 +1,23 @@
<template>
<md-list-item class="attendee-list-item" :key="attendee._id">
<md-list-item class="attendee-list-item md-double-line" :key="attendee._id">
<md-icon>person</md-icon>
<span v-if="!edit">{{attendee.name}}</span>
<md-input-container md-inline v-if="edit">
<md-input @keyup.enter.native="updateAttendee()" v-model="attendee.name" ref="updateAttendeeName" />
</md-input-container>
<div v-if="!edit" class="md-list-text-container">
<span>{{ attendee.name }}</span>
<span v-if="attendee.notes" class="attendee-notes">{{ attendee.notes }}</span>
</div>
<div v-if="edit">
<md-input-container md-inline>
<md-input @keyup.enter.native="updateAttendee()" @keydown.esc.native="edit = false" v-model="attendee.name" ref="updateAttendeeName" />
</md-input-container>
<div class="notes-editor-list-item">
<md-input-container md-inline>
<label>notes</label>
<md-input class="attendee-notes" @keyup.enter.native="updateAttendee()" @keydown.esc.native="edit = false" v-model="attendee.notes" />
</md-input-container>
</div>
</div>
<md-menu v-if="isAuthorized(attendee.created_by)" md-align-trigger>
<md-menu v-if="isAuthorized(attendee.created_by) && !edit" md-align-trigger>
<md-button class="md-icon-button" md-menu-trigger>
<md-icon>more_vert</md-icon>
</md-button>
@ -97,4 +108,31 @@ export default {
min-width: 250px;
}
.attendee-notes {
font-style: italic !important;
}
.notes-editor-list-item {
margin-bottom: 0px !important;
padding-left: 16px;
}
.notes-editor-list-item ul {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
.notes-editor-list-item .md-theme-default.md-list {
background-color: transparent;
}
.notes-editor-list-item button:hover {
background-color: transparent !important;
}
.attendee-notes {
max-width: 120px;
}
</style>

51
src/Group.vue
View file

@ -1,4 +1,5 @@
<template>
<!-- XXX: too much duplication in this template -->
<md-layout class="group-layout" md-col gutter="120" md-align="start">
<md-card v-if="!addNewGroup" md-with-hover @mouseenter.native="focusToNewAttendee()">
<md-card-header class="group-header">
@ -12,11 +13,22 @@
<md-list md-dense>
<attendee v-for="attendee in group.attendees || []" :attendee="attendee" @updated="reload" />
<md-list-item class="attendee-add">
<md-icon>person_add</md-icon>
<md-icon @click.native="addAttendee(group.group)">person_add</md-icon>
<md-input-container class="new-attendee">
<label>new attendee</label>
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(group.group, newAttendee)" v-model="newAttendee" class="attendee-add-name" />
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(group.group)" v-model="newAttendee" />
</md-input-container>
<md-list-expand>
<md-list>
<md-list-item class="md-inset">
<md-input-container>
<label>notes</label>
<md-input class="new-attendee-notes" @keyup.enter.native="addAttendee(group.group)" v-model="newAttendeeNotes" />
</md-input-container>
</md-list-item>
</md-list>
</md-list-expand>
</md-list-item>
</md-list>
</md-card-content>
@ -32,11 +44,22 @@
<md-card-content>
<md-list v-show="newGroup">
<md-list-item class="attendee-add">
<md-icon>person_add</md-icon>
<md-icon @click.native="addAttendee(newGroup)">person_add</md-icon>
<md-input-container>
<label>new attendee</label>
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(newGroup, newAttendee)" v-model="newAttendee" class="attendee-add-name" />
<md-input ref="newAttendeeInput" @keyup.enter.native="addAttendee(newGroup)" v-model="newAttendee" />
</md-input-container>
<md-list-expand>
<md-list>
<md-list-item class="md-inset">
<md-input-container>
<label>notes</label>
<md-input class="new-attendee-notes" @keyup.enter.native="addAttendee(newGroup)" v-model="newAttendeeNotes" />
</md-input-container>
</md-list-item>
</md-list>
</md-list-expand>
</md-list-item>
</md-list>
</md-card-content>
@ -53,7 +76,11 @@ export default {
props: {group: {}, day: {}, addNewGroup: {default: false}},
data: function () {
return { newAttendee: '', newGroup: '' }
return {
newAttendee: '',
newAttendeeNotes: '',
newGroup: ''
}
},
computed: {
@ -69,6 +96,7 @@ export default {
methods: {
reset() {
this.newAttendee = '';
this.newAttendeeNotes = '';
this.newGroup = '';
},
@ -86,7 +114,14 @@ export default {
},
addAttendee(group, newAttendee) {
this.attendeesUrl.save({day: this.day, group: group, name: newAttendee}).then((response) => {
newAttendee = newAttendee || this.newAttendee;
var attendee = {
day: this.day,
group: group,
name: newAttendee,
notes: this.newAttendeeNotes
};
this.attendeesUrl.save(attendee).then((response) => {
return response.json();
}, (response) => {
this.$refs.dialogObj.show({text: 'unable to add the attendee'});
@ -150,4 +185,8 @@ export default {
line-height: 1;
}
.new-attendee-notes {
max-width: 120px;
}
</style>