init

src/core/ctrls/ModalCtrl.module.less

@@ -4,9 +4,9 @@
   bottom: 0;
   right: 0;
   left: 0;
-  background-color: rgba(0, 0, 0, 0.9);
+  background-color: rgba(0, 0, 0, 0.8);
   z-index: 2000;
   display: flex;
   align-items: center;
   justify-content: center;
-}
+}
\ No newline at end of file

src/core/ctrls/ModalCtrl.tsx

@@ -5,6 +5,8 @@ import NewcomerPanel from "@/panels/NewcomerPanel/NewcomerPanel.tsx";
 import WedExpPanel from "@/panels/WedExpPanel/WedExpPanel.tsx";
 import SignSucPanel from "@/panels/SignSucPanel/SignSucPanel.tsx";
 import VideoPanel from "@/panels/VideoPanel/VideoPanel.tsx";
+import GuidePanel from "@/panels/GuidePanel/GuidePanel.tsx";
+import top from "@/pages/HomePage/Top/Top.tsx";
 
 // 弹窗优先级配置Map，key为弹窗组件名（建议用组件.displayName或组件名字符串），value为优先级数值
 // 数值越大优先级越高，未配置的默认0
@@ -13,6 +15,7 @@ const modalPriorityMap = new Map<ComponentType<any>, number>([
   [WedExpPanel, 15],
   [SignSucPanel, 15],
   [VideoPanel, 10],
+  [GuidePanel, 100],
 ]);
 
 interface ModalItem {
@@ -29,9 +32,10 @@ interface ModalCtrlState {
 export class ModalCtrl extends Component<{}, ModalCtrlState> {
   state = {
     modals: [],
+    showMask: true,
   };
 
-  static showModal: (Component: ComponentType<any>, props?: any) => void = null;
+  static showModal: (Component: ComponentType<any>, props?: any, showMask?: boolean) => void = null;
   static closeModal: (Component?: ComponentType<any>) => void = null;
   static closeAllModal: () => void = null;
 
@@ -47,12 +51,12 @@ export class ModalCtrl extends Component<{}, ModalCtrlState> {
     ModalCtrl.closeAllModal = null;
   }
 
-  showModal = (Component: ComponentType<any>, props: any = {}) => {
+  showModal = (Component: ComponentType<any>, props: any = {}, showMask = true) => {
     const key = `modal_${Date.now()}_${Math.random()}`;
     const priority = modalPriorityMap.get(Component) || 0;
 
     const modals = this.state.modals;
-    modals.push({ key, Component, props, priority })
+    modals.push({ key, Component, props, priority, showMask });
     modals.sort((a, b) => {
       return (a.priority || 0) - (b.priority || 0);
     });
@@ -85,7 +89,11 @@ export class ModalCtrl extends Component<{}, ModalCtrlState> {
     const topModal = modals[modals.length - 1];
     return (
       <>
-        <div className={styles.modalManagerBg} key={topModal.key} style={{ zIndex: 2000 }}>
+        <div
+          className={styles.modalManagerBg}
+          key={topModal.key}
+          style={{ zIndex: 2000, backgroundColor: `rgba(0,0,0, ${topModal.showMask ? 0.7 : 0})` }}
+        >
           <topModal.Component {...topModal.props}/>
         </div>
       </>

src/pages/HomePage/HomePage.tsx

@@ -77,7 +77,7 @@ class HomePage extends React.Component<any, any> {
         </div>
 
       </div>
-      {!guideFlag && <GuidePanel />}
+      {/*{!guideFlag && <GuidePanel />}*/}
     </>;
   }
 }

src/store/store.ts

@@ -21,6 +21,7 @@ import { showShareGuide } from '@spark/share';
 import Assist_succeed from "../../src/components/assist_succeed/assist_succeed"
 import Assist_fail from "../../src/components/assist_fail/assist_fail"
 import Fail_challenge from "../../src/components/fail_challenge/fail_challenge"
+import GuidePanel from "@/panels/GuidePanel/GuidePanel.tsx";
 
 class Store {
 
@@ -113,6 +114,11 @@ class Store {
       });
     }
 
+    if (!data.guideFlag) {
+      ModalCtrl.closeModal(GuidePanel);
+      ModalCtrl.showModal(GuidePanel, {}, false);
+    }
+
   }
 
   /**