modified: begushiybashkir/bbvue/src/views/Profile.vue

some fix?
This commit is contained in:
2025-10-12 07:33:02 +05:00
parent 237ee6742e
commit 8447dbe882
+22 -19
View File
@@ -1,14 +1,12 @@
<template> <template>
<div class="page"> <div class="page">
<h1>👤 Личный кабинет</h1> <h1>👤 Личный кабинет</h1>
<div v-if="authLoading" class="loading">Загрузка профиля...</div> <div v-if="authLoading" class="loading">Загрузка профиля...</div>
<div v-else-if="user" class="profile-content"> <div v-else-if="user" class="profile-content">
<div class="profile-header"> <div class="profile-header">
<img :src="getImageUrl('dinamo.jpg')" <img :src="getImageUrl('dinamo.jpg')" alt="Аватар" style="width: 100px; height: 100px; border-radius: 50%;">
alt="Аватар"
style="width: 100px; height: 100px; border-radius: 50%;">
<h2>{{ user.firstName }} {{ user.lastName }}</h2> <h2>{{ user.firstName }} {{ user.lastName }}</h2>
<p>Участник с {{ joinDate }}</p> <p>Участник с {{ joinDate }}</p>
<p class="user-email">{{ user.email }}</p> <p class="user-email">{{ user.email }}</p>
@@ -44,11 +42,11 @@
{{ statsLoading ? '⟳' : '🔄' }} {{ statsLoading ? '⟳' : '🔄' }}
</button> </button>
</div> </div>
<div v-if="statsError" class="error-message"> <div v-if="statsError" class="error-message">
{{ statsError }} {{ statsError }}
</div> </div>
<div v-else class="stats-grid"> <div v-else class="stats-grid">
<div class="stat-card"> <div class="stat-card">
<h4>🏃 Всего пробег</h4> <h4>🏃 Всего пробег</h4>
@@ -94,9 +92,9 @@
</button> </button>
</div> </div>
</div> </div>
<div v-else class="error-message"> <div v-else class="error-message">
Не удалось загрузить данные профиля. Не удалось загрузить данные профиля.
<router-link to="/login" class="link">Войдите</router-link> снова. <router-link to="/login" class="link">Войдите</router-link> снова.
</div> </div>
@@ -143,7 +141,7 @@ export default {
}, },
joinDate() { joinDate() {
if (!this.user?.createdAt) return 'января 2024'; if (!this.user?.createdAt) return 'января 2024';
const date = new Date(this.user.createdAt); const date = new Date(this.user.createdAt);
const month = date.toLocaleString('ru-RU', { month: 'long' }); const month = date.toLocaleString('ru-RU', { month: 'long' });
const year = date.getFullYear(); const year = date.getFullYear();
@@ -191,19 +189,24 @@ export default {
async loadStats() { async loadStats() {
this.statsLoading = true this.statsLoading = true
try { try {
await Promise.all([ const [statsResult, achievementsResult] = await Promise.all([
this.userStore.fetchUserStats(), this.userStore.fetchUserStats(),
this.userStore.fetchUserAchievements() this.userStore.fetchUserAchievements()
]) ])
// Проверяем результаты
if (!statsResult.success) {
console.error('Ошибка загрузки статистики:', statsResult.error)
}
if (!achievementsResult.success) {
console.error('Ошибка загрузки достижений:', achievementsResult.error)
}
} catch (error) { } catch (error) {
console.error('Ошибка загрузки статистики:', error) console.error('Ошибка загрузки статистики:', error)
} finally { } finally {
this.statsLoading = false this.statsLoading = false
} }
}, },
async refreshStats() {
await this.loadStats()
},
async handleLogout() { async handleLogout() {
await this.authStore.logout() await this.authStore.logout()
this.$router.push('/login') this.$router.push('/login')
@@ -259,7 +262,7 @@ export default {
background: white; background: white;
padding: 1.5rem; padding: 1.5rem;
border-radius: 10px; border-radius: 10px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
margin-bottom: 2rem; margin-bottom: 2rem;
text-align: center; text-align: center;
} }
@@ -312,7 +315,7 @@ export default {
background: white; background: white;
padding: 1rem; padding: 1rem;
border-radius: 8px; border-radius: 8px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
text-align: center; text-align: center;
border: 1px solid #e0e0e0; border: 1px solid #e0e0e0;
} }
@@ -362,15 +365,15 @@ export default {
.info-grid { .info-grid {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
.stats-grid { .stats-grid {
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
} }
.profile-actions { .profile-actions {
max-width: 100%; max-width: 100%;
} }
.achievements-progress { .achievements-progress {
flex-direction: column; flex-direction: column;
gap: 0.5rem; gap: 0.5rem;