redi/astro_advokat
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Новое измнений в код

Browse source
This commit is contained in:
Web-serfer 2026-03-31 18:45:18 +05:00
parent 735146fbfb
commit aa40fac43b
4 changed files with 337 additions and 274 deletions
Download patch file Download diff file Expand all files Collapse all files

86
frontend/src/components/about/Achievements.astro
View file

@ -5,7 +5,25 @@ import { CONTACT_CONSTANTS } from '@constants/constants.ts';
const dynamicStats = getDynamicStats();
const yearsOfPractice = getYearsOfPractice();
const achievements = [
// Отдельный тип для числовых статов (исключаем "24/7")
interface NumericStat {
number: number;
suffix: string;
text: string;
type: 'years' | 'cases' | 'clients';
icon: 'calendar' | 'briefcase' | 'users';
}
// Специальный тип для support
interface SupportStat {
number: "24/7";
suffix: '';
text: 'На связи';
type: 'support';
icon: 'clock';
}
const numericAchievements: NumericStat[] = [
{
number: yearsOfPractice,
suffix: '',
@ -26,15 +44,16 @@ const achievements = [
text: 'довольных клиентов',
type: 'clients',
icon: 'users'
},
{
}
];
const supportStat: SupportStat = {
number: "24/7",
suffix: '',
text: 'На связи',
type: 'support',
icon: 'clock'
}
] as const;
};
const iconPaths = {
calendar: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z",
@ -43,16 +62,17 @@ const iconPaths = {
clock: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
} as const;
type StatType = typeof achievements[number]['type'];
const getStatText = (stat: typeof achievements[number]): string => {
const texts: Record<StatType, string> = {
years: `${stat.number} ${getYearDeclension(stat.number)} практики`,
cases: 'Успешных дел',
clients: `${stat.number} ${getClientDeclension(stat.number)}`,
support: 'Поддержка клиентов'
};
return texts[stat.type];
const getStatText = (stat: NumericStat | SupportStat): string => {
if (stat.type === 'years') {
return `${stat.number} ${getYearDeclension(stat.number)} практики`;
}
if (stat.type === 'cases') {
return 'Успешных дел';
}
if (stat.type === 'clients') {
return `${stat.number} ${getClientDeclension(stat.number as number)}`;
}
return 'Поддержка клиентов';
};
---
@ -68,38 +88,51 @@ const getStatText = (stat: typeof achievements[number]): string => {
<!-- Сетка достижений -->
<div class="grid grid-cols-2 lg:grid-cols-4 gap-6 mb-16">
{achievements.map((stat) => (
{numericAchievements.map((stat) => (
<div class="group bg-white/80 backdrop-blur-xl rounded-2xl p-6 md:p-8 shadow-lg border border-white/50 hover:shadow-2xl hover:shadow-[var(--color-blue-primary)]/10 hover:-translate-y-1 transition-all duration-500 text-center relative overflow-hidden">
<!-- Декоративный фон -->
<div class="absolute inset-0 bg-gradient-to-br from-[var(--color-blue-primary)]/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative z-10">
<!-- Иконка -->
<div class="w-12 h-12 mx-auto bg-[var(--color-blue-primary)]/10 rounded-xl flex items-center justify-center mb-4 group-hover:bg-[var(--color-blue-primary)] transition-colors duration-300">
<svg class="w-6 h-6 text-[var(--color-blue-primary)] group-hover:text-white transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d={iconPaths[stat.icon]}/>
</svg>
</div>
<!-- Число -->
<div class="flex items-baseline justify-center gap-1 mb-2">
{stat.type !== 'support' ? (
<span class="stat-counter text-4xl md:text-5xl font-extrabold text-gray-900" data-target={stat.number}>
0
</span>
) : (
<span class="text-3xl md:text-4xl font-extrabold text-[var(--color-blue-primary)]">{stat.number}</span>
)}
<span class="text-2xl font-bold text-[var(--color-blue-primary)]">{stat.suffix}</span>
</div>
<!-- Текст -->
<span class="text-xs md:text-sm font-bold text-gray-500 uppercase tracking-wider">
{getStatText(stat)}
</span>
</div>
</div>
))}
<!-- Support статик -->
<div class="group bg-white/80 backdrop-blur-xl rounded-2xl p-6 md:p-8 shadow-lg border border-white/50 hover:shadow-2xl hover:shadow-[var(--color-blue-primary)]/10 hover:-translate-y-1 transition-all duration-500 text-center relative overflow-hidden">
<div class="absolute inset-0 bg-gradient-to-br from-[var(--color-blue-primary)]/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500"></div>
<div class="relative z-10">
<div class="w-12 h-12 mx-auto bg-[var(--color-blue-primary)]/10 rounded-xl flex items-center justify-center mb-4 group-hover:bg-[var(--color-blue-primary)] transition-colors duration-300">
<svg class="w-6 h-6 text-[var(--color-blue-primary)] group-hover:text-white transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d={iconPaths[supportStat.icon]}/>
</svg>
</div>
<div class="flex items-baseline justify-center gap-1 mb-2">
<span class="text-3xl md:text-4xl font-extrabold text-[var(--color-blue-primary)]">{supportStat.number}</span>
</div>
<span class="text-xs md:text-sm font-bold text-gray-500 uppercase tracking-wider">
{getStatText(supportStat)}
</span>
</div>
</div>
</div>
<!-- CTA Блок -->
@ -133,7 +166,7 @@ const getStatText = (stat: typeof achievements[number]): string => {
entries.forEach(entry => {
if (!entry.isIntersecting) return;
const counter = entry.target;
const counter = entry.target as HTMLElement; // <-- Исправление: явное приведение к HTMLElement
const target = parseInt(counter.dataset.target || '0', 10);
let startTime: number | null = null;
@ -164,10 +197,7 @@ const getStatText = (stat: typeof achievements[number]): string => {
counters.forEach(counter => observer.observe(counter));
};
// Запускаем анимацию
initStatsAnimation();
// Для Astro View Transitions
document.addEventListener('astro:after-swap', initStatsAnimation);
document.addEventListener('astro:page-load', initStatsAnimation);
</script>

30
frontend/src/components/single-post/Comments.tsx
View file

@ -27,6 +27,12 @@ interface ApiComment {
};
}
// Тип для toast-уведомлений
interface ToastMessage {
type: "success" | "error";
message: string;
}
export default function Comments(props: CommentsProps) {
const [isAuthenticated, setIsAuthenticated] = createSignal(false);
const [currentUser, setCurrentUser] = createSignal<{
@ -39,6 +45,15 @@ export default function Comments(props: CommentsProps) {
const [replyTo, setReplyTo] = createSignal<string | null>(null);
const [commentAuthors, setCommentAuthors] = createSignal<Record<string, string>>({});
const [toastVisible, setToastVisible] = createSignal<string | null>(null);
// Добавляем сигнал для toast-уведомлений
const [toast, setToast] = createSignal<ToastMessage | null>(null);
// Функция показа toast-уведомлений
const showToast = (message: ToastMessage): void => {
setToast(message);
// Автоматически скрываем через 3 секунды
setTimeout(() => setToast(null), 3000);
};
onMount(async () => {
console.log("[Comments] Начало проверки авторизации...");
@ -260,6 +275,21 @@ export default function Comments(props: CommentsProps) {
return (
<>
{/* Глобальное toast-уведомление */}
<Show when={toast()}>
{(t) => (
<div
class={`fixed bottom-4 right-4 px-6 py-3 rounded-xl shadow-lg transition-all duration-300 z-50 ${
t().type === "success"
? "bg-green-500 text-white"
: "bg-red-500 text-white"
}`}
>
{t().message}
</div>
)}
</Show>
{isLoading() ? (
<div class="max-w-4xl mx-auto mt-12 pt-8 border-t border-gray-200">
<div class="flex items-center gap-3 mb-8">

12
frontend/src/lib/auth.ts
View file

@ -1,4 +1,5 @@
import PocketBase from 'pocketbase';
import type { RecordModel } from 'pocketbase';
// URL PocketBase сервера
const POCKETBASE_URL = import.meta.env.PUBLIC_POCKETBASE_URL || 'http://localhost:8090';
@ -22,30 +23,26 @@ export function saveAuthToCookie(): void {
// Автоматическое восстановление сессии при загрузке страницы
if (typeof document !== 'undefined') {
// Загружаем из cookies при инициализации
pb.authStore.loadFromCookie(document.cookie);
// Подписываемся на изменения
pb.authStore.onChange(() => {
saveAuthToCookie();
}, true);
}
// Типы для аутентификации
export interface AuthRecord {
id: string;
// Типы для аутентификации — расширяем RecordModel вместо дублирования
export interface AuthRecord extends RecordModel {
email: string;
name: string;
avatar?: string;
emailVisibility: boolean;
verified: boolean;
created: string;
updated: string;
}
// Функция входа пользователя
export async function login(email: string, password: string): Promise<AuthRecord> {
const authData = await pb.collection('users').authWithPassword(email, password);
// Теперь приведение типа безопасно, так как AuthRecord extends RecordModel
return authData.record as AuthRecord;
}
@ -64,7 +61,6 @@ export async function register(
emailVisibility: true,
});
// Автоматический вход после регистрации
await login(email, password);
return record as AuthRecord;

35
frontend/src/pages/auth/verify.astro
View file

@ -82,19 +82,19 @@ const seo = {
<script>
const urlParams = new URLSearchParams(window.location.search);
const email = urlParams.get('email');
const resendBtn = document.getElementById('resend-btn');
const resendBtn = document.getElementById('resend-btn') as HTMLButtonElement | null;
const timerText = document.getElementById('timer-text');
const countdownEl = document.getElementById('countdown');
const userEmailEl = document.getElementById('user-email');
// Логирование
function log(message, data) {
function log(message: string, data?: unknown): void {
const timestamp = new Date().toISOString();
console.log(`[VERIFY PAGE][${timestamp}] ${message}`, data || '');
}
// Отображение email
if (email) {
if (email && userEmailEl) {
userEmailEl.textContent = email;
log(`Страница загружена для email: ${email}`);
} else {
@ -105,23 +105,29 @@ const seo = {
let countdown = 60;
let canResend = true;
function startTimer() {
function startTimer(): void {
if (!resendBtn || !timerText || !countdownEl) return;
canResend = false;
resendBtn.disabled = true;
timerText.classList.remove('hidden');
countdown = 60;
countdownEl.textContent = countdown;
countdownEl.textContent = countdown.toString();
log('Таймер запущен');
const interval = setInterval(() => {
if (!countdownEl) return;
countdown--;
countdownEl.textContent = countdown;
countdownEl.textContent = countdown.toString();
if (countdown <= 0) {
clearInterval(interval);
canResend = true;
if (resendBtn) {
resendBtn.disabled = false;
timerText.classList.add('hidden');
}
timerText?.classList.add('hidden');
log('Таймер завершен, кнопка активна');
}
}, 1000);
@ -129,14 +135,14 @@ const seo = {
// Отправка повторного письма
resendBtn?.addEventListener('click', async () => {
if (!canResend || !email) {
if (!canResend || !email || !resendBtn) {
log(`Клик отклонен: canResend=${canResend}, email=${email}`);
return;
}
log('Отправка повторного письма подтверждения...');
const originalText = resendBtn.textContent;
const originalText = resendBtn.textContent || '';
resendBtn.textContent = 'Отправка...';
resendBtn.disabled = true;
@ -149,7 +155,7 @@ const seo = {
log(`Ответ сервера: ${response.status}`);
const data = await response.json();
const data = await response.json() as { error?: string };
log('Данные ответа:', data);
if (!response.ok) {
@ -159,12 +165,13 @@ const seo = {
alert('Письмо отправлено повторно! Проверьте вашу почту.');
log('✅ Письмо отправлено успешно');
startTimer();
} catch (error) {
} catch (error: unknown) {
console.error('Ошибка:', error);
log('❌ Ошибка отправки:', error.message);
alert(error.message || 'Ошибка отправки письма');
const errorMessage = error instanceof Error ? error.message : 'Неизвестная ошибка';
log('❌ Ошибка отправки:', errorMessage);
alert(errorMessage || 'Ошибка отправки письма');
} finally {
if (canResend) {
if (canResend && resendBtn) {
resendBtn.textContent = originalText;
}
}