diff --git a/web-app/src/components/lens_issues/LensIssueFormModal.jsx b/web-app/src/components/lens_issues/LensIssueFormModal.jsx index 4205539..fd827aa 100644 --- a/web-app/src/components/lens_issues/LensIssueFormModal.jsx +++ b/web-app/src/components/lens_issues/LensIssueFormModal.jsx @@ -1,25 +1,25 @@ import {useEffect, useState} from "react"; -import {Modal, Form, Input, Select, Collapse, Button, notification, List} from "antd"; +import {Modal, Form, Input, Select, Button, notification, Typography, Collapse, Steps} from "antd"; import PropTypes from "prop-types"; import getAllPatients from "../../api/patients/GetAllPatients.jsx"; import getAllLenses from "../../api/lenses/GetAllLenses.jsx"; import {useAuth} from "../../AuthContext.jsx"; const {Option} = Select; -const {Panel} = Collapse; const LensIssueFormModal = ({visible, onCancel, onSubmit}) => { const {user} = useAuth(); - - const [form] = Form.useForm(); const [patients, setPatients] = useState([]); const [lenses, setLenses] = useState([]); - const [selectedPatient, setSelectedPatient] = useState(null); - const [selectedLens, setSelectedLens] = useState(null); const [searchPatientString, setSearchPatientString] = useState(""); const [searchLensString, setSearchLensString] = useState(""); + const [selectedPatient, setSelectedPatient] = useState(null); + const [selectedLens, setSelectedLens] = useState(null); + + const [currentStep, setCurrentStep] = useState(0); + useEffect(() => { if (visible) { fetchPatients(); @@ -55,17 +55,15 @@ const LensIssueFormModal = ({visible, onCancel, onSubmit}) => { const handleOk = async () => { try { - const values = await form.validateFields(); - onSubmit({...values, patient: selectedPatient, lens: selectedLens}); - form.resetFields(); + // const values = await form.validateFields(); + onSubmit({...values, patient: selectedPatient}); setSelectedPatient(null); - setSelectedLens(null); } catch (errorInfo) { console.log("Validation Failed:", errorInfo); } }; - const flteredPatients = patients + const filteredPatients = patients .filter((patient) => { const searchLower = searchPatientString.toLowerCase(); @@ -74,13 +72,7 @@ const LensIssueFormModal = ({visible, onCancel, onSubmit}) => { .some(value => value.toLowerCase().includes(searchLower)); }); - const filteredLenses = lenses - .filter((lens) => { - const searchLower = searchLensString.toLowerCase(); - return lens.side.toLowerCase().includes(searchLower); - }); - - const items = flteredPatients.map((patient) => ( + const patientsItems = filteredPatients.map((patient) => ( { key: patient.id, label: `${patient.last_name} ${patient.first_name} (${new Date(patient.birthday).toLocaleDateString("ru-RU")})`, @@ -91,16 +83,151 @@ const LensIssueFormModal = ({visible, onCancel, onSubmit}) => {

Диагноз: {patient.diagnosis}

Email: {patient.email}

Телефон: {patient.phone}

+ , } )); + const filteredLenses = lenses.filter((lens) => { + const searchLower = searchLensString.toLowerCase(); + + return Object.values(lens) + .filter(value => typeof value === "string") + .some(value => value.toLowerCase().includes(searchLower)); + }) + + const lensesItems = filteredLenses.map((lens) => ( + { + key: lens.id, + label: `Линза ${lens.side} ${lens.diameter} мм`, + children: +
+

Диаметр: {lens.diameter}

+

Тор: {lens.tor}

+

Пресетная рефракция: {lens.preset_refraction}

+

Диаметр: {lens.diameter}

+

FVC: {lens.fvc}

+

Острота зрения (Trial): {lens.trial}

+

Периферийная торичность: {lens.periphery_toricity}

+

Сторона: {lens.side}

+

Esa: {lens.esa}

+ +
, + } + )); + + const SelectPatientStep = () => { + return selectedPatient ? ( +
+ + {selectedPatient.last_name} {selectedPatient.first_name} + +

Дата рождения: {new Date(selectedPatient.birthday).toLocaleDateString("ru-RU")}

+

Email: {selectedPatient.email}

+

Телефон: {selectedPatient.phone}

+ +
+ ) : ( + <> + setSearchPatientString(e.target.value)} + style={{marginBottom: 16}} + allowClear + /> + +
+ +
+ + ) + }; + + const SelectLensStep = () => { + return selectedLens ? ( +
+ + {selectedLens.diameter} {selectedLens.tor} {selectedLens.preset_refraction} + +

Диаметр: {selectedLens.diameter}

+

Тор: {selectedLens.tor}

+

Пресетная рефракция: {selectedLens.preset_refraction}

+

Диаметр: {selectedLens.diameter}

+

FVC: {selectedLens.fvc}

+

Острота зрения (Trial): {selectedLens.trial}

+

Периферийная торичность: {selectedLens.periphery_toricity}

+

Сторона: {selectedLens.side}

+

Esa: {selectedLens.esa}

+ +
+ ) : ( + <> + setSearchLensString(e.target.value)} + style={{marginBottom: 16}} + allowClear + /> + +
+ +
+ + ) + }; + + const ConfirmStep = () => { + return ( +
+ + {selectedPatient.last_name} {selectedPatient.first_name} + +

Дата рождения: {new Date(selectedPatient.birthday).toLocaleDateString("ru-RU")}

+

Email: {selectedPatient.email}

+

Телефон: {selectedPatient.phone}

+

Линза: {selectedLens.diameter} {selectedLens.tor} {selectedLens.preset_refraction}

+
+ ) + }; + + const steps = [ + { + title: 'Выбор пациента', + content: , + }, + { + title: 'Выбор линзы', + content: , + }, + { + title: 'Подтверждение', + content: , + }, + ] + return ( { - form.resetFields(); setSelectedPatient(null); setSelectedLens(null); onCancel(); @@ -111,44 +238,16 @@ const LensIssueFormModal = ({visible, onCancel, onSubmit}) => { maskClosable={false} centered > -
- - setSearchPatientString(e.target.value)} - style={{marginBottom: 16}} - allowClear - /> + {steps[currentStep].content} + -
- -
- - - - - - - - -
); }; @@ -157,37 +256,6 @@ LensIssueFormModal.propTypes = { visible: PropTypes.bool.isRequired, onCancel: PropTypes.func.isRequired, onSubmit: PropTypes.func.isRequired, - lensIssue: PropTypes.shape({ - issue_date: PropTypes.string, - patient: PropTypes.shape({ - first_name: PropTypes.string, - last_name: PropTypes.string, - patronymic: PropTypes.string, - birthday: PropTypes.string, - address: PropTypes.string, - email: PropTypes.string, - phone: PropTypes.string, - diagnosis: PropTypes.string, - correction: PropTypes.string, - }), - doctor: PropTypes.shape({ - last_name: PropTypes.string, - first_name: PropTypes.string, - login: PropTypes.string, - }), - lens: PropTypes.shape({ - id: PropTypes.number.isRequired, - tor: PropTypes.number.isRequired, - diameter: PropTypes.number.isRequired, - esa: PropTypes.number.isRequired, - fvc: PropTypes.number.isRequired, - preset_refraction: PropTypes.number.isRequired, - periphery_toricity: PropTypes.number.isRequired, - side: PropTypes.string.isRequired, - issued: PropTypes.bool.isRequired, - trial: PropTypes.number.isRequired, - }), - }), }; export default LensIssueFormModal; diff --git a/web-app/src/pages/IssuesPage.jsx b/web-app/src/pages/IssuesPage.jsx index 8675c80..2768634 100644 --- a/web-app/src/pages/IssuesPage.jsx +++ b/web-app/src/pages/IssuesPage.jsx @@ -30,8 +30,10 @@ const IssuesPage = () => { }, []); useEffect(() => { - const interval = setInterval(fetchLensIssues, 5000); - return () => clearInterval(interval); + if (!isModalVisible) { + const interval = setInterval(fetchLensIssues, 5000); + return () => clearInterval(interval); + } }, [user]); const fetchLensIssuesWithCache = async () => {