Merge branch 'suggest-creation-when-no-event' into 'master'

Suggest creation when no event

Closes #290

See merge request framasoft/mobilizon!754
This commit is contained in:
Thomas Citharel 2020-12-09 20:02:13 +01:00
commit 5f936c62a1
4 changed files with 125 additions and 14 deletions

View file

@ -810,5 +810,15 @@
"Unable to load event for participation. The error details are provided below:": "Unable to load event for participation. The error details are provided below:",
"Unable to save your participation in this browser.": "Unable to save your participation in this browser.",
"return to the event's page": "return to the event's page",
"View all events": "View all events"
"View all events": "View all events",
"You will find here all the events you have created or of which you are a participant.": "You will find here all the events you have created or of which you are a participant.",
"Create event": "Create event",
"You didn't create or join any event yet": "You didn't create or join any event yet",
"create an event": "create an event",
"explore the events": "explore the events",
"Do you wish to {create_event} or {explore_events}?": "Do you wish to {create_event} or {explore_events}?",
"You are not part of any group": "You are not part of any group",
"create a group": "create a group",
"explore the groups": "explore the groups",
"Do you wish to {create_group} or {explore_groups}?": "Do you wish to {create_group} or {explore_groups}?"
}

View file

@ -904,5 +904,15 @@
"Unable to save your participation in this browser.": "Échec de la sauvegarde de votre participation dans ce navigateur.",
"return to the event's page": "retourner sur la page de l'événement",
"You may now close this window, or {return_to_event}.": "Vous pouvez maintenant fermer cette fenêtre, ou bien {return_to_event}.",
"View all events": "Voir tous les événements"
"View all events": "Voir tous les événements",
"You will find here all the events you have created or of which you are a participant.": "Vous trouverez ici tous les événements que vous avez créé ou dont vous êtes un·e participant·e.",
"Create event": "Créer un événement",
"You didn't create or join any event yet.": "Vous n'avez pas encore créé ou rejoint d'événement.",
"create an event": "créer un événement",
"explore the events": "explorer les événements",
"Do you wish to {create_event} or {explore_events}?": "Voulez-vous {create_event} ou {explore_events} ?",
"You are not part of any group.": "Vous ne faites partie d'aucun groupe.",
"create a group": "créer un groupe",
"explore the groups": "explorer les groupes",
"Do you wish to {create_group} or {explore_groups}?": "Voulez-vous {create_group} ou {explore_groups} ?"
}

View file

@ -1,8 +1,22 @@
<template>
<section class="section container">
<div class="section container">
<h1 class="title">
{{ $t("My events") }}
</h1>
<p>
{{
$t(
"You will find here all the events you have created or of which you are a participant."
)
}}
</p>
<div class="buttons">
<router-link
class="button is-primary"
:to="{ name: RouteName.CREATE_EVENT }"
>{{ $t("Create event") }}</router-link
>
</div>
<b-loading :active.sync="$apollo.loading"></b-loading>
<section v-if="futureParticipations.length > 0">
<subtitle>
@ -77,22 +91,44 @@
>
</div>
</section>
<b-message
<section
class="has-text-centered not-found"
v-if="
futureParticipations.length === 0 &&
pastParticipations.length === 0 &&
$apollo.loading === false
!$apollo.loading
"
type="is-danger"
>
{{ $t("No events found") }}
</b-message>
<div class="columns is-vertical is-centered">
<div class="column is-three-quarters">
<div class="img-container" />
<div class="content has-text-centered">
<p>
{{ $t("You didn't create or join any event yet.") }}
<i18n path="Do you wish to {create_event} or {explore_events}?">
<router-link
:to="{ name: RouteName.CREATE_EVENT }"
slot="create_event"
>{{ $t("create an event") }}</router-link
>
<router-link
:to="{ name: RouteName.SEARCH }"
slot="explore_events"
>{{ $t("explore the events") }}</router-link
>
</i18n>
</p>
</div>
</div>
</div>
</section>
</div>
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { ParticipantRole } from "@/types/enums";
import RouteName from "@/router/name";
import { IParticipant, Participant } from "../../types/participant.model";
import {
LOGGED_USER_PARTICIPATIONS,
@ -173,6 +209,8 @@ export default class MyEvents extends Vue {
drafts: IEvent[] = [];
RouteName = RouteName;
static monthlyParticipations(
participations: IParticipant[],
revertSort = false
@ -299,6 +337,10 @@ export default class MyEvents extends Vue {
<style lang="scss" scoped>
main > .container {
background: $white;
& > h1 {
margin: 10px auto 5px;
}
}
.participation {
@ -310,4 +352,16 @@ section {
text-transform: capitalize;
}
}
.not-found {
.img-container {
background-image: url("/img/pics/2020-10-06-mobilizon-illustration-B_creation-evenement.jpg");
max-width: 450px;
height: 300px;
box-shadow: 0 0 8px 8px white inset;
background-size: cover;
border-radius: 10px;
margin: auto auto 1rem;
}
}
</style>

View file

@ -40,12 +40,33 @@
>
</b-pagination>
</section>
<b-message
v-if="$apollo.loading === false && memberships.length === 0"
type="is-danger"
<section
class="has-text-centered not-found"
v-if="memberships.length === 0 && !$apollo.loading"
>
{{ $t("No groups found") }}
</b-message>
<div class="columns is-vertical is-centered">
<div class="column is-three-quarters">
<div class="img-container" />
<div class="content has-text-centered">
<p>
{{ $t("You are not part of any group.") }}
<i18n path="Do you wish to {create_group} or {explore_groups}?">
<router-link
:to="{ name: RouteName.CREATE_GROUP }"
slot="create_group"
>{{ $t("create a group") }}</router-link
>
<router-link
:to="{ name: RouteName.SEARCH }"
slot="explore_groups"
>{{ $t("explore the groups") }}</router-link
>
</i18n>
</p>
</div>
</div>
</div>
</section>
</section>
</template>
@ -156,6 +177,10 @@ export default class MyGroups extends Vue {
<style lang="scss" scoped>
main > .container {
background: $white;
& > h1 {
margin: 10px auto 5px;
}
}
.participation {
@ -171,4 +196,16 @@ section {
.group-member-card {
margin-bottom: 1rem;
}
.not-found {
.img-container {
background-image: url("/img/pics/2020-10-06-mobilizon-illustration-C_groupe.jpg");
max-width: 450px;
height: 300px;
box-shadow: 0 0 8px 8px white inset;
background-size: cover;
border-radius: 10px;
margin: auto auto 1rem;
}
}
</style>