74 lines
3.7 KiB
Vue
74 lines
3.7 KiB
Vue
|
<template>
|
|||
|
|
<div class="container mt-5">
|
|||
|
|
<div class="row justify-content-center">
|
|||
|
|
<div class="col-md-8">
|
|||
|
|
<div class="text-center p-5 rounded-3 bg-light shadow-sm">
|
|||
|
|
<template v-if="isAuthenticated">
|
|||
|
|
<h1 class="display-4 fw-bold mb-3">С возвращением, {{ user?.name || 'Пользователь' }}!</h1>
|
|||
|
|
<p class="lead mb-4">
|
|||
|
|
Готов продолжить поиск своей второй половинки?
|
|||
|
|
</p>
|
|||
|
|
<hr class="my-4" />
|
|||
|
|
<p>
|
|||
|
|
Перейди в свой <router-link to="/profile">профиль</router-link> или начни <router-link to="/swipe">поиск</router-link>! (Ссылка на свайпы пока не работает)
|
|||
|
|
</p>
|
|||
|
|
<!-- Можно добавить еще кнопки или информацию для залогиненного пользователя -->
|
|||
|
|
</template>
|
|||
|
|
<template v-else>
|
|||
|
|
<h1 class="display-4 fw-bold mb-3">Добро пожаловать в Dating App!</h1>
|
|||
|
|
<p class="lead mb-4">
|
|||
|
|
Найди свою вторую половинку уже сегодня. Присоединяйся к нашему
|
|||
|
|
дружелюбному сообществу.
|
|||
|
|
</p>
|
|||
|
|
<hr class="my-4" />
|
|||
|
|
<p>
|
|||
|
|
Это главная страница нашего замечательного приложения. Готов начать?
|
|||
|
|
</p>
|
|||
|
|
<div class="d-grid gap-2 d-sm-flex justify-content-sm-center mt-4">
|
|||
|
|
<router-link to="/login" class="btn btn-outline-primary btn-lg px-4 gap-3">
|
|||
|
|
Войти
|
|||
|
|
</router-link>
|
|||
|
|
<router-link to="/register" class="btn btn-success btn-lg px-4">
|
|||
|
|
Зарегистрироваться
|
|||
|
|
</router-link>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- ... секция с фичами (можно оставить или убрать) ... -->
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup>
|
|||
|
|
import { useAuth } from '@/auth'; // Импортируем наш auth composable
|
|||
|
|
import { onMounted } from 'vue'; // Добавляем импорт onMounted
|
|||
|
|
|
|||
|
|
const { user, isAuthenticated, fetchUser } = useAuth(); // Добавляем fetchUser
|
|||
|
|
|
|||
|
|
// Обновляем данные пользователя при монтировании компонента
|
|||
|
|
onMounted(async () => {
|
|||
|
|
if (localStorage.getItem('userToken')) {
|
|||
|
|
// Если в localStorage есть токен, пробуем загрузить данные пользователя
|
|||
|
|
await fetchUser();
|
|||
|
|
console.log('HomeView: Состояние аутентификации:', isAuthenticated.value);
|
|||
|
|
console.log('HomeView: Пользователь:', user.value);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// Если нужна какая-то специфическая логика для главной страницы, можно добавить здесь.
|
|||
|
|
// Например, если пользователь аутентифицирован, можно было бы сразу перенаправлять
|
|||
|
|
// на другую страницу, но это зависит от желаемого UX.
|
|||
|
|
// import { useRouter } from 'vue-router';
|
|||
|
|
// const router = useRouter();
|
|||
|
|
// onMounted(() => {
|
|||
|
|
// if (isAuthenticated.value) {
|
|||
|
|
// // router.push('/swipe'); // Например, на страницу свайпов
|
|||
|
|
// }
|
|||
|
|
// });
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
/* Стили Bootstrap уже должны применяться глобально */
|
|||
|
|
/* Здесь можно добавить специфичные стили для этой страницы, если нужно */
|
|||
|
|
</style>
|