pengjunjie/web-apps
1
0
Fork 1
mirror of https://github.com/ONLYOFFICE/web-apps.git synced 2026-07-24 18:24:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

[DE mobile] Correct opening of custom option in dropdown list

Browse Source
This commit is contained in:
SergeyEzhin
2024-04-22 20:07:46 +03:00
parent 3973951711
commit 3fab4e712a
3 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/common/mobile/resources/less/common.less
View File

@ -1068,6 +1068,12 @@ input[type="number"]::-webkit-inner-spin-button {
height: 100%;
}
.dropdown-list-popup {
height: 260px;
bottom: 0;
top: auto;
}
.dropdown-list {
&__placeholder {
opacity: 0.6;

2
apps/documenteditor/mobile/src/controller/DropdownList.jsx
View File

@ -72,7 +72,7 @@ class DropdownListController extends Component {
closeModal() {
if(Device.isPhone) {
f7.sheet.close('#dropdown-list-sheet', true);
f7.popup.close('#dropdown-list-popup', true);
} else {
f7.popover.close('#dropdown-list-popover', true);
}

23
apps/documenteditor/mobile/src/view/DropdownList.jsx
View File

@ -1,5 +1,5 @@
import React, { Component, useEffect, useState } from 'react';
import { f7, Page, Navbar, List, ListItem, Popover, View, Link, Sheet, Icon, NavRight, BlockTitle, NavLeft } from "framework7-react";
import { f7, Page, Navbar, List, ListItem, Popover, View, Link, Sheet, Icon, NavRight, BlockTitle, NavLeft, Popup } from "framework7-react";
import { Device } from '../../../../common/mobile/utils/device';
import { useTranslation } from 'react-i18next';
@ -28,13 +28,6 @@ const PageCustomOptionList = props => {
)
}
const routes = [
{
path: '/custom-option/',
component: PageCustomOptionList
}
]
const PageDropdownList = props => {
const listItems = props.listItems;
const curValue = props.curValue;
@ -122,6 +115,13 @@ const PageDropdownList = props => {
);
};
const routes = [
{
path: '/custom-option/',
component: PageCustomOptionList
}
]
class DropdownListView extends Component {
constructor(props) {
super(props);
@ -130,7 +130,7 @@ class DropdownListView extends Component {
render() {
return (
Device.isPhone ?
<Sheet id="dropdown-list-sheet" closeByBackdropClick={true} swipeToClose={true} onSheetClosed={() => this.props.closeModal()}>
<Popup id="dropdown-list-popup" className="dropdown-list-popup" closeByOutsideClick={true} swipeToClose={true} onPopupClosed={() => this.props.closeModal()}>
<PageDropdownList
listItems={this.props.listItems}
onChangeItemList={this.props.onChangeItemList}
@ -139,8 +139,9 @@ class DropdownListView extends Component {
onAddItem={this.props.onAddItem}
curValue={this.props.curValue}
enteredValue={this.props.enteredValue}
style={{height: '260px'}}
/>
</Sheet>
</Popup>
:
<Popover id="dropdown-list-popover" className="popover__titled" closeByOutsideClick={true} onPopoverClosed={() => this.props.closeModal()}>
<PageDropdownList
@ -163,7 +164,7 @@ class DropdownListView extends Component {
const DropdownList = props => {
useEffect(() => {
if(Device.isPhone) {
f7.sheet.open('#dropdown-list-sheet', true);
f7.popup.open('#dropdown-list-popup', true);
} else {
f7.popover.open('#dropdown-list-popover', '#dropdown-list-target');
}