[DE mobile] Correct creating searchbar

This commit is contained in:
SergeyEzhin 2022-10-18 21:51:12 +04:00
parent 5edf90c839
commit 3bfca10bcd
3 changed files with 20 additions and 18 deletions

View file

@ -1,12 +1,13 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Searchbar, Popover, Popup, View, Page, List, ListItem, Navbar, NavRight, Link } from 'framework7-react'; import { Popover, Popup, View, Page, List, ListItem, Navbar, NavRight, Link, f7 } from 'framework7-react';
import { Toggle } from 'framework7-react'; import { Toggle } from 'framework7-react';
import { f7 } from 'framework7-react'; // import { f7 } from 'framework7-react/shared/f7.js';
import { Dom7 } from 'framework7'; // import { Dom7 } from 'framework7';
import { Device } from '../../../../common/mobile/utils/device'; import { Device } from '../../../../common/mobile/utils/device';
import { observable, runInAction } from "mobx"; import { observable, runInAction } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import Searchbar from 'framework7/components/searchbar'
const searchOptions = observable({ const searchOptions = observable({
usereplace: false, usereplace: false,
@ -105,12 +106,13 @@ class SearchView extends Component {
$editor.on('pointerdown', this.onEditorTouchStart); $editor.on('pointerdown', this.onEditorTouchStart);
$editor.on('pointerup', this.onEditorTouchEnd); $editor.on('pointerup', this.onEditorTouchEnd);
if( !this.searchbar ) { // if(!this.searchbar) {
this.searchbar = f7.searchbar.get('.searchbar'); // // f7.searchbar.get('.searchbar');
} // // this.searchbar = Searchbar.get('.searchbar');
// }
if( !this.searchbar ) { if(!this.searchbar) {
this.searchbar = f7.searchbar.create({ this.searchbar = Searchbar.create({
el: '.searchbar', el: '.searchbar',
customSearch: true, customSearch: true,
expandable: true, expandable: true,

View file

@ -4,8 +4,8 @@ import { createRoot } from 'react-dom/client';
// Import Framework7 // Import Framework7
// framework7/lite-bundle // framework7/lite-bundle
import Framework7 from 'framework7'; import Framework7 from 'framework7/lite';
import { Dom7 } from 'framework7'; import { Dom7 } from 'framework7/lite';
window.$$ = Dom7; window.$$ = Dom7;
// Import Framework7-React Plugin // Import Framework7-React Plugin
@ -23,9 +23,9 @@ import('./less/app.less');
// Import App Component // Import App Component
import App from './view/app.jsx';
import { I18nextProvider } from 'react-i18next'; import { I18nextProvider } from 'react-i18next';
import i18n from './lib/i18n.js'; import i18n from './lib/i18n.js';
import App from './view/app.jsx';
import { Provider } from 'mobx-react'; import { Provider } from 'mobx-react';
import { stores } from './store/mainStore.js'; import { stores } from './store/mainStore.js';
@ -35,7 +35,7 @@ const container = document.getElementById('app');
const root = createRoot(container); const root = createRoot(container);
// Init F7 React Plugin // Init F7 React Plugin
Framework7.use(Framework7React) Framework7.use(Framework7React);
// Mount React App // Mount React App
root.render( root.render(

View file

@ -1,10 +1,10 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { List, ListItem, Toggle, Page, Navbar, NavRight, Link } from 'framework7-react'; import { List, ListItem, Toggle, Page, Navbar, NavRight, Link, f7 } from 'framework7-react';
import { SearchController, SearchView, SearchSettingsView } from '../../../../common/mobile/lib/controller/Search'; import { SearchController, SearchView, SearchSettingsView } from '../../../../common/mobile/lib/controller/Search';
import { f7 } from 'framework7-react';
import { withTranslation } from 'react-i18next'; import { withTranslation } from 'react-i18next';
import { Device } from '../../../../common/mobile/utils/device'; import { Device } from '../../../../common/mobile/utils/device';
import { observer, inject } from "mobx-react"; import { observer, inject } from "mobx-react";
// import { f7 } from 'framework7-react/shared/f7.js';
class SearchSettings extends SearchSettingsView { class SearchSettings extends SearchSettingsView {
constructor(props) { constructor(props) {
@ -94,14 +94,14 @@ class DESearchView extends SearchView {
const Search = withTranslation()(props => { const Search = withTranslation()(props => {
const { t } = props; const { t } = props;
const _t = t('Settings', {returnObjects: true}); const _t = t('Settings', {returnObjects: true});
// f7.searchbar.get('.searchbar')?.enabled &&
useEffect(() => { useEffect(() => {
if (f7.searchbar.get('.searchbar')?.enabled && Device.phone) { if(Device.phone) {
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();
$$('.searchbar-input').focus(); $$('.searchbar-input').focus();
api.asc_enableKeyEvents(false); // api.asc_enableKeyEvents(false);
} }
}); }, []);
const onSearchQuery = params => { const onSearchQuery = params => {
const api = Common.EditorApi.get(); const api = Common.EditorApi.get();