Trim login UI to simple email and bot buttons
This commit is contained in:
@@ -124,26 +124,23 @@ onMounted(async () => {
|
||||
|
||||
<template>
|
||||
<section class="mx-auto flex min-h-[calc(100vh-4rem)] w-full max-w-3xl items-center py-8">
|
||||
<div class="card w-full border border-base-300 bg-base-100 shadow-xl">
|
||||
<div class="card w-full bg-base-100 shadow-xl">
|
||||
<div class="card-body p-5 md:p-8">
|
||||
<div class="mb-4 text-center">
|
||||
<h1 class="text-3xl font-extrabold">Вход в личный кабинет</h1>
|
||||
<p class="mt-1 text-sm text-base-content/70">
|
||||
Введите email и выберите способ входа.
|
||||
</p>
|
||||
<p class="mt-1 text-sm text-base-content/70">Вход через e-mail</p>
|
||||
</div>
|
||||
|
||||
<div v-if="step === 'request'" class="space-y-4">
|
||||
<fieldset class="fieldset rounded-box border border-base-300 bg-base-200/40 p-4">
|
||||
<legend class="fieldset-legend text-sm font-semibold">Email адрес</legend>
|
||||
<label class="label pb-1">На этот email придет код и он же пойдет в deep-link бота</label>
|
||||
<input
|
||||
v-model="email"
|
||||
type="email"
|
||||
class="input input-bordered w-full"
|
||||
placeholder="name@company.com"
|
||||
>
|
||||
</fieldset>
|
||||
<label class="label">
|
||||
<span class="label-text font-semibold">E-mail</span>
|
||||
</label>
|
||||
<input
|
||||
v-model="email"
|
||||
type="email"
|
||||
class="input input-bordered input-primary w-full"
|
||||
placeholder="name@company.com"
|
||||
>
|
||||
|
||||
<div class="grid gap-2 sm:grid-cols-2">
|
||||
<a
|
||||
@@ -174,29 +171,21 @@ onMounted(async () => {
|
||||
>
|
||||
{{ requestCodeMutation.loading.value ? 'Отправляем…' : 'Получить код' }}
|
||||
</button>
|
||||
|
||||
<p v-if="!telegramBotUrl || !maxBotUrl" class="text-xs text-warning">
|
||||
Для кнопок бота нужно задать `NUXT_PUBLIC_TELEGRAM_BOT_URL` и `NUXT_PUBLIC_MAX_BOT_URL`.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div v-else class="space-y-4">
|
||||
<div class="alert alert-info">
|
||||
Код отправлен на <span class="font-bold">{{ maskedEmail }}</span>.
|
||||
Действителен до: <span class="font-bold">{{ expiresAt }}</span>.
|
||||
</div>
|
||||
|
||||
<fieldset class="fieldset rounded-box border border-base-300 bg-base-200/40 p-4">
|
||||
<legend class="fieldset-legend text-sm font-semibold">Код подтверждения</legend>
|
||||
<label class="label pb-1">Введите 6-значный код</label>
|
||||
<input
|
||||
v-model="code"
|
||||
type="text"
|
||||
maxlength="6"
|
||||
class="input input-bordered w-full"
|
||||
placeholder="123456"
|
||||
>
|
||||
</fieldset>
|
||||
<h2 class="text-xl font-semibold">E-mail</h2>
|
||||
<p class="text-sm text-base-content/70">{{ maskedEmail }}</p>
|
||||
<label class="label">
|
||||
<span class="label-text font-semibold">Код</span>
|
||||
</label>
|
||||
<input
|
||||
v-model="code"
|
||||
type="text"
|
||||
maxlength="6"
|
||||
class="input input-bordered input-primary w-full"
|
||||
placeholder="123456"
|
||||
>
|
||||
|
||||
<button
|
||||
class="btn btn-primary w-full"
|
||||
@@ -209,6 +198,8 @@ onMounted(async () => {
|
||||
<button class="btn btn-ghost w-full" @click="step = 'request'">
|
||||
Вернуться
|
||||
</button>
|
||||
|
||||
<p class="text-xs text-base-content/60">Код действует до {{ expiresAt }}</p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user