|
|
@@ -1,43 +1,39 @@
|
|
|
<template>
|
|
|
- <div class="bg-white p-8 rounded-lg shadow-md text-center w-full max-w-md mx-4">
|
|
|
- <h2 class="text-2xl font-bold text-gray-800">Check-in do Evento</h2>
|
|
|
- <p class="text-gray-600 mt-2">Preencha seus dados para confirmar a presença.</p>
|
|
|
+ <div>
|
|
|
+ <h2>Check-in do Evento</h2>
|
|
|
+ <p>Preencha seus dados para confirmar a presença.</p>
|
|
|
|
|
|
- <form @submit.prevent="handleCheckin" class="flex flex-col gap-4 mt-6">
|
|
|
+ <form @submit.prevent="handleCheckin">
|
|
|
<input
|
|
|
v-model="name"
|
|
|
type="text"
|
|
|
placeholder="Nome Completo"
|
|
|
:disabled="isLoading"
|
|
|
required
|
|
|
- class="px-4 py-3 border border-gray-300 rounded-md w-full focus:ring-2 focus:ring-blue-500 focus:border-transparent disabled:bg-gray-100"
|
|
|
- />
|
|
|
+ >
|
|
|
<input
|
|
|
v-model="email"
|
|
|
type="email"
|
|
|
placeholder="Seu melhor e-mail"
|
|
|
:disabled="isLoading"
|
|
|
required
|
|
|
- class="px-4 py-3 border border-gray-300 rounded-md w-full focus:ring-2 focus:ring-blue-500 focus:border-transparent disabled:bg-gray-100"
|
|
|
- />
|
|
|
+ >
|
|
|
<input
|
|
|
v-model="eventCode"
|
|
|
type="text"
|
|
|
placeholder="Código do Evento"
|
|
|
:disabled="isLoading"
|
|
|
required
|
|
|
- class="px-4 py-3 border border-gray-300 rounded-md w-full focus:ring-2 focus:ring-blue-500 focus:border-transparent disabled:bg-gray-100"
|
|
|
- />
|
|
|
+ >
|
|
|
<button
|
|
|
type="submit"
|
|
|
:disabled="isLoading"
|
|
|
- class="px-4 py-3 bg-blue-600 text-white font-semibold rounded-md cursor-pointer hover:bg-blue-700 transition-colors duration-200 disabled:bg-gray-400 disabled:cursor-not-allowed"
|
|
|
>
|
|
|
{{ isLoading ? 'Confirmando...' : 'Confirmar Presença' }}
|
|
|
</button>
|
|
|
</form>
|
|
|
|
|
|
- <p v-if="statusMessage" class="mt-4 font-semibold text-gray-700">{{ statusMessage }}</p>
|
|
|
+ <p v-if="statusMessage">{{ statusMessage }}</p>
|
|
|
</div>
|
|
|
</template>
|
|
|
|