Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE mobile] Correct content controls

Browse source
This commit is contained in:
SergeyEzhin 2021-09-24 16:16:20 +03:00
parent 95c56cde77
commit ee5dab8cb0
4 changed files with 46 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
apps/documenteditor/mobile/locale/en.json
View file

@ -326,7 +326,8 @@
"textSeptember": "September",
"textOctober": "October",
"textNovember": "November",
"textDecember": "December"
"textDecember": "December",
"textEmpty": "Empty"
},
"Error": {
"convertationTimeoutText": "Conversion timeout exceeded.",

42
apps/documenteditor/mobile/src/controller/DropdownList.jsx
View file

@ -1,6 +1,7 @@
import React, { Component } from 'react';
import { Device } from '../../../../common/mobile/utils/device';
import { f7 } from "framework7-react";
import { withTranslation } from "react-i18next";
import DropdownList from "../view/DropdownList";
class DropdownListController extends Component {
@ -12,19 +13,17 @@ class DropdownListController extends Component {
isOpen: false
};
Common.Notifications.on('openDropdownList', (obj, x, y) => {
this.initDropdownList(obj, x, y);
Common.Notifications.on('openDropdownList', obj => {
this.initDropdownList(obj);
});
}
initDropdownList(obj, x, y) {
initDropdownList(obj) {
let type = obj.type;
this.left = x;
this.top = y;
this.props = obj.pr;
this.specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? this.props.get_ComboBoxPr() : this.props.get_DropDownListPr();
this.isForm = !!this.props.get_FormPr();
this.propsObj = obj.pr;
this.specProps = (type == Asc.c_oAscContentControlSpecificType.ComboBox) ? this.propsObj.get_ComboBoxPr() : this.propsObj.get_DropDownListPr();
this.isForm = !!this.propsObj.get_FormPr();
this.listItems = [];
this.initListItems();
@ -35,7 +34,17 @@ class DropdownListController extends Component {
}
initListItems() {
let count = this.specProps.get_ItemsCount();
const { t } = this.props;
const count = this.specProps.get_ItemsCount();
if(this.isForm) {
let text = this.propsObj.get_PlaceholderText();
this.listItems.push({
caption: text.trim() !== '' ? text : t('Edit.textEmpty'),
value: ''
});
}
for (let i = 0; i < count; i++) {
if(this.specProps.get_ItemValue(i) || !this.isForm) {
@ -45,11 +54,18 @@ class DropdownListController extends Component {
});
}
}
if (!this.isForm && this.listItems.length < 1) {
this.listItems.push({
caption: t('Edit.textEmpty'),
value: -1
});
}
}
closeModal() {
if(Device.isPhone) {
f7.popup.close('#dropdown-list-popup', true);
f7.sheet.close('#dropdown-list-sheet', true);
} else {
f7.popover.close('#dropdown-list-popover', true);
}
@ -59,10 +75,10 @@ class DropdownListController extends Component {
onChangeItemList(value) {
const api = Common.EditorApi.get();
// const internalId = this.props.get_InternalId;
// const internalId = this.propsObj.get_InternalId;
if(value !== -1) {
this.closeModal()
this.closeModal();
api.asc_SelectContentControlListItem(value);
}
}
@ -79,4 +95,4 @@ class DropdownListController extends Component {
}
}
export default DropdownListController;
export default withTranslation()(DropdownListController);

8
apps/documenteditor/mobile/src/controller/Main.jsx
View file

@ -562,10 +562,6 @@ class MainController extends Component {
}
});
this.api.asc_registerCallback('asc_onHideContentControlsActions', () => {
console.log(true);
});
// text settings
const storeTextSettings = this.props.storeTextSettings;
storeTextSettings.resetFontsRecent(LocalStorage.getItem('dde-settings-recent-fonts'));
@ -722,6 +718,7 @@ class MainController extends Component {
onShowListActions(obj, x, y) {
if(!Device.isPhone) {
this.dropdownListTarget = this.boxSdk.find('#dropdown-list-target');
if (this.dropdownListTarget.length < 1) {
@ -730,8 +727,9 @@ class MainController extends Component {
}
this.dropdownListTarget.css({left: `${x}px`, top: `${y}px`});
}
Common.Notifications.trigger('openDropdownList', obj, x, y);
Common.Notifications.trigger('openDropdownList', obj);
}
onProcessSaveResult (data) {

12
apps/documenteditor/mobile/src/view/DropdownList.jsx
View file

@ -1,6 +1,5 @@
import React, {Component, useEffect, useState} from 'react';
import { f7, Page, Navbar, List, ListItem, BlockTitle, ListButton, Popover, Popup, View, Link, Actions, ActionsGroup } from "framework7-react";
import { useTranslation } from "react-i18next";
import { f7, Page, Navbar, List, ListItem, BlockTitle, ListButton, Popover, Popup, View, Link, Sheet } from "framework7-react";
import { Device } from '../../../../common/mobile/utils/device';
const PageDropdownList = props => {
@ -27,16 +26,15 @@ class DropdownListView extends Component {
render() {
return (
Device.isPhone ?
<Popup id="dropdown-list-popup" style={{height: '410px'}}>
<Sheet id="dropdown-list-sheet" closeByOutsideClick={true} backdrop={false} closeByBackdropClick={false} swipeToStep={true} swipeToClose={true}>
<PageDropdownList
listItems={this.props.listItems}
onChangeItemList={this.props.onChangeItemList}
closeModal={this.props.closeModal}
style={{height: '100%'}}
/>
</Popup>
</Sheet>
:
<Popover id="dropdown-list-popover" closeByOutsideClick={false} closeByBackdropClick={false}>
<Popover id="dropdown-list-popover" className="popover__titled" closeByOutsideClick={false}>
<PageDropdownList
listItems={this.props.listItems}
onChangeItemList={this.props.onChangeItemList}
@ -53,7 +51,7 @@ class DropdownListView extends Component {
const DropdownList = props => {
useEffect(() => {
if(Device.isPhone) {
f7.popup.open('#dropdown-list-popup', true);
f7.sheet.open('#dropdown-list-sheet', true);
} else {
f7.popover.open('#dropdown-list-popover', '#dropdown-list-target');
}