177 lines
5.7 KiB
Vue
Executable File
177 lines
5.7 KiB
Vue
Executable File
<template>
|
||
<div
|
||
v-if="site.confpages.enableReg"
|
||
class="row q-ma-sm centermydiv2 q-pa-sm justify-center align-center"
|
||
>
|
||
<div v-if="!start">
|
||
|
||
<q-btn
|
||
rounded
|
||
glossy
|
||
icon="fas fa-user-plus"
|
||
size="md"
|
||
color="primary"
|
||
@click="buttRegistrati()"
|
||
:label="$t('reg.submit')"
|
||
>
|
||
</q-btn>
|
||
</div>
|
||
<q-carousel
|
||
v-if="start"
|
||
v-model="slide"
|
||
transition-prev="scale"
|
||
transition-next="scale"
|
||
animated
|
||
control-color="white"
|
||
navigation
|
||
padding
|
||
height="500px"
|
||
:class="`text-white bg-primary shadow-1 rounded-borders`"
|
||
>
|
||
<q-carousel-slide name="start" class="column no-wrap flex-center">
|
||
<q-icon name="fas fa-user-plus" size="56px" />
|
||
<div class="q-mt-md text-center">
|
||
<span class="text-h6 text-white"> {{ $t('reg.invitante') }}</span>
|
||
<q-card class="dialog_card q-mb-lg">
|
||
<q-card-section class="column q-ma-sm q-pa-sm q-col-gutter-sm">
|
||
<q-btn
|
||
rounded
|
||
glossy
|
||
size="lg"
|
||
color="positive"
|
||
@click="
|
||
slide = 'second';
|
||
noInvited = false;
|
||
chooseReg = true;
|
||
"
|
||
:label="$t('dialog.yes')"
|
||
>
|
||
</q-btn>
|
||
|
||
<q-btn
|
||
rounded
|
||
glossy
|
||
size="lg"
|
||
color="negative"
|
||
@click="
|
||
slide = 'second';
|
||
noInvited = true;
|
||
chooseReg = false;
|
||
"
|
||
:label="$t('dialog.no')"
|
||
>
|
||
</q-btn>
|
||
</q-card-section>
|
||
</q-card>
|
||
</div>
|
||
</q-carousel-slide>
|
||
<q-carousel-slide name="second">
|
||
<div v-if="noInvited" class="text-h7">
|
||
<div class="text-center text-bold text-h6">
|
||
Se ancora non sei stato invitato:
|
||
</div>
|
||
<br />
|
||
1️⃣ 👉🏻 Entra nei gruppi Territoriali su Telegram:<br />
|
||
<div class="text-center">
|
||
<q-btn
|
||
type="a"
|
||
rounded
|
||
icon="fab fa-telegram"
|
||
color="positive"
|
||
href="https://t.me/riso_canale/3"
|
||
target="_blank"
|
||
label="Progetto RISO"
|
||
>
|
||
</q-btn>
|
||
</div>
|
||
<br />
|
||
|
||
2️⃣ 👉🏻 sul post del canale fissato in alto, troverai tutte le info sul
|
||
progetto e su come entrare nel gruppo della tua provincia.<br />
|
||
Potrai cosi richiedere il link una volta entrato nella chat di
|
||
gruppo.<br />
|
||
</div>
|
||
<div v-else-if="chooseReg">
|
||
<div class="row justify-center items-center">
|
||
<q-icon name="fas fa-user-plus" size="27px" class="q-mx-md" />
|
||
<span class="text-h6 text-white"> {{ $t('reg.page_title') }}</span>
|
||
<q-card class="q-mt-sm dialog_card q-mb-sm">
|
||
<q-card-section>
|
||
<div
|
||
v-if="site.confpages.enableRegMultiChoice"
|
||
style=""
|
||
class="column q-ma-sm centermydiv2 q-pa-sm justify-center"
|
||
>
|
||
<q-btn
|
||
rounded
|
||
type="a"
|
||
class="col-xs-12 col-sm-6 flex-item-btn items-center q-my-md"
|
||
icon="fab fa-telegram"
|
||
size="md"
|
||
color="primary"
|
||
:href="
|
||
invited
|
||
? tools.getLinkBotTelegram(invited, regexpire)
|
||
: `/bot`
|
||
"
|
||
:label="$t('reg.bytelegram')"
|
||
>
|
||
<q-badge color="red" align="bottom" floating
|
||
>Consigliato</q-badge
|
||
>
|
||
</q-btn>
|
||
<br>
|
||
<div
|
||
:class="
|
||
$q.dark.isActive
|
||
? `text-white`
|
||
: `text-black` + ` col-12 text-center`
|
||
"
|
||
>
|
||
<div class="bg-grey-4">
|
||
<br />
|
||
se non hai Telegram puoi registrarti con solo l'email ma
|
||
<span style="text-decoration: underline"
|
||
>non potrai contattare gli iscritti</span
|
||
>.
|
||
<q-btn
|
||
rounded
|
||
class="flex-item-btn col-xs-12 col-sm-6"
|
||
outline
|
||
icon="fas fa-envelope"
|
||
size="0.75rem"
|
||
:color="$q.dark.isActive ? `black` : `white`"
|
||
:text-color="$q.dark.isActive ? `white` : `black`"
|
||
@click="regEventEmail"
|
||
:label="$t('reg.byemail')"
|
||
>
|
||
</q-btn>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-else style="margin-top: 10px; text-align: center">
|
||
Registrati<br />
|
||
<q-btn
|
||
rounded
|
||
size="md"
|
||
color="primary"
|
||
@click="clickToRegister"
|
||
:label="$t('reg.submit')"
|
||
>
|
||
</q-btn>
|
||
</div>
|
||
</q-card-section>
|
||
</q-card>
|
||
</div>
|
||
</div>
|
||
</q-carousel-slide>
|
||
</q-carousel>
|
||
</div>
|
||
</template>
|
||
|
||
<script lang="ts" src="./CRegistration.ts">
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
@import './CRegistration.scss';
|
||
</style>
|