diff --git a/web/src/components/RealtimeTable/Cell/Cell/Cell.jsx b/web/src/components/RealtimeTable/Cell/Cell/Cell.jsx index 2164513..50a7c4a 100644 --- a/web/src/components/RealtimeTable/Cell/Cell/Cell.jsx +++ b/web/src/components/RealtimeTable/Cell/Cell/Cell.jsx @@ -31,12 +31,13 @@ const LockBadge = styled.div` `; // Функция для подсветки текста -const highlightText = (text, searchQuery) => { - if (!searchQuery || !text) return text; - - const escapedQuery = searchQuery.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); - const regex = new RegExp(`(${escapedQuery})`, 'gi'); +const highlightText = (text, searchQueries) => { + if (!text) return text; + const cleanSearchQueries = searchQueries.filter(q => (q !== undefined && q !== '')); + if (cleanSearchQueries.length == 0) return text; + const escapedQueries = cleanSearchQueries.map(query => query.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')); + const regex = new RegExp(`(${ escapedQueries.join('|')})`, 'gi'); const parts = text.split(regex); return parts.map((part, index) => @@ -89,7 +90,7 @@ const formatNumber = (value, asInteger = false) => { }); }; -const Cell = React.memo(({ cell, row, column, onClick, globalFilter, backgroundColor, color, isEditable }) => { +const Cell = React.memo(({ cell, row, column, onClick, globalFilter, columnFilter, backgroundColor, color, isEditable }) => { const { lockedCells } = useRealtime(); const cellKey = `${row.id}_${column.id}`; @@ -105,9 +106,10 @@ const Cell = React.memo(({ cell, row, column, onClick, globalFilter, backgroundC } const highlightedContent = useMemo(() => { - return highlightText(textValue, globalFilter); + return highlightText(textValue, [globalFilter, columnFilter]); }, [textValue, globalFilter]); + // Базовые стили для заблокированной ячейки const lockedStyles = isLocked ? { border: '2px solid #e0e0e0', diff --git a/web/src/components/RealtimeTable/RealtimeTable.jsx b/web/src/components/RealtimeTable/RealtimeTable.jsx index b307303..b75259b 100644 --- a/web/src/components/RealtimeTable/RealtimeTable.jsx +++ b/web/src/components/RealtimeTable/RealtimeTable.jsx @@ -229,6 +229,12 @@ const RealtimeTable = ({ formType, formId, sheetName, direction, year }) => { minHeight: '1px', maxHeight: '1px', visibility: 'hidden', + '& svg': { + height: '1px', + minHeight: '1px', + maxHeight: '1px', + visibility: 'hidden', + } }, }, muiTablePaperProps: getTablePaperStyles(), diff --git a/web/src/components/RealtimeTable/TableHead/TableHead.jsx b/web/src/components/RealtimeTable/TableHead/TableHead.jsx index 9f819d9..efd1296 100644 --- a/web/src/components/RealtimeTable/TableHead/TableHead.jsx +++ b/web/src/components/RealtimeTable/TableHead/TableHead.jsx @@ -313,10 +313,10 @@ const FilterCell = ({ column, table }) => { onChange={(e) => handleFilterChange(e.target.value)} style={{ width: '100%', - padding: '4px 6px', - fontSize: '11px', + padding: '0.25rem 0.375rem', + fontSize: '0.6875rem', border: '1px solid #ddd', - borderRadius: '4px', + borderRadius: '0.25rem', backgroundColor: 'white', }} > @@ -330,23 +330,30 @@ const FilterCell = ({ column, table }) => { ); case 'range': { - // Для диапазона можно реализовать два поля const [min, max] = column.getFilterValue() || ['', '']; return ( -