add compomemts&front

2026-08-10 16:16:37 +03:00
parent b0ee07823e
commit b0754e8cdb
27 changed files with 5256 additions and 962 deletions
@@ -0,0 +1,105 @@
+import React from 'react';
+
+interface MainMenuProps {
+    onSectionSelect: (section: string) => void;
+    employee: any;
+}
+
+const MainMenu: React.FC<MainMenuProps> = ({ onSectionSelect, employee }) => {
+    console.log('🔵 MainMenu компонент рендерится!');
+    
+    const menuItems = [
+        { id: 'employee-info', title: 'Моя информация', emoji: '📋' },
+        { id: 'finance', title: 'Финансы', emoji: '💰' },
+        { id: 'medicine', title: 'Медицина', emoji: '🏥' },
+        { id: 'trade-union', title: 'Профсоюз', emoji: '🤝' },
+        { id: 'labor-safety', title: 'Охрана труда', emoji: '⛑️' },
+        { id: 'contacts', title: 'Контакты', emoji: '📞' },
+        { id: 'news', title: 'Новости', emoji: '📰' },
+        { id: 'profile', title: 'Обо мне', emoji: '👤' },
+    ];
+
+    return (
+        <div style={{
+            minHeight: '100vh',
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            justifyContent: 'center',
+            padding: '40px',
+            background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
+        }}>
+            {employee && (
+                <div style={{
+                    color: '#fff',
+                    fontSize: '1.2rem',
+                    marginBottom: '10px',
+                }}>
+                    Здравствуйте, {employee.ima} {employee.famaly}
+                </div>
+            )}
+            <h1 style={{
+                color: '#fff',
+                fontSize: '2.5rem',
+                marginBottom: '40px',
+                fontWeight: 300,
+            }}>
+                Выберите раздел
+            </h1>
+
+            <div style={{
+                display: 'grid',
+                gridTemplateColumns: 'repeat(auto-fit, minmax(150px, 200px))',
+                gap: '25px',
+                maxWidth: '900px',
+                width: '100%',
+                justifyContent: 'center',
+            }}>
+                {menuItems.map((item) => (
+                    <button
+                        key={item.id}
+                        onClick={() => onSectionSelect(item.id)}
+                        style={{
+                            display: 'flex',
+                            flexDirection: 'column',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            gap: '12px',
+                            padding: '25px 20px',
+                            background: 'rgba(255,255,255,0.95)',
+                            border: 'none',
+                            borderRadius: '16px',
+                            cursor: 'pointer',
+                            boxShadow: '0 8px 30px rgba(0,0,0,0.12)',
+                            minHeight: '140px',
+                            fontSize: '2.5rem',
+                            transition: 'all 0.3s ease',
+                        }}
+                        onMouseEnter={(e) => {
+                            e.currentTarget.style.transform = 'scale(1.05)';
+                            e.currentTarget.style.boxShadow = '0 12px 40px rgba(0,0,0,0.2)';
+                        }}
+                        onMouseLeave={(e) => {
+                            e.currentTarget.style.transform = 'scale(1)';
+                            e.currentTarget.style.boxShadow = '0 8px 30px rgba(0,0,0,0.12)';
+                        }}
+                    >
+                        <div>{item.emoji}</div>
+                        <span style={{
+                            fontSize: '1rem',
+                            fontWeight: 500,
+                            color: '#2d3436',
+                            textAlign: 'center',
+                        }}>
+                            {item.title}
+                        </span>
+                    </button>
+                ))}
+            </div>
+        </div>
+    );
+};
+
+console.log('🟢 MainMenu.tsx экспорт готов');
+
+export default MainMenu;