diff --git a/app/plans/page.tsx b/app/plans/page.tsx new file mode 100644 index 0000000..20339a0 --- /dev/null +++ b/app/plans/page.tsx @@ -0,0 +1,257 @@ +'use client'; + +import { useState } from 'react'; +import { ArrowLeft, Check } from 'lucide-react'; +import { useRouter } from 'next/navigation'; + +export default function Plans() { + const router = useRouter(); + const [isLoading, setIsLoading] = useState(false); + + const handlePurchase = async (planType: string) => { + // Проверяем есть ли уже активная подписка ЧЕРЕЗ API + const telegramWebApp = (window as any).Telegram?.WebApp; + const telegramId = telegramWebApp?.initDataUnsafe?.user?.id; + const telegramUsername = telegramWebApp?.initDataUnsafe?.user?.username; + + if (telegramId || telegramUsername) { + const params = new URLSearchParams(); + if (telegramId) params.append('telegramId', telegramId.toString()); + if (telegramUsername) params.append('telegramUsername', telegramUsername); + + const checkResponse = await fetch(`/api/user-subscription?${params.toString()}`); + const checkData = await checkResponse.json(); + + if (checkData.success && checkData.hasSubscription) { + const confirmOverwrite = confirm('У вас уже есть активная подписка. Создать новую? (старая будет заменена)'); + if (!confirmOverwrite) { + return; + } + } + } + + setIsLoading(true); + + try { + const telegramWebApp = (window as any).Telegram?.WebApp; + console.log('🔍 Telegram WebApp объект:', telegramWebApp); + console.log('🔍 initData:', telegramWebApp?.initData); + console.log('🔍 initDataUnsafe (FULL):', JSON.stringify(telegramWebApp?.initDataUnsafe, null, 2)); + console.log('🔍 user (FULL):', JSON.stringify(telegramWebApp?.initDataUnsafe?.user, null, 2)); + + const user = telegramWebApp?.initDataUnsafe?.user; + const telegramId = user?.id || null; + const telegramUsername = user?.username || null; + const firstName = user?.first_name || null; + const lastName = user?.last_name || null; + + console.log('📤 Отправляем:', { planType, telegramId, telegramUsername, firstName, lastName }); + + // Вызываем API для создания реального пользователя в Marzban + const response = await fetch('/api/create-user', { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + planType: planType, + telegramId: telegramId, + telegramUsername: telegramUsername, + firstName: firstName, + lastName: lastName, + }), + }); + + const data = await response.json(); + + if (!data.success) { + throw new Error(data.error || 'Failed to create subscription'); + } + + // Просто возвращаемся на главную - там данные обновятся автоматически + router.push('/'); + } catch (error) { + console.error('Purchase error:', error); + alert('Ошибка при создании подписки. Попробуйте позже.'); + } finally { + setIsLoading(false); + } + }; + return ( +
+ {/* Header */} +
+ +

+ Выбрать тариф +

+
+ +
+ {/* Trial - полная ширина */} +
+ handlePurchase('trial')} + isLoading={isLoading} + /> +
+ + {/* Grid 2x2 для остальных тарифов */} +
+ {/* Start */} + handlePurchase('start')} + isLoading={isLoading} + /> + + {/* Plus */} + handlePurchase('plus')} + isLoading={isLoading} + /> + + {/* Max */} + handlePurchase('max')} + isLoading={isLoading} + /> + + {/* Empty slot or promo */} +
+
+
💰
+
Скоро новые
+
тарифы
+
+
+
+
+
+ ); +} + +function PlanCard({ + badge, + title, + price, + features, + buttonText, + isPrimary = false, + isPopular = false, + onPurchase, + isLoading = false, +}: { + badge: string; + title: string; + price: string; + features: string[]; + buttonText: string; + isPrimary?: boolean; + isPopular?: boolean; + onPurchase: () => void; + isLoading?: boolean; +}) { + return ( +
+ {isPopular && ( +
+ ⭐ ТОП +
+ )} +
{badge}
+

+ {title} +

+
+ {price} +
+ + + + +
+ ); +}