feat: Добавлена навигация между калькуляторами и исправлена ошибка API

- Добавлен компонент CalculatorNav для переключения между калькуляторами
- Навигация сохраняет chat_id при переходах
- Исправлен endpoint API (используется правильный путь с типом калькулятора)
- Пересобран frontend для применения изменений
This commit is contained in:
dosai 2025-11-01 20:18:57 +03:00
parent 281fc94838
commit 02ad29e64b
5 changed files with 76 additions and 2 deletions

View File

@ -0,0 +1,11 @@
// app/[calculator]/layout.tsx
// Layout для страниц калькуляторов с сохранением chat_id
export default function CalculatorLayout({
children,
}: {
children: React.ReactNode;
}) {
return <>{children}</>;
}

View File

@ -1,6 +1,11 @@
// app/page.tsx
// Главная страница с выбором калькулятора
import { redirect } from 'next/navigation';
import { getAvailableCalculators } from '@/lib/calculators';
export default function Home() {
// Редирект на калькулятор мыла по умолчанию
// Редирект на калькулятор мыла по умолчанию, если есть chat_id
// Иначе показываем список калькуляторов
redirect('/soap');
}

View File

@ -0,0 +1,54 @@
// components/CalculatorNav.tsx
// Навигация между калькуляторами
'use client';
import { usePathname, useSearchParams } from 'next/navigation';
export default function CalculatorNav() {
const pathname = usePathname();
const searchParams = useSearchParams();
const chatId = searchParams.get('chat_id');
// Сохраняем chat_id при переходах
const queryString = chatId ? `?chat_id=${chatId}` : '';
const calculators = [
{ id: 'soap', name: 'Мыло' },
{ id: 'candle', name: 'Свеча' },
];
const handleCalculatorChange = (calcId: string) => {
window.location.href = `/${calcId}${queryString}`;
};
return (
<div className="mb-6 bg-gray-700 rounded-lg p-4">
<h2 className="text-lg font-semibold text-gray-200 mb-3">
Выберите калькулятор:
</h2>
<div className="grid grid-cols-2 gap-2">
{calculators.map((calc) => {
const isActive = pathname === `/${calc.id}`;
return (
<button
key={calc.id}
onClick={() => handleCalculatorChange(calc.id)}
className={`
px-4 py-2 rounded-md text-center font-medium transition-colors
${isActive
? 'bg-sky-500 text-gray-100'
: 'bg-gray-600 text-gray-200 hover:bg-gray-500 active:bg-gray-400'
}
`}
>
{calc.name}
</button>
);
})}
</div>
</div>
);
}

View File

@ -8,6 +8,7 @@ import Image from 'next/image';
import { getCalculator } from '@/lib/calculators';
import { submitCalculator } from '@/lib/api';
import FormField from './FormField';
import CalculatorNav from './CalculatorNav';
import type { Calculator } from '@/types/calculator';
interface DynamicCalculatorProps {
@ -215,6 +216,9 @@ export default function DynamicCalculator({ calculatorType }: DynamicCalculatorP
/>
</div>
{/* Навигация между калькуляторами */}
<CalculatorNav />
{/* Предупреждение о chat_id */}
{chatId === null && (
<div className="bg-yellow-800 p-2 text-yellow-200 font-semibold rounded">

View File

@ -162,7 +162,7 @@ export default function SoapCalculator() {
}
try {
const res = await fetch(`${API_BASE_URL}/api/submit`, {
const res = await fetch(`${API_BASE_URL}/api/submit/soap`, {
method: 'POST',
body: formData,
});