Parcourir la source

fix: 修改pwa 弹窗多展示

Before il y a 8 mois
Parent
commit
6fe35d3558

+ 1 - 1
src/app/[locale]/(TabBar)/[[...share]]/@popupWidget/page.tsx

@@ -41,7 +41,7 @@ const Page = async () => {
                 type={promotions?.summery?.showType || 1}
             />
             {/*安装弹窗*/}
-            <Desktop />
+            <Desktop source={"page"} />
 
             {/* 新用户充值活动 */}
             <UserRecharge />

+ 15 - 9
src/components/Box/Desktop.tsx

@@ -3,7 +3,7 @@ import { useSystemStore } from "@/stores/useSystemStore";
 import { Button, Popup } from "antd-mobile";
 import { useTranslations } from "next-intl";
 import Image from "next/image";
-import { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
 
 /**
  * @description 检测pwa是否下载
@@ -14,17 +14,21 @@ export interface DesktopRefProps {
     onOpen: () => void;
     onClose: () => void;
 }
-interface Props {}
+interface Props {
+    source?: "page" | "components";
+}
 const Desktop = forwardRef<DesktopRefProps, Props>(function Desktop(props, ref) {
     const prompt = useRef<Event | null>(null);
+    const { source = "page" } = props;
 
     const t = useTranslations("HomePage");
-    const { isHasDesktop, setHasDesktop } = useSystemStore((state) => {
-        return {
-            isHasDesktop: state.isHasDesktop,
-            setHasDesktop: state.setHasDesktop,
-        };
-    });
+    // const { isHasDesktop, setHasDesktop } = useSystemStore((state) => {
+    //     return {
+    //         isHasDesktop: state.isHasDesktop,
+    //         setHasDesktop: state.setHasDesktop,
+    //     };
+    // });
+    const [isHasDesktop, setHasDesktop] = useState(false);
     const downloadHandler = () => {
         // @ts-ignore
         prompt.current?.prompt();
@@ -33,6 +37,8 @@ const Desktop = forwardRef<DesktopRefProps, Props>(function Desktop(props, ref)
     };
 
     const initDesktop = (e: Event) => {
+        console.log(`🚀🚀🚀🚀🚀-> in Desktop.tsx on 40`, source);
+        if (source === "components") return;
         if (window.matchMedia("(display-mode: standalone)").matches) {
             setHasDesktop(false);
             return;
@@ -66,7 +72,7 @@ const Desktop = forwardRef<DesktopRefProps, Props>(function Desktop(props, ref)
     return (
         <Popup
             visible={!!isHasDesktop}
-            getContainer={null}
+            getContainer={document.getElementById("app")}
             bodyStyle={{ padding: "0.2rem", background: "#fff" }}
         >
             <div className={"flex text-[0.12rem] text-[#8d8d8d]"}>

+ 1 - 1
src/components/Box/index.tsx

@@ -144,7 +144,7 @@ const Box: FC<PropsWithChildren<Props>> = (props) => {
             </Tag>
 
             <RedPacketModal ref={packetModalRef} />
-            <DesktopModal ref={pwaModalRef} />
+            <DesktopModal ref={pwaModalRef} source={"components"} />
         </>
     );
 };

+ 3 - 0
src/components/Box/types.ts

@@ -1,3 +1,6 @@
+/**
+ * @description 弹窗类型
+ */
 export enum ModalEnum {
     red_packet = "red_packet",
     pwa_install = "pwa_install",