From 4499fb2f311e8c075dc0784a4abfcc278c44b9e5 Mon Sep 17 00:00:00 2001 From: Thomas Citharel Date: Fri, 11 Oct 2019 15:06:58 +0200 Subject: [PATCH] Fix participation section, show how many places are available Signed-off-by: Thomas Citharel --- js/src/graphql/event.ts | 12 ++- js/src/i18n/en_US.json | 3 +- js/src/i18n/fr_FR.json | 3 +- js/src/types/event.model.ts | 3 +- js/src/views/Event/Event.vue | 140 +++++++++++++++++++-------- lib/mobilizon_web/resolvers/event.ex | 2 +- lib/mobilizon_web/schema/event.ex | 5 +- 7 files changed, 118 insertions(+), 50 deletions(-) diff --git a/js/src/graphql/event.ts b/js/src/graphql/event.ts index 1ce5d1b24..92edeeb36 100644 --- a/js/src/graphql/event.ts +++ b/js/src/graphql/event.ts @@ -101,7 +101,8 @@ export const FETCH_EVENT = gql` # }, participantStats { approved, - unapproved + unapproved, + participants }, tags { ${tagsQuery} @@ -257,7 +258,8 @@ export const CREATE_EVENT = gql` }, participantStats { approved, - unapproved + unapproved, + participants }, tags { ${tagsQuery} @@ -341,7 +343,8 @@ export const EDIT_EVENT = gql` }, participantStats { approved, - unapproved + unapproved, + participants }, tags { ${tagsQuery} @@ -407,7 +410,8 @@ export const PARTICIPANTS = gql` participantStats { approved, unapproved, - rejected + rejected, + participants } } } diff --git a/js/src/i18n/en_US.json b/js/src/i18n/en_US.json index 8d19829b6..29ee401ae 100644 --- a/js/src/i18n/en_US.json +++ b/js/src/i18n/en_US.json @@ -273,5 +273,6 @@ "{count} participants": "{count} participants", "{count} requests waiting": "{count} requests waiting", "{license} guarantees {respect} of the people who will use it. Since {source}, anyone can audit it, which guarantees its transparency.": "{license} guarantees {respect} of the people who will use it. Since {source}, anyone can audit it, which guarantees its transparency.", - "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks": "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks" + "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks": "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks", + "All the places have already been taken": "All the places have been taken|One place is still available|{places} places are still available" } \ No newline at end of file diff --git a/js/src/i18n/fr_FR.json b/js/src/i18n/fr_FR.json index dbed4d118..9a58e5ff6 100644 --- a/js/src/i18n/fr_FR.json +++ b/js/src/i18n/fr_FR.json @@ -312,5 +312,6 @@ "{count} participants": "Un⋅e participant⋅e|{count} participant⋅e⋅s", "{count} requests waiting": "Un⋅e demande en attente|{count} demandes en attente", "{license} guarantees {respect} of the people who will use it. Since {source}, anyone can audit it, which guarantees its transparency.": "{license} garantit {respect} des personnes qui l'utiliseront. Puisque {source}, il est publiquement auditable, ce qui garantit sa transparence.", - "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks": "© Les contributeurs de Mobilizon {date} - Fait avec Elixir, Phoenix, VueJS & et de l'amour et des semaines" + "© The Mobilizon Contributors {date} - Made with Elixir, Phoenix, VueJS & with some love and some weeks": "© Les contributeurs de Mobilizon {date} - Fait avec Elixir, Phoenix, VueJS & et de l'amour et des semaines", + "All the places have already been taken": "Toutes les places ont été prises|Une place est encore disponible|{places} places sont encore disponibles" } \ No newline at end of file diff --git a/js/src/types/event.model.ts b/js/src/types/event.model.ts index 82aac6692..66e946a38 100644 --- a/js/src/types/event.model.ts +++ b/js/src/types/event.model.ts @@ -112,6 +112,7 @@ export interface IEvent { approved: number; unapproved: number; rejected: number; + participants: number; }; participants: IParticipant[]; @@ -178,7 +179,7 @@ export class EventModel implements IEvent { publishAt = new Date(); - participantStats = { approved: 0, unapproved: 0, rejected: 0 }; + participantStats = { approved: 0, unapproved: 0, rejected: 0, participants: 0 }; participants: IParticipant[] = []; relatedEvents: IEvent[] = []; diff --git a/js/src/views/Event/Event.vue b/js/src/views/Event/Event.vue index 2ee20b502..b108cee94 100644 --- a/js/src/views/Event/Event.vue +++ b/js/src/views/Event/Event.vue @@ -17,17 +17,24 @@
-

{{ event.title }}

+
+

{{ event.title }}

+ + + {{ $tc('One person is going', event.participantStats.approved, {approved: event.participantStats.approved}) }} + + + {{ $tc('You and one other person are going to this event', event.participantStats.participants, { approved: event.participantStats.participants }) }} + + + {{ $tc('All the places have already been taken', numberOfPlacesStillAvailable, { places: numberOfPlacesStillAvailable}) }} + + +
-
- - {{ $tc('One person is going', event.participantStats.approved, {approved: event.participantStats.approved}) }} - - - {{ $tc('You and one other person are going to this event', event.participantStats.approved - 1, {approved: event.participantStats.approved - 1}) }} - +
-

+

{{ $t('Draft') }} - {{ tag.title }} - ⋅ - + {{ $t('Public event') }} {{ $t('Private event') }} + {{ tag.title }} + ⋅

@@ -147,6 +154,9 @@

{{ $t('Share this event') }}

+ + {{ $t('All the places have already been taken') }} +
@@ -346,7 +356,7 @@ export default class Event extends EventMixin { const participationCachedData = store.readQuery<{ person: IPerson }>({ query: EVENT_PERSON_PARTICIPATION, - variables: { eventId: this.event.id, name: identity.preferredUsername }, + variables: { eventId: this.event.id, actorId: identity.id }, }); if (participationCachedData == null) return; const { person } = participationCachedData; @@ -357,7 +367,7 @@ export default class Event extends EventMixin { person.participations.push(data.joinEvent); store.writeQuery({ query: EVENT_PERSON_PARTICIPATION, - variables: { eventId: this.event.id, name: identity.preferredUsername }, + variables: { eventId: this.event.id, actorId: identity.id }, data: { person }, }); @@ -408,7 +418,7 @@ export default class Event extends EventMixin { const participationCachedData = store.readQuery<{ person: IPerson }>({ query: EVENT_PERSON_PARTICIPATION, - variables: { eventId: this.event.id, name: this.currentActor.preferredUsername }, + variables: { eventId: this.event.id, actorId: this.currentActor.id }, }); if (participationCachedData == null) return; const { person } = participationCachedData; @@ -420,7 +430,7 @@ export default class Event extends EventMixin { person.participations = []; store.writeQuery({ query: EVENT_PERSON_PARTICIPATION, - variables: { eventId: this.event.id, name: this.currentActor.preferredUsername }, + variables: { eventId: this.event.id, actorId: this.currentActor.id }, data: { person }, }); @@ -497,6 +507,15 @@ export default class Event extends EventMixin { return meta.getAttribute('content') || ''; } + get eventCapacityOK(): boolean { + if (!this.event.options.maximumAttendeeCapacity) return true; + return this.event.options.maximumAttendeeCapacity > this.event.participantStats.participants; + } + + get numberOfPlacesStillAvailable(): number { + return this.event.options.maximumAttendeeCapacity - this.event.participantStats.participants; + } + }