From b27b7ea0ea3772ce71ca3befddad5aeebef73aab Mon Sep 17 00:00:00 2001
From: Danis <danis.hasanov@onlyoffice.com>
Date: Thu, 14 Aug 2025 18:26:09 +0400
Subject: [PATCH] Added column, row resize

---
 apps/documenteditor/mobile/locale/en.json     |  3 ++
 .../mobile/src/controller/edit/EditTable.jsx  | 40 ++++++++++++++
 .../mobile/src/store/tableSettings.js         |  6 +++
 .../mobile/src/view/edit/EditTable.jsx        | 54 +++++++++++++++++--
 4 files changed, 99 insertions(+), 4 deletions(-)

diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json
index 64f149b69b..c9b62e1f0e 100644
--- a/apps/documenteditor/mobile/locale/en.json
+++ b/apps/documenteditor/mobile/locale/en.json
@@ -325,6 +325,9 @@
     "textLastColumn": "Last Column",
     "textLeader": "Leader",
     "textLetterSpacing": "Letter spacing",
+    "txtWidth": "Width",
+    "txtHeight": "Height",
+    "textCellSize": "Rows & columns size",
     "textLevels": "Levels",
     "textLineSpacing": "Line spacing",
     "textLink": "Link",
diff --git a/apps/documenteditor/mobile/src/controller/edit/EditTable.jsx b/apps/documenteditor/mobile/src/controller/edit/EditTable.jsx
index 335e63eac6..892cc948e7 100644
--- a/apps/documenteditor/mobile/src/controller/edit/EditTable.jsx
+++ b/apps/documenteditor/mobile/src/controller/edit/EditTable.jsx
@@ -214,6 +214,44 @@ class EditTableController extends Component {
         api.tblApply(properties);
     }
 
+    onChangeRowHeight (height, isDecrement) {
+        const api = Common.EditorApi.get();
+        const properties = new Asc.CTableProp();
+        let step, newHeight;
+        const maxValue = Common.Utils.Metric.fnRecalcFromMM(55.88);
+        if (Common.Utils.Metric.getCurrentMetric() === Common.Utils.Metric.c_MetricUnits.pt) {
+            step = 1;
+        } else {
+            step = 0.1;
+        }
+        if (isDecrement) {
+            newHeight = Math.max(-1, height - step)
+        } else {
+            newHeight = Math.min(maxValue, height + step);
+        }
+        properties.put_RowHeight(Common.Utils.Metric.fnRecalcToMM(newHeight));
+        api.tblApply(properties);
+    }
+
+    onChangeColumnWidth (width, isDecrement) {
+        const api = Common.EditorApi.get();
+        const properties = new Asc.CTableProp();
+        let step, newWidth;
+        const maxValue = Common.Utils.Metric.fnRecalcFromMM(55.88);
+        if (Common.Utils.Metric.getCurrentMetric() === Common.Utils.Metric.c_MetricUnits.pt) {
+            step = 1;
+        } else {
+            step = 0.1;
+        }
+        if (isDecrement) {
+            newWidth = Math.max(-1, width - step)
+        } else {
+            newWidth = Math.min(maxValue, width + step);
+        }
+        properties.put_ColumnWidth(Common.Utils.Metric.fnRecalcToMM(newWidth));
+        api.tblApply(properties);
+    }
+
     render () {
         return (
             <EditTable onRemoveTable={this.onRemoveTable}
@@ -235,6 +273,8 @@ class EditTableController extends Component {
                        onFillColor={this.onFillColor}
                        onBorderTypeClick={this.onBorderTypeClick}
                        onGetTableStylesPreviews = {this.onGetTableStylesPreviews}
+                       onChangeRowHeight = {this.onChangeRowHeight}
+                       onChangeColumnWidth = {this.onChangeColumnWidth}
             />
         )
     }
diff --git a/apps/documenteditor/mobile/src/store/tableSettings.js b/apps/documenteditor/mobile/src/store/tableSettings.js
index 41fd7ef368..a07fcd0ebf 100644
--- a/apps/documenteditor/mobile/src/store/tableSettings.js
+++ b/apps/documenteditor/mobile/src/store/tableSettings.js
@@ -73,6 +73,12 @@ export class storeTableSettings {
     getWrapDistance (tableObject) {
         return tableObject.get_TablePaddings().get_Top();
     }
+    getRowHeight (tableObject) {
+        return tableObject.get_RowHeight()
+    }
+    getColumnWidth (tableObject) {
+        return tableObject.get_ColumnWidth()
+    }
 
     // Fill color
     getFillColor (tableObject) {
diff --git a/apps/documenteditor/mobile/src/view/edit/EditTable.jsx b/apps/documenteditor/mobile/src/view/edit/EditTable.jsx
index a7ae1ba372..863773f5da 100644
--- a/apps/documenteditor/mobile/src/view/edit/EditTable.jsx
+++ b/apps/documenteditor/mobile/src/view/edit/EditTable.jsx
@@ -1,6 +1,6 @@
 import React, {Fragment, useState, useEffect} from 'react';
 import {observer, inject} from "mobx-react";
-import {Page, Navbar, NavRight, List, ListItem, ListButton, BlockTitle, SkeletonBlock, Range, Toggle, Icon, Link, Tabs, Tab} from 'framework7-react';
+import {Page, Navbar, NavRight, List, ListItem, ListButton, BlockTitle, SkeletonBlock, Range, Toggle, Icon, Link, Tabs, Tab, Segmented, Button} from 'framework7-react';
 import { f7 } from 'framework7-react';
 import { useTranslation } from 'react-i18next';
 import {Device} from '../../../../../common/mobile/utils/device';
@@ -37,13 +37,17 @@ const PageTableOptions = props => {
     const metricText = Common.Utils.Metric.getCurrentMetricName();
     const storeFocusObjects = props.storeFocusObjects;
     const tableObject = storeFocusObjects.tableObject;
-    const storeTableSettings = props.storeTableSettings;
+    const storeTableSettings = props.storeTableSettings;   
 
-    let distance, isRepeat, isResize;
+    let distance, isRepeat, isResize, columnWidth, rowHeight, displayRowHeight, displayColumnWidth;
     if (tableObject) {
         distance = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getCellMargins(tableObject));
         isRepeat = storeTableSettings.getRepeatOption(tableObject);
         isResize = storeTableSettings.getResizeOption(tableObject);
+        rowHeight = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getRowHeight(tableObject));
+        columnWidth = Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getColumnWidth(tableObject));
+        displayRowHeight = Number(Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getRowHeight(tableObject)).toFixed(2));
+        displayColumnWidth = Number(Common.Utils.Metric.fnRecalcFromMM(storeTableSettings.getColumnWidth(tableObject)).toFixed(2));
     }
     const [stateDistance, setDistance] = useState(distance);
 
@@ -74,6 +78,46 @@ const PageTableOptions = props => {
                     <Toggle checked={isResize} onToggleChange={() => {props.onOptionResize(!isResize)}}/>
                 </ListItem>
             </List>
+            <BlockTitle>{_t.textCellSize}</BlockTitle>
+            <List>
+                <ListItem title={_t.txtHeight}>
+                    {!isAndroid && <div slot='after-start'>{displayRowHeight + ' ' + metricText}</div>}
+                    <div slot='after'>
+                        <Segmented>
+                            <Button outline className='decrement item-link' onClick={() => {props.onChangeRowHeight(rowHeight, true)}}>
+                                {isAndroid ? 
+                                    <SvgIcon symbolId={IconExpandDownAndroid.id} className={'icon icon-svg'} />
+                                : ' - '}
+                            </Button>
+                            {isAndroid && <label>{displayRowHeight + ' ' + metricText}</label>}
+                            <Button outline className='increment item-link' onClick={() => {props.onChangeRowHeight(rowHeight, false)}}>
+                                {isAndroid ? 
+                                    <SvgIcon symbolId={IconExpandUp.id} className={'icon icon-svg'} />
+                                : ' + '}
+                            </Button>
+                        </Segmented>
+                    </div>
+                </ListItem>
+                <ListItem title={_t.txtWidth}>
+                    {!isAndroid && <div slot='after-start'>{displayColumnWidth + ' ' + metricText}</div>}
+                    <div slot='after'>
+                        <Segmented>
+                            <Button outline className='decrement item-link' onClick={() => {props.onChangeColumnWidth(columnWidth, true)}}>
+                                {isAndroid ? 
+                                    <SvgIcon symbolId={IconExpandDownAndroid.id} className={'icon icon-svg'} />
+                                : ' - '}
+                            </Button>
+                            {isAndroid && <label>{displayColumnWidth + ' ' + metricText}</label>}
+                            <Button outline className='increment item-link' onClick={() => {props.onChangeColumnWidth(columnWidth, false)}}>
+                                {isAndroid ? 
+                                    <SvgIcon symbolId={IconExpandUp.id} className={'icon icon-svg'} />
+                                : ' + '}
+                            </Button>
+                        </Segmented>
+                    </div>
+                </ListItem>
+            </List>
+
             <BlockTitle>{_t.textCellMargins}</BlockTitle>
             <List>
                 <ListItem>
@@ -632,7 +676,9 @@ const EditTable = props => {
                 <ListItem title={_t.textTableOptions} link='/edit-table-options/' routeProps={{
                     onCellMargins: props.onCellMargins,
                     onOptionResize: props.onOptionResize,
-                    onOptionRepeat: props.onOptionRepeat
+                    onOptionRepeat: props.onOptionRepeat,
+                    onChangeRowHeight: props.onChangeRowHeight,
+                    onChangeColumnWidth: props.onChangeColumnWidth
                 }}></ListItem>
                 <ListItem title={_t.textStyle} link='/edit-table-style/' routeProps={{
                     onStyleClick: props.onStyleClick,