getCstTypificationLabel(cst), {
id: 'type',
header: 'Типизация',
- size: 175,
- maxSize: 175,
- cell: props =>
{props.getValue()}
+ size: 150,
+ minSize: 150,
+ maxSize: 150,
+ enableHiding: true,
+ cell: props =>
{props.getValue()}
}),
columnHelper.accessor(cst => cst.term_resolved || cst.term_raw || '', {
id: 'term',
header: 'Термин',
- size: 350,
+ size: 500,
minSize: 150,
- maxSize: 350
+ maxSize: 500
}),
columnHelper.accessor('definition_formal', {
id: 'expression',
header: 'Формальное определение',
- size: 300,
+ size: 1000,
minSize: 300,
- maxSize: 500
+ maxSize: 1000
}),
columnHelper.accessor(cst => cst.definition_resolved || cst.definition_raw || '', {
id: 'definition',
header: 'Текстовое определение',
- size: 200,
+ size: 1000,
minSize: 200,
- cell: props =>
{props.getValue()}
+ maxSize: 1000,
+ cell: props =>
{props.getValue()}
}),
columnHelper.accessor('convention', {
id: 'convention',
header: 'Конвенция / Комментарий',
+ size: 500,
minSize: 100,
- maxSize: undefined,
- cell: props =>
{props.getValue()}
+ maxSize: 500,
+ enableHiding: true,
+ cell: props =>
{props.getValue()}
}),
], [colors]);
- // name: 'Типизация',
- // hide: 1600
- // },
- // {
- // name: 'Формальное определение',
- // grow: 2,
- // },
- // {
- // name: 'Текстовое определение',
- // grow: 2,
- // },
- // {
- // name: 'Конвенция / Комментарий',
- // id: 'convention',
- // hide: 1800
-
return (
-
-
-
- Выбраны
-
- {selected.length} из {schema?.stats?.count_all ?? 0}
-
-
-
-
+
+
+
+ Выбраны
+
+ {selected.length} из {schema?.stats?.count_all ?? 0}
+
-
-
- Список пуст
- handleCreateCst()}>
- Создать новую конституенту
-
-
- }
+
+
- );
+
+
+ Список пуст
+ handleCreateCst()}>
+ Создать новую конституенту
+
+
+ }
+ />
+
+
);
}
export default EditorItems;
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
index 2b47645c..6d43462d 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph.tsx
@@ -375,10 +375,10 @@ function EditorTermGraph({ onOpenEdit, onCreateCst, onDeleteCst }: EditorTermGra
}
-
+
Выбраны
- {allSelected.length} из {schema?.stats?.count_all ?? 0}
+ {allSelected.length} из {schema?.stats?.count_all ?? 0}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
index f89ac8ab..512cddd2 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/elements/ViewSideConstituents.tsx
@@ -1,10 +1,10 @@
-import { createColumnHelper } from '@tanstack/react-table';
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useLayoutEffect, useMemo, useState } from 'react';
-import DataTable from '../../../components/Common/DataTable';
+import DataTable, { createColumnHelper, IConditionalStyle, VisibilityState } from '../../../components/DataTable';
import { useRSForm } from '../../../context/RSFormContext';
import { useConceptTheme } from '../../../context/ThemeContext';
import useLocalStorage from '../../../hooks/useLocalStorage';
+import useWindowSize from '../../../hooks/useWindowSize';
import { prefixes } from '../../../utils/constants';
import { applyGraphFilter, CstMatchMode, CstType, DependencyMode, extractGlobals, IConstituenta, matchConstituenta } from '../../../utils/models';
import { getCstDescription, getCstStatusFgColor, getMockConstituenta } from '../../../utils/staticUI';
@@ -15,6 +15,9 @@ import MatchModePicker from './MatchModePicker';
// Height that should be left to accomodate navigation panel + bottom margin
const LOCAL_NAVIGATION_H = '2.1rem';
+// Window width cutoff for expression show
+const COLUMN_EXPRESSION_HIDE_THRESHOLD = 1500;
+
interface ViewSideConstituentsProps {
expression: string
baseHeight: string
@@ -29,8 +32,11 @@ function isMockCst(cst: IConstituenta) {
const columnHelper = createColumnHelper
();
function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }: ViewSideConstituentsProps) {
+ const windowSize = useWindowSize();
const { noNavigation, colors } = useConceptTheme();
const { schema } = useRSForm();
+
+ const [columnVisibility, setColumnVisibility] = useState({'expression': true})
const [filterMatch, setFilterMatch] = useLocalStorage('side-filter-match', CstMatchMode.ALL);
const [filterText, setFilterText] = useLocalStorage('side-filter-text', '');
@@ -38,7 +44,19 @@ function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }:
const [filteredData, setFilteredData] = useState(schema?.items ?? []);
- useEffect(
+ useLayoutEffect(
+ () => {
+ setColumnVisibility(prev => {
+ const newValue = (windowSize.width ?? 0) >= COLUMN_EXPRESSION_HIDE_THRESHOLD;
+ if (newValue === prev['expression']) {
+ return prev;
+ } else {
+ return {'expression': newValue}
+ }
+ });
+ }, [windowSize]);
+
+ useLayoutEffect(
() => {
if (!schema?.items) {
setFilteredData([]);
@@ -118,9 +136,9 @@ function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }:
columnHelper.accessor(cst => getCstDescription(cst), {
id: 'description',
header: 'Описание',
- size: 350,
+ size: 500,
minSize: 350,
- maxSize: 350,
+ maxSize: 500,
cell: props =>
[] => [
+ {
+ when: (cst: IConstituenta) => cst.id === activeID,
+ style: {
+ backgroundColor: colors.bgSelected
+ },
+ }
+ ], [activeID, colors]);
+
const maxHeight = useMemo(
() => {
const siblingHeight = `${baseHeight} - ${LOCAL_NAVIGATION_H}`
@@ -174,9 +203,12 @@ function ViewSideConstituents({ expression, baseHeight, activeID, onOpenEdit }:
diff --git a/rsconcept/frontend/src/pages/UserProfilePage/ViewSubscriptions.tsx b/rsconcept/frontend/src/pages/UserProfilePage/ViewSubscriptions.tsx
index bff7332f..ebde5ad8 100644
--- a/rsconcept/frontend/src/pages/UserProfilePage/ViewSubscriptions.tsx
+++ b/rsconcept/frontend/src/pages/UserProfilePage/ViewSubscriptions.tsx
@@ -1,8 +1,7 @@
-import { createColumnHelper } from '@tanstack/react-table';
import { useMemo } from 'react';
import { useIntl } from 'react-intl';
-import DataTable from '../../components/Common/DataTable';
+import DataTable, { createColumnHelper } from '../../components/DataTable';
import { useConceptNavigation } from '../../context/NagivationContext';
import { ILibraryItem } from '../../utils/models';
@@ -52,9 +51,13 @@ function ViewSubscriptions({items}: ViewSubscriptionsProps) {
Отслеживаемые схемы отсутствуют
}
diff --git a/rsconcept/frontend/src/utils/color.ts b/rsconcept/frontend/src/utils/color.ts
index 6520a81a..5c058d67 100644
--- a/rsconcept/frontend/src/utils/color.ts
+++ b/rsconcept/frontend/src/utils/color.ts
@@ -65,7 +65,7 @@ export const lightT: IColorTheme = {
fgGreen: 'hsl(100, 090%, 035%)',
fgBlue: 'hsl(235, 100%, 050%)',
fgPurple: 'hsl(270, 100%, 070%)',
- fgTeal: 'hsl(192, 090%, 040%)',
+ fgTeal: 'hsl(200, 080%, 050%)',
fgOrange: 'hsl(030, 090%, 055%)'
};