сделал карточку пациента

web-app/src/components/PatientListCard.jsx

@@ -0,0 +1,32 @@
+import { Card } from "antd";
+import PropTypes from "prop-types";
+
+const PatientListCard = ({ patient }) => {
+    return (
+        <Card
+            hoverable={true}
+            title={`${patient.last_name} ${patient.first_name}`}
+        >
+            <p><strong>📅 Дата рождения:</strong> {patient.birthday}</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>
+    );
+};
+
+PatientListCard.propTypes = {
+    patient: PropTypes.shape({
+        last_name: PropTypes.string.isRequired,
+        first_name: PropTypes.string.isRequired,
+        patronymic: PropTypes.string,
+        birthday: PropTypes.string.isRequired,
+        address: PropTypes.string,
+        email: PropTypes.string,
+        phone: PropTypes.string,
+        diagnosis: PropTypes.string,
+        correction: PropTypes.string,
+    }).isRequired,
+};
+
+export default PatientListCard;

web-app/src/pages/PatientsPage.jsx

@@ -3,6 +3,7 @@ import {Input, Select, List, Card, Button, FloatButton} 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;
@@ -58,13 +59,11 @@ const PatientsPage = () => {
             </div>
 
             <List
-                grid={{gutter: 16, column: 2}}
+                grid={{gutter: 16, column: 1}}
                 dataSource={filteredPatients}
                 renderItem={(patient) => (
                     <List.Item>
-                        <Card title={`${patient.last_name} ${patient.first_name}`}>
+                        <PatientListCard patient={patient}/>
-                            Информация о пациенте
-                        </Card>
                     </List.Item>
                 )}
             />