diff options
author | Marco <marcoambrosini@icloud.com> | 2023-01-13 14:13:05 +0100 |
---|---|---|
committer | Marco <marcoambrosini@icloud.com> | 2023-01-24 15:10:55 +0000 |
commit | 71be76840c8fd79a150e91e27344b1b2fc7a8569 (patch) | |
tree | b092beec56933d9875ee77f7ee9e5deb4ad86778 | |
parent | 7787518505a8d65db6da6e644fafcefd2d84d5d5 (diff) |
Add assignment button
Signed-off-by: Marco <marcoambrosini@icloud.com>
-rw-r--r-- | src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue | 38 |
1 files changed, 36 insertions, 2 deletions
diff --git a/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue b/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue index c57b85620..3b8a269b2 100644 --- a/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue +++ b/src/components/BreakoutRoomsEditor/BreakoutRoomsParticipantsEditor.vue @@ -21,12 +21,27 @@ <template> <div class="participants-editor"> + <NcActions v-if="hasSelected" :menu-title="t('spreed', 'Assign participants to room')"> + <NcActionButton v-for="breakoutRoom in breakoutRooms" :key="breakoutRoom.id"> + <template #icon> + <!-- TODO: choose final icon --> + <GoogleCircles :size="20" /> + </template> + {{ breakoutRoom.displayName }} + </NcActionButton> + <NcActionButton> + <template #icon> + <Reload :size="20" /> + </template> + {{ t('spreed', 'Reset all assignments') }} + </NcActionButton> + </NcActions> <div v-for="participant in participants" :key="participant.attendeeId" tabindex="0" class="participants-editor__participant"> <input id="participant.attendeeId" - v-model="checkedParticipants" + v-model="selectedParticipants" :value="participant.attendeeId" type="checkbox" name="participant.attendeeId"> @@ -47,11 +62,20 @@ <script> import AvatarWrapper from '../AvatarWrapper/AvatarWrapper.vue' +import NcActions from '@nextcloud/vue/dist/Components/NcActions.js' +import NcActionButton from '@nextcloud/vue/dist/Components/NcActionButton.js' +import GoogleCircles from 'vue-material-design-icons/GoogleCircles.vue' +import Reload from 'vue-material-design-icons/Reload.vue' + export default { name: 'BreakoutRoomsParticipantsEditor', components: { AvatarWrapper, + NcActions, + NcActionButton, + GoogleCircles, + Reload, }, props: { @@ -63,7 +87,7 @@ export default { data() { return { - checkedParticipants: [], + selectedParticipants: [], } }, @@ -71,6 +95,16 @@ export default { participants() { return this.$store.getters.participantsList(this.token) }, + + hasSelected() { + return !!this.selectedParticipants + }, + + breakoutRooms() { + return this.$store.getters.breakoutRoomsReferences(this.token).map(reference => { + return this.$store.getters.conversation(reference) + }) + }, }, } </script> |