+
Линзы
-
+
lensesUI.handleSetSearchText(e.target.value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchText}
+ onChange={(e) => lensesData.handleSetSearchText(e.target.value)}
+ style={lensesData.formItemStyle}
allowClear
/>
: }
+ onClick={lensesData.toggleAdvancedSearch}
+ icon={lensesData.showAdvancedSearch ? : }
block
>
Расширенный поиск
@@ -168,8 +165,8 @@ const LensesTab = () => {
{
- {lensesUI.showAdvancedSearch && (
+ {lensesData.showAdvancedSearch && (
lensesUI.handleParamChange("tor", value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchParams.tor || 0}
+ onChange={(value) => lensesData.handleParamChange("tor", value)}
+ style={lensesData.formItemStyle}
defaultValue={0}
step={0.1}
/>
-
lensesUI.handleParamChange("diameter", value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchParams.diameter || 0}
+ onChange={(value) => lensesData.handleParamChange("diameter", value)}
+ style={lensesData.formItemStyle}
defaultValue={0}
step={0.1}
/>
-
lensesUI.handleParamChange("preset_refraction", value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchParams.preset_refraction || 0}
+ onChange={(value) => lensesData.handleParamChange("preset_refraction", value)}
+ style={lensesData.formItemStyle}
defaultValue={0}
step={0.1}
/>
-
lensesUI.handleParamChange("periphery_toricity", value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchParams.periphery_toricity || 0}
+ onChange={(value) => lensesData.handleParamChange("periphery_toricity", value)}
+ style={lensesData.formItemStyle}
defaultValue={0}
step={0.1}
/>
-
-
-
lensesUI.handleParamChange("trial", value)}
- style={lensesUI.formItemStyle}
+ value={lensesData.searchParams.trial || 0}
+ onChange={(value) => lensesData.handleParamChange("trial", value)}
+ style={lensesData.formItemStyle}
defaultValue={0}
step={0.1}
/>
-
+ style={{ textAlign: screens.sm ? "right" : "center", marginTop: "1.7rem" }}>
diff --git a/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLenses.js b/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLenses.js
index 3308a78..9bc8923 100644
--- a/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLenses.js
+++ b/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLenses.js
@@ -1,28 +1,100 @@
-import {useDispatch, useSelector} from "react-redux";
+import { useEffect, useMemo } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import { notification } from "antd";
import {
useAddLensMutation,
useDeleteLensMutation,
useGetLensesQuery,
useUpdateLensMutation
} from "../../../../../Api/lensesApi.js";
-import {notification} from "antd";
-import {closeModal} from "../../../../../Redux/Slices/lensesSlice.js";
-
+import {
+ closeModal,
+ openModal,
+ selectLens,
+ setCurrentPage,
+ setPageSize,
+ setSearchParams,
+ setSearchText,
+ setShowAdvancedSearch,
+ setViewMode
+} from "../../../../../Redux/Slices/lensesSlice.js";
+import { getCachedInfo } from "../../../../../Utils/cachedInfoUtils.js";
const useLenses = () => {
const dispatch = useDispatch();
-
const {
+ searchText,
+ viewMode,
+ currentPage,
+ pageSize,
selectedLens,
+ isModalVisible,
+ showAdvancedSearch,
+ searchParams,
} = useSelector(state => state.lensesUI);
- const {data: lenses = [], isLoading, isError} = useGetLensesQuery(undefined, {
- pollingInterval: 20000,
- });
+ const { data = { lenses: [], total_count: 0 }, isLoading, isError } = useGetLensesQuery(
+ { page: currentPage, pageSize, search: searchText || undefined },
+ {
+ pollingInterval: 20000,
+ refetchOnMountOrArgChange: true,
+ }
+ );
- const [addLens, {isLoading: isAdding}] = useAddLensMutation();
- const [updateLens, {isLoading: isUpdating}] = useUpdateLensMutation();
- const [deleteLens, {isLoading: isDeleting}] = useDeleteLensMutation();
+ const [addLens, { isLoading: isAdding }] = useAddLensMutation();
+ const [updateLens, { isLoading: isUpdating }] = useUpdateLensMutation();
+ const [deleteLens, { isLoading: isDeleting }] = useDeleteLensMutation();
+
+ useEffect(() => {
+ document.title = "Линзы";
+ const cachedViewMode = getCachedInfo("viewModeLenses");
+ if (cachedViewMode) dispatch(setViewMode(cachedViewMode));
+ }, [dispatch]);
+
+ const containerStyle = { padding: 20 };
+ const filterBarStyle = { marginBottom: 20 };
+ const formItemStyle = { width: "100%" };
+ const viewModIconStyle = { marginRight: 8 };
+ const tableActionButtonsStyle = { display: "flex", gap: "8px" };
+ const advancedSearchCardStyle = { marginBottom: 20 };
+
+ const handleSetSearchText = (value) => {
+ dispatch(setSearchText(value));
+ dispatch(setCurrentPage(1)); // Сбрасываем на первую страницу при изменении поиска
+ };
+
+ const handleCloseModal = () => dispatch(closeModal());
+
+ const handleSetCurrentPage = (page) => dispatch(setCurrentPage(page));
+ const handleSetPageSize = (size) => dispatch(setPageSize(size));
+ const handleSetViewMode = (mode) => dispatch(setViewMode(mode));
+
+ const handleAddLens = () => {
+ dispatch(selectLens(null));
+ dispatch(openModal());
+ };
+
+ const handleEditLens = (lens) => {
+ dispatch(selectLens(lens));
+ dispatch(openModal());
+ };
+
+ const handleParamChange = (param, value) => {
+ if (typeof param === "object") {
+ dispatch(setSearchParams(param));
+ } else {
+ dispatch(setSearchParams({ ...searchParams, [param]: value }));
+ }
+ };
+
+ const toggleAdvancedSearch = () => {
+ dispatch(setShowAdvancedSearch(!showAdvancedSearch));
+ };
+
+ const handlePaginationChange = (page, pageSize) => {
+ handleSetCurrentPage(page);
+ handleSetPageSize(pageSize);
+ };
const handleDeleteLens = async (lensId) => {
try {
@@ -43,10 +115,9 @@ const useLenses = () => {
const handleModalSubmit = async (lensData) => {
dispatch(closeModal());
-
try {
if (selectedLens) {
- await updateLens({id: selectedLens.id, ...lensData}).unwrap();
+ await updateLens({ id: selectedLens.id, ...lensData }).unwrap();
notification.success({
message: "Линза обновлена",
description: "Линза успешно обновлена.",
@@ -69,14 +140,72 @@ const useLenses = () => {
}
};
+ const filteredLenses = useMemo(() => {
+ return data.lenses.filter((lens) => {
+ const textMatch = Object.values(lens).some((value) =>
+ value?.toString().toLowerCase().includes(searchText.toLowerCase())
+ );
+
+ const advancedMatch = Object.entries(searchParams).every(([key, value]) => {
+ if (value === null || value === '') return true;
+ if (key === 'side') {
+ if (value === 'all') return true;
+ return lens.side === value;
+ }
+ if (key === 'issued') {
+ return lens.issued === value || value === "all";
+ }
+ return lens[key] === value;
+ });
+
+ return textMatch && advancedMatch && (searchParams.issued || lens.issued === false);
+ }).sort((a, b) => {
+ return b.id - a.id; // Сортировка по убыванию id
+ });
+ }, [data.lenses, searchText, searchParams]);
+
+ const pagination = {
+ current: currentPage,
+ pageSize: pageSize,
+ total: data.total_count,
+ showSizeChanger: true,
+ pageSizeOptions: ["5", "10", "20", "50"],
+ onChange: (page, newPageSize) => {
+ handlePaginationChange(page, newPageSize);
+ },
+ };
+
return {
- lenses,
+ lenses: data.lenses,
+ filteredLenses: filteredLenses.map(lens => ({ ...lens, key: lens.id })),
isLoading,
isError,
isProcessing: isAdding || isUpdating || isDeleting,
+ searchText,
+ viewMode,
+ currentPage,
+ pageSize,
+ selectedLens,
+ isModalVisible,
+ showAdvancedSearch,
+ searchParams,
+ pagination,
+ containerStyle,
+ filterBarStyle,
+ formItemStyle,
+ viewModIconStyle,
+ tableActionButtonsStyle,
+ advancedSearchCardStyle,
+ handleSetSearchText,
+ handleAddLens,
+ handleEditLens,
+ handleCloseModal,
handleDeleteLens,
handleModalSubmit,
- }
+ handleParamChange,
+ toggleAdvancedSearch,
+ handleSetViewMode,
+ };
};
export default useLenses;
\ No newline at end of file
diff --git a/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLensesUI.js b/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLensesUI.js
deleted file mode 100644
index a840ed0..0000000
--- a/web-app/src/Components/Pages/LensesSetsPage/Components/LensesTab/useLensesUI.js
+++ /dev/null
@@ -1,128 +0,0 @@
-import {useEffect, useMemo} from "react";
-import {getCachedInfo} from "../../../../../Utils/cachedInfoUtils.js";
-import {
- closeModal,
- openModal,
- selectLens, setCurrentPage, setPageSize,
- setSearchParams,
- setSearchText, setShowAdvancedSearch,
- setViewMode
-} from "../../../../../Redux/Slices/lensesSlice.js";
-import {useDispatch, useSelector} from "react-redux";
-
-
-const useLensesUI = (lenses) => {
- const dispatch = useDispatch();
- const {
- searchText,
- viewMode,
- currentPage,
- pageSize,
- selectedLens,
- isModalVisible,
- showAdvancedSearch,
- searchParams,
- } = useSelector(state => state.lensesUI);
-
- useEffect(() => {
- document.title = "Линзы";
- const cachedViewMode = getCachedInfo("viewModeLenses");
- if (cachedViewMode) dispatch(setViewMode(cachedViewMode));
- }, [dispatch]);
-
- 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());
- const handleSetCurrentPage = (page) => dispatch(setCurrentPage(page));
- const handleSetPageSize = (size) => dispatch(setPageSize(size));
- const handleSetViewMode = (mode) => dispatch(setViewMode(mode));
-
- const handleAddLens = () => {
- dispatch(selectLens(null));
- dispatch(openModal());
- };
-
- const handleEditLens = (lens) => {
- dispatch(selectLens(lens));
- dispatch(openModal());
- };
-
- const handleParamChange = (param, value) => {
- dispatch(setSearchParams({...searchParams, [param]: value}));
- };
-
- const toggleAdvancedSearch = () => {
- dispatch(setShowAdvancedSearch(!showAdvancedSearch));
- };
-
- const handlePaginationChange = (page, pageSize) => {
- handleSetCurrentPage(page);
- handleSetPageSize(pageSize);
- };
-
- const filteredLenses = useMemo(() => {
- return lenses.filter((lens) => {
- const textMatch = Object.values(lens).some((value) =>
- value?.toString().toLowerCase().includes(searchText.toLowerCase())
- );
-
- const advancedMatch = Object.entries(searchParams).every(([key, value]) => {
- if (value === null || value === '') return true;
- if (key === 'side') {
- if (value === 'all') return true;
- return lens.side === value;
- }
- if (key === 'issued') {
- return lens.issued === value || value === "all";
- }
- return lens[key] === value;
- });
-
- return textMatch && advancedMatch && (searchParams.issued || lens.issued === false);
- }).sort((a, b) => {
- return b.id - a.id;
- });
- }, [lenses, searchText, searchParams]);
-
- const pagination = {
- currentPage: currentPage,
- pageSize: pageSize,
- showSizeChanger: true,
- pageSizeOptions: ["5", "10", "20", "50"],
- onChange: (page, newPageSize) => {
- handlePaginationChange(page, newPageSize);
- },
- };
-
- return {
- searchText,
- viewMode,
- currentPage,
- pageSize,
- selectedLens,
- isModalVisible,
- showAdvancedSearch,
- searchParams,
- pagination,
- containerStyle,
- filterBarStyle,
- formItemStyle,
- viewModIconStyle,
- tableActionButtonsStyle,
- filteredLenses: filteredLenses.map(lens => ({...lens, key: lens.id})),
- handleSetSearchText,
- handleAddLens,
- handleEditLens,
- handleCloseModal,
- handleParamChange,
- toggleAdvancedSearch,
- handleSetViewMode,
- }
-};
-
-export default useLensesUI;
\ No newline at end of file