From e1a95e1d817dacbb5b4095b8b4d5f3730f090db9 Mon Sep 17 00:00:00 2001
From: Ivan <8611739+IRBorisov@users.noreply.github.com>
Date: Thu, 22 Aug 2024 21:38:59 +0300
Subject: [PATCH] M: Improve manuals

---
 rsconcept/frontend/src/components/Icons.tsx   |  1 +
 .../frontend/src/components/ui/IconValue.tsx  |  6 ++--
 .../pages/ManualsPage/items/HelpThesaurus.tsx | 30 +++++++++++++++----
 .../EditorRSFormCard/RSFormStats.tsx          | 17 ++++-------
 4 files changed, 36 insertions(+), 18 deletions(-)

diff --git a/rsconcept/frontend/src/components/Icons.tsx b/rsconcept/frontend/src/components/Icons.tsx
index cdd95dbf..f391e9df 100644
--- a/rsconcept/frontend/src/components/Icons.tsx
+++ b/rsconcept/frontend/src/components/Icons.tsx
@@ -112,6 +112,7 @@ export { BiDuplicate      as IconClone }          from 'react-icons/bi';
 export { LuReplace        as IconReplace }        from 'react-icons/lu';
 export { FaSortAmountDownAlt as IconSortList }    from 'react-icons/fa';
 export { LuNetwork        as IconGenerateStructure } from 'react-icons/lu';
+export { LuCombine        as IconSynthesis }      from 'react-icons/lu';
 export { LuBookCopy       as IconInlineSynthesis } from 'react-icons/lu';
 export { LuWand2          as IconGenerateNames }  from 'react-icons/lu';
 export { GrConnect        as IconConnect }        from 'react-icons/gr';
diff --git a/rsconcept/frontend/src/components/ui/IconValue.tsx b/rsconcept/frontend/src/components/ui/IconValue.tsx
index 2e24da63..ab1cd8c6 100644
--- a/rsconcept/frontend/src/components/ui/IconValue.tsx
+++ b/rsconcept/frontend/src/components/ui/IconValue.tsx
@@ -27,7 +27,7 @@ function IconValue({
 }: IconValueProps) {
   return (
     <div
-      className={clsx('flex items-center', { 'justify-between gap-6 text-right': !dense, 'gap-1': dense }, className)}
+      className={clsx('flex items-center text-right', { 'justify-between gap-6': !dense, 'gap-1': dense }, className)}
       {...restProps}
     >
       <MiniButton
@@ -40,7 +40,9 @@ function IconValue({
         disabled={disabled}
         onClick={onClick}
       />
-      <span id={id}>{value}</span>
+      <span id={id} className='min-w-[1.2rem]'>
+        {value}
+      </span>
     </div>
   );
 }
diff --git a/rsconcept/frontend/src/pages/ManualsPage/items/HelpThesaurus.tsx b/rsconcept/frontend/src/pages/ManualsPage/items/HelpThesaurus.tsx
index a527d489..2b550451 100644
--- a/rsconcept/frontend/src/pages/ManualsPage/items/HelpThesaurus.tsx
+++ b/rsconcept/frontend/src/pages/ManualsPage/items/HelpThesaurus.tsx
@@ -1,16 +1,19 @@
 import {
   IconChild,
+  IconDownload,
   IconGraphCollapse,
   IconGraphExpand,
   IconGraphInputs,
   IconGraphOutputs,
+  IconOSS,
   IconPredecessor,
   IconRSForm,
   IconStatusError,
   IconStatusIncalculable,
   IconStatusOK,
   IconStatusProperty,
-  IconStatusUnknown
+  IconStatusUnknown,
+  IconSynthesis
 } from '@/components/Icons';
 import LinkTopic from '@/components/ui/LinkTopic';
 import { HelpTopic } from '@/models/miscellaneous';
@@ -25,8 +28,7 @@ function HelpThesaurus() {
         Справки через гиперссылки. Также указываются графические обозначения (иконки, цвета), используемые для
         обозначения соответствующих сущностей в интерфейсе Портала.
       </p>
-      <h2>Концептуализация</h2>
-      <p>Раздел в разработке...</p>
+
       <h2>Концептуальная схема</h2>
       <p>
         <IconRSForm size='1rem' className='inline-icon' />{' '}
@@ -198,10 +200,28 @@ function HelpThesaurus() {
       </ul>
 
       <h2>Операционная схема синтеза</h2>
-      <p>Раздел в разработке...</p>
+      <p>
+        <IconOSS size='1rem' className='inline-icon' />{' '}
+        <LinkTopic text='Операционная схема синтеза' topic={HelpTopic.CC_OSS} /> (ОСС) – система концептуальных схем,
+        связанных операциями синтеза.
+      </p>
+      <p>
+        Граф синтеза – ориентированный граф, вершинами которого являются операции, а ребра указывают на использование
+        результата одной операции как аргумента другой операции.
+      </p>
 
       <h2>Операция</h2>
-      <p>Раздел в разработке...</p>
+      <p>Операция – выделенная часть ОСС, определяющая способ получения КС в рамках ОСС.</p>
+
+      <ul>
+        По <b>способу получения КС выделены</b>:
+        <li>
+          <IconDownload size='1rem' className='inline-icon' /> загрузка КС из библиотеки;
+        </li>
+        <li>
+          <IconSynthesis size='1rem' className='inline-icon' /> синтез концептуальных схем.
+        </li>
+      </ul>
     </div>
   );
 }
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/RSFormStats.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/RSFormStats.tsx
index 1d0ae24d..b7266925 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/RSFormStats.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/RSFormStats.tsx
@@ -6,7 +6,6 @@ import {
   IconStatusOK,
   IconStatusProperty
 } from '@/components/Icons';
-import Divider from '@/components/ui/Divider';
 import IconValue from '@/components/ui/IconValue';
 import LabeledValue from '@/components/ui/LabeledValue';
 import { type IRSFormStats } from '@/models/rsform';
@@ -20,11 +19,9 @@ function RSFormStats({ stats }: RSFormStatsProps) {
     return null;
   }
   return (
-    <div className='flex flex-col sm:gap-1 sm:ml-6 sm:mt-8 sm:w-[14rem]'>
-      <Divider margins='my-2' className='sm:hidden' />
-
+    <div className='flex flex-col mt-3 sm:gap-1 sm:ml-6 sm:mt-8 sm:w-[16rem]'>
       <LabeledValue id='count_all' label='Всего конституент' text={stats.count_all} />
-      <div className='grid grid-cols-4 gap-1'>
+      <div className='grid grid-cols-4 gap-1 justify-items-start sm:justify-items-end'>
         <IconValue
           id='count_owned'
           dense
@@ -39,9 +36,9 @@ function RSFormStats({ stats }: RSFormStatsProps) {
           value={stats.count_inherited}
           title='Наследованные'
         />
-      </div>
-      <div className='grid grid-cols-4 gap-1'>
+
         <IconValue
+          className='col-start-1'
           id='count_ok'
           dense
           icon={<IconStatusOK size='1.25rem' className='clr-text-green' />}
@@ -69,8 +66,7 @@ function RSFormStats({ stats }: RSFormStatsProps) {
           value={stats.count_errors}
           title='Некорректные'
         />
-      </div>
-      <div className='grid grid-cols-4 gap-1'>
+
         <IconValue
           id='count_base'
           dense
@@ -99,6 +95,7 @@ function RSFormStats({ stats }: RSFormStatsProps) {
           value={stats.count_axiom}
           title='Аксиомы'
         />
+
         <IconValue
           id='count_term'
           dense
@@ -129,8 +126,6 @@ function RSFormStats({ stats }: RSFormStatsProps) {
         />
       </div>
 
-      <Divider margins='my-2' />
-
       <LabeledValue id='count_text_term' label='Термины' text={stats.count_text_term} />
       <LabeledValue id='count_definition' label='Определения' text={stats.count_definition} />
       <LabeledValue id='count_convention' label='Конвенции' text={stats.count_convention} />