Fix anonymous & remote participation pages
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
@@ -1,106 +1,99 @@
|
||||
<template>
|
||||
<section class="container mx-auto hero">
|
||||
<div class="hero-body" v-if="event">
|
||||
<div class="container mx-auto">
|
||||
<h2 class="text-2xl">
|
||||
{{ $t("You wish to participate to the following event") }}
|
||||
</h2>
|
||||
<EventListViewCard v-if="event" :event="event" />
|
||||
<div class="columns has-text-centered">
|
||||
<div class="column">
|
||||
<router-link
|
||||
:to="{ name: RouteName.EVENT_PARTICIPATE_WITH_ACCOUNT }"
|
||||
>
|
||||
<figure class="image is-128x128">
|
||||
<img
|
||||
src="../../assets/undraw_profile.svg"
|
||||
alt="Profile illustration"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
$t("I have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</router-link>
|
||||
<p>
|
||||
<small>
|
||||
{{
|
||||
$t(
|
||||
"Either on the {instance} instance or on another instance.",
|
||||
{
|
||||
instance: host,
|
||||
}
|
||||
)
|
||||
}}
|
||||
</small>
|
||||
<o-tooltip
|
||||
variant="dark"
|
||||
:label="
|
||||
$t(
|
||||
'Mobilizon is a federated network. You can interact with this event from a different server.'
|
||||
)
|
||||
"
|
||||
>
|
||||
<o-icon size="small" icon="help-circle-outline" />
|
||||
</o-tooltip>
|
||||
</p>
|
||||
</div>
|
||||
<vertical-divider
|
||||
:content="$t('Or')"
|
||||
v-if="anonymousParticipationAllowed"
|
||||
/>
|
||||
<div
|
||||
class="column"
|
||||
v-if="
|
||||
anonymousParticipationAllowed &&
|
||||
hasAnonymousEmailParticipationMethod
|
||||
<section class="container mx-auto max-w-2xl">
|
||||
<h2 class="text-2xl">
|
||||
{{ t("You wish to participate to the following event") }}
|
||||
</h2>
|
||||
<EventListViewCard v-if="event" :event="event" />
|
||||
<div class="flex flex-wrap gap-4 items-center w-full my-6">
|
||||
<div class="bg-white dark:bg-zinc-700 rounded-md p-4 flex-1">
|
||||
<router-link :to="{ name: RouteName.EVENT_PARTICIPATE_WITH_ACCOUNT }">
|
||||
<figure class="flex justify-center my-2">
|
||||
<img
|
||||
src="/img/undraw_profile.svg"
|
||||
alt="Profile illustration"
|
||||
width="128"
|
||||
height="128"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
t("I have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</router-link>
|
||||
<p>
|
||||
<small>
|
||||
{{
|
||||
t("Either on the {instance} instance or on another instance.", {
|
||||
instance: host,
|
||||
})
|
||||
}}
|
||||
</small>
|
||||
<o-tooltip
|
||||
variant="dark"
|
||||
:label="
|
||||
t(
|
||||
'Mobilizon is a federated network. You can interact with this event from a different server.'
|
||||
)
|
||||
"
|
||||
>
|
||||
<router-link
|
||||
:to="{ name: RouteName.EVENT_PARTICIPATE_WITHOUT_ACCOUNT }"
|
||||
v-if="event.local"
|
||||
>
|
||||
<figure class="image is-128x128">
|
||||
<img
|
||||
src="../../assets/undraw_mail_2.svg"
|
||||
alt="Privacy illustration"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
$t("I don't have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</router-link>
|
||||
<a :href="`${event.url}/participate/without-account`" v-else>
|
||||
<figure class="image is-128x128">
|
||||
<img
|
||||
src="../../assets/undraw_mail_2.svg"
|
||||
alt="Privacy illustration"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
$t("I don't have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</a>
|
||||
<p>
|
||||
<small>{{ $t("Participate using your email address") }}</small>
|
||||
<br />
|
||||
<small v-if="!event.local">
|
||||
{{ $t("You will be redirected to the original instance") }}
|
||||
</small>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="has-text-centered">
|
||||
<o-button tag="a" variant="text" @click="router.go(-1)">{{
|
||||
$t("Back to previous page")
|
||||
}}</o-button>
|
||||
</div>
|
||||
<o-icon size="small" icon="help-circle-outline" />
|
||||
</o-tooltip>
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="bg-white dark:bg-zinc-700 rounded-md p-4 flex-1"
|
||||
v-if="
|
||||
event &&
|
||||
anonymousParticipationAllowed &&
|
||||
hasAnonymousEmailParticipationMethod
|
||||
"
|
||||
>
|
||||
<router-link
|
||||
:to="{ name: RouteName.EVENT_PARTICIPATE_WITHOUT_ACCOUNT }"
|
||||
v-if="event.local"
|
||||
>
|
||||
<figure class="flex justify-center my-2">
|
||||
<img
|
||||
width="128"
|
||||
height="128"
|
||||
src="/img/undraw_mail_2.svg"
|
||||
alt="Privacy illustration"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
t("I don't have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</router-link>
|
||||
<a :href="`${event.url}/participate/without-account`" v-else>
|
||||
<figure class="flex justify-center my-2">
|
||||
<img
|
||||
src="/img/undraw_mail_2.svg"
|
||||
width="128"
|
||||
height="128"
|
||||
alt="Privacy illustration"
|
||||
/>
|
||||
</figure>
|
||||
<o-button variant="primary">{{
|
||||
t("I don't have a Mobilizon account")
|
||||
}}</o-button>
|
||||
</a>
|
||||
<p>
|
||||
<small>{{ t("Participate using your email address") }}</small>
|
||||
<br />
|
||||
<small v-if="!event.local">
|
||||
{{ t("You will be redirected to the original instance") }}
|
||||
</small>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="has-text-centered">
|
||||
<o-button tag="a" variant="text" @click="router.go(-1)">{{
|
||||
t("Back to previous page")
|
||||
}}</o-button>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import EventListViewCard from "@/components/Event/EventListViewCard.vue";
|
||||
import VerticalDivider from "@/components/Utils/VerticalDivider.vue";
|
||||
import RouteName from "../../router/name";
|
||||
import { useFetchEvent } from "@/composition/apollo/event";
|
||||
import { useAnonymousParticipationConfig } from "@/composition/apollo/config";
|
||||
|
||||
Reference in New Issue
Block a user