Compare commits
2 Commits
a3e941b19f
...
24bd4aade4
| Author | SHA1 | Date | |
|---|---|---|---|
| 24bd4aade4 | |||
|
71f772f2b9 |
108
frontend/package-lock.json
generated
108
frontend/package-lock.json
generated
@@ -10,9 +10,12 @@
|
||||
"dependencies": {
|
||||
"@tailwindcss/postcss": "^4.1.18",
|
||||
"axios": "^1.13.2",
|
||||
"i18next": "^25.8.0",
|
||||
"i18next-browser-languagedetector": "^8.2.0",
|
||||
"lucide-react": "^0.561.0",
|
||||
"react": "^19.2.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"react-i18next": "^16.5.3",
|
||||
"react-router-dom": "^7.10.1",
|
||||
"zustand": "^5.0.9"
|
||||
},
|
||||
@@ -280,6 +283,15 @@
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/runtime": {
|
||||
"version": "7.28.6",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
|
||||
"integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/template": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
|
||||
@@ -2988,6 +3000,55 @@
|
||||
"hermes-estree": "0.25.1"
|
||||
}
|
||||
},
|
||||
"node_modules/html-parse-stringify": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
|
||||
"integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"void-elements": "3.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/i18next": {
|
||||
"version": "25.8.0",
|
||||
"resolved": "https://registry.npmjs.org/i18next/-/i18next-25.8.0.tgz",
|
||||
"integrity": "sha512-urrg4HMFFMQZ2bbKRK7IZ8/CTE7D8H4JRlAwqA2ZwDRFfdd0K/4cdbNNLgfn9mo+I/h9wJu61qJzH7jCFAhUZQ==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://locize.com"
|
||||
},
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://locize.com/i18next.html"
|
||||
},
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.28.4"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"typescript": "^5"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"typescript": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/i18next-browser-languagedetector": {
|
||||
"version": "8.2.0",
|
||||
"resolved": "https://registry.npmjs.org/i18next-browser-languagedetector/-/i18next-browser-languagedetector-8.2.0.tgz",
|
||||
"integrity": "sha512-P+3zEKLnOF0qmiesW383vsLdtQVyKtCNA9cjSoKCppTKPQVfKd2W8hbVo5ZhNJKDqeM7BOcvNoKJOjpHh4Js9g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.2"
|
||||
}
|
||||
},
|
||||
"node_modules/ignore": {
|
||||
"version": "5.3.2",
|
||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
||||
@@ -3731,6 +3792,33 @@
|
||||
"react": "^19.2.1"
|
||||
}
|
||||
},
|
||||
"node_modules/react-i18next": {
|
||||
"version": "16.5.3",
|
||||
"resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-16.5.3.tgz",
|
||||
"integrity": "sha512-fo+/NNch37zqxOzlBYrWMx0uy/yInPkRfjSuy4lqKdaecR17nvCHnEUt3QyzA8XjQ2B/0iW/5BhaHR3ZmukpGw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.28.4",
|
||||
"html-parse-stringify": "^3.0.1",
|
||||
"use-sync-external-store": "^1.6.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"i18next": ">= 25.6.2",
|
||||
"react": ">= 16.8.0",
|
||||
"typescript": "^5"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
},
|
||||
"react-native": {
|
||||
"optional": true
|
||||
},
|
||||
"typescript": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-refresh": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.18.0.tgz",
|
||||
@@ -3977,7 +4065,7 @@
|
||||
"version": "5.9.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
|
||||
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
|
||||
"dev": true,
|
||||
"devOptional": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
@@ -4059,6 +4147,15 @@
|
||||
"punycode": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/use-sync-external-store": {
|
||||
"version": "1.6.0",
|
||||
"resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
|
||||
"integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "7.2.7",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-7.2.7.tgz",
|
||||
@@ -4134,6 +4231,15 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/void-elements": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
|
||||
"integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/which": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
|
||||
@@ -12,9 +12,12 @@
|
||||
"dependencies": {
|
||||
"@tailwindcss/postcss": "^4.1.18",
|
||||
"axios": "^1.13.2",
|
||||
"i18next": "^25.8.0",
|
||||
"i18next-browser-languagedetector": "^8.2.0",
|
||||
"lucide-react": "^0.561.0",
|
||||
"react": "^19.2.0",
|
||||
"react-dom": "^19.2.0",
|
||||
"react-i18next": "^16.5.3",
|
||||
"react-router-dom": "^7.10.1",
|
||||
"zustand": "^5.0.9"
|
||||
},
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useEffect } from 'react';
|
||||
import { BrowserRouter, Routes, Route, Navigate, useLocation } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import Login from './pages/Login';
|
||||
import FamilyView from './pages/FamilyView';
|
||||
import AdminPanel from './pages/AdminPanel';
|
||||
@@ -10,6 +11,7 @@ import { authApi } from './api/client';
|
||||
import { Loader2 } from 'lucide-react';
|
||||
|
||||
function AppContent() {
|
||||
const { t } = useTranslation();
|
||||
const { user, isAuthenticated, isLoading, setUser, setIsLoading } = useStore();
|
||||
const location = useLocation();
|
||||
|
||||
@@ -41,7 +43,7 @@ function AppContent() {
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg">
|
||||
<div className="flex items-center gap-3 text-white">
|
||||
<Loader2 className="w-8 h-8 animate-spin" />
|
||||
<span className="text-xl font-medium">Загрузка...</span>
|
||||
<span className="text-xl font-medium">{t('common.loading')}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { X, AlertTriangle } from 'lucide-react';
|
||||
|
||||
interface ConfirmModalProps {
|
||||
@@ -13,12 +14,15 @@ interface ConfirmModalProps {
|
||||
export default function ConfirmModal({
|
||||
title,
|
||||
message,
|
||||
confirmText = 'Подтвердить',
|
||||
cancelText = 'Отмена',
|
||||
confirmText,
|
||||
cancelText,
|
||||
onConfirm,
|
||||
onCancel,
|
||||
variant = 'danger',
|
||||
}: ConfirmModalProps) {
|
||||
const { t } = useTranslation();
|
||||
const defaultConfirmText = confirmText || t('common.confirm');
|
||||
const defaultCancelText = cancelText || t('common.cancel');
|
||||
const getVariantStyles = () => {
|
||||
switch (variant) {
|
||||
case 'danger':
|
||||
@@ -67,13 +71,13 @@ export default function ConfirmModal({
|
||||
onClick={onCancel}
|
||||
className="flex-1 px-6 py-3 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-2xl transition-all font-semibold"
|
||||
>
|
||||
{cancelText}
|
||||
{defaultCancelText}
|
||||
</button>
|
||||
<button
|
||||
onClick={onConfirm}
|
||||
className={`flex-1 px-6 py-3 text-white rounded-2xl transition-all font-semibold ${styles.confirmButton}`}
|
||||
>
|
||||
{confirmText}
|
||||
{defaultConfirmText}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { shoppingItemApi } from '../api/client';
|
||||
import type { ShoppingItem } from '../types';
|
||||
import {
|
||||
@@ -23,6 +24,7 @@ type ConfirmAction =
|
||||
| { type: 'clear-all' };
|
||||
|
||||
export default function ShoppingListModal({ familyId, onClose }: ShoppingListModalProps) {
|
||||
const { t } = useTranslation();
|
||||
const [items, setItems] = useState<ShoppingItem[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [newItemName, setNewItemName] = useState('');
|
||||
@@ -41,7 +43,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
setItems(response.data);
|
||||
} catch (err) {
|
||||
console.error('Error loading shopping items:', err);
|
||||
alert('Ошибка загрузки списка покупок');
|
||||
alert(t('shopping.loadError'));
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -56,7 +58,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error adding item:', err);
|
||||
alert('Ошибка добавления покупки');
|
||||
alert(t('shopping.addError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -66,7 +68,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error toggling purchased status:', err);
|
||||
alert('Ошибка изменения статуса');
|
||||
alert(t('shopping.toggleError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -80,7 +82,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error deleting item:', err);
|
||||
alert('Ошибка удаления покупки');
|
||||
alert(t('shopping.deleteError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -99,7 +101,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error updating item:', err);
|
||||
alert('Ошибка обновления покупки');
|
||||
alert(t('shopping.updateError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -118,7 +120,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error marking all as purchased:', err);
|
||||
alert('Ошибка обновления списка');
|
||||
alert(t('shopping.markAllError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -132,7 +134,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
loadItems();
|
||||
} catch (err) {
|
||||
console.error('Error clearing all items:', err);
|
||||
alert('Ошибка очистки списка');
|
||||
alert(t('shopping.clearError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -160,22 +162,22 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
switch (confirmAction.type) {
|
||||
case 'delete-item':
|
||||
return {
|
||||
title: 'Удалить покупку?',
|
||||
message: 'Покупка будет удалена из списка безвозвратно.',
|
||||
confirmText: 'Удалить',
|
||||
title: t('confirm.deleteItem'),
|
||||
message: t('confirm.deleteItemMessage'),
|
||||
confirmText: t('common.delete'),
|
||||
};
|
||||
case 'mark-all':
|
||||
return {
|
||||
title: 'Пометить все как купленные?',
|
||||
message: 'Все покупки в списке будут отмечены как купленные.',
|
||||
confirmText: 'Пометить',
|
||||
title: t('confirm.markAll'),
|
||||
message: t('confirm.markAllMessage'),
|
||||
confirmText: t('confirm.markButton'),
|
||||
variant: 'info' as const,
|
||||
};
|
||||
case 'clear-all':
|
||||
return {
|
||||
title: 'Очистить список?',
|
||||
message: 'Все покупки будут удалены из списка безвозвратно.',
|
||||
confirmText: 'Очистить',
|
||||
title: t('confirm.clearAll'),
|
||||
message: t('confirm.clearAllMessage'),
|
||||
confirmText: t('shopping.clear'),
|
||||
};
|
||||
}
|
||||
};
|
||||
@@ -193,7 +195,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
<div className="p-3 bg-white/20 backdrop-blur-md rounded-2xl">
|
||||
<ShoppingCart className="w-8 h-8 text-white" />
|
||||
</div>
|
||||
<h2 className="text-3xl font-bold text-white">Список покупок</h2>
|
||||
<h2 className="text-3xl font-bold text-white">{t('shopping.title')}</h2>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
@@ -208,7 +210,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Добавить покупку..."
|
||||
placeholder={t('shopping.addPlaceholder')}
|
||||
value={newItemName}
|
||||
onChange={(e) => setNewItemName(e.target.value)}
|
||||
onKeyPress={(e) => e.key === 'Enter' && handleAddItem()}
|
||||
@@ -219,7 +221,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
className="px-6 py-3 bg-gradient-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold flex items-center gap-2"
|
||||
>
|
||||
<Plus className="w-5 h-5" />
|
||||
<span className="hidden sm:inline">Добавить</span>
|
||||
<span className="hidden sm:inline">{t('common.add')}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -232,7 +234,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
<div className="space-y-6">
|
||||
{unpurchasedItems.length > 0 && (
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-gray-700 mb-3">К покупке</h3>
|
||||
<h3 className="text-lg font-semibold text-gray-700 mb-3">{t('shopping.toBuy')}</h3>
|
||||
<div className="space-y-2">
|
||||
{unpurchasedItems.map((item) => (
|
||||
<div
|
||||
@@ -295,7 +297,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
|
||||
{purchasedItems.length > 0 && (
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-gray-700 mb-3">Куплено</h3>
|
||||
<h3 className="text-lg font-semibold text-gray-700 mb-3">{t('shopping.purchased')}</h3>
|
||||
<div className="space-y-2">
|
||||
{purchasedItems.map((item) => (
|
||||
<div
|
||||
@@ -328,7 +330,7 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
{items.length === 0 && (
|
||||
<div className="text-center py-12 text-gray-500">
|
||||
<ShoppingCart className="w-16 h-16 mx-auto mb-4 opacity-30" />
|
||||
<p className="text-lg">Список покупок пуст</p>
|
||||
<p className="text-lg">{t('shopping.empty')}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -343,14 +345,14 @@ export default function ShoppingListModal({ familyId, onClose }: ShoppingListMod
|
||||
className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-gradient-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold"
|
||||
>
|
||||
<Check className="w-5 h-5" />
|
||||
Все куплено
|
||||
{t('shopping.allPurchased')}
|
||||
</button>
|
||||
<button
|
||||
onClick={handleClearAll}
|
||||
className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-gradient-to-r from-red-500 to-red-600 text-white rounded-2xl hover:shadow-lg transition-all font-semibold"
|
||||
>
|
||||
<Trash2 className="w-5 h-5" />
|
||||
Очистить
|
||||
{t('shopping.clear')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
26
frontend/src/i18n/index.ts
Normal file
26
frontend/src/i18n/index.ts
Normal file
@@ -0,0 +1,26 @@
|
||||
import i18n from 'i18next';
|
||||
import { initReactI18next } from 'react-i18next';
|
||||
import LanguageDetector from 'i18next-browser-languagedetector';
|
||||
|
||||
import ru from './locales/ru.json';
|
||||
import en from './locales/en.json';
|
||||
|
||||
i18n
|
||||
.use(LanguageDetector)
|
||||
.use(initReactI18next)
|
||||
.init({
|
||||
resources: {
|
||||
ru: { translation: ru },
|
||||
en: { translation: en },
|
||||
},
|
||||
fallbackLng: 'ru',
|
||||
interpolation: {
|
||||
escapeValue: false,
|
||||
},
|
||||
detection: {
|
||||
order: ['navigator', 'htmlTag', 'localStorage'],
|
||||
caches: ['localStorage'],
|
||||
},
|
||||
});
|
||||
|
||||
export default i18n;
|
||||
143
frontend/src/i18n/locales/en.json
Normal file
143
frontend/src/i18n/locales/en.json
Normal file
@@ -0,0 +1,143 @@
|
||||
{
|
||||
"common": {
|
||||
"loading": "Loading...",
|
||||
"error": "Error",
|
||||
"cancel": "Cancel",
|
||||
"confirm": "Confirm",
|
||||
"delete": "Delete",
|
||||
"add": "Add",
|
||||
"create": "Create",
|
||||
"save": "Save",
|
||||
"back": "Back",
|
||||
"toHome": "Home",
|
||||
"logout": "Log out",
|
||||
"exit": "Exit",
|
||||
"currency": "$"
|
||||
},
|
||||
"login": {
|
||||
"title": "Family Budget",
|
||||
"subtitle": "Sign in to continue",
|
||||
"googleButton": "Sign in with Google",
|
||||
"authError": "Error getting authorization link"
|
||||
},
|
||||
"noFamily": {
|
||||
"welcome": "Welcome!",
|
||||
"createFamily": "Create your family",
|
||||
"familyName": "Family name",
|
||||
"familyNameRequired": "Family name *",
|
||||
"familyNamePlaceholder": "For example: Smith Family",
|
||||
"password": "Password",
|
||||
"passwordOptional": "(optional)",
|
||||
"passwordPlaceholder": "For access protection",
|
||||
"passwordHint": "Password will be needed to access the family budget",
|
||||
"createButton": "Create family",
|
||||
"adminPanel": "Admin panel",
|
||||
"enterFamilyName": "Enter family name",
|
||||
"alreadyInFamily": "You are already in a family",
|
||||
"createError": "Error creating family",
|
||||
"joiningFamily": "Joining family...",
|
||||
"invalidInvite": "Invite link is invalid or expired",
|
||||
"joinError": "Error joining family"
|
||||
},
|
||||
"family": {
|
||||
"defaultName": "Family",
|
||||
"totalLimit": "Total limit",
|
||||
"totalRemaining": "Total remaining",
|
||||
"shoppingList": "Shopping list",
|
||||
"inviteMember": "Invite member",
|
||||
"loadError": "Error loading categories"
|
||||
},
|
||||
"category": {
|
||||
"remaining": "Remaining:",
|
||||
"limit": "Limit:",
|
||||
"percentRemaining": "% remaining",
|
||||
"addExpense": "Add expense",
|
||||
"expense": "Expense",
|
||||
"reset": "Reset",
|
||||
"history": "History",
|
||||
"management": "Category management",
|
||||
"newCategory": "New category",
|
||||
"categoryName": "Category name",
|
||||
"categoryLimit": "Limit ($)",
|
||||
"addCategory": "Add category",
|
||||
"deleteConfirm": "Delete category?",
|
||||
"resetConfirm": "Delete all expenses for this category?",
|
||||
"createError": "Error creating category",
|
||||
"deleteError": "Error deleting category",
|
||||
"resetError": "Error resetting expenses"
|
||||
},
|
||||
"expense": {
|
||||
"addTitle": "Add expense",
|
||||
"amount": "Amount ($)",
|
||||
"amountPlaceholder": "0.00",
|
||||
"description": "Description",
|
||||
"descriptionPlaceholder": "Optional",
|
||||
"historyTitle": "Expense history",
|
||||
"noExpenses": "No expenses",
|
||||
"addError": "Error adding expense",
|
||||
"historyError": "Error loading expense history"
|
||||
},
|
||||
"invite": {
|
||||
"title": "Invite member",
|
||||
"description": "Create an invite link to add a new member to the family. The link will be valid for 7 days.",
|
||||
"createLink": "Create link",
|
||||
"creating": "Creating...",
|
||||
"sendLink": "Send this link to the person you want to invite:",
|
||||
"copyLink": "Copy link",
|
||||
"copied": "Copied!",
|
||||
"createError": "Error creating invite link",
|
||||
"pageTitle": "Family invitation",
|
||||
"pageDescription": "You have been invited to join a family budget. Sign in with Google to accept the invitation.",
|
||||
"loginAndJoin": "Sign in and join",
|
||||
"validating": "Validating invitation...",
|
||||
"joining": "Joining family...",
|
||||
"invalid": "Link is invalid or has expired",
|
||||
"notFound": "Link not found",
|
||||
"alreadyInFamily": "You are already in a family",
|
||||
"joinError": "Error joining family"
|
||||
},
|
||||
"admin": {
|
||||
"title": "Admin panel",
|
||||
"subtitle": "Family management",
|
||||
"accessDenied": "Access denied",
|
||||
"requiresAdmin": "Administrator rights required",
|
||||
"createFamily": "Create new family",
|
||||
"familyName": "Family name",
|
||||
"familyNamePlaceholder": "For example: Smith Family",
|
||||
"familyPassword": "Family password",
|
||||
"familyPasswordPlaceholder": "Protect your family with a password",
|
||||
"createButton": "Create family",
|
||||
"familyList": "Family list",
|
||||
"noFamilies": "No families found",
|
||||
"createFirst": "Create the first family",
|
||||
"fillNameAndPassword": "Fill in the family name and password",
|
||||
"createError": "Error creating family",
|
||||
"deleteConfirm": "Delete family?",
|
||||
"deleteError": "Error deleting family"
|
||||
},
|
||||
"shopping": {
|
||||
"title": "Shopping list",
|
||||
"addPlaceholder": "Add item...",
|
||||
"toBuy": "To buy",
|
||||
"purchased": "Purchased",
|
||||
"empty": "Shopping list is empty",
|
||||
"allPurchased": "All purchased",
|
||||
"clear": "Clear",
|
||||
"loadError": "Error loading shopping list",
|
||||
"addError": "Error adding item",
|
||||
"toggleError": "Error changing status",
|
||||
"deleteError": "Error deleting item",
|
||||
"updateError": "Error updating item",
|
||||
"markAllError": "Error updating list",
|
||||
"clearError": "Error clearing list"
|
||||
},
|
||||
"confirm": {
|
||||
"deleteItem": "Delete item?",
|
||||
"deleteItemMessage": "The item will be permanently removed from the list.",
|
||||
"markAll": "Mark all as purchased?",
|
||||
"markAllMessage": "All items in the list will be marked as purchased.",
|
||||
"markButton": "Mark",
|
||||
"clearAll": "Clear list?",
|
||||
"clearAllMessage": "All items will be permanently removed from the list."
|
||||
}
|
||||
}
|
||||
143
frontend/src/i18n/locales/ru.json
Normal file
143
frontend/src/i18n/locales/ru.json
Normal file
@@ -0,0 +1,143 @@
|
||||
{
|
||||
"common": {
|
||||
"loading": "Загрузка...",
|
||||
"error": "Ошибка",
|
||||
"cancel": "Отмена",
|
||||
"confirm": "Подтвердить",
|
||||
"delete": "Удалить",
|
||||
"add": "Добавить",
|
||||
"create": "Создать",
|
||||
"save": "Сохранить",
|
||||
"back": "Назад",
|
||||
"toHome": "На главную",
|
||||
"logout": "Выйти",
|
||||
"exit": "Выход",
|
||||
"currency": "₽"
|
||||
},
|
||||
"login": {
|
||||
"title": "Семейный бюджет",
|
||||
"subtitle": "Войдите, чтобы продолжить",
|
||||
"googleButton": "Войти через Google",
|
||||
"authError": "Ошибка при получении ссылки для авторизации"
|
||||
},
|
||||
"noFamily": {
|
||||
"welcome": "Добро пожаловать!",
|
||||
"createFamily": "Создайте свою семью",
|
||||
"familyName": "Название семьи",
|
||||
"familyNameRequired": "Название семьи *",
|
||||
"familyNamePlaceholder": "Например: Семья Ивановых",
|
||||
"password": "Пароль",
|
||||
"passwordOptional": "(необязательно)",
|
||||
"passwordPlaceholder": "Для защиты доступа",
|
||||
"passwordHint": "Пароль понадобится для доступа к бюджету семьи",
|
||||
"createButton": "Создать семью",
|
||||
"adminPanel": "Админ панель",
|
||||
"enterFamilyName": "Введите название семьи",
|
||||
"alreadyInFamily": "Вы уже состоите в семье",
|
||||
"createError": "Ошибка при создании семьи",
|
||||
"joiningFamily": "Присоединение к семье...",
|
||||
"invalidInvite": "Ссылка-приглашение недействительна или истекла",
|
||||
"joinError": "Ошибка при присоединении к семье"
|
||||
},
|
||||
"family": {
|
||||
"defaultName": "Семья",
|
||||
"totalLimit": "Общий лимит",
|
||||
"totalRemaining": "Общий остаток",
|
||||
"shoppingList": "Список покупок",
|
||||
"inviteMember": "Пригласить участника",
|
||||
"loadError": "Ошибка загрузки категорий"
|
||||
},
|
||||
"category": {
|
||||
"remaining": "Остаток:",
|
||||
"limit": "Лимит:",
|
||||
"percentRemaining": "% осталось",
|
||||
"addExpense": "Добавить расход",
|
||||
"expense": "Расход",
|
||||
"reset": "Обнулить",
|
||||
"history": "История",
|
||||
"management": "Управление категориями",
|
||||
"newCategory": "Новая категория",
|
||||
"categoryName": "Название категории",
|
||||
"categoryLimit": "Лимит (₽)",
|
||||
"addCategory": "Добавить категорию",
|
||||
"deleteConfirm": "Удалить категорию?",
|
||||
"resetConfirm": "Удалить все траты по этой категории?",
|
||||
"createError": "Ошибка создания категории",
|
||||
"deleteError": "Ошибка удаления категории",
|
||||
"resetError": "Ошибка сброса трат"
|
||||
},
|
||||
"expense": {
|
||||
"addTitle": "Добавить расход",
|
||||
"amount": "Сумма (₽)",
|
||||
"amountPlaceholder": "0.00",
|
||||
"description": "Описание",
|
||||
"descriptionPlaceholder": "Опционально",
|
||||
"historyTitle": "История трат",
|
||||
"noExpenses": "Нет трат",
|
||||
"addError": "Ошибка добавления расхода",
|
||||
"historyError": "Ошибка загрузки истории трат"
|
||||
},
|
||||
"invite": {
|
||||
"title": "Пригласить участника",
|
||||
"description": "Создайте ссылку-приглашение, чтобы добавить нового участника в семью. Ссылка будет действительна 7 дней.",
|
||||
"createLink": "Создать ссылку",
|
||||
"creating": "Создание...",
|
||||
"sendLink": "Отправьте эту ссылку участнику, которого хотите пригласить:",
|
||||
"copyLink": "Скопировать ссылку",
|
||||
"copied": "Скопировано!",
|
||||
"createError": "Ошибка создания ссылки-приглашения",
|
||||
"pageTitle": "Приглашение в семью",
|
||||
"pageDescription": "Вас пригласили присоединиться к семейному бюджету. Войдите через Google, чтобы принять приглашение.",
|
||||
"loginAndJoin": "Войти и присоединиться",
|
||||
"validating": "Проверка приглашения...",
|
||||
"joining": "Присоединение к семье...",
|
||||
"invalid": "Ссылка недействительна или срок её действия истёк",
|
||||
"notFound": "Ссылка не найдена",
|
||||
"alreadyInFamily": "Вы уже состоите в семье",
|
||||
"joinError": "Ошибка при присоединении к семье"
|
||||
},
|
||||
"admin": {
|
||||
"title": "Админ панель",
|
||||
"subtitle": "Управление семьями",
|
||||
"accessDenied": "Доступ запрещен",
|
||||
"requiresAdmin": "Требуются права администратора",
|
||||
"createFamily": "Создать новую семью",
|
||||
"familyName": "Название семьи",
|
||||
"familyNamePlaceholder": "Например: Семья Ивановых",
|
||||
"familyPassword": "Пароль семьи",
|
||||
"familyPasswordPlaceholder": "Защитите семью паролем",
|
||||
"createButton": "Создать семью",
|
||||
"familyList": "Список семей",
|
||||
"noFamilies": "Семьи не найдены",
|
||||
"createFirst": "Создайте первую семью",
|
||||
"fillNameAndPassword": "Заполните название и пароль семьи",
|
||||
"createError": "Ошибка создания семьи",
|
||||
"deleteConfirm": "Удалить семью?",
|
||||
"deleteError": "Ошибка удаления семьи"
|
||||
},
|
||||
"shopping": {
|
||||
"title": "Список покупок",
|
||||
"addPlaceholder": "Добавить покупку...",
|
||||
"toBuy": "К покупке",
|
||||
"purchased": "Куплено",
|
||||
"empty": "Список покупок пуст",
|
||||
"allPurchased": "Все куплено",
|
||||
"clear": "Очистить",
|
||||
"loadError": "Ошибка загрузки списка покупок",
|
||||
"addError": "Ошибка добавления покупки",
|
||||
"toggleError": "Ошибка изменения статуса",
|
||||
"deleteError": "Ошибка удаления покупки",
|
||||
"updateError": "Ошибка обновления покупки",
|
||||
"markAllError": "Ошибка обновления списка",
|
||||
"clearError": "Ошибка очистки списка"
|
||||
},
|
||||
"confirm": {
|
||||
"deleteItem": "Удалить покупку?",
|
||||
"deleteItemMessage": "Покупка будет удалена из списка безвозвратно.",
|
||||
"markAll": "Пометить все как купленные?",
|
||||
"markAllMessage": "Все покупки в списке будут отмечены как купленные.",
|
||||
"markButton": "Пометить",
|
||||
"clearAll": "Очистить список?",
|
||||
"clearAllMessage": "Все покупки будут удалены из списка безвозвратно."
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
import { StrictMode } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import './i18n'
|
||||
import './index.css'
|
||||
import App from './App.tsx'
|
||||
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { authApi, familyApi } from '../api/client';
|
||||
import { useStore } from '../store/useStore';
|
||||
import {
|
||||
@@ -14,6 +15,7 @@ import {
|
||||
} from 'lucide-react';
|
||||
|
||||
export default function AdminPanel() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const { user, logout: storeLogout } = useStore();
|
||||
|
||||
@@ -46,7 +48,7 @@ export default function AdminPanel() {
|
||||
|
||||
const handleCreateFamily = async () => {
|
||||
if (!newFamilyName.trim() || !newFamilyPassword.trim()) {
|
||||
alert('Заполните название и пароль семьи');
|
||||
alert(t('admin.fillNameAndPassword'));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -56,19 +58,19 @@ export default function AdminPanel() {
|
||||
setNewFamilyPassword('');
|
||||
loadFamilies();
|
||||
} catch (err) {
|
||||
alert('Ошибка создания семьи');
|
||||
alert(t('admin.createError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDeleteFamily = async (id: number) => {
|
||||
if (!confirm('Удалить семью?')) return;
|
||||
if (!confirm(t('admin.deleteConfirm'))) return;
|
||||
|
||||
try {
|
||||
await familyApi.delete(id);
|
||||
loadFamilies();
|
||||
} catch (err) {
|
||||
alert('Ошибка удаления семьи');
|
||||
alert(t('admin.deleteError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
@@ -84,17 +86,17 @@ export default function AdminPanel() {
|
||||
</div>
|
||||
</div>
|
||||
<h1 className="text-2xl sm:text-3xl font-bold text-gray-900 mb-2">
|
||||
Доступ запрещен
|
||||
{t('admin.accessDenied')}
|
||||
</h1>
|
||||
<p className="text-gray-600 mb-6 text-sm sm:text-base">
|
||||
Требуются права администратора
|
||||
{t('admin.requiresAdmin')}
|
||||
</p>
|
||||
<button
|
||||
onClick={() => navigate('/')}
|
||||
className="w-full flex items-center justify-center gap-2 px-4 py-3 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-xl transition-all duration-300 font-medium"
|
||||
>
|
||||
<ArrowLeft className="w-5 h-5" />
|
||||
Назад
|
||||
{t('common.back')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -110,10 +112,10 @@ export default function AdminPanel() {
|
||||
<Shield className="w-12 h-12 text-white" />
|
||||
</div>
|
||||
<h1 className="text-4xl sm:text-5xl font-bold text-white mb-2">
|
||||
Админ панель
|
||||
{t('admin.title')}
|
||||
</h1>
|
||||
<p className="text-purple-100 text-base sm:text-lg mb-6">
|
||||
Управление семьями
|
||||
{t('admin.subtitle')}
|
||||
</p>
|
||||
<div className="flex justify-center gap-3">
|
||||
<button
|
||||
@@ -121,14 +123,14 @@ export default function AdminPanel() {
|
||||
className="inline-flex items-center gap-2 px-5 py-3 bg-red-500/80 hover:bg-red-600 text-white rounded-2xl backdrop-blur-md transition-all duration-300 hover:shadow-lg font-medium"
|
||||
>
|
||||
<LogOut className="w-5 h-5" />
|
||||
Выход
|
||||
{t('common.exit')}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => navigate('/')}
|
||||
className="inline-flex items-center gap-2 px-5 py-3 bg-white/20 hover:bg-white/30 text-white rounded-2xl backdrop-blur-md transition-all duration-300 hover:shadow-lg font-medium"
|
||||
>
|
||||
<Home className="w-5 h-5" />
|
||||
На главную
|
||||
{t('common.toHome')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -139,7 +141,7 @@ export default function AdminPanel() {
|
||||
<Plus className="w-8 h-8 text-white" />
|
||||
</div>
|
||||
<h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
|
||||
Создать новую семью
|
||||
{t('admin.createFamily')}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
@@ -147,11 +149,11 @@ export default function AdminPanel() {
|
||||
<div>
|
||||
<label className="flex items-center justify-center gap-2 text-sm font-semibold text-gray-700 mb-3">
|
||||
<Users className="w-5 h-5 text-purple-600" />
|
||||
Название семьи
|
||||
{t('admin.familyName')}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Например: Семья Ивановых"
|
||||
placeholder={t('admin.familyNamePlaceholder')}
|
||||
value={newFamilyName}
|
||||
onChange={(e) => setNewFamilyName(e.target.value)}
|
||||
className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:ring-2 focus:ring-purple-500 focus:border-purple-500 transition-all font-medium text-center"
|
||||
@@ -160,11 +162,11 @@ export default function AdminPanel() {
|
||||
<div>
|
||||
<label className="flex items-center justify-center gap-2 text-sm font-semibold text-gray-700 mb-3">
|
||||
<Lock className="w-5 h-5 text-purple-600" />
|
||||
Пароль семьи
|
||||
{t('admin.familyPassword')}
|
||||
</label>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Защитите семью паролем"
|
||||
placeholder={t('admin.familyPasswordPlaceholder')}
|
||||
value={newFamilyPassword}
|
||||
onChange={(e) => setNewFamilyPassword(e.target.value)}
|
||||
className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:ring-2 focus:ring-purple-500 focus:border-purple-500 transition-all font-medium text-center"
|
||||
@@ -175,7 +177,7 @@ export default function AdminPanel() {
|
||||
className="w-full flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold text-lg"
|
||||
>
|
||||
<Plus className="w-6 h-6" />
|
||||
Создать семью
|
||||
{t('admin.createButton')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -186,7 +188,7 @@ export default function AdminPanel() {
|
||||
<Users className="w-8 h-8 text-white" />
|
||||
</div>
|
||||
<h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
|
||||
Список семей
|
||||
{t('admin.familyList')}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
@@ -196,10 +198,10 @@ export default function AdminPanel() {
|
||||
<Users className="w-20 h-20 text-purple-400" />
|
||||
</div>
|
||||
<p className="text-gray-600 text-lg sm:text-xl mb-2 font-semibold">
|
||||
Семьи не найдены
|
||||
{t('admin.noFamilies')}
|
||||
</p>
|
||||
<p className="text-gray-500 text-sm sm:text-base">
|
||||
Создайте первую семью
|
||||
{t('admin.createFirst')}
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
@@ -222,7 +224,7 @@ export default function AdminPanel() {
|
||||
className="w-full sm:w-auto flex items-center justify-center gap-2 px-5 py-3 bg-red-500 hover:bg-red-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg"
|
||||
>
|
||||
<Trash2 className="w-5 h-5" />
|
||||
Удалить
|
||||
{t('common.delete')}
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useParams, useNavigate } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { categoryApi, expenseApi, inviteLinkApi } from '../api/client';
|
||||
import { useStore } from '../store/useStore';
|
||||
import type { Category, Expense, InviteLinkResponse } from '../types';
|
||||
@@ -24,6 +25,7 @@ import {
|
||||
import ShoppingListModal from '../components/ShoppingListModal';
|
||||
|
||||
export default function FamilyView() {
|
||||
const { t } = useTranslation();
|
||||
const { familyId } = useParams<{ familyId: string }>();
|
||||
const navigate = useNavigate();
|
||||
const { selectedFamily } = useStore();
|
||||
@@ -82,7 +84,7 @@ export default function FamilyView() {
|
||||
setRemainingLimits(limits);
|
||||
console.log('All data loaded successfully');
|
||||
} catch (err: any) {
|
||||
const errorMsg = err.response?.data?.message || err.message || 'Ошибка загрузки категорий';
|
||||
const errorMsg = err.response?.data?.message || err.message || t('family.loadError');
|
||||
setError(errorMsg);
|
||||
console.error('Error loading categories:', err);
|
||||
} finally {
|
||||
@@ -103,28 +105,28 @@ export default function FamilyView() {
|
||||
setShowAddCategory(false);
|
||||
loadCategories();
|
||||
} catch (err: any) {
|
||||
const errorMsg = err.response?.data?.message || err.response?.statusText || err.message || 'Ошибка создания категории';
|
||||
alert(`Ошибка создания категории: ${errorMsg} (Статус: ${err.response?.status})`);
|
||||
const errorMsg = err.response?.data?.message || err.response?.statusText || err.message || t('category.createError');
|
||||
alert(`${t('category.createError')}: ${errorMsg}`);
|
||||
console.error('Full error:', err);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDeleteCategory = async (categoryId: number) => {
|
||||
if (!familyId) return;
|
||||
if (!confirm('Удалить категорию?')) return;
|
||||
if (!confirm(t('category.deleteConfirm'))) return;
|
||||
|
||||
try {
|
||||
await categoryApi.delete(parseInt(familyId), categoryId);
|
||||
loadCategories();
|
||||
} catch (err) {
|
||||
alert('Ошибка удаления категории');
|
||||
alert(t('category.deleteError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
|
||||
const handleResetLimit = async (categoryId: number) => {
|
||||
if (!familyId) return;
|
||||
if (!confirm('Удалить все траты по этой категории?')) return;
|
||||
if (!confirm(t('category.resetConfirm'))) return;
|
||||
|
||||
try {
|
||||
const expensesResponse = await expenseApi.getAllByCategory(
|
||||
@@ -142,7 +144,7 @@ export default function FamilyView() {
|
||||
|
||||
loadCategories();
|
||||
} catch (err) {
|
||||
alert('Ошибка сброса трат');
|
||||
alert(t('category.resetError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
@@ -160,7 +162,7 @@ export default function FamilyView() {
|
||||
setShowAddExpense(null);
|
||||
loadCategories();
|
||||
} catch (err) {
|
||||
alert('Ошибка добавления расхода');
|
||||
alert(t('expense.addError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
@@ -181,7 +183,7 @@ export default function FamilyView() {
|
||||
setCategoryExpenses(response.data);
|
||||
setShowHistory(categoryId);
|
||||
} catch (err) {
|
||||
alert('Ошибка загрузки истории трат');
|
||||
alert(t('expense.historyError'));
|
||||
console.error(err);
|
||||
}
|
||||
};
|
||||
@@ -192,7 +194,7 @@ export default function FamilyView() {
|
||||
const response = await inviteLinkApi.create({ expires_in_hours: 168 });
|
||||
setInviteLink(response.data);
|
||||
} catch (err) {
|
||||
alert('Ошибка создания ссылки-приглашения');
|
||||
alert(t('invite.createError'));
|
||||
console.error(err);
|
||||
} finally {
|
||||
setInviteLoading(false);
|
||||
@@ -221,7 +223,7 @@ export default function FamilyView() {
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg">
|
||||
<div className="flex items-center gap-3 text-white">
|
||||
<Loader2 className="w-8 h-8 animate-spin" />
|
||||
<span className="text-xl font-medium">Загрузка...</span>
|
||||
<span className="text-xl font-medium">{t('common.loading')}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -270,25 +272,25 @@ export default function FamilyView() {
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-white/20 hover:bg-white/30 text-white rounded-2xl backdrop-blur-md mb-6 transition-all duration-300 group"
|
||||
>
|
||||
<UserPlus className="w-5 h-5 group-hover:scale-110 transition-transform" />
|
||||
<span className="font-medium">Пригласить участника</span>
|
||||
<span className="font-medium">{t('family.inviteMember')}</span>
|
||||
</button>
|
||||
<div className="text-center">
|
||||
<div className="inline-flex p-4 bg-white/20 backdrop-blur-md rounded-2xl mb-4">
|
||||
<Wallet className="w-12 h-12 text-white" />
|
||||
</div>
|
||||
<h1 className="text-4xl sm:text-5xl font-bold text-white mb-6">
|
||||
{selectedFamily?.name || 'Семья'}
|
||||
{selectedFamily?.name || t('family.defaultName')}
|
||||
</h1>
|
||||
<div className="max-w-2xl mx-auto glass-effect rounded-2xl shadow-lg p-5">
|
||||
<div className="grid grid-cols-2 gap-4 mb-4">
|
||||
<div className="text-center">
|
||||
<p className="text-gray-600 font-medium text-sm mb-2">Общий лимит</p>
|
||||
<p className="text-gray-600 font-medium text-sm mb-2">{t('family.totalLimit')}</p>
|
||||
<p className="text-2xl sm:text-3xl font-bold text-gray-900">
|
||||
{getTotalLimit().toFixed(2)} ₽
|
||||
</p>
|
||||
</div>
|
||||
<div className="text-center border-l-2 border-gray-300">
|
||||
<p className="text-gray-600 font-medium text-sm mb-2">Общий остаток</p>
|
||||
<p className="text-gray-600 font-medium text-sm mb-2">{t('family.totalRemaining')}</p>
|
||||
<p className="text-2xl sm:text-3xl font-bold text-gray-900">
|
||||
{getTotalRemaining().toFixed(2)} ₽
|
||||
</p>
|
||||
@@ -299,7 +301,7 @@ export default function FamilyView() {
|
||||
className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gradient-to-r from-green-500 to-emerald-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold"
|
||||
>
|
||||
<ShoppingCart className="w-5 h-5" />
|
||||
Список покупок
|
||||
{t('family.shoppingList')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -341,21 +343,21 @@ export default function FamilyView() {
|
||||
className="flex items-center gap-2 px-4 py-2 bg-linear-to-r from-red-500 to-pink-500 text-white rounded-xl hover:shadow-lg transition-all duration-300 font-semibold whitespace-nowrap text-sm"
|
||||
>
|
||||
<TrendingDown className="w-4 h-4" />
|
||||
<span className="hidden sm:inline">Добавить расход</span>
|
||||
<span className="sm:hidden">Расход</span>
|
||||
<span className="hidden sm:inline">{t('category.addExpense')}</span>
|
||||
<span className="sm:hidden">{t('category.expense')}</span>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="space-y-3 mb-4">
|
||||
<div className="flex justify-between items-baseline">
|
||||
<span className="text-gray-600 font-medium text-sm">Остаток:</span>
|
||||
<span className="text-gray-600 font-medium text-sm">{t('category.remaining')}</span>
|
||||
<span className="text-2xl sm:text-3xl font-bold text-gray-900">
|
||||
{remaining.toFixed(2)} ₽
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex justify-between items-baseline text-gray-500 text-sm">
|
||||
<span>Лимит:</span>
|
||||
<span>{t('category.limit')}</span>
|
||||
<span className="text-base font-semibold">{limit.toFixed(2)} ₽</span>
|
||||
</div>
|
||||
|
||||
@@ -366,7 +368,7 @@ export default function FamilyView() {
|
||||
/>
|
||||
</div>
|
||||
<p className="text-xs text-gray-500 text-center font-medium">
|
||||
{percentage.toFixed(0)}% осталось
|
||||
{percentage.toFixed(0)}{t('category.percentRemaining')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -376,21 +378,21 @@ export default function FamilyView() {
|
||||
className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-yellow-500 hover:bg-yellow-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
|
||||
>
|
||||
<RotateCcw className="w-4 h-4" />
|
||||
<span>Обнулить</span>
|
||||
<span>{t('category.reset')}</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleShowHistory(category.id)}
|
||||
className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
|
||||
>
|
||||
<History className="w-4 h-4" />
|
||||
<span>История</span>
|
||||
<span>{t('category.history')}</span>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleDeleteCategory(category.id)}
|
||||
className="flex-1 flex items-center justify-center gap-1.5 px-3 py-2 bg-red-500 hover:bg-red-600 text-white rounded-xl transition-all font-semibold shadow-md hover:shadow-lg text-sm"
|
||||
>
|
||||
<Trash2 className="w-4 h-4" />
|
||||
<span>Удалить</span>
|
||||
<span>{t('common.delete')}</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -399,7 +401,7 @@ export default function FamilyView() {
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<h3 className="font-semibold text-gray-800 text-lg flex items-center gap-2">
|
||||
<History className="w-5 h-5" />
|
||||
История трат
|
||||
{t('expense.historyTitle')}
|
||||
</h3>
|
||||
<button
|
||||
onClick={() => setShowHistory(null)}
|
||||
@@ -410,7 +412,7 @@ export default function FamilyView() {
|
||||
</div>
|
||||
|
||||
{categoryExpenses.length === 0 ? (
|
||||
<p className="text-center text-gray-500 py-4">Нет трат</p>
|
||||
<p className="text-center text-gray-500 py-4">{t('expense.noExpenses')}</p>
|
||||
) : (
|
||||
<div className="space-y-2 max-h-96 overflow-y-auto">
|
||||
{categoryExpenses.map((expense) => (
|
||||
@@ -448,12 +450,12 @@ export default function FamilyView() {
|
||||
{showAddExpense === category.id && (
|
||||
<div className="bg-linear-to-br from-purple-50 to-blue-50 p-6 rounded-2xl border-2 border-purple-200">
|
||||
<h3 className="font-semibold text-gray-800 mb-4 text-center">
|
||||
Добавить расход
|
||||
{t('expense.addTitle')}
|
||||
</h3>
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Сумма (₽)
|
||||
{t('expense.amount')}
|
||||
</label>
|
||||
<input
|
||||
type="number"
|
||||
@@ -465,11 +467,11 @@ export default function FamilyView() {
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Описание
|
||||
{t('expense.description')}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Опционально"
|
||||
placeholder={t('expense.descriptionPlaceholder')}
|
||||
value={expenseDescription}
|
||||
onChange={(e) => setExpenseDescription(e.target.value)}
|
||||
className="w-full px-4 py-3 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all"
|
||||
@@ -481,7 +483,7 @@ export default function FamilyView() {
|
||||
className="flex-1 flex items-center justify-center gap-2 px-5 py-3 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all font-semibold"
|
||||
>
|
||||
<Plus className="w-5 h-5" />
|
||||
Добавить
|
||||
{t('common.add')}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setShowAddExpense(null)}
|
||||
@@ -504,26 +506,26 @@ export default function FamilyView() {
|
||||
<DollarSign className="w-8 h-8 text-white" />
|
||||
</div>
|
||||
<h2 className="text-2xl sm:text-3xl font-bold text-gray-800">
|
||||
Управление категориями
|
||||
{t('category.management')}
|
||||
</h2>
|
||||
</div>
|
||||
|
||||
{showAddCategory ? (
|
||||
<div className="mb-8 p-6 bg-linear-to-br from-purple-50 to-blue-50 rounded-2xl border-2 border-purple-200">
|
||||
<h3 className="font-bold text-gray-800 mb-5 text-center text-lg">
|
||||
Новая категория
|
||||
{t('category.newCategory')}
|
||||
</h3>
|
||||
<div className="space-y-4">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Название категории"
|
||||
placeholder={t('category.categoryName')}
|
||||
value={newCategoryName}
|
||||
onChange={(e) => setNewCategoryName(e.target.value)}
|
||||
className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all font-medium"
|
||||
/>
|
||||
<input
|
||||
type="number"
|
||||
placeholder="Лимит (₽)"
|
||||
placeholder={t('category.categoryLimit')}
|
||||
value={newCategoryLimit}
|
||||
onChange={(e) => setNewCategoryLimit(e.target.value)}
|
||||
className="w-full px-5 py-4 border-2 border-gray-300 rounded-2xl focus:border-purple-500 focus:ring-2 focus:ring-purple-200 transition-all font-medium text-center"
|
||||
@@ -534,13 +536,13 @@ export default function FamilyView() {
|
||||
className="flex-1 flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-green-500 to-green-600 text-white rounded-2xl hover:shadow-xl transition-all font-semibold"
|
||||
>
|
||||
<Plus className="w-5 h-5" />
|
||||
Создать
|
||||
{t('common.create')}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setShowAddCategory(false)}
|
||||
className="px-6 py-4 bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-2xl transition-all font-medium"
|
||||
>
|
||||
Отмена
|
||||
{t('common.cancel')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -551,7 +553,7 @@ export default function FamilyView() {
|
||||
className="w-full flex items-center justify-center gap-2 px-6 py-4 bg-linear-to-r from-purple-600 to-blue-600 text-white rounded-2xl hover:shadow-xl transition-all duration-300 font-semibold"
|
||||
>
|
||||
<Plus className="w-5 h-5" />
|
||||
Добавить категорию
|
||||
{t('category.addCategory')}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
@@ -572,7 +574,7 @@ export default function FamilyView() {
|
||||
<div className="p-3 bg-gradient-to-br from-purple-500 to-blue-500 rounded-2xl">
|
||||
<UserPlus className="w-6 h-6 text-white" />
|
||||
</div>
|
||||
<h2 className="text-xl font-bold text-gray-800">Пригласить участника</h2>
|
||||
<h2 className="text-xl font-bold text-gray-800">{t('invite.title')}</h2>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setShowInviteModal(false)}
|
||||
@@ -585,8 +587,7 @@ export default function FamilyView() {
|
||||
{!inviteLink ? (
|
||||
<div className="text-center">
|
||||
<p className="text-gray-600 mb-6">
|
||||
Создайте ссылку-приглашение, чтобы добавить нового участника в семью.
|
||||
Ссылка будет действительна 7 дней.
|
||||
{t('invite.description')}
|
||||
</p>
|
||||
<button
|
||||
onClick={handleCreateInviteLink}
|
||||
@@ -596,12 +597,12 @@ export default function FamilyView() {
|
||||
{inviteLoading ? (
|
||||
<>
|
||||
<Loader2 className="w-5 h-5 animate-spin" />
|
||||
Создание...
|
||||
{t('invite.creating')}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<UserPlus className="w-5 h-5" />
|
||||
Создать ссылку
|
||||
{t('invite.createLink')}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
@@ -609,7 +610,7 @@ export default function FamilyView() {
|
||||
) : (
|
||||
<div>
|
||||
<p className="text-gray-600 mb-4 text-center">
|
||||
Отправьте эту ссылку участнику, которого хотите пригласить:
|
||||
{t('invite.sendLink')}
|
||||
</p>
|
||||
<div className="bg-gray-100 rounded-2xl p-4 mb-4">
|
||||
<p className="text-sm text-gray-800 break-all font-mono">
|
||||
@@ -627,12 +628,12 @@ export default function FamilyView() {
|
||||
{copied ? (
|
||||
<>
|
||||
<Check className="w-5 h-5" />
|
||||
Скопировано!
|
||||
{t('invite.copied')}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Copy className="w-5 h-5" />
|
||||
Скопировать ссылку
|
||||
{t('invite.copyLink')}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useParams, useNavigate } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { inviteLinkApi, authApi } from '../api/client';
|
||||
import { useStore } from '../store/useStore';
|
||||
import { Loader2, Users, UserPlus, AlertCircle } from 'lucide-react';
|
||||
|
||||
export default function InvitePage() {
|
||||
const { t } = useTranslation();
|
||||
const { token } = useParams<{ token: string }>();
|
||||
const navigate = useNavigate();
|
||||
const { isAuthenticated, setUser } = useStore();
|
||||
@@ -37,10 +39,10 @@ export default function InvitePage() {
|
||||
setIsValid(true);
|
||||
setFamilyName(response.data.family_name);
|
||||
} else {
|
||||
setError('Ссылка недействительна или срок её действия истёк');
|
||||
setError(t('invite.invalid'));
|
||||
}
|
||||
} catch (err) {
|
||||
setError('Ссылка не найдена');
|
||||
setError(t('invite.notFound'));
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -61,9 +63,9 @@ export default function InvitePage() {
|
||||
}
|
||||
} catch (err: any) {
|
||||
if (err.response?.status === 400) {
|
||||
setError('Вы уже состоите в семье');
|
||||
setError(t('invite.alreadyInFamily'));
|
||||
} else {
|
||||
setError('Ошибка при присоединении к семье');
|
||||
setError(t('invite.joinError'));
|
||||
}
|
||||
} finally {
|
||||
setJoining(false);
|
||||
@@ -78,7 +80,7 @@ export default function InvitePage() {
|
||||
const response = await authApi.getGoogleAuthUrl(window.location.href);
|
||||
window.location.href = response.data.url;
|
||||
} catch (err) {
|
||||
setError('Ошибка при получении ссылки для авторизации');
|
||||
setError(t('login.authError'));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -87,7 +89,7 @@ export default function InvitePage() {
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg">
|
||||
<div className="flex items-center gap-3 text-white">
|
||||
<Loader2 className="w-8 h-8 animate-spin" />
|
||||
<span className="text-xl font-medium">Проверка приглашения...</span>
|
||||
<span className="text-xl font-medium">{t('invite.validating')}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -98,7 +100,7 @@ export default function InvitePage() {
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg">
|
||||
<div className="flex items-center gap-3 text-white">
|
||||
<Loader2 className="w-8 h-8 animate-spin" />
|
||||
<span className="text-xl font-medium">Присоединение к семье...</span>
|
||||
<span className="text-xl font-medium">{t('invite.joining')}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -111,13 +113,13 @@ export default function InvitePage() {
|
||||
<div className="p-4 bg-red-100 rounded-2xl inline-block mb-6">
|
||||
<AlertCircle className="w-12 h-12 text-red-500" />
|
||||
</div>
|
||||
<h1 className="text-2xl font-bold text-gray-800 mb-4">Ошибка</h1>
|
||||
<h1 className="text-2xl font-bold text-gray-800 mb-4">{t('common.error')}</h1>
|
||||
<p className="text-gray-600 mb-6">{error}</p>
|
||||
<button
|
||||
onClick={() => navigate('/')}
|
||||
className="px-6 py-3 bg-gradient-to-r from-purple-600 to-blue-600 text-white rounded-2xl font-semibold hover:shadow-xl transition-all"
|
||||
>
|
||||
На главную
|
||||
{t('common.toHome')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -131,21 +133,20 @@ export default function InvitePage() {
|
||||
<Users className="w-12 h-12 text-white" />
|
||||
</div>
|
||||
<h1 className="text-2xl font-bold text-gray-800 mb-2">
|
||||
Приглашение в семью
|
||||
{t('invite.pageTitle')}
|
||||
</h1>
|
||||
<p className="text-3xl font-bold text-purple-600 mb-6">
|
||||
{familyName}
|
||||
</p>
|
||||
<p className="text-gray-600 mb-8">
|
||||
Вас пригласили присоединиться к семейному бюджету.
|
||||
Войдите через Google, чтобы принять приглашение.
|
||||
{t('invite.pageDescription')}
|
||||
</p>
|
||||
<button
|
||||
onClick={handleGoogleLogin}
|
||||
className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-gradient-to-r from-purple-600 to-blue-600 text-white rounded-2xl font-semibold hover:shadow-xl transition-all"
|
||||
>
|
||||
<UserPlus className="w-5 h-5" />
|
||||
Войти и присоединиться
|
||||
{t('invite.loginAndJoin')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
import { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { authApi } from '../api/client';
|
||||
import { Loader2, Wallet } from 'lucide-react';
|
||||
|
||||
export default function Login() {
|
||||
const { t } = useTranslation();
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState('');
|
||||
|
||||
@@ -14,7 +16,7 @@ export default function Login() {
|
||||
const response = await authApi.getGoogleAuthUrl(currentUrl);
|
||||
window.location.href = response.data.url;
|
||||
} catch (err) {
|
||||
setError('Ошибка при получении ссылки для авторизации');
|
||||
setError(t('login.authError'));
|
||||
console.error(err);
|
||||
setLoading(false);
|
||||
}
|
||||
@@ -29,10 +31,10 @@ export default function Login() {
|
||||
<Wallet className="w-12 h-12" />
|
||||
</div>
|
||||
<h1 className="text-3xl sm:text-4xl font-bold text-gray-900 mb-2">
|
||||
Семейный бюджет
|
||||
{t('login.title')}
|
||||
</h1>
|
||||
<p className="text-gray-600">
|
||||
Войдите, чтобы продолжить
|
||||
{t('login.subtitle')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -69,7 +71,7 @@ export default function Login() {
|
||||
d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
|
||||
/>
|
||||
</svg>
|
||||
Войти через Google
|
||||
{t('login.googleButton')}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useStore } from '../store/useStore';
|
||||
import { authApi, familyApi, inviteLinkApi } from '../api/client';
|
||||
import { Users, LogOut, Settings, Plus, Loader2, Eye, EyeOff } from 'lucide-react';
|
||||
|
||||
export default function NoFamily() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const { user, logout, setUser } = useStore();
|
||||
|
||||
@@ -37,9 +39,9 @@ export default function NoFamily() {
|
||||
}
|
||||
} catch (err: any) {
|
||||
if (err.response?.status === 400) {
|
||||
setError('Ссылка-приглашение недействительна или истекла');
|
||||
setError(t('noFamily.invalidInvite'));
|
||||
} else {
|
||||
setError('Ошибка при присоединении к семье');
|
||||
setError(t('noFamily.joinError'));
|
||||
}
|
||||
} finally {
|
||||
setJoiningFamily(false);
|
||||
@@ -64,7 +66,7 @@ export default function NoFamily() {
|
||||
e.preventDefault();
|
||||
|
||||
if (!familyName.trim()) {
|
||||
setError('Введите название семьи');
|
||||
setError(t('noFamily.enterFamilyName'));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -87,12 +89,12 @@ export default function NoFamily() {
|
||||
if (err && typeof err === 'object' && 'response' in err) {
|
||||
const axiosError = err as { response?: { status?: number } };
|
||||
if (axiosError.response?.status === 409) {
|
||||
setError('Вы уже состоите в семье');
|
||||
setError(t('noFamily.alreadyInFamily'));
|
||||
} else {
|
||||
setError('Ошибка при создании семьи');
|
||||
setError(t('noFamily.createError'));
|
||||
}
|
||||
} else {
|
||||
setError('Ошибка при создании семьи');
|
||||
setError(t('noFamily.createError'));
|
||||
}
|
||||
console.error(err);
|
||||
} finally {
|
||||
@@ -105,7 +107,7 @@ export default function NoFamily() {
|
||||
<div className="min-h-screen flex items-center justify-center gradient-bg">
|
||||
<div className="flex items-center gap-3 text-white">
|
||||
<Loader2 className="w-8 h-8 animate-spin" />
|
||||
<span className="text-xl font-medium">Присоединение к семье...</span>
|
||||
<span className="text-xl font-medium">{t('noFamily.joiningFamily')}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -120,7 +122,7 @@ export default function NoFamily() {
|
||||
<Users className="w-12 h-12" />
|
||||
</div>
|
||||
<h1 className="text-2xl sm:text-3xl font-bold text-gray-900 mb-2">
|
||||
Добро пожаловать!
|
||||
{t('noFamily.welcome')}
|
||||
</h1>
|
||||
<p className="text-gray-600">
|
||||
<span className="font-semibold text-purple-600">{user?.email || user?.username}</span>
|
||||
@@ -129,7 +131,7 @@ export default function NoFamily() {
|
||||
|
||||
<form onSubmit={handleCreateFamily} className="mb-6">
|
||||
<h2 className="text-lg font-semibold text-gray-800 mb-4 text-center">
|
||||
Создайте свою семью
|
||||
{t('noFamily.createFamily')}
|
||||
</h2>
|
||||
|
||||
{error && (
|
||||
@@ -141,14 +143,14 @@ export default function NoFamily() {
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label htmlFor="familyName" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Название семьи *
|
||||
{t('noFamily.familyNameRequired')}
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="familyName"
|
||||
value={familyName}
|
||||
onChange={(e) => setFamilyName(e.target.value)}
|
||||
placeholder="Например: Семья Ивановых"
|
||||
placeholder={t('noFamily.familyNamePlaceholder')}
|
||||
className="w-full px-4 py-3 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
|
||||
disabled={loading}
|
||||
/>
|
||||
@@ -156,7 +158,7 @@ export default function NoFamily() {
|
||||
|
||||
<div>
|
||||
<label htmlFor="password" className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Пароль <span className="text-gray-400">(необязательно)</span>
|
||||
{t('noFamily.password')} <span className="text-gray-400">{t('noFamily.passwordOptional')}</span>
|
||||
</label>
|
||||
<div className="relative">
|
||||
<input
|
||||
@@ -164,7 +166,7 @@ export default function NoFamily() {
|
||||
id="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
placeholder="Для защиты доступа"
|
||||
placeholder={t('noFamily.passwordPlaceholder')}
|
||||
className="w-full px-4 py-3 pr-12 border-2 border-gray-300 rounded-xl focus:border-purple-500 focus:outline-none transition-colors"
|
||||
disabled={loading}
|
||||
/>
|
||||
@@ -177,7 +179,7 @@ export default function NoFamily() {
|
||||
</button>
|
||||
</div>
|
||||
<p className="mt-1 text-xs text-gray-500">
|
||||
Пароль понадобится для доступа к бюджету семьи
|
||||
{t('noFamily.passwordHint')}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -191,7 +193,7 @@ export default function NoFamily() {
|
||||
) : (
|
||||
<>
|
||||
<Plus className="w-5 h-5" />
|
||||
Создать семью
|
||||
{t('noFamily.createButton')}
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
@@ -206,7 +208,7 @@ export default function NoFamily() {
|
||||
className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
|
||||
>
|
||||
<Settings className="w-5 h-5" />
|
||||
Админ панель
|
||||
{t('noFamily.adminPanel')}
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
@@ -214,7 +216,7 @@ export default function NoFamily() {
|
||||
className="w-full flex items-center justify-center gap-2 px-6 py-3 bg-gray-100 hover:bg-gray-200 text-gray-700 rounded-2xl transition-all duration-300 font-medium"
|
||||
>
|
||||
<LogOut className="w-5 h-5" />
|
||||
Выйти
|
||||
{t('common.logout')}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user