feat: 完善博物馆

src/api/index.ts

@@ -53,6 +53,7 @@ export const redeemApi = (params: any) => {
   return requestByPost("/api/cms/game/prize/redeem", params, {
     meta: {
       showLoading: true,
+      showError: true,
     },
   });
 };

src/app.config.ts

@@ -12,6 +12,7 @@ export default defineAppConfig({
         "pages/shopmall/index",
         "pages/feedback/index",
         "pages/order/index",
+        "pages/iframe/index",
         "pages/portrait-iframe/index",
         "pages/museum/index",
         "pages/protocol/index",

src/app.tsx

@@ -29,6 +29,7 @@ initial({
       }
       return next();
     },
+    // @ts-ignore
     async (request, next) => {
       const { showLoading, showError } = request.meta;
       try {
@@ -58,6 +59,12 @@ initial({
         }
 
         return response;
+      } catch (err) {
+        Taro.showToast({
+          title: "系统出差中",
+          icon: "none",
+          duration: 2000,
+        });
       } finally {
         if (showLoading && !showError) {
           Taro.hideLoading();

src/pages/home/components/Menu/index.tsx

@@ -6,7 +6,7 @@ import { AtDrawerProps } from "taro-ui/types/drawer";
 import { observer } from "mobx-react";
 import { useMemo } from "react";
 import { getShopRuleApi } from "../../../../api";
-import { getSceneUrl, login, MUSEUM_URL } from "../../../../utils";
+import { getSceneUrl, login } from "../../../../utils";
 import baseStore from "../../../../store/base";
 import CloseIcon from "../../../../images/icon_back_menu@2x.png";
 // import SearchIcon from "../../../../images/icon_search_black@2x-min.png";
@@ -50,9 +50,7 @@ export const Menu: FC<MenuProps> = observer((props) => {
           },
           {
             label: "慈善博物馆",
-            link:
-              "/subModule/pages/portrait-iframe/index?url=" +
-              encodeURIComponent(MUSEUM_URL),
+            link: "/subModule/pages/museum/index",
           },
           {
             label: "慈善云学校",

src/pages/home/components/SightDetailLayout/index.tsx

@@ -75,7 +75,7 @@ export const SightDetailLayout: FC<SightDetailLayoutProps> = (props) => {
                 className="sight-layout-toolbar__btn"
                 onClick={() => {
                   Taro.navigateTo({
-                    url: `/subModule/pages/portrait-iframe/index?url=${encodeURIComponent(
+                    url: `/subModule/pages/iframe/index?url=${encodeURIComponent(
                       props.item.link
                     )}`,
                   });

src/pages/iframe/index.tsx

@@ -1,25 +1,11 @@
 import { WebView } from "@tarojs/components";
-import Taro, { FC, getCurrentPages, useRouter } from "@tarojs/taro";
+import { FC, useRouter } from "@tarojs/taro";
 
 const IframePage: FC = () => {
   const route = useRouter();
 
-  const handleMessage = (event) => {
-    console.log(event);
-    const pages = getCurrentPages();
-    const firstPage = pages[0];
-    console.log(firstPage);
-
-    Taro.reLaunch({
-      url: "/pages/banner/index",
-    });
-  };
-
   return route.params.url ? (
-    <WebView
-      src={decodeURIComponent(route.params.url)}
-      onMessage={handleMessage}
-    />
+    <WebView src={decodeURIComponent(route.params.url)} />
   ) : null;
 };
 

src/subModule/pages/iframe/index.config.ts

@@ -0,0 +1,4 @@
+export default definePageConfig({
+  navigationBarTitleText: "锡善云城",
+  pageOrientation: "landscape",
+});

src/subModule/pages/iframe/index.tsx

@@ -0,0 +1,21 @@
+import { WebView } from "@tarojs/components";
+import Taro, { FC, useRouter } from "@tarojs/taro";
+import { useEffect } from "react";
+
+const IframePage: FC = () => {
+  const route = useRouter();
+
+  useEffect(() => {
+    if (route.params.title) {
+      Taro.setNavigationBarTitle({
+        title: route.params.title,
+      });
+    }
+  }, []);
+
+  return route.params.url ? (
+    <WebView src={decodeURIComponent(route.params.url)} />
+  ) : null;
+};
+
+export default IframePage;

src/subModule/pages/museum/index.scss

@@ -3,4 +3,104 @@
   height: 100vh;
   overflow: hidden;
   background: url("./images/bg@2x-min.jpg") no-repeat center bottom / cover;
+
+  &__logo {
+    position: absolute;
+    top: 50px;
+    left: 50%;
+    width: 564px;
+    height: 302px;
+    transform: translateX(-50%);
+    transition: all linear 0.2s;
+
+    &.sm {
+      top: 20px;
+      width: 400px;
+      height: 214px;
+    }
+  }
+  &-swiper {
+    width: 100%;
+    height: 100%;
+
+    &-item {
+      overflow: visible;
+    }
+  }
+  &-contain {
+    position: relative;
+    padding-top: 123px;
+    height: calc(100% + 360px);
+    border-top-left-radius: 30px;
+    border-top-right-radius: 30px;
+    background: rgba(22, 18, 14, 0.6);
+    box-sizing: border-box;
+
+    &__close {
+      position: absolute;
+      top: 30px;
+      right: 20px;
+      width: 122px;
+      height: 123px;
+    }
+  }
+  .list {
+    height: 100%;
+
+    &-item {
+      display: flex;
+      flex-direction: column;
+      padding-left: 32px;
+
+      &__scroll {
+        flex: 1;
+        height: 0;
+        padding-bottom: 20px;
+      }
+      &__img {
+        margin: 10px 0 46px;
+        width: 480px;
+      }
+      &__inner {
+        width: calc(100% - 100px);
+        color: white;
+        text-indent: 2em;
+        font-size: 31px;
+        line-height: 36px;
+      }
+    }
+  }
+  &__tips {
+    display: none;
+    position: absolute;
+    left: 50%;
+    bottom: 67px;
+    text-align: center;
+    line-height: 92px;
+    width: 448px;
+    height: 92px;
+    color: white;
+    font-size: 31px;
+    background: rgba(0, 0, 0, 0.85);
+    border-radius: 10px;
+    transform: translate(-50%);
+    opacity: 0;
+
+    &.show {
+      display: block;
+      animation: tipsAni ease-in-out 2s forwards;
+    }
+  }
+}
+
+@keyframes tipsAni {
+  20% {
+    opacity: 1;
+  }
+  80% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
 }

src/utils/fetch.ts

@@ -9,6 +9,8 @@ export const $fetch = (input, init) => {
   const headers = requestInit.headers ?? {};
   const body = requestInit.body;
 
+  headers["Content-Type"] = "application/json";
+
   return new Promise((resolve) => {
     Taro.request({
       url,

src/utils/index.ts

@@ -13,7 +13,7 @@ export const getSceneUrl = (scene?: number) => {
   const name = getStorageSync(NICKNAME_KEY);
   const token = getStorageSync(TOKEN_KEY);
 
-  return `https://app.4dage.com/projects/wxcs/web/index.html?platform=wx&name=${encodeURIComponent(
+  return `https://app.4dage.com/projects/wxcs/wx/index.html?platform=wx&name=${encodeURIComponent(
     name
   )}&token=${token}${typeof scene === "number" ? `&scene=${scene}` : ""}`;
 };