[DE mobile] Correct creating searchbar
This commit is contained in:
parent
5edf90c839
commit
3bfca10bcd
|
@ -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,
|
||||||
|
|
|
@ -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(
|
||||||
|
|
|
@ -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();
|
||||||
|
|
Loading…
Reference in a new issue