From ddf8b235702e0a73fb1e7b23d31e04f94694fdac Mon Sep 17 00:00:00 2001
From: SergeyEzhin <ezhin@mail.ru>
Date: Tue, 1 Feb 2022 00:22:31 +0400
Subject: [PATCH] [DE mobile] Correct structure

---
 .../src/controller/edit/EditTableContents.jsx | 32 +++++++++--------
 .../src/view/edit/EditTableContents.jsx       | 36 +++++++++++++------
 2 files changed, 44 insertions(+), 24 deletions(-)

diff --git a/apps/documenteditor/mobile/src/controller/edit/EditTableContents.jsx b/apps/documenteditor/mobile/src/controller/edit/EditTableContents.jsx
index 73fd5ff56..8069098d0 100644
--- a/apps/documenteditor/mobile/src/controller/edit/EditTableContents.jsx
+++ b/apps/documenteditor/mobile/src/controller/edit/EditTableContents.jsx
@@ -79,8 +79,6 @@ class EditTableContentsController extends Component {
             }
         });
 
-        console.log(styles);
-
         if(props) {
             let start = props.get_OutlineStart(),
                 end = props.get_OutlineEnd(),
@@ -93,7 +91,6 @@ class EditTableContentsController extends Component {
             if ((start < 0 || end < 0) && count < 1) {
                 start = 1;
                 end = 9;
-                // this.spnLevels.setValue(end, true);
             }
 
             for (let i = 0; i < count; i++) {
@@ -162,7 +159,6 @@ class EditTableContentsController extends Component {
                 }
             }
 
-            // this.spnLevels.setValue(newEnd > 0 ? newEnd : '', true);
             checkStyles = (disableOutlines || newStart > 1);
         } else {
             for (let i = this.startLevel; i <= this.endLevel; i++) {
@@ -185,25 +181,33 @@ class EditTableContentsController extends Component {
 
         return {
             styles, 
-            start: this.startLevel,
+            // start: this.startLevel,
             end: this.endLevel,
             count: this.count,
-            disableOutlines,
-            checkStyles
+            // disableOutlines,
+            // checkStyles
         }
     }
 
-    addStyles(styleName, value) {
+    addStyles(styles, styleName, value) {
         const api = Common.EditorApi.get();
         const propsTableContents = api.asc_GetTableOfContentsPr();
 
-        // propsTableContents.clear_Styles();
-        propsTableContents.add_Style(styleName, value);
+        propsTableContents.clear_Styles();
 
-        // if (propsTableContents.get_StylesCount() > 0)
-        //     propsTableContents.put_OutlineRange(-1, -1);
-        // else
-        //     propsTableContents.put_OutlineRange(1, 9);
+        styles.forEach(style => {
+            if(style.name === styleName) {
+                propsTableContents.add_Style(styleName, value);
+            } else {
+                propsTableContents.add_Style(style.name, style.value);
+            }
+        });
+
+        if (propsTableContents.get_StylesCount() > 0) {
+            propsTableContents.put_OutlineRange(-1, -1);
+        } else {
+            propsTableContents.put_OutlineRange(1, 9);
+        }
 
         api.asc_SetTableOfContentsPr(propsTableContents);
     }
diff --git a/apps/documenteditor/mobile/src/view/edit/EditTableContents.jsx b/apps/documenteditor/mobile/src/view/edit/EditTableContents.jsx
index c18ade6dd..1bd1900cd 100644
--- a/apps/documenteditor/mobile/src/view/edit/EditTableContents.jsx
+++ b/apps/documenteditor/mobile/src/view/edit/EditTableContents.jsx
@@ -10,7 +10,6 @@ const EditTableContents = props => {
     const api = Common.EditorApi.get();
     const propsTableContents = api.asc_GetTableOfContentsPr();
     const stylesCount = propsTableContents.get_StylesCount();
-    console.log(propsTableContents);
     const [type, setType] = useState(0);
     const [styleValue, setStyleValue] = useState(propsTableContents.get_StylesType());
     const [pageNumbers, setPageNumbers] = useState(propsTableContents.get_ShowPageNumbers());
@@ -186,12 +185,20 @@ const PageEditStructureTableContents = props => {
     const isAndroid = Device.android;
     const api = Common.EditorApi.get();
     const propsTableContents = api.asc_GetTableOfContentsPr();
-    const {styles, start, end, count, disableOutlines, checkStyles} = props.fillTOCProps(propsTableContents);
-    console.log(styles, start, end, count, disableOutlines, checkStyles);
-
+    const {styles, end, count} = props.fillTOCProps(propsTableContents);
+    const chosenStyles = styles.filter(style => style.checked);
+    
     const [structure, setStructure] = useState(count ? 1 : 0);
     const [amountLevels, setAmountLevels] = useState(end);
 
+    const addNewStyle = (style) => {
+        let indexStyle = chosenStyles.findIndex(currentStyle => currentStyle.name === style.name);
+
+        if(indexStyle === -1) { 
+            chosenStyles.push(style); 
+        }
+    }
+
     return (
         <Page>
             <Navbar title={t('Edit.textStructure')} backLink={_t.textBack}>
@@ -210,7 +217,7 @@ const PageEditStructureTableContents = props => {
             {structure === 0 ?
                 <List>
                     <ListItem title={t('Edit.textAmountOfLevels')}>
-                        {!isAndroid && <div slot='after-start'>{amountLevels}</div>}
+                        {!isAndroid && <div slot='after-start'>{amountLevels === -1 ? '-' : amountLevels}</div>}
                         <div slot='after'>
                             <Segmented>
                                 <Button outline className='decrement item-link' onClick={() => {
@@ -221,11 +228,16 @@ const PageEditStructureTableContents = props => {
                                 }}>
                                     {isAndroid ? <Icon icon="icon-expand-down"></Icon> : ' - '}
                                 </Button>
-                                {isAndroid && <label>{amountLevels}</label>}
+                                {isAndroid && <label>{amountLevels === -1 ? '-' : amountLevels}</label>}
                                 <Button outline className='increment item-link' onClick={() => {
                                     if(amountLevels < 9) {
-                                        setAmountLevels(amountLevels + 1); 
-                                        props.onLevelsChange(amountLevels + 1);
+                                        if(amountLevels === -1) {
+                                            setAmountLevels(9); 
+                                            props.onLevelsChange(9);
+                                        } else {
+                                            setAmountLevels(amountLevels + 1); 
+                                            props.onLevelsChange(amountLevels + 1);
+                                        }
                                     }
                                 }}>
                                     {isAndroid ? <Icon icon="icon-expand-up"></Icon> : ' + '}
@@ -244,7 +256,9 @@ const PageEditStructureTableContents = props => {
                                     <Segmented>
                                         <Button outline className='decrement item-link' onClick={() => {
                                             if(style.value > 1) {
-                                                props.addStyles(style.name, style.value - 1);
+                                                setAmountLevels(-1);
+                                                addNewStyle(style);
+                                                props.addStyles(chosenStyles, style.name, style.value - 1);
                                             }
                                         }}>
                                             {isAndroid ? <Icon icon="icon-expand-down"></Icon> : ' - '}
@@ -252,7 +266,9 @@ const PageEditStructureTableContents = props => {
                                         {isAndroid && <label>{style.value}</label>}
                                         <Button outline className='increment item-link' onClick={() => {
                                             if(style.value < 9) {
-                                                props.addStyles(style.name, style.value + 1);
+                                                setAmountLevels(-1);
+                                                addNewStyle(style);
+                                                props.addStyles(chosenStyles, style.name, style.value + 1);
                                             }
                                         }}>
                                             {isAndroid ? <Icon icon="icon-expand-up"></Icon> : ' + '}