|
@@ -26,7 +26,7 @@ import ResizeObserver from "resize-observer-polyfill";
|
|
|
import {useSelector} from "react-redux";
|
|
import {useSelector} from "react-redux";
|
|
|
import {allTopNavs, getRoute, getRouteChain, getUserInfo, isLogin, isLogined} from "@features/mainSlice";
|
|
import {allTopNavs, getRoute, getRouteChain, getUserInfo, isLogin, isLogined} from "@features/mainSlice";
|
|
|
import LazyImage from "@components/LazyImage";
|
|
import LazyImage from "@components/LazyImage";
|
|
|
-import {numFormatter} from "@utils/helpers";
|
|
|
|
|
|
|
+import {numFormatter, sleep} from "@utils/helpers";
|
|
|
import {ROUTE_PATH} from "@constants/routes";
|
|
import {ROUTE_PATH} from "@constants/routes";
|
|
|
const i18n=global.i18n;
|
|
const i18n=global.i18n;
|
|
|
|
|
|
|
@@ -273,6 +273,9 @@ const PageHeader = () => {
|
|
|
show=true;
|
|
show=true;
|
|
|
setShowMHeader(show);
|
|
setShowMHeader(show);
|
|
|
}
|
|
}
|
|
|
|
|
+ if (scrollTop<20){
|
|
|
|
|
+ setShowMHeader(true);
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
const changeHeaderHeight=()=>{
|
|
const changeHeaderHeight=()=>{
|
|
|
document.documentElement.style.setProperty('--header-active', getHeaderHeight());
|
|
document.documentElement.style.setProperty('--header-active', getHeaderHeight());
|
|
@@ -286,15 +289,132 @@ const PageHeader = () => {
|
|
|
changeHeaderHeight();
|
|
changeHeaderHeight();
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
|
|
+ const getProgressierInstallBanner=(params,callback)=>{
|
|
|
|
|
+ let banner=new window.NewProgressierInstallBanner(
|
|
|
|
|
+ params,
|
|
|
|
|
+ callback
|
|
|
|
|
+ )
|
|
|
|
|
+ banner.remove = async ()=>{
|
|
|
|
|
+ if (banner.deny && !banner.data.preview) {
|
|
|
|
|
+ banner.deny()
|
|
|
|
|
+ }
|
|
|
|
|
+ banner.element.classList.remove("in");
|
|
|
|
|
+ // await progressier.utils.wait(1e3);
|
|
|
|
|
+ banner.element.remove()
|
|
|
|
|
+ }
|
|
|
|
|
+ banner.make=()=>{
|
|
|
|
|
+ document.querySelectorAll("." + banner.className).forEach(function(e) {
|
|
|
|
|
+ e.remove()
|
|
|
|
|
+ });
|
|
|
|
|
+ banner.element = window.progressier.utils.node("div", banner.className, {
|
|
|
|
|
+ parent: document.querySelector("#installBanner")
|
|
|
|
|
+ });
|
|
|
|
|
+ banner.element.classList.add(styles.install_banner);
|
|
|
|
|
+ }
|
|
|
|
|
+ return banner;
|
|
|
|
|
+ }
|
|
|
|
|
+ const reProgressierInstallBanner=()=>{
|
|
|
|
|
+ let ProgressierInstallBanner=window.ProgressierInstallBanner;
|
|
|
|
|
+ window.NewProgressierInstallBanner=ProgressierInstallBanner;
|
|
|
|
|
+ window.ProgressierInstallBanner=function (e, t) {
|
|
|
|
|
+ this.remove = async function() {
|
|
|
|
|
+
|
|
|
|
|
+ };
|
|
|
|
|
+ this.render = async function() {
|
|
|
|
|
+
|
|
|
|
|
+ };
|
|
|
|
|
+ this.make = function() {
|
|
|
|
|
+
|
|
|
|
|
+ };
|
|
|
|
|
+ this.init = async function() {
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ const checkWaitForData=async ()=>{
|
|
|
|
|
+ let l=window.progressier.banners;
|
|
|
|
|
+ for (let i = 0; i < 5; i++) {
|
|
|
|
|
+ if (l.data.installBannerPitch!=null) break;
|
|
|
|
|
+ await l.parent.data.waitForData();
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ const startListening=async ()=>{
|
|
|
|
|
+ let l=window.progressier.banners;
|
|
|
|
|
+ await l.parent.data.waitForData();
|
|
|
|
|
+ l.data = l.parent.data.params;
|
|
|
|
|
+ if (!l.reinstallTimer) {
|
|
|
|
|
+ l.reinstallTimer = setInterval(function() {
|
|
|
|
|
+ if (!l.showInstall()) {
|
|
|
|
|
+ return
|
|
|
|
|
+ }
|
|
|
|
|
+ if (l.showed) {
|
|
|
|
|
+ return
|
|
|
|
|
+ }
|
|
|
|
|
+ l.showed = true;
|
|
|
|
|
+ // new window.NewProgressierInstallBanner({
|
|
|
|
|
+ // icon: l.icon(),
|
|
|
|
|
+ // color: l.data.buttonColor,
|
|
|
|
|
+ // btnColor: l.data.buttonTextColor,
|
|
|
|
|
+ // text: l.data.installBannerPitch
|
|
|
|
|
+ // },function() {
|
|
|
|
|
+ // l.deny(l.installCookie)
|
|
|
|
|
+ // }
|
|
|
|
|
+ // ).init();
|
|
|
|
|
+ let InstallBanner=getProgressierInstallBanner(
|
|
|
|
|
+ {
|
|
|
|
|
+ icon: l.icon(),
|
|
|
|
|
+ color: l.data.buttonColor,
|
|
|
|
|
+ btnColor: l.data.buttonTextColor,
|
|
|
|
|
+ text: l.data.installBannerPitch
|
|
|
|
|
+ },()=>{
|
|
|
|
|
+ l.deny(l.installCookie)
|
|
|
|
|
+ }
|
|
|
|
|
+ ).init();
|
|
|
|
|
+
|
|
|
|
|
+ clearInterval(l.reinstallTimer)
|
|
|
|
|
+ }, l.interval)
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ const checkProgressier=async ()=>{
|
|
|
|
|
+ if (window.progressier){
|
|
|
|
|
+ reProgressierInstallBanner();
|
|
|
|
|
+ // let l=window.progressier.banners;
|
|
|
|
|
+ // await l.parent.data.waitForData();
|
|
|
|
|
+ // await checkWaitForData();
|
|
|
|
|
+ // let data=l.data;
|
|
|
|
|
+ // if (data){
|
|
|
|
|
+ // if (window.NewProgressierInstallBanner){
|
|
|
|
|
+ // let InstallBanner=getProgressierInstallBanner(
|
|
|
|
|
+ // {
|
|
|
|
|
+ // icon: l.icon(),
|
|
|
|
|
+ // color: l.data.buttonColor,
|
|
|
|
|
+ // btnColor: l.data.buttonTextColor,
|
|
|
|
|
+ // text: l.data.installBannerPitch
|
|
|
|
|
+ // }
|
|
|
|
|
+ // ).init();
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ startListening();
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ const stopListener=()=>{
|
|
|
|
|
+ if (window.progressier==null)return;
|
|
|
|
|
+ let l=window.progressier.banners;
|
|
|
|
|
+ if(l){
|
|
|
|
|
+ if (l.reinstallTimer!=null){
|
|
|
|
|
+ clearInterval(l.reinstallTimer);
|
|
|
|
|
+ l.reinstallTimer=null;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
// 这里的代码会在组件挂载时执行
|
|
// 这里的代码会在组件挂载时执行
|
|
|
// console.log('Component mounted');
|
|
// console.log('Component mounted');
|
|
|
window.addEventListener('scroll', handleScroll);
|
|
window.addEventListener('scroll', handleScroll);
|
|
|
- // console.log("ProgressierInstallBannerProgressierInstallBanner");
|
|
|
|
|
- // console.log(window.ProgressierInstallBanner)
|
|
|
|
|
if (barRef.current) {
|
|
if (barRef.current) {
|
|
|
resizeObserver.observe(barRef.current);
|
|
resizeObserver.observe(barRef.current);
|
|
|
}
|
|
}
|
|
|
|
|
+ checkProgressier();
|
|
|
return () => {
|
|
return () => {
|
|
|
// 可选的清除函数,当组件卸载时执行
|
|
// 可选的清除函数,当组件卸载时执行
|
|
|
// console.log('Component unmounted');
|
|
// console.log('Component unmounted');
|
|
@@ -302,6 +422,7 @@ const PageHeader = () => {
|
|
|
if (barRef.current) {
|
|
if (barRef.current) {
|
|
|
resizeObserver.unobserve(barRef.current);
|
|
resizeObserver.unobserve(barRef.current);
|
|
|
}
|
|
}
|
|
|
|
|
+ stopListener();
|
|
|
};
|
|
};
|
|
|
}, []);
|
|
}, []);
|
|
|
// }, [pathname]);
|
|
// }, [pathname]);
|
|
@@ -355,13 +476,17 @@ const PageHeader = () => {
|
|
|
</animated.div>
|
|
</animated.div>
|
|
|
);
|
|
);
|
|
|
}
|
|
}
|
|
|
|
|
+ const renderMobileInstall=()=>{
|
|
|
|
|
+ return (
|
|
|
|
|
+ <div id={'installBanner'} className={styles.header_install}></div>
|
|
|
|
|
+ )
|
|
|
|
|
+ }
|
|
|
const renderMobile=()=>{
|
|
const renderMobile=()=>{
|
|
|
return (
|
|
return (
|
|
|
<>
|
|
<>
|
|
|
|
|
+ {renderMobileInstall()}
|
|
|
<MobileNav />
|
|
<MobileNav />
|
|
|
- {
|
|
|
|
|
- renderHeaderRoom()
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ {renderHeaderRoom()}
|
|
|
</>
|
|
</>
|
|
|
)
|
|
)
|
|
|
}
|
|
}
|