02ad29e64b
- Добавлен компонент CalculatorNav для переключения между калькуляторами - Навигация сохраняет chat_id при переходах - Исправлен endpoint API (используется правильный путь с типом калькулятора) - Пересобран frontend для применения изменений
55 lines
1.5 KiB
TypeScript
55 lines
1.5 KiB
TypeScript
// 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>
|
||
);
|
||
}
|
||
|