fix: 演示过渡页添加 隐藏 返回按钮事件

src/pages/bootpage/template/demonstration/components/Iframe/index.js

@@ -13,18 +13,8 @@ import { decode, encode } from 'js-base64';
 import styles from './index.less';
 const IframeContainer = props => {
   const { linkUrl, onMessageBack, loading } = props;
-  const [showBackBtn, setShowBackBtn] = useState(true); // 是否显示iframe 返回按钮，三维平台用
 
   const onMessage = e => {
-    console.log('onMessageBack ~ data:', e?.data);
-    if (e?.data.type === 'showBack') {
-      !showBackBtn && setShowBackBtn(true);
-      return;
-    }
-    if (e?.data.type === 'hideBack') {
-      showBackBtn && setShowBackBtn(false);
-      return;
-    }
     onMessageBack && onMessageBack(e?.data);
   };
   const onError = e => {

src/pages/bootpage/template/demonstration/index.js

@@ -59,6 +59,7 @@ const Demonstration = props => {
   const [newProductData, setNewProductData] = useState([]);
   const [productConfig, setProductConfig] = useState({}); // 项目案例是否可免密跳转
 
+  const [showBackBtn, setShowBackBtn] = useState(true); // 是否显示iframe 返回按钮，三维平台用
   const [ref, isFullscreen, handleFullScreen, handleExitFullScreen] = useFullScreen(false);
   // 退出
   const exit = () => {
@@ -133,19 +134,35 @@ const Demonstration = props => {
   };
   const onMessageBack = data => {
     if (!data?.type) return;
-    if (data?.type === 'runAfterFirstMounted' || data?.type === 'loginSuccess') {
-      jumpProgressEnd();
-      setTimeout(() => {
-        setJumpLoading(false);
-      }, 100);
-    } else if (data?.type === 'loginError') {
-      message.warning('登录失败，请联系管理人员');
-      handError();
-    } else if (data?.type === '无法连接') {
-      message.warning('该站点无法连接，请联系管理人员');
-      setTimeout(() => {
+    console.log('onMessageBack ~ data:', data);
+    switch (data?.type) {
+      // 页面加载完成
+      // 登录成功
+      case 'runAfterFirstMounted':
+      case 'loginSuccess':
+        jumpProgressEnd();
+        setTimeout(() => {
+          setJumpLoading(false);
+        }, 100);
+        break;
+      case 'loginError':
+        message.warning('登录失败，请联系管理人员');
         handError();
-      }, 100);
+        break;
+      case '无法连接':
+        message.warning('该站点无法连接，请联系管理人员');
+        setTimeout(() => {
+          handError();
+        }, 100);
+        break;
+      case 'showBack':
+        !showBackBtn && setShowBackBtn(true);
+        break;
+      case 'hideBack':
+        showBackBtn && setShowBackBtn(false);
+        break;
+      default:
+        break;
     }
   };
 
@@ -391,18 +408,6 @@ const Demonstration = props => {
     if (!linkUrl) return null;
     return (
       <>
-        <div
-          className={classNames(styles.iframeExit, 'animate__animated', 'animate__fadeIn')}
-          onClick={() => setLinkUrl('')}
-        >
-          <div className={styles.iframeBackLeft}>
-            <img src={arrowLeftImg} alt="返回" />
-          </div>
-          <div className={styles.iframeExitIcon}>
-            <img src={backImg} alt="返回" />
-            返回
-          </div>
-        </div>
         <div className={classNames(!jumpLoading ? styles.scaleInCenter : styles.hide, 'animate__animated')}>
           <Iframe linkUrl={linkUrl} onMessageBack={onMessageBack} />
         </div>
@@ -566,6 +571,20 @@ const Demonstration = props => {
           </>
         ) : null}
       </div>
+      {linkUrl && showBackBtn ? (
+        <div
+          className={classNames(styles.iframeExit, 'animate__animated', 'animate__fadeIn')}
+          onClick={() => setLinkUrl('')}
+        >
+          <div className={styles.iframeBackLeft}>
+            <img src={arrowLeftImg} alt="返回" />
+          </div>
+          <div className={styles.iframeExitIcon}>
+            <img src={backImg} alt="返回" />
+            返回
+          </div>
+        </div>
+      ) : null}
       {iframeItem}
     </div>
   );