From bb08761d846ed2c56bd41c937a959251520c6f3d Mon Sep 17 00:00:00 2001
From: Andrei Duvakin <andrei@duvakin.ru>
Date: Sun, 9 Feb 2025 21:51:48 +0500
Subject: [PATCH] =?UTF-8?q?=D1=81=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20=D0=B7?=
 =?UTF-8?q?=D0=B0=D0=B3=D0=BE=D1=82=D0=BE=D0=B2=D0=BA=D1=83=20=D0=B4=D0=BB?=
 =?UTF-8?q?=D1=8F=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D1=8B=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/AppRouter.jsx          |  2 +
 web-app/src/AuthContext.jsx        |  2 +-
 web-app/src/api/GetAllPatients.jsx | 25 ++++++++++
 web-app/src/api/LoginRequest.jsx   |  5 +-
 web-app/src/pages/PatientsPage.jsx | 80 +++++++++++++++++++++++++++++-
 5 files changed, 109 insertions(+), 5 deletions(-)
 create mode 100644 web-app/src/api/GetAllPatients.jsx

diff --git a/web-app/src/AppRouter.jsx b/web-app/src/AppRouter.jsx
index 1c3a40e..7c17da1 100644
--- a/web-app/src/AppRouter.jsx
+++ b/web-app/src/AppRouter.jsx
@@ -2,6 +2,7 @@ import {Routes, Route, Navigate} from "react-router-dom";
 import PrivateRoute from "./components/PrivateRoute.jsx";
 import LoginPage from "./pages/LoginPage.jsx";
 import MainLayout from "./layouts/MainLayout.jsx";
+import PatientsPage from "./pages/PatientsPage.jsx";
 
 
 const AppRouter = () => (
@@ -11,6 +12,7 @@ const AppRouter = () => (
         <Route element={<PrivateRoute/>}>
             <Route element={<MainLayout/>}>
                 <Route path={"/"} element={<p>1234</p>}/>
+                <Route path={"/patients"} element={<PatientsPage/>}/>
                 <Route path={"*"} element={<Navigate to={"/"}/>}/>
             </Route>
         </Route>
diff --git a/web-app/src/AuthContext.jsx b/web-app/src/AuthContext.jsx
index 5a86161..59af6e8 100644
--- a/web-app/src/AuthContext.jsx
+++ b/web-app/src/AuthContext.jsx
@@ -1,6 +1,6 @@
 import {createContext, useState, useContext, useEffect} from "react";
 import PropTypes from "prop-types";
-import {loginUser} from "./api/LoginRequest.jsx";
+import loginUser from "./api/LoginRequest.jsx";
 
 const AuthContext = createContext(undefined);
 
diff --git a/web-app/src/api/GetAllPatients.jsx b/web-app/src/api/GetAllPatients.jsx
new file mode 100644
index 0000000..ed672b3
--- /dev/null
+++ b/web-app/src/api/GetAllPatients.jsx
@@ -0,0 +1,25 @@
+import axios from "axios";
+import CONFIG from "../core/Config.jsx";
+
+const getAllPatients = async (token) => {
+
+    if (!token) {
+        throw new Error("Ошибка авторизации: пользователь не аутентифицирован");
+    }
+
+    try {
+        const response = await axios.get(`${CONFIG.BASE_URL}/patients/`, {
+            headers: {
+                Authorization: `Bearer ${token}`,
+            },
+        });
+        return response.data;
+    } catch (error) {
+        if (error.response?.status === 401) {
+            throw new Error("Ошибка авторизации: пользователь не найден или токен недействителен");
+        }
+        throw new Error(error.message);
+    }
+};
+
+export default getAllPatients;
diff --git a/web-app/src/api/LoginRequest.jsx b/web-app/src/api/LoginRequest.jsx
index c4993ea..830f77e 100644
--- a/web-app/src/api/LoginRequest.jsx
+++ b/web-app/src/api/LoginRequest.jsx
@@ -1,8 +1,7 @@
 import axios from "axios";
 import CONFIG from "../core/Config.jsx";
 
-export const loginUser = async (loginData) => {
-    console.log(loginData)
+const loginUser = async (loginData) => {
     try {
         const response = await axios.post(`${CONFIG.BASE_URL}/login/`, loginData, {
             withCredentials: true,
@@ -16,3 +15,5 @@ export const loginUser = async (loginData) => {
         throw new Error(error.message);
     }
 };
+
+export default loginUser;
\ No newline at end of file
diff --git a/web-app/src/pages/PatientsPage.jsx b/web-app/src/pages/PatientsPage.jsx
index b8701fa..454a8d7 100644
--- a/web-app/src/pages/PatientsPage.jsx
+++ b/web-app/src/pages/PatientsPage.jsx
@@ -1,5 +1,81 @@
+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 getAllPatients from "../api/GetAllPatients.jsx";
+
+const {Search} = Input;
+const {Option} = Select;
+
 const PatientsPage = () => {
+    const { user } = useAuth();
+    const [searchText, setSearchText] = useState("");
+    const [sortOrder, setSortOrder] = useState("asc");
+    const [patients, setPatients] = useState([]);
+    const [error, setError] = useState(null);
+
+    useEffect(() => {
+        const fetchPatients = async () => {
+            if (!user || !user.token) return;
+
+            try {
+                const data = await getAllPatients(user.token);
+                setPatients(data);
+            } catch (err) {
+                setError(err.message);
+            }
+        };
+
+        fetchPatients();
+    }, [user]);
+
+    const filteredPatients = patients
+        .filter((patient) =>
+            `${patient.first_name} ${patient.last_name}`.toLowerCase().includes(searchText.toLowerCase())
+        )
+        .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 (
-    )
-}
\ No newline at end of file
+        <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>
+
+            <List
+                grid={{gutter: 16, column: 2}}
+                dataSource={filteredPatients}
+                renderItem={(patient) => (
+                    <List.Item>
+                        <Card title={`${patient.last_name} ${patient.first_name}`}>
+                            Информация о пациенте
+                        </Card>
+                    </List.Item>
+                )}
+            />
+
+            <FloatButton
+                icon={<PlusOutlined/>}
+                style={{position: "fixed", bottom: 20, right: 20}}
+                onClick={() => console.log("Добавить пациента")}
+            />
+        </div>
+    );
+};
+
+export default PatientsPage;