andrei/visus-plus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Андрей Дувакин 2025-03-29 10:30:26 +05:00
parent 26484676da
commit 1b7ddc6d8a
7 changed files with 61 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web-app/src/hooks/ui/useIssuesUI.js
View File

@ -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,

4
web-app/src/hooks/ui/useLensesUI.js
View File

@ -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,

2
web-app/src/hooks/ui/usePatientsUI.js
View File

@ -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,

22
web-app/src/pages/IssuesPage.jsx
View File

@ -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}

4
web-app/src/pages/PatientsPage.jsx
View File

@ -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}/>
}
];

33
web-app/src/pages/lenses_layout/LensesPage.jsx
View File

@ -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="Добавить линзу"
/>

10
web-app/src/pages/lenses_layout/SetLensesPage.jsx
View File

@ -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>