From defe869e3eb1d4ee20fad0248caf6bfa02660420 Mon Sep 17 00:00:00 2001 From: Andrei Duvakin Date: Wed, 12 Feb 2025 20:51:46 +0500 Subject: [PATCH] =?UTF-8?q?=D1=81=D0=B4=D0=B5=D0=BB=D0=B0=D0=BB=20=D0=B4?= =?UTF-8?q?=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=B8=D0=B5=20=D0=BF?= =?UTF-8?q?=D0=B0=D1=86=D0=B8=D0=B5=D0=BD=D1=82=D0=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-app/src/api/patients/AddPatient.jsx | 18 ++ web-app/src/pages/PatientsPage.jsx | 263 ++++++++++++------------ 2 files changed, 155 insertions(+), 126 deletions(-) create mode 100644 web-app/src/api/patients/AddPatient.jsx diff --git a/web-app/src/api/patients/AddPatient.jsx b/web-app/src/api/patients/AddPatient.jsx new file mode 100644 index 0000000..ab6dd7a --- /dev/null +++ b/web-app/src/api/patients/AddPatient.jsx @@ -0,0 +1,18 @@ +import axios from "axios"; +import CONFIG from "../../core/Config.jsx"; + + +const AddPatient = async (token, patient) => { + try { + const response = await axios.post(`${CONFIG.BASE_URL}/patients/`, patient, { + headers: { + Authorization: `Bearer ${token}`, + }, + }); + return response.data; + } catch (error) { + throw new Error(error.response.data.message); + } +}; + +export default AddPatient; \ No newline at end of file diff --git a/web-app/src/pages/PatientsPage.jsx b/web-app/src/pages/PatientsPage.jsx index dd208c3..a562e7c 100644 --- a/web-app/src/pages/PatientsPage.jsx +++ b/web-app/src/pages/PatientsPage.jsx @@ -1,155 +1,166 @@ import {useEffect, useState} from "react"; -import {Input, Select, List, FloatButton, Row, Col, message} from "antd"; -import {PlusOutlined} from "@ant-design/icons"; +import {Input, Select, List, FloatButton, Row, Col, message, Spin} from "antd"; +import {LoadingOutlined, PlusOutlined} from "@ant-design/icons"; import {useAuth} from "../AuthContext.jsx"; import getAllPatients from "../api/patients/GetAllPatients.jsx"; import PatientListCard from "../components/PatientListCard.jsx"; import PatientModal from "../components/PatientModal.jsx"; -import updatePatient from "../api/patients/UpdatePatient.jsx"; // Подключаем модальное окно +import updatePatient from "../api/patients/UpdatePatient.jsx"; +import addPatient from "../api/patients/AddPatient.jsx"; // Подключаем модальное окно 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); + const {user} = useAuth(); + const [searchText, setSearchText] = useState(""); + const [sortOrder, setSortOrder] = useState("asc"); + const [patients, setPatients] = useState([]); + const [error, setError] = useState(null); - const [current, setCurrent] = useState(1); - const [pageSize, setPageSize] = useState(10); + const [current, setCurrent] = useState(1); + const [pageSize, setPageSize] = useState(10); - const [isModalVisible, setIsModalVisible] = useState(false); - const [selectedPatient, setSelectedPatient] = useState(null); + const [isModalVisible, setIsModalVisible] = useState(false); + const [selectedPatient, setSelectedPatient] = useState(null); + const [loading, setLoading] = useState(true); - useEffect(() => { - if (!isModalVisible) { - const intervalId = setInterval(fetchPatients, 5000); - return () => clearInterval(intervalId); - } - }, [user, isModalVisible]); + useEffect(() => { + if (!isModalVisible) { + const intervalId = setInterval(fetchPatients, 5000); + return () => clearInterval(intervalId); + } + }, [user, isModalVisible]); - const fetchPatients = async () => { - if (!user || !user.token) return; + const fetchPatients = async () => { + if (!user || !user.token) return; + + try { + const data = await getAllPatients(user.token); + setPatients(data); + } catch (err) { + setError(err.message); + } + + if (loading) { + setLoading(false) + } + }; + + 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); + }); + + const handleAddPatient = () => { + setSelectedPatient(null); + setIsModalVisible(true); + }; + + const handleEditPatient = (patient) => { + setSelectedPatient(patient); + setIsModalVisible(true); + }; + + const handleCancel = () => { + setIsModalVisible(false); + }; + + const handleSubmit = async (newPatient) => { + if (selectedPatient) { try { - const data = await getAllPatients(user.token); - setPatients(data); - } catch (err) { - setError(err.message); - } - }; - - 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); - }); - - const handleAddPatient = () => { - setSelectedPatient(null); - setIsModalVisible(true); - }; - - const handleEditPatient = (patient) => { - setSelectedPatient(patient); - setIsModalVisible(true); - }; - - const handleCancel = () => { - setIsModalVisible(false); - }; - - const handleSubmit = async (newPatient) => { - if (selectedPatient) { - - try { - await updatePatient(user.token, selectedPatient.id, newPatient); - } catch (error) { - if (error.response?.status === 401) { - throw new Error("Ошибка авторизации: пользователь неяден или токен недействителен"); - } - throw new Error(error.message); + await updatePatient(user.token, selectedPatient.id, newPatient); + } catch (error) { + if (error.response?.status === 401) { + throw new Error("Ошибка авторизации: пользователь неяден или токен недействителен"); } + throw new Error(error.message); } + } - if (!selectedPatient) { - setPatients((prevPatients) => [...prevPatients, {id: Date.now(), ...newPatient}]); - message.success("Пациент успешно добавлен!"); + + if (!selectedPatient) { + + try { + await addPatient(user.token, newPatient); + } catch (error) { + if (error.response?.status === 401) { + throw new Error("Ошибка авторизации: пользователь неяден или токен недействителен"); + } + throw new Error(error.message); } - setIsModalVisible(false); - }; + } - return ( -
- - - setSearchText(e.target.value)} - style={{width: "100%"}} - /> - - - - - + setIsModalVisible(false); + }; - ( - { - handleEditPatient(patient); - }} - > - - - )} - pagination={{ - current, - pageSize, - showSizeChanger: true, - pageSizeOptions: ["5", "10", "20", "50"], - onChange: (page, newPageSize) => { - setCurrent(page); - setPageSize(newPageSize); - }, + return (
+ + + setSearchText(e.target.value)} + style={{width: "100%"}} + /> + + + + + + + {loading ? ( + }/> + ) : ( + ( { + handleEditPatient(patient); }} - /> + > + + )} + pagination={{ + current, + pageSize, + showSizeChanger: true, + pageSizeOptions: ["5", "10", "20", "50"], + onChange: (page, newPageSize) => { + setCurrent(page); + setPageSize(newPageSize); + }, + }} + /> + )} - } - style={{position: "fixed", bottom: 20, right: 20}} - onClick={handleAddPatient} - /> - -
- ); - } -; + } + style={{position: "fixed", bottom: 20, right: 20}} + onClick={handleAddPatient} + /> + + +
); +}; export default PatientsPage;