From 55687c6925c4260f5a2ec6b3321b14af0402d873 Mon Sep 17 00:00:00 2001
From: Andrei Duvakin <andrei@duvakin.ru>
Date: Mon, 10 Feb 2025 17:56:22 +0500
Subject: [PATCH] =?UTF-8?q?=D1=83=D0=BB=D1=83=D1=87=D1=88=D0=B8=D0=BB=20?=
 =?UTF-8?q?=D0=BE=D1=82=D0=BE=D0=B1=D1=80=D0=B0=D0=B6=D0=B5=D0=BD=D0=B8?=
 =?UTF-8?q?=D0=B5=20=D0=BA=D0=B0=D1=80=D1=82=D0=BE=D1=87=D0=B5=D0=BA=20?=
 =?UTF-8?q?=D1=81=20=D0=BF=D0=B0=D1=86=D0=B8=D0=B5=D0=BD=D1=82=D0=B0=D0=BC?=
 =?UTF-8?q?=D0=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web-app/src/components/PatientListCard.jsx |  9 ++--
 web-app/src/layouts/MainLayout.jsx         | 17 ++++---
 web-app/src/pages/PatientsPage.jsx         | 59 ++++++++++++----------
 3 files changed, 48 insertions(+), 37 deletions(-)

diff --git a/web-app/src/components/PatientListCard.jsx b/web-app/src/components/PatientListCard.jsx
index 783a65f..21db7c3 100644
--- a/web-app/src/components/PatientListCard.jsx
+++ b/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>
     );
 };
diff --git a/web-app/src/layouts/MainLayout.jsx b/web-app/src/layouts/MainLayout.jsx
index 5be754d..643342c 100644
--- a/web-app/src/layouts/MainLayout.jsx
+++ b/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,
-    LogoutOutlined
+    TeamOutlined,
+    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("Пациенты", "/patients", <SolutionOutlined/>),
+        getItem("Линзы", "/lenses", <FolderViewOutlined/>),
+        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>
diff --git a/web-app/src/pages/PatientsPage.jsx b/web-app/src/pages/PatientsPage.jsx
index abf9eab..6147602 100644
--- a/web-app/src/pages/PatientsPage.jsx
+++ b/web-app/src/pages/PatientsPage.jsx
@@ -1,12 +1,11 @@
-import {useEffect, useState} from "react";
-import {Input, Select, List, Card, Button, FloatButton} from "antd";
-import {PlusOutlined} from "@ant-design/icons";
-import {useAuth} from "../AuthContext.jsx";
+import { useEffect, useState } from "react";
+import { Input, Select, List, FloatButton, Row, Col } from "antd";
+import { PlusOutlined } from "@ant-design/icons";
+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={{display: "flex", gap: 10, marginBottom: 20}}>
-                <Search
-                    placeholder="Поиск пациента"
-                    onChange={(e) => setSearchText(e.target.value)}
-                    style={{flex: 1}}
-                />
-                <Select
-                    value={sortOrder}
-                    onChange={(value) => setSortOrder(value)}
-                    style={{width: 150}}
-                >
-                    <Option value="asc">А-Я</Option>
-                    <Option value="desc">Я-А</Option>
-                </Select>
-            </div>
+        <div style={{ padding: 20 }}>
+            <Row gutter={[16, 16]} style={{ marginBottom: 20 }}>
+                <Col xs={24} sm={16}>
+                    <Input
+                        placeholder="Поиск пациента"
+                        onChange={(e) => setSearchText(e.target.value)}
+                        style={{ width: "100%" }}
+                    />
+                </Col>
+                <Col xs={24} sm={8}>
+                    <Select
+                        value={sortOrder}
+                        onChange={(value) => setSortOrder(value)}
+                        style={{ width: "100%" }}
+                    >
+                        <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/>}
-                style={{position: "fixed", bottom: 20, right: 20}}
+                icon={<PlusOutlined />}
+                style={{ position: "fixed", bottom: 20, right: 20 }}
                 onClick={() => console.log("Добавить пациента")}
             />
         </div>