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

[SSE mobile] Added function info

Browse source
This commit is contained in:
SergeyEzhin 2021-09-01 19:22:51 +03:00
parent 78cdc5f873
commit a7311327f8
2 changed files with 29 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -878,12 +878,10 @@ input[type="number"]::-webkit-inner-spin-button {
} }
.functions-list { .functions-list {
width: 100%; height: 175px;
height: 150px;
overflow-y: auto; overflow-y: auto;
position: absolute; position: absolute;
top: 30px; top: 30px;
left: 0;
right: 0; right: 0;
background-color: @white; background-color: @white;
.list { .list {
@ -898,7 +896,7 @@ input[type="number"]::-webkit-inner-spin-button {
padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left) - var(--menu-list-offset)); padding-left: calc(var(--f7-list-item-padding-horizontal) + var(--f7-safe-area-left) - var(--menu-list-offset));
} }
.item-title { .item-title {
font-size: 14px; font-size: 15px;
} }
} }
} }

31
apps/spreadsheeteditor/mobile/src/view/CellEditor.jsx
View file

@ -1,7 +1,10 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Input, View, Button, Link, Popover, ListItem, List } from 'framework7-react'; import { Input, View, Button, Link, Popover, ListItem, List, Icon, f7 } from 'framework7-react';
import {observer, inject} from "mobx-react"; import {observer, inject} from "mobx-react";
// import {PageFunctionInfo} from "./add/AddFunction";
import { __interactionsRef } from 'scheduler/tracing';
import { Device } from '../../../../common/mobile/utils/device';
const viewStyle = { const viewStyle = {
height: 30 height: 30
@ -13,7 +16,10 @@ const contentStyle = {
const CellEditorView = props => { const CellEditorView = props => {
const [expanded, setExpanded] = useState(false); const [expanded, setExpanded] = useState(false);
const isPhone = Device.isPhone;
const storeAppOptions = props.storeAppOptions; const storeAppOptions = props.storeAppOptions;
const storeFunctions = props.storeFunctions;
const functions = storeFunctions.functions;
const isEdit = storeAppOptions.isEdit; const isEdit = storeAppOptions.isEdit;
const funcArr = props.funcArr; const funcArr = props.funcArr;
@ -35,11 +41,28 @@ const CellEditorView = props => {
<Link icon="caret" onClick={expandClick} /> <Link icon="caret" onClick={expandClick} />
</div> </div>
{funcArr && funcArr.length && {funcArr && funcArr.length &&
<div id="idx-functions-list" className="functions-list"> <div id="idx-functions-list" className="functions-list" style={{left: isPhone ? '0' : '132px', width: isPhone ? '100%' : '360px'}}>
<List> <List>
{funcArr.map((elem, index) => { {funcArr.map((elem, index) => {
return ( return (
<ListItem key={index} title={elem.name} onClick={() => props.insertFormula(elem.name, elem.type)}></ListItem> <ListItem key={index} title={elem.name} className="no-indicator" onClick={() => props.insertFormula(elem.name, elem.type)}>
<div slot='after'
onClick={(e) => {
e.stopPropagation();
let functionInfo = functions[elem.name];
if(functionInfo) {
f7.dialog.create({
title: functionInfo.caption,
content: `<h3>${functionInfo.caption} ${functionInfo.args}</h3>
<p>${functionInfo.descr}</p>`,
buttons: [{text: 'Ok'}]
}).open();
}
}}>
<Icon icon='icon-info'/>
</div>
</ListItem>
) )
})} })}
</List> </List>
@ -48,4 +71,4 @@ const CellEditorView = props => {
</View>; </View>;
}; };
export default inject("storeAppOptions")(observer(CellEditorView)); export default inject("storeAppOptions", "storeFunctions")(observer(CellEditorView));