вынес стили из компонентов в ui хуки

web-app/src/hooks/ui/useIssuesUI.js

@@ -39,6 +39,16 @@ const useIssuesUI = (issues) => {
     const filterDates = [startFilterDateConverted, endFilterDateConverted];
     const isFilterDates = startFilterDate && endFilterDate;
 
+    const containerStyle = { padding: 20 };
+    const filterBarStyle = { marginBottom: 20 };
+    const formItemStyle = { width: "100%" };
+    const viewModIconStyle = { marginRight: 8 };
+    const advancedSearchCardStyle = {
+        marginBottom: 20,
+        boxShadow: "0 1px 6px rgba(0, 0, 0, 0.15)",
+        borderRadius: 8
+    };
+
     const handleSetSearchText = (value) => dispatch(setSearchText(value));
     const handleSetViewMode = (mode) => dispatch(setViewMode(mode));
     const handleSetCurrentPage = (page) => dispatch(setCurrentPage(page));
@@ -114,6 +124,11 @@ const useIssuesUI = (issues) => {
         pageSize,
         filterDates,
         isFilterDates,
+        containerStyle,
+        filterBarStyle,
+        formItemStyle,
+        viewModIconStyle,
+        advancedSearchCardStyle,
         handleAddIssue,
         handlePaginationChange,
         handleSetSearchText,

web-app/src/hooks/ui/useLensesUI.js

@@ -33,6 +33,8 @@ const useLensesUI = (lenses) => {
     const containerStyle = { padding: 20 };
     const filterBarStyle = { marginBottom: 20 };
     const formItemStyle = { width: "100%" };
+    const viewModIconStyle = { marginRight: 8 };
+    const tableActionButtonsStyle = {display: "flex", gap: "8px"};
 
     const handleSetSearchText = (value) => dispatch(setSearchText(value));
     const handleCloseModal = () => dispatch(closeModal());
@@ -108,6 +110,8 @@ const useLensesUI = (lenses) => {
         containerStyle,
         filterBarStyle,
         formItemStyle,
+        viewModIconStyle,
+        tableActionButtonsStyle,
         filteredLenses: filteredLenses.map(lens => ({...lens, key: lens.id})),
         handleSetSearchText,
         handleAddLens,

web-app/src/hooks/ui/usePatientsUI.js

@@ -33,6 +33,7 @@ const usePatientsUI = (patients) => {
     const containerStyle = { padding: 20 };
     const filterBarStyle = { marginBottom: 20 };
     const formItemStyle = { width: "100%" };
+    const viewModIconStyle = { marginRight: 8 };
 
     const handleSetSearchText = (value) => dispatch(setSearchText(value));
     const handleSetSortOrder = (value) => dispatch(setSortOrder(value));
@@ -93,6 +94,7 @@ const usePatientsUI = (patients) => {
         containerStyle,
         filterBarStyle,
         formItemStyle,
+        viewModIconStyle,
         pagination,
         filteredPatients: filteredPatients.map(p => ({ ...p, key: p.id })),
         handleSetSearchText,

web-app/src/pages/IssuesPage.jsx

@@ -10,7 +10,7 @@ import {
     Typography,
     Timeline,
     Grid,
-    Pagination
+    Pagination, Result
 } from "antd";
 import {DatabaseOutlined, PlusOutlined, UnorderedListOutlined} from "@ant-design/icons";
 import LensIssueViewModal from "../components/lens_issues/LensIssueViewModal.jsx";
@@ -34,12 +34,12 @@ const IssuesPage = () => {
         {
             value: "table",
             label: "Таблица",
-            icon: <DatabaseOutlined style={{marginRight: 8}}/>,
+            icon: <DatabaseOutlined style={issuesUI.viewModIconStyle}/>,
         },
         {
             value: "timeline",
             label: "Лента",
-            icon: <UnorderedListOutlined style={{marginRight: 8}}/>,
+            icon: <UnorderedListOutlined style={issuesUI.viewModIconStyle}/>,
         },
     ];
 
@@ -144,15 +144,23 @@ const IssuesPage = () => {
         );
     };
 
+    if (issuesData.isError) return (
+        <Result
+            status="error"
+            title="Ошибка"
+            subTitle="Произошла ошибка в работе страницы"
+        />
+    );
+
     return (
-        <div style={{padding: 20}}>
+        <div style={issuesUI.containerStyle}>
             <Title level={1}><DatabaseOutlined/> Выдача линз</Title>
-            <Row gutter={[16, 16]} style={{marginBottom: 20}}>
+            <Row gutter={[16, 16]} style={issuesUI.filterBarStyle}>
                 <Col xs={24} md={24} sm={24} xl={12}>
                     <Input
                         placeholder="Поиск по пациенту или врачу"
                         onChange={(e) => issuesUI.handleSetSearchText(e.target.value)}
-                        style={{width: "100%"}}
+                        style={issuesUI.formItemStyle}
                         allowClear
                     />
                 </Col>
@@ -169,7 +177,7 @@ const IssuesPage = () => {
                     >
                         <DatePicker.RangePicker
                             allowClear={false}
-                            style={{width: "100%"}}
+                            style={issuesUI.formItemStyle}
                             placeholder={["Дата начала", "Дата окончания"]}
                             format="DD.MM.YYYY"
                             value={issuesUI.isFilterDates && issuesUI.filterDates}

web-app/src/pages/PatientsPage.jsx

@@ -96,12 +96,12 @@ const PatientsPage = () => {
         {
             value: "tile",
             label: "Плитка",
-            icon: <BuildOutlined style={{marginRight: 8}}/>
+            icon: <BuildOutlined style={patientsUI.viewModIconStyle}/>
         },
         {
             value: "table",
             label: "Таблица",
-            icon: <TableOutlined style={{marginRight: 8}}/>
+            icon: <TableOutlined style={patientsUI.viewModIconStyle}/>
         }
     ];
 

web-app/src/pages/lenses_layout/LensesPage.jsx

@@ -43,12 +43,12 @@ const LensesPage = () => {
         {
             value: "tile",
             label: "Плитка",
-            icon: <BuildOutlined style={{marginRight: 8}}/>
+            icon: <BuildOutlined style={lensesUI.viewModIconStyle}/>
         },
         {
             value: "table",
             label: "Таблица",
-            icon: <TableOutlined style={{marginRight: 8}}/>
+            icon: <TableOutlined style={lensesUI.viewModIconStyle}/>
         }
     ];
 
@@ -115,7 +115,7 @@ const LensesPage = () => {
             key: "actions",
             fixed: 'right',
             render: (text, record) => (
-                <div style={{display: "flex", gap: "8px"}}>
+                <div style={lensesUI.tableActionButtonsStyle}>
                     <Button onClick={() => lensesUI.handleEditLens(record)}>Изменить</Button>
 
                     <Popconfirm
@@ -140,15 +140,15 @@ const LensesPage = () => {
     );
 
     return (
-        <div style={{padding: 20}}>
+        <div style={lensesUI.containerStyle}>
             <Title level={1}><FolderViewOutlined/> Линзы</Title>
-            <Row gutter={[16, 16]} style={{marginBottom: 20}}>
+            <Row gutter={[16, 16]} style={lensesUI.filterBarStyle}>
                 <Col xs={24} md={24} sm={24} xl={15}>
                     <Input
                         placeholder="Поиск линзы"
                         value={lensesUI.searchText}
                         onChange={(e) => lensesUI.handleSetSearchText(e.target.value)}
-                        style={{width: "100%"}}
+                        style={lensesUI.formItemStyle}
                         allowClear
                     />
                 </Col>
@@ -175,11 +175,7 @@ const LensesPage = () => {
             {lensesUI.showAdvancedSearch && (
                 <Card
                     title="Расширенный поиск"
-                    style={{
-                        marginBottom: 20,
-                        boxShadow: "0 1px 6px rgba(0, 0, 0, 0.15)",
-                        borderRadius: 8
-                    }}
+                    style={lensesUI.advancedSearchCardStyle}
                 >
                     <Row gutter={16}>
                         <Col xs={24} sm={12}>
@@ -188,7 +184,7 @@ const LensesPage = () => {
                                     <InputNumber
                                         value={lensesUI.searchParams.tor || 0}
                                         onChange={(value) => lensesUI.handleParamChange("tor", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                         defaultValue={0}
                                         step={0.1}
                                     />
@@ -198,7 +194,7 @@ const LensesPage = () => {
                                     <InputNumber
                                         value={lensesUI.searchParams.diameter || 0}
                                         onChange={(value) => lensesUI.handleParamChange("diameter", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                         defaultValue={0}
                                         step={0.1}
                                     />
@@ -208,7 +204,7 @@ const LensesPage = () => {
                                     <InputNumber
                                         value={lensesUI.searchParams.preset_refraction || 0}
                                         onChange={(value) => lensesUI.handleParamChange("preset_refraction", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                         defaultValue={0}
                                         step={0.1}
                                     />
@@ -218,7 +214,7 @@ const LensesPage = () => {
                                     <InputNumber
                                         value={lensesUI.searchParams.periphery_toricity || 0}
                                         onChange={(value) => lensesUI.handleParamChange("periphery_toricity", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                         defaultValue={0}
                                         step={0.1}
                                     />
@@ -232,7 +228,7 @@ const LensesPage = () => {
                                     <Select
                                         value={lensesUI.searchParams.side}
                                         onChange={(value) => lensesUI.handleParamChange("side", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                     >
                                         <Option value="all">Все</Option>
                                         <Option value="левая">Левая</Option>
@@ -244,7 +240,7 @@ const LensesPage = () => {
                                     <Select
                                         value={lensesUI.searchParams.issued}
                                         onChange={(value) => lensesUI.handleParamChange("issued", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                     >
                                         <Option value="all">Все</Option>
                                         <Option value={true}>Да</Option>
@@ -256,7 +252,7 @@ const LensesPage = () => {
                                     <InputNumber
                                         value={lensesUI.searchParams.trial || 0}
                                         onChange={(value) => lensesUI.handleParamChange("trial", value)}
-                                        style={{width: "100%"}}
+                                        style={lensesUI.formItemStyle}
                                         defaultValue={0}
                                         step={0.1}
                                     />
@@ -322,7 +318,6 @@ const LensesPage = () => {
             <FloatButton
                 icon={<PlusOutlined/>}
                 type="primary"
-                style={{position: "fixed", bottom: 40, right: 40}}
                 onClick={lensesUI.handleAddLens}
                 tooltip="Добавить линзу"
             />

web-app/src/pages/lenses_layout/SetLensesPage.jsx

@@ -1,4 +1,4 @@
-import {FloatButton, Input, List, Row, Typography} from "antd";
+import {FloatButton, Input, List, Result, Row, Typography} from "antd";
 import {PlusOutlined, SwitcherOutlined} from "@ant-design/icons";
 import SetListCard from "../../components/sets/SetListCard.jsx";
 import SetFormModal from "../../components/sets/SetFormModal.jsx";
@@ -13,6 +13,14 @@ const SetLensesPage = () => {
     const setsData = useSets();
     const setsUI = useSetsUI(setsData.sets);
 
+    if (setsData.isError) return (
+        <Result
+            status="error"
+            title="Ошибка"
+            subTitle="Произошла ошибка в работе страницы"
+        />
+    );
+
     return (
         <div style={setsUI.containerStyle}>
             <Title level={1}><SwitcherOutlined/> Наборы линз</Title>