[SSE mobile] Correct protection sheet
This commit is contained in:
parent
0c145e9b6f
commit
d1072fd3f9
|
@ -15,6 +15,7 @@ const ToolbarController = inject('storeAppOptions', 'users', 'storeSpreadsheetIn
|
||||||
const isDisconnected = props.users.isDisconnected;
|
const isDisconnected = props.users.isDisconnected;
|
||||||
|
|
||||||
const storeFocusObjects = props.storeFocusObjects;
|
const storeFocusObjects = props.storeFocusObjects;
|
||||||
|
const focusOn = storeFocusObjects.focusOn;
|
||||||
const isObjectLocked = storeFocusObjects.isLocked;
|
const isObjectLocked = storeFocusObjects.isLocked;
|
||||||
const isEditCell = storeFocusObjects.isEditCell;
|
const isEditCell = storeFocusObjects.isEditCell;
|
||||||
const editFormulaMode = storeFocusObjects.editFormulaMode;
|
const editFormulaMode = storeFocusObjects.editFormulaMode;
|
||||||
|
@ -157,6 +158,7 @@ const ToolbarController = inject('storeAppOptions', 'users', 'storeSpreadsheetIn
|
||||||
onEditDocument={onEditDocument}
|
onEditDocument={onEditDocument}
|
||||||
isDisconnected={isDisconnected}
|
isDisconnected={isDisconnected}
|
||||||
worksheetProtection={worksheetProtection}
|
worksheetProtection={worksheetProtection}
|
||||||
|
focusOn={focusOn}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
}));
|
}));
|
||||||
|
|
|
@ -30,6 +30,8 @@ class AddOtherController extends Component {
|
||||||
return (
|
return (
|
||||||
<AddOther closeModal={this.closeModal}
|
<AddOther closeModal={this.closeModal}
|
||||||
hideAddComment={this.hideAddComment}
|
hideAddComment={this.hideAddComment}
|
||||||
|
wsPropsHyperlinks={this.props.wsPropsHyperlinks}
|
||||||
|
wsPropsObjects={this.props.wsPropsObjects}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -88,6 +88,10 @@ class MainPage extends Component {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const appOptions = this.props.storeAppOptions;
|
const appOptions = this.props.storeAppOptions;
|
||||||
|
const storeWorksheets = this.props.storeWorksheets;
|
||||||
|
const worksheetProtection = storeWorksheets.worksheetProtection;
|
||||||
|
const wsLock = worksheetProtection.wsLock;
|
||||||
|
const wsProps = worksheetProtection.wsProps;
|
||||||
const config = appOptions.config;
|
const config = appOptions.config;
|
||||||
const showLogo = !(appOptions.canBrandingExt && (config.customization && (config.customization.loaderName || config.customization.loaderLogo)));
|
const showLogo = !(appOptions.canBrandingExt && (config.customization && (config.customization.loaderName || config.customization.loaderLogo)));
|
||||||
const showPlaceholder = !appOptions.isDocReady && (!config.customization || !(config.customization.loaderName || config.customization.loaderLogo));
|
const showPlaceholder = !appOptions.isDocReady && (!config.customization || !(config.customization.loaderName || config.customization.loaderLogo));
|
||||||
|
@ -115,11 +119,11 @@ class MainPage extends Component {
|
||||||
<SearchSettings useSuspense={false} />
|
<SearchSettings useSuspense={false} />
|
||||||
{
|
{
|
||||||
!this.state.editOptionsVisible ? null :
|
!this.state.editOptionsVisible ? null :
|
||||||
<EditOptions onclosed={this.handleOptionsViewClosed.bind(this, 'edit')} />
|
<EditOptions onclosed={this.handleOptionsViewClosed.bind(this, 'edit')} wsProps={wsProps} />
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
!this.state.addOptionsVisible ? null :
|
!this.state.addOptionsVisible ? null :
|
||||||
<AddOptions onclosed={this.handleOptionsViewClosed.bind(this, 'add')} showOptions={this.state.addShowOptions} />
|
<AddOptions onclosed={this.handleOptionsViewClosed.bind(this, 'add')} wsProps={wsProps} showOptions={this.state.addShowOptions} />
|
||||||
}
|
}
|
||||||
{
|
{
|
||||||
!this.state.settingsVisible ? null :
|
!this.state.settingsVisible ? null :
|
||||||
|
@ -145,4 +149,4 @@ class MainPage extends Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default inject("storeAppOptions")(observer(MainPage));
|
export default inject("storeAppOptions", "storeWorksheets")(observer(MainPage));
|
|
@ -6,6 +6,7 @@ import EditorUIController from '../lib/patch'
|
||||||
const ToolbarView = props => {
|
const ToolbarView = props => {
|
||||||
const isDisconnected = props.isDisconnected;
|
const isDisconnected = props.isDisconnected;
|
||||||
const worksheetProtection = props.worksheetProtection;
|
const worksheetProtection = props.worksheetProtection;
|
||||||
|
const focusOn = props.focusOn;
|
||||||
const undo_box = props.isEdit && EditorUIController.toolbarOptions ? EditorUIController.toolbarOptions.getUndoRedo({
|
const undo_box = props.isEdit && EditorUIController.toolbarOptions ? EditorUIController.toolbarOptions.getUndoRedo({
|
||||||
disabledUndo: !props.isCanUndo || isDisconnected,
|
disabledUndo: !props.isCanUndo || isDisconnected,
|
||||||
disabledRedo: !props.isCanRedo || isDisconnected,
|
disabledRedo: !props.isCanRedo || isDisconnected,
|
||||||
|
@ -28,6 +29,7 @@ const ToolbarView = props => {
|
||||||
{props.isEdit && EditorUIController.toolbarOptions && EditorUIController.toolbarOptions.getEditOptions({
|
{props.isEdit && EditorUIController.toolbarOptions && EditorUIController.toolbarOptions.getEditOptions({
|
||||||
disabled: props.disabledEditControls || props.disabledControls || isDisconnected,
|
disabled: props.disabledEditControls || props.disabledControls || isDisconnected,
|
||||||
worksheetProtection,
|
worksheetProtection,
|
||||||
|
focusOn,
|
||||||
onEditClick: () => props.openOptions('edit'),
|
onEditClick: () => props.openOptions('edit'),
|
||||||
onAddClick: () => props.openOptions('add')
|
onAddClick: () => props.openOptions('add')
|
||||||
})}
|
})}
|
||||||
|
|
|
@ -57,6 +57,7 @@ const routes = [
|
||||||
|
|
||||||
const AddLayoutNavbar = ({ tabs, inPopover }) => {
|
const AddLayoutNavbar = ({ tabs, inPopover }) => {
|
||||||
const isAndroid = Device.android;
|
const isAndroid = Device.android;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Navbar>
|
<Navbar>
|
||||||
{tabs.length > 1 ?
|
{tabs.length > 1 ?
|
||||||
|
@ -67,7 +68,7 @@ const AddLayoutNavbar = ({ tabs, inPopover }) => {
|
||||||
</Link>)}
|
</Link>)}
|
||||||
{isAndroid && <span className='tab-link-highlight' style={{width: 100 / tabs.lenght + '%'}}></span>}
|
{isAndroid && <span className='tab-link-highlight' style={{width: 100 / tabs.lenght + '%'}}></span>}
|
||||||
</div> :
|
</div> :
|
||||||
<NavTitle>{ tabs[0].caption }</NavTitle>
|
<NavTitle>{tabs[0].caption}</NavTitle>
|
||||||
}
|
}
|
||||||
{ !inPopover && <NavRight><Link icon='icon-expand-down' popupClose=".add-popup"></Link></NavRight> }
|
{ !inPopover && <NavRight><Link icon='icon-expand-down' popupClose=".add-popup"></Link></NavRight> }
|
||||||
</Navbar>
|
</Navbar>
|
||||||
|
@ -89,50 +90,54 @@ const AddLayoutContent = ({ tabs }) => {
|
||||||
const AddTabs = props => {
|
const AddTabs = props => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const _t = t('View.Add', {returnObjects: true});
|
const _t = t('View.Add', {returnObjects: true});
|
||||||
|
const wsProps = props.wsProps;
|
||||||
const showPanels = props.showPanels;
|
const showPanels = props.showPanels;
|
||||||
const tabs = [];
|
const tabs = [];
|
||||||
|
|
||||||
if (!showPanels) {
|
if(!wsProps.Objects) {
|
||||||
tabs.push({
|
if (!showPanels) {
|
||||||
caption: _t.textChart,
|
tabs.push({
|
||||||
id: 'add-chart',
|
caption: _t.textChart,
|
||||||
icon: 'icon-add-chart',
|
id: 'add-chart',
|
||||||
component: <AddChartController/>
|
icon: 'icon-add-chart',
|
||||||
});
|
component: <AddChartController/>
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (!showPanels || showPanels === 'function') {
|
||||||
|
tabs.push({
|
||||||
|
caption: _t.textFunction,
|
||||||
|
id: 'add-function',
|
||||||
|
icon: 'icon-add-formula',
|
||||||
|
component: <AddFunctionController onOptionClick={props.onOptionClick}/>
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (!showPanels || showPanels.indexOf('shape') > 0) {
|
||||||
|
tabs.push({
|
||||||
|
caption: _t.textShape,
|
||||||
|
id: 'add-shape',
|
||||||
|
icon: 'icon-add-shape',
|
||||||
|
component: <AddShapeController/>
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (showPanels && showPanels.indexOf('image') !== -1) {
|
||||||
|
tabs.push({
|
||||||
|
caption: _t.textImage,
|
||||||
|
id: 'add-image',
|
||||||
|
icon: 'icon-add-image',
|
||||||
|
component: <AddImageController inTabs={true}/>
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
if (!showPanels || showPanels === 'function') {
|
if (!showPanels && (!wsProps.InsertHyperlinks || !wsProps.Objects)) {
|
||||||
tabs.push({
|
|
||||||
caption: _t.textFunction,
|
|
||||||
id: 'add-function',
|
|
||||||
icon: 'icon-add-formula',
|
|
||||||
component: <AddFunctionController onOptionClick={props.onOptionClick}/>
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (!showPanels || showPanels.indexOf('shape') > 0) {
|
|
||||||
tabs.push({
|
|
||||||
caption: _t.textShape,
|
|
||||||
id: 'add-shape',
|
|
||||||
icon: 'icon-add-shape',
|
|
||||||
component: <AddShapeController/>
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (showPanels && showPanels.indexOf('image') !== -1) {
|
|
||||||
tabs.push({
|
|
||||||
caption: _t.textImage,
|
|
||||||
id: 'add-image',
|
|
||||||
icon: 'icon-add-image',
|
|
||||||
component: <AddImageController inTabs={true}/>
|
|
||||||
});
|
|
||||||
}
|
|
||||||
if (!showPanels) {
|
|
||||||
tabs.push({
|
tabs.push({
|
||||||
caption: _t.textOther,
|
caption: _t.textOther,
|
||||||
id: 'add-other',
|
id: 'add-other',
|
||||||
icon: 'icon-add-other',
|
icon: 'icon-add-other',
|
||||||
component: <AddOtherController/>
|
component: <AddOtherController wsPropsObjects={wsProps.Objects}
|
||||||
|
wsPropsHyperlinks={wsProps.InsertHyperlinks}/>
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if ((showPanels && showPanels === 'hyperlink') || props.isAddShapeHyperlink) {
|
if (((showPanels && showPanels === 'hyperlink') || props.isAddShapeHyperlink) && !wsProps.InsertHyperlinks) {
|
||||||
tabs.push({
|
tabs.push({
|
||||||
caption: _t.textAddLink,
|
caption: _t.textAddLink,
|
||||||
id: 'add-link',
|
id: 'add-link',
|
||||||
|
@ -164,10 +169,10 @@ class AddView extends Component {
|
||||||
return (
|
return (
|
||||||
show_popover ?
|
show_popover ?
|
||||||
<Popover id="add-popover" className="popover__titled" closeByOutsideClick={false} onPopoverClosed={() => this.props.onclosed()}>
|
<Popover id="add-popover" className="popover__titled" closeByOutsideClick={false} onPopoverClosed={() => this.props.onclosed()}>
|
||||||
<AddTabs isAddShapeHyperlink={this.props.isAddShapeHyperlink} inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} showPanels={this.props.showPanels}/>
|
<AddTabs isAddShapeHyperlink={this.props.isAddShapeHyperlink} wsProps={this.props.wsProps} inPopover={true} onOptionClick={this.onoptionclick} style={{height: '410px'}} showPanels={this.props.showPanels}/>
|
||||||
</Popover> :
|
</Popover> :
|
||||||
<Popup className="add-popup" onPopupClosed={() => this.props.onclosed()}>
|
<Popup className="add-popup" onPopupClosed={() => this.props.onclosed()}>
|
||||||
<AddTabs isAddShapeHyperlink={this.props.isAddShapeHyperlink} onOptionClick={this.onoptionclick} showPanels={this.props.showPanels}/>
|
<AddTabs isAddShapeHyperlink={this.props.isAddShapeHyperlink} wsProps={this.props.wsProps} onOptionClick={this.onoptionclick} showPanels={this.props.showPanels}/>
|
||||||
</Popup>
|
</Popup>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -186,6 +191,7 @@ const Add = props => {
|
||||||
// component will unmount
|
// component will unmount
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const onviewclosed = () => {
|
const onviewclosed = () => {
|
||||||
if ( props.onclosed )
|
if ( props.onclosed )
|
||||||
props.onclosed();
|
props.onclosed();
|
||||||
|
@ -221,6 +227,7 @@ const Add = props => {
|
||||||
onclosed={onviewclosed}
|
onclosed={onviewclosed}
|
||||||
showPanels={options ? options.panels : undefined}
|
showPanels={options ? options.panels : undefined}
|
||||||
isAddShapeHyperlink = {isAddShapeHyperlink}
|
isAddShapeHyperlink = {isAddShapeHyperlink}
|
||||||
|
wsProps={props.wsProps}
|
||||||
/>
|
/>
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -6,23 +6,26 @@ const AddOther = props => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const _t = t('View.Add', {returnObjects: true});
|
const _t = t('View.Add', {returnObjects: true});
|
||||||
const hideAddComment = props.hideAddComment();
|
const hideAddComment = props.hideAddComment();
|
||||||
|
const wsPropsHyperlinks = props.wsPropsHyperlinks;
|
||||||
|
const wsPropsObjects = props.wsPropsObjects;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<List>
|
<List>
|
||||||
<ListItem title={_t.textImage} link={'/add-image/'}>
|
<ListItem title={_t.textImage} className={wsPropsObjects && 'disabled'} link={'/add-image/'}>
|
||||||
<Icon slot="media" icon="icon-insimage"></Icon>
|
<Icon slot="media" icon="icon-insimage"></Icon>
|
||||||
</ListItem>
|
</ListItem>
|
||||||
{!hideAddComment && <ListItem title={_t.textComment} onClick={() => {
|
{(!hideAddComment && !wsPropsObjects) && <ListItem title={_t.textComment} onClick={() => {
|
||||||
props.closeModal();
|
props.closeModal();
|
||||||
Common.Notifications.trigger('addcomment');
|
Common.Notifications.trigger('addcomment');
|
||||||
}}>
|
}}>
|
||||||
<Icon slot="media" icon="icon-insert-comment"></Icon>
|
<Icon slot="media" icon="icon-insert-comment"></Icon>
|
||||||
</ListItem>}
|
</ListItem>}
|
||||||
<ListItem title={_t.textLink} link={'/add-link/'}>
|
<ListItem title={_t.textSortAndFilter} className={wsPropsObjects && 'disabled'} link={'/add-sort-and-filter/'}>
|
||||||
<Icon slot="media" icon="icon-link"></Icon>
|
|
||||||
</ListItem>
|
|
||||||
<ListItem title={_t.textSortAndFilter} link={'/add-sort-and-filter/'}>
|
|
||||||
<Icon slot="media" icon="icon-sort"></Icon>
|
<Icon slot="media" icon="icon-sort"></Icon>
|
||||||
</ListItem>
|
</ListItem>
|
||||||
|
<ListItem title={_t.textLink} className={wsPropsHyperlinks && 'disabled'} link={'/add-link/'}>
|
||||||
|
<Icon slot="media" icon="icon-link"></Icon>
|
||||||
|
</ListItem>
|
||||||
</List>
|
</List>
|
||||||
)
|
)
|
||||||
};
|
};
|
||||||
|
|
|
@ -329,6 +329,7 @@ const EditTabs = props => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const _t = t('View.Edit', {returnObjects: true});
|
const _t = t('View.Edit', {returnObjects: true});
|
||||||
const store = props.storeFocusObjects;
|
const store = props.storeFocusObjects;
|
||||||
|
const wsProps = props.wsProps;
|
||||||
const settings = !store.focusOn ? [] : (store.focusOn === 'obj' ? store.objects : store.selections);
|
const settings = !store.focusOn ? [] : (store.focusOn === 'obj' ? store.objects : store.selections);
|
||||||
let editors = [];
|
let editors = [];
|
||||||
|
|
||||||
|
@ -345,41 +346,43 @@ const EditTabs = props => {
|
||||||
component: <EditCellController />
|
component: <EditCellController />
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
if (settings.indexOf('shape') > -1) {
|
if(!wsProps.Objects) {
|
||||||
editors.push({
|
if (settings.indexOf('shape') > -1) {
|
||||||
caption: _t.textShape,
|
editors.push({
|
||||||
id: 'edit-shape',
|
caption: _t.textShape,
|
||||||
component: <EditShapeController />
|
id: 'edit-shape',
|
||||||
})
|
component: <EditShapeController />
|
||||||
}
|
})
|
||||||
if (settings.indexOf('image') > -1) {
|
}
|
||||||
editors.push({
|
if (settings.indexOf('image') > -1) {
|
||||||
caption: _t.textImage,
|
editors.push({
|
||||||
id: 'edit-image',
|
caption: _t.textImage,
|
||||||
component: <EditImageController />
|
id: 'edit-image',
|
||||||
})
|
component: <EditImageController />
|
||||||
}
|
})
|
||||||
if (settings.indexOf('text') > -1) {
|
}
|
||||||
editors.push({
|
if (settings.indexOf('text') > -1) {
|
||||||
caption: _t.textText,
|
editors.push({
|
||||||
id: 'edit-text',
|
caption: _t.textText,
|
||||||
component: <EditTextController />
|
id: 'edit-text',
|
||||||
})
|
component: <EditTextController />
|
||||||
}
|
})
|
||||||
if (settings.indexOf('chart') > -1) {
|
}
|
||||||
editors.push({
|
if (settings.indexOf('chart') > -1) {
|
||||||
caption: _t.textChart,
|
editors.push({
|
||||||
id: 'edit-chart',
|
caption: _t.textChart,
|
||||||
component: <EditChartController />
|
id: 'edit-chart',
|
||||||
})
|
component: <EditChartController />
|
||||||
}
|
})
|
||||||
if (settings.indexOf('hyperlink') > -1 || (props.hyperinfo && props.isAddShapeHyperlink)) {
|
}
|
||||||
editors.push({
|
if (settings.indexOf('hyperlink') > -1 || (props.hyperinfo && props.isAddShapeHyperlink)) {
|
||||||
caption: _t.textHyperlink,
|
editors.push({
|
||||||
id: 'edit-link',
|
caption: _t.textHyperlink,
|
||||||
component: <EditLinkController />
|
id: 'edit-link',
|
||||||
})
|
component: <EditLinkController />
|
||||||
}
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -403,10 +406,10 @@ const EditView = props => {
|
||||||
return (
|
return (
|
||||||
show_popover ?
|
show_popover ?
|
||||||
<Popover id="edit-popover" className="popover__titled" closeByOutsideClick={false} onPopoverClosed={() => props.onClosed()}>
|
<Popover id="edit-popover" className="popover__titled" closeByOutsideClick={false} onPopoverClosed={() => props.onClosed()}>
|
||||||
<EditTabsContainer isAddShapeHyperlink={props.isAddShapeHyperlink} hyperinfo={props.hyperinfo} inPopover={true} onOptionClick={onOptionClick} style={{height: '410px'}} />
|
<EditTabsContainer isAddShapeHyperlink={props.isAddShapeHyperlink} hyperinfo={props.hyperinfo} inPopover={true} wsProps={props.wsProps} onOptionClick={onOptionClick} style={{height: '410px'}} />
|
||||||
</Popover> :
|
</Popover> :
|
||||||
<Sheet id="edit-sheet" push onSheetClosed={() => props.onClosed()}>
|
<Sheet id="edit-sheet" push onSheetClosed={() => props.onClosed()}>
|
||||||
<EditTabsContainer isAddShapeHyperlink={props.isAddShapeHyperlink} hyperinfo={props.hyperinfo} onOptionClick={onOptionClick} />
|
<EditTabsContainer isAddShapeHyperlink={props.isAddShapeHyperlink} hyperinfo={props.hyperinfo} onOptionClick={onOptionClick} wsProps={props.wsProps} />
|
||||||
</Sheet>
|
</Sheet>
|
||||||
)
|
)
|
||||||
};
|
};
|
||||||
|
@ -433,7 +436,7 @@ const EditOptions = props => {
|
||||||
const isAddShapeHyperlink = api.asc_canAddShapeHyperlink();
|
const isAddShapeHyperlink = api.asc_canAddShapeHyperlink();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<EditView usePopover={!Device.phone} onClosed={onviewclosed} isAddShapeHyperlink={isAddShapeHyperlink} hyperinfo={hyperinfo} />
|
<EditView usePopover={!Device.phone} onClosed={onviewclosed} isAddShapeHyperlink={isAddShapeHyperlink} hyperinfo={hyperinfo} wsProps={props.wsProps} />
|
||||||
)
|
)
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -44,7 +44,7 @@ const EditCell = props => {
|
||||||
onFontSize: props.onFontSize,
|
onFontSize: props.onFontSize,
|
||||||
onFontClick: props.onFontClick
|
onFontClick: props.onFontClick
|
||||||
}}/>
|
}}/>
|
||||||
{!wsLock || !wsProps.FormatCells &&
|
{(!wsLock || !wsProps.FormatCells) &&
|
||||||
<>
|
<>
|
||||||
<List>
|
<List>
|
||||||
<ListItem className='buttons'>
|
<ListItem className='buttons'>
|
||||||
|
|
Loading…
Reference in a new issue