улучшил отображение карточек с пациентами

web-app/src/components/PatientListCard.jsx

@@ -2,15 +2,18 @@ import { Card } from "antd";
 import PropTypes from "prop-types";
 
 const PatientListCard = ({ patient }) => {
+    const birthday = new Date(patient.birthday)
+
     return (
         <Card
-            hoverable={true}
+            hoverable
+            type="inner"
             title={`${patient.last_name} ${patient.first_name}`}
+            style={{ marginBottom: 16, borderRadius: 12 }}
         >
-            <p><strong>📅 Дата рождения:</strong> {patient.birthday}</p>
+            <p><strong>📅 Дата рождения:</strong> {birthday.toLocaleString('ru-RU', {month: 'long', day: 'numeric', year: 'numeric'})}</p>
             {patient.phone && <p><strong>📞 Телефон:</strong> {patient.phone}</p>}
             {patient.email && <p><strong>✉️ Email:</strong> {patient.email}</p>}
-            {patient.diagnosis && <p><strong>🩺 Диагноз:</strong> {patient.diagnosis}</p>}
         </Card>
     );
 };

web-app/src/layouts/MainLayout.jsx

@@ -2,12 +2,14 @@ import {useState} from "react";
 import {Layout, Menu} from "antd";
 import {Outlet, useLocation, useNavigate} from "react-router-dom";
 import {
-    AppstoreOutlined,
+    HomeOutlined,
     CalendarOutlined,
     DatabaseOutlined,
+    FolderViewOutlined,
     UserOutlined,
-    SolutionOutlined,
+    TeamOutlined,
-    LogoutOutlined
+    LogoutOutlined,
+    MessageOutlined
 } from "@ant-design/icons";
 import {useAuth} from "../AuthContext.jsx";
 
@@ -22,11 +24,12 @@ const MainLayout = () => {
     const {logout} = useAuth();
 
     const menuItems = [
-        getItem("Главная", "/", <AppstoreOutlined/>),
+        getItem("Главная", "/", <HomeOutlined/>),
         getItem("Приёмы", "/appointments", <CalendarOutlined/>),
-        getItem("Линзы", "/lenses", <DatabaseOutlined/>),
+        getItem("Линзы", "/lenses", <FolderViewOutlined/>),
-        getItem("Пациенты", "/patients", <SolutionOutlined/>),
+        getItem("Пациенты", "/patients", <TeamOutlined/>),
         getItem("Выдачи линз", "/dispensing", <DatabaseOutlined/>),
+        getItem("Рассылки", "/mailing", <MessageOutlined/>),
         {type: "divider"},
         getItem("Мой профиль", "profile", <UserOutlined/>, [
             getItem("Перейти в профиль", "/profile", <UserOutlined/>),
@@ -62,7 +65,7 @@ const MainLayout = () => {
             </Sider>
 
             <Layout style={{marginLeft: collapsed ? 80 : 200, transition: "margin-left 0.2s"}}>
-                <Content style={{margin: "0 16px", padding: 24, minHeight: "100vh", overflow: "auto", background: "#fff", borderRadius: 8}}>
+                <Content style={{margin: "0 16px", padding: 24, minHeight: "100vh", overflow: "auto", background: "#fff", borderRadius: 8, marginTop: "15px"}}>
                     <Outlet/>
                 </Content>
                 <Footer style={{textAlign: "center"}}>Линза+ © {new Date().getFullYear()}</Footer>

web-app/src/pages/PatientsPage.jsx

@@ -1,12 +1,11 @@
-import {useEffect, useState} from "react";
+import { useEffect, useState } from "react";
-import {Input, Select, List, Card, Button, FloatButton} from "antd";
+import { Input, Select, List, FloatButton, Row, Col } from "antd";
-import {PlusOutlined} from "@ant-design/icons";
+import { PlusOutlined } from "@ant-design/icons";
-import {useAuth} from "../AuthContext.jsx";
+import { useAuth } from "../AuthContext.jsx";
 import getAllPatients from "../api/GetAllPatients.jsx";
 import PatientListCard from "../components/PatientListCard.jsx";
 
-const {Search} = Input;
+const { Option } = Select;
-const {Option} = Select;
 
 const PatientsPage = () => {
     const { user } = useAuth();
@@ -37,40 +36,46 @@ const PatientsPage = () => {
         .sort((a, b) => {
             const fullNameA = `${a.last_name} ${a.first_name}`;
             const fullNameB = `${b.last_name} ${b.first_name}`;
-            return sortOrder === "asc" ? fullNameA.localeCompare(fullNameB) : fullNameB.localeCompare(fullNameA);
+            return sortOrder === "asc"
+                ? fullNameA.localeCompare(fullNameB)
+                : fullNameB.localeCompare(fullNameA);
         });
 
     return (
-        <div style={{padding: 20}}>
+        <div style={{ padding: 20 }}>
-            <div style={{display: "flex", gap: 10, marginBottom: 20}}>
+            <Row gutter={[16, 16]} style={{ marginBottom: 20 }}>
-                <Search
+                <Col xs={24} sm={16}>
-                    placeholder="Поиск пациента"
+                    <Input
-                    onChange={(e) => setSearchText(e.target.value)}
+                        placeholder="Поиск пациента"
-                    style={{flex: 1}}
+                        onChange={(e) => setSearchText(e.target.value)}
-                />
+                        style={{ width: "100%" }}
-                <Select
+                    />
-                    value={sortOrder}
+                </Col>
-                    onChange={(value) => setSortOrder(value)}
+                <Col xs={24} sm={8}>
-                    style={{width: 150}}
+                    <Select
-                >
+                        value={sortOrder}
-                    <Option value="asc">А-Я</Option>
+                        onChange={(value) => setSortOrder(value)}
-                    <Option value="desc">Я-А</Option>
+                        style={{ width: "100%" }}
-                </Select>
+                    >
-            </div>
+                        <Option value="asc">А-Я</Option>
+                        <Option value="desc">Я-А</Option>
+                    </Select>
+                </Col>
+            </Row>
 
             <List
-                grid={{gutter: 16, column: 1}}
+                grid={{ gutter: 16, column: 1 }}
                 dataSource={filteredPatients}
                 renderItem={(patient) => (
                     <List.Item>
-                        <PatientListCard patient={patient}/>
+                        <PatientListCard patient={patient} />
                     </List.Item>
                 )}
             />
 
             <FloatButton
-                icon={<PlusOutlined/>}
+                icon={<PlusOutlined />}
-                style={{position: "fixed", bottom: 20, right: 20}}
+                style={{ position: "fixed", bottom: 20, right: 20 }}
                 onClick={() => console.log("Добавить пациента")}
             />
         </div>