Improvements to group page

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/components/Event/EventListViewCard.vue

@@ -16,7 +16,7 @@
           </span>
           <span>
             <span>
-              {{ $t("Organized by {name}", { name: event.organizerActor.displayName() }) }}
+              {{ $t("Organized by {name}", { name: usernameWithDomain(event.organizerActor) }) }}
             </span>
           </span>
         </div>
@@ -53,7 +53,7 @@
 import { ParticipantRole, EventVisibility, IEventCardOptions, IEvent } from "@/types/event.model";
 import { Component, Prop } from "vue-property-decorator";
 import DateCalendarIcon from "@/components/Event/DateCalendarIcon.vue";
-import { IPerson } from "@/types/actor";
+import { IPerson, usernameWithDomain } from "@/types/actor";
 import { mixins } from "vue-class-component";
 import ActorMixin from "@/mixins/actor";
 import { CURRENT_ACTOR_CLIENT } from "@/graphql/actor";
@@ -96,6 +96,8 @@ export default class EventListViewCard extends mixins(ActorMixin, EventMixin) {
   EventVisibility = EventVisibility;
 
   RouteName = RouteName;
+
+  usernameWithDomain = usernameWithDomain;
 }
 </script>
 

js/src/components/Event/EventMinimalistCard.vue

@@ -9,7 +9,46 @@
       <p v-if="event.physicalAddress" class="has-text-grey">
         {{ event.physicalAddress.description }}
       </p>
-      <p v-else>3 demandes de participation à traiter</p>
+      <p v-else>
+        <span v-if="event.options.maximumAttendeeCapacity !== 0">
+          {{
+            $tc(
+              "{available}/{capacity} available places",
+              event.options.maximumAttendeeCapacity - event.participantStats.participant,
+              {
+                available:
+                  event.options.maximumAttendeeCapacity - event.participantStats.participant,
+                capacity: event.options.maximumAttendeeCapacity,
+              }
+            )
+          }}
+        </span>
+        <span v-else>
+          {{
+            $tc("{count} participants", event.participantStats.participant, {
+              count: event.participantStats.participant,
+            })
+          }}
+        </span>
+        <span v-if="event.participantStats.notApproved > 0">
+          <b-button
+            type="is-text"
+            @click="
+              gotToWithCheck(participation, {
+                name: RouteName.PARTICIPATIONS,
+                query: { role: ParticipantRole.NOT_APPROVED },
+                params: { eventId: event.uuid },
+              })
+            "
+          >
+            {{
+              $tc("{count} requests waiting", event.participantStats.notApproved, {
+                count: event.participantStats.notApproved,
+              })
+            }}
+          </b-button>
+        </span>
+      </p>
     </div>
   </router-link>
 </template>