Trang chủ Khám phá Trợ giúp
Đăng ký Đăng nhập
shaogen1995
/
huaDongYeZhanJun
1
0
Fork 0
Các tập tin Các vấn đề 0 Yêu cầu khéo về 0 Wiki
Browse Source

upp

shaogen1995 1 năm trước cách đây
mục cha
c2ce0003ec
commit
04ea27e3a8
13 tập tin đã thay đổi với 162 bổ sung và 582 xóa
Split View Hiển thị tình trạng sai khác
  1. 1 1
      public/index.html
  2. 0 3
      src/App.tsx
  3. 0 3
      src/AppM.tsx
  4. BIN
      src/assets/img/back.png
  5. BIN
      src/assets/img/look.png
  6. 81 49
      src/pages/A1Home/index.module.scss
  7. 53 13
      src/pages/A1Home/index.tsx
  8. 19 2
      src/pages/A2VrPage/index.tsx
  9. 0 123
      src/pages/A4Intro/index.module.scss
  10. 0 127
      src/pages/A4Intro/index.tsx
  11. 0 113
      src/pages/A4IntroM/index.module.scss
  12. 0 141
      src/pages/A4IntroM/index.tsx
  13. 8 7
      src/types/api/layot.d.ts

+ 1 - 1
public/index.html
Xem Tập Tin 

@@ -32,7 +32,7 @@
 
       work correctly both with client-side routing and a non-root public URL.
 
       Learn how to configure a non-root public URL by running `npm run build`.
 
     -->
 
-  <title>黄麻起义红色基因库</title>
 
+  <title>华东野战军线上展厅</title>
 
 </head>
 
 
 <body>

+ 0 - 3
src/App.tsx
Xem Tập Tin 

@@ -13,7 +13,6 @@ import NotFound from "./components/NotFound";
 
 const A1Home = React.lazy(() => import("./pages/A1Home"));
 
 const A2VrPage = React.lazy(() => import("./pages/A2VrPage"));
 
 const A3Goods = React.lazy(() => import("./pages/A3Goods"));
 
-const A4Intro = React.lazy(() => import("./pages/A4Intro"));
 
 
 export default function App() {
 
   // 从仓库中获取查看图片的信息
 
@@ -33,8 +32,6 @@ export default function App() {
 
             <Route path="/vr" component={A2VrPage} />
 
             {/* 文物赏析页面 */}
 
             <Route path="/goods" component={A3Goods} />
 
-            {/* 场馆介绍页面 */}
 
-            <Route path="/intro" component={A4Intro} />
 
 
             {/* 找不到页面 */}
 
             <Route path="*" component={NotFound} />

+ 0 - 3
src/AppM.tsx
Xem Tập Tin 

@@ -11,7 +11,6 @@ import screenImg from "@/assets/img/landtip.png";
 
 const A1HomeM = React.lazy(() => import("./pages/A1HomeM"));
 
 const A2VrPage = React.lazy(() => import("./pages/A2VrPage"));
 
 const A3GoodsM = React.lazy(() => import("./pages/A3GoodsM"));
 
-const A4IntroM = React.lazy(() => import("./pages/A4IntroM"));
 
 
 export default function App() {
 
   const setFullFu = useCallback(() => {
 
@@ -53,8 +52,6 @@ export default function App() {
 
             <Route path="/vr" component={A2VrPage} />
 
             {/* 文物赏析页面 */}
 
             <Route path="/goods" component={A3GoodsM} />
 
-            {/* 场馆介绍页面 */}
 
-            <Route path="/intro" component={A4IntroM} />
 
             {/* 找不到页面 */}
 
             <Route path="*" component={NotFound} />
 
           </Switch>

BIN
src/assets/img/back.png
Xem Tập Tin


BIN
src/assets/img/look.png
Xem Tập Tin


+ 81 - 49
src/pages/A1Home/index.module.scss
Xem Tập Tin 

@@ -3,65 +3,97 @@
 
   position: relative;
 
 
   :global {
 
-    .nameImg {
 
+    .homeBtn {
 
       position: absolute;
 
-      z-index: 10;
 
-      left: 50px;
 
-      top: 30px;
 
-    }
 
-
 
-    .txtImg {
 
-      position: absolute;
 
-      z-index: 10;
 
-      top: 230px;
 
-      left: 100px;
 
-      width: 80%;
 
-    }
 
+      bottom: 90px;
 
+      left: 50%;
 
+      transform: translateX(-50%);
 
+      display: flex;
 
 
-    .txt2Img {
 
-      position: absolute;
 
-      z-index: 10;
 
-      bottom: 45px;
 
-      left: 50px;
 
-    }
 
+      .homeBtnRow {
 
+        cursor: pointer;
 
+        width: 181px;
 
+        height: 57px;
 
+        display: flex;
 
+        justify-content: center;
 
+        align-items: center;
 
+        background-size: 100% 100%;
 
+        margin-right: 190px;
 
+        position: relative;
 
+        color: #fff;
 
+        font-size: 20px;
 
+        letter-spacing: 2px;
 
+        padding-bottom: 2px;
 
 
-    .txt2Iccmg {
 
-      height: 100%;
 
-    }
 
+        .homeXing {
 
+          position: absolute;
 
+          left: -132px;
 
+          top: 50%;
 
+          transform: translateY(-50%);
 
+          width: 75px;
 
+          height: 18px;
 
+          background-size: 100% 100%;
 
+          pointer-events: none;
 
+        }
 
 
-    .rightBacBox {
 
-      position: absolute;
 
-      z-index: 10;
 
-      right: 0;
 
-      top: 0;
 
-      height: 100%;
 
-      width: 306px;
 
-      background-size: 100% 100%;
 
-      padding: 20px 10px 20px 145px;
 
-      display: flex;
 
-      flex-direction: column;
 
-      justify-content: space-around;
 
+        .homeXing2 {
 
+          left: auto;
 
+          right: -132px;
 
+        }
 
 
-      &>div {
 
-        cursor: pointer;
 
-        width: 150px;
 
-        height: 150px;
 
-        border: 1px solid red;
 
-        border-radius: 50%;
 
-        overflow: hidden;
 
-
 
-        &>img {
 
-          width: 100%;
 
-          height: 100%;
 
-          object-fit: contain;
 
+        // 线上展厅选项
 
+        .home1Hover {
 
+          opacity: 0;
 
+          pointer-events: none;
 
           transition: all .2s;
 
+          z-index: -1;
 
+          position: absolute;
 
+          bottom: -8px;
 
+          width: 200px;
 
+          background-color: rgba(187, 12, 12, 0.80);
 
+          backdrop-filter: blur(6px);
 
+          border-radius: 10px 10px 20px 20px;
 
+          overflow: hidden;
 
+          color: #fff;
 
+          padding: 15px 15px 64px;
 
+
 
+          .home1HoverRow {
 
+            margin-bottom: 15px;
 
+
 
+            &>img {
 
+              width: 100%;
 
+              height: 120px;
 
+            }
 
+
 
+            &>p {
 
+              font-size: 14px;
 
+              text-align: center;
 
+              margin-top: 5px;
 
+            }
 
+
 
+            &:hover {
 
+              color: #D6B970;
 
+            }
 
+
 
+          }
 
+
 
         }
 
-        &:hover{
 
-          &>img{
 
-            transform: scale(1.1);
 
+
 
+
 
+        &:last-child {
 
+          margin-right: 0;
 
+        }
 
+
 
+        &:hover {
 
+          color: #D6B970;
 
+          .home1Hover{
 
+            opacity: 1;
 
+            pointer-events: auto;
 
           }
 
         }
 
+
 
       }
 
     }
 
+
 
   }
 
 }

+ 53 - 13
src/pages/A1Home/index.tsx
Xem Tập Tin 

@@ -1,30 +1,70 @@
 
-import React from "react";
 
+import React, { useCallback } from "react";
 
 import styles from "./index.module.scss";
 
 import { baseURL } from "@/utils/http";
 
 import history from "@/utils/history";
 
+import { useSelector } from "react-redux";
 
+import { RootState } from "@/store";
 
 
 const rightList = [
 
-  { id: 1, name: "实景VR", path: "/vr" },
 
-  { id: 2, name: "文物赏析", path: "/goods" },
 
-  { id: 3, name: "场馆介绍", path: "/intro" },
 
+  { id: 1, name: "线上展厅" },
 
+  { id: 2, name: "航拍建筑" },
 
+  { id: 3, name: "文物鉴赏" },
 
 ];
 
 
 function A1Home() {
 
+  const btnData = useSelector(
 
+    (state: RootState) => state.A0Layout.dataAll.Home.scene
 
+  );
 
+
 
+  const clickBtnFu = useCallback((id: number) => {
 
+    if (id === 2) history.push("/vr?id=4");
 
+    else if (id === 3) history.push("/goods");
 
+  }, []);
 
+
 
   return (
 
     <div
 
       className={styles.A1Home}
 
       style={{ backgroundImage: `url(${baseURL}/Home/pc/bac.jpg)` }}
 
     >
 
-      <img className="nameImg" src={`${baseURL}/Home/pc/name.png`} alt="" />
 
-      <img className="txtImg" src={`${baseURL}/Home/pc/txt.png`} alt="" />
 
-      <img className="txt2Img" src={`${baseURL}/Home/pc/txt2.png`} alt="" />
 
-      <div
 
-        className="rightBacBox"
 
-        style={{ backgroundImage: `url(${baseURL}/Home/pc/rightBac.png)` }}
 
-      >
 
+      {/* 底部按钮 */}
 
+      <div className="homeBtn">
 
         {rightList.map((v) => (
 
-          <div onClick={() => history.push(v.path)} key={v.id}>
 
-            <img src={`${baseURL}/Home/pc/icon${v.id}.png`} alt="" />
 
+          <div
 
+            onClick={() => clickBtnFu(v.id)}
 
+            key={v.id}
 
+            className="homeBtnRow"
 
+            style={{ backgroundImage: `url(${baseURL}/Home/btn.png)` }}
 
+          >
 
+            {/* 星星 */}
 
+            <div
 
+              className="homeXing"
 
+              style={{ backgroundImage: `url(${baseURL}/Home/xing.png)` }}
 
+            ></div>
 
+
 
+            {v.id === 3 ? (
 
+              <div
 
+                className="homeXing homeXing2"
 
+                style={{ backgroundImage: `url(${baseURL}/Home/xing.png)` }}
 
+              ></div>
 
+            ) : null}
 
+
 
+            {v.name}
 
+
 
+            {/* 线上展厅出来的 三个选项 */}
 
+            {v.id === 1 ? (
 
+              <div className="home1Hover">
 
+                {btnData.map((v) => (
 
+                  <div
 
+                    key={v.id}
 
+                    className="home1HoverRow"
 
+                    onClick={() => history.push(`/vr?id=${v.id}`)}
 
+                  >
 
+                    <img src={`${baseURL}/Home/scene/${v.id}.jpg`} alt="" />
 
+                    <p>{v.name}</p>
 
+                  </div>
 
+                ))}
 
+              </div>
 
+            ) : null}
 
           </div>
 
         ))}
 
       </div>

+ 19 - 2
src/pages/A2VrPage/index.tsx
Xem Tập Tin 

@@ -1,17 +1,34 @@
 
 /* eslint-disable jsx-a11y/iframe-has-title */
 
-import React from "react";
 
+import React, { useMemo } from "react";
 
 import styles from "./index.module.scss";
 
 import { useSelector } from "react-redux";
 
 import { RootState } from "@/store";
 
 import backImg from "@/assets/img/back.png";
 
 import history from "@/utils/history";
 
+import { useLocation } from "react-router-dom";
 
 
 function A2VrPage() {
 
   const data = useSelector((state: RootState) => state.A0Layout.dataAll.Home);
 
 
+  const location = useLocation();
 
+
 
+  const query = new URLSearchParams(location.search);
 
+  const param = query.get("id");
 
+
 
+  const urlRes = useMemo(() => {
 
+    let url = "";
 
+
 
+    if (param) {
 
+      if (param === "4") url = data.vr;
 
+      else url = data.scene.find((v) => v.id === Number(param))!.path;
 
+    }
 
+
 
+    return url;
 
+  }, [data.scene, data.vr, param]);
 
+
 
   return (
 
     <div className={styles.A2VrPage}>
 
-      {data.vr ? <iframe src={data.vr} frameBorder="0"></iframe> : null}
 
+      {urlRes ? <iframe src={urlRes} frameBorder="0"></iframe> : null}
 
       {/* 返回按钮 */}
 
       <div className="vrBack" onClick={() => history.push("/")}>
 
         <img src={backImg} alt="" />

+ 0 - 123
src/pages/A4Intro/index.module.scss
Xem Tập Tin 

@@ -1,123 +0,0 @@
 
-.A4Intro {
 
-  position: relative;
 
-  background-size: 100% 100%;
 
-
 
-  :global {
 
-    .introBack {
 
-      position: absolute;
 
-      z-index: 3;
 
-      top: 20px;
 
-      left: 30px;
 
-      cursor: pointer;
 
-    }
 
-
 
-    .introTxt1 {
 
-      position: absolute;
 
-      z-index: 3;
 
-      top: 54px;
 
-      left: 200px;
 
-    }
 
-
 
-    .txtBox {
 
-      width: 976px;
 
-      height: 622px;
 
-      background-size: 100% 100%;
 
-      position: absolute;
 
-      top: 52px;
 
-      left: 578px;
 
-      padding: 120px 110px 120px 120px;
 
-
 
-      .txtBoxMain {
 
-        height: 100%;
 
-        padding-right: 10px;
 
-        overflow-y: auto;
 
-        font-size: 16px;
 
-        letter-spacing: 4px;
 
-        line-height: 24px;
 
-      }
 
-    }
 
-
 
-    .introSwBox {
 
-      position: absolute;
 
-      width: 1350px;
 
-      z-index: 3;
 
-      bottom: 40px;
 
-      height: 170px;
 
-      left: 248px;
 
-      display: flex;
 
-      align-items: center;
 
-
 
-      .introSw1 {
 
-        width: 262px;
 
-        height: 80px;
 
-        margin-right: 18px;
 
-        background-size: 100% 100%;
 
-        font-size: 30px;
 
-        line-height: 80px;
 
-        text-align: center;
 
-        font-weight: 700;
 
-        color: var(--themeColor);
 
-      }
 
-
 
-      .introSw2 {
 
-        position: relative;
 
-        width: calc(100% - 280px);
 
-        height: 120px;
 
-        padding: 0 60px;
 
-
 
-        .swiper {
 
-          .swiper-slide {
 
-            border: 3px solid #fff;
 
-            border-radius: 4px;
 
-            height: 120px;
 
-            cursor: pointer;
 
-          }
 
-
 
-
 
-        }
 
-
 
-        .swiper-button-prev {
 
-          position: absolute;
 
-          left: 4px;
 
-          width: 41px;
 
-          height: 81px;
 
-          background-size: 100% 100%;
 
-          top: 50%;
 
-          transform: translateY(-50%);
 
-          margin-top: 0;
 
-
 
-          &::after {
 
-            opacity: 0;
 
-          }
 
-        }
 
-
 
-        .swiper-button-next {
 
-          position: absolute;
 
-          right: 4px;
 
-          width: 41px;
 
-          height: 81px;
 
-          background-size: 100% 100%;
 
-          top: 50%;
 
-          transform: translateY(-50%);
 
-          margin-top: 0;
 
-
 
-          &::after {
 
-            opacity: 0;
 
-          }
 
-        }
 
-
 
-        .sw-disable {
 
-          opacity: .5;
 
-          pointer-events: none;
 
-          width: 41px;
 
-          height: 81px;
 
-          background-size: 100% 100%;
 
-          top: 50%;
 
-          transform: translateY(-50%);
 
-          margin-top: 0;
 
-        }
 
-
 
-      }
 
-    }
 
-  }
 
-}

+ 0 - 127
src/pages/A4Intro/index.tsx
Xem Tập Tin 

@@ -1,127 +0,0 @@
 
-import React, { useCallback, useMemo } from "react";
 
-import styles from "./index.module.scss";
 
-import backImg from "@/assets/img/back.png";
 
-import history from "@/utils/history";
 
-import { baseURL } from "@/utils/http";
 
-import { useSelector } from "react-redux";
 
-import store, { RootState } from "@/store";
 
-
 
-// 轮播图
 
-import { Swiper, SwiperSlide } from "swiper/react";
 
-import { Navigation } from "swiper";
 
-import "swiper/css";
 
-import "swiper/css/navigation";
 
-import ImageLazy from "@/components/ImageLazy";
 
-
 
-function A4Intro() {
 
-  const data = useSelector((state: RootState) => state.A0Layout.dataAll.Home);
 
-
 
-  const dataRes = data.introduce || {};
 
-
 
-  const imgArr = useMemo(() => {
 
-    const num = dataRes.imgNum || 0;
 
-
 
-    const dom: number[] = [];
 
-
 
-    for (let i = 0; i < num; i++) {
 
-      dom.push(i);
 
-    }
 
-    return dom;
 
-  }, [dataRes.imgNum]);
 
-
 
-  const lookArr = useCallback(() => {
 
-    const arr = [] as string[];
 
-
 
-    imgArr.forEach((v, i) => {
 
-      arr.push(`${baseURL}/4Intro/pc/${i + 1}.jpg`);
 
-    });
 
-
 
-    return arr;
 
-  }, [imgArr]);
 
-
 
-  return (
 
-    <div
 
-      className={styles.A4Intro}
 
-      style={{ backgroundImage: `url(${baseURL}/4Intro/pc/bac.jpg)` }}
 
-    >
 
-      {/* 返回按钮 */}
 
-      <div className="introBack" onClick={() => history.push("/")}>
 
-        <img src={backImg} alt="" />
 
-      </div>
 
-
 
-      <img className="introTxt1" src={`${baseURL}/4Intro/pc/txt1.png`} alt="" />
 
-
 
-      <div
 
-        className="txtBox"
 
-        style={{ backgroundImage: `url(${baseURL}/4Intro/pc/txtBac.png)` }}
 
-      >
 
-        <div
 
-          className="txtBoxMain mySorrl"
 
-          dangerouslySetInnerHTML={{ __html: dataRes.txt }}
 
-        ></div>
 
-      </div>
 
-
 
-      {/* 底部轮播图 */}
 
-      <div className="introSwBox">
 
-        <div
 
-          className="introSw1"
 
-          style={{ backgroundImage: `url(${baseURL}/4Intro/pc/txt2.png)` }}
 
-        >
 
-          场 馆 风 采
 
-        </div>
 
-        <div className="introSw2">
 
-          <Swiper
 
-            modules={[Navigation]}
 
-            spaceBetween={30}
 
-            slidesPerView={4}
 
-            navigation={{
 
-              nextEl: ".swiper-button-next",
 
-              prevEl: ".swiper-button-prev",
 
-              disabledClass: "sw-disable", // 当导航按钮变为不可用时添加的class,也就是当swiper索引为0时上一张没有prevEl的class类名就会添加一个disable，也就是.swiper-button-prev .disable
 
-            }}
 
-            // onSlideChange={() => console.log("slide change")}
 
-            // onSwiper={(swiper) => console.log(swiper)}
 
-          >
 
-            {imgArr.map((v, i) => (
 
-              <SwiperSlide
 
-                key={v}
 
-                onClick={() =>
 
-                  store.dispatch({
 
-                    type: "layout/lookBigImg",
 
-                    payload: {
 
-                      show: true,
 
-                      url: lookArr(),
 
-                      current: i,
 
-                    },
 
-                  })
 
-                }
 
-              >
 
-                <ImageLazy
 
-                  noLook={true}
 
-                  offline={true}
 
-                  width="100%"
 
-                  height="100%"
 
-                  src={`${baseURL}/4Intro/pc/${v + 1}.jpg`}
 
-                />
 
-              </SwiperSlide>
 
-            ))}
 
-          </Swiper>
 
-
 
-          {/* 左右按钮 */}
 
-          <div
 
-            className="swiper-button-prev"
 
-            style={{ backgroundImage: `url(${baseURL}/4Intro/pc/left.png)` }}
 
-          ></div>
 
-          <div
 
-            className="swiper-button-next"
 
-            style={{ backgroundImage: `url(${baseURL}/4Intro/pc/right.png)` }}
 
-          ></div>
 
-        </div>
 
-      </div>
 
-    </div>
 
-  );
 
-}
 
-
 
-const MemoA4Intro = React.memo(A4Intro);
 
-
 
-export default MemoA4Intro;

+ 0 - 113
src/pages/A4IntroM/index.module.scss
Xem Tập Tin 

@@ -1,113 +0,0 @@
 
-.A4IntroM{
 
-  background-size: 100% 100%;
 
-  padding: 20px;
 
-  :global{
 
-    .introBack{
 
-      width: 40px;
 
-    }
 
-    .txtBox{
 
-      width: 100%;
 
-      height: calc(100% - 220px);
 
-      background-size: 100% 100%;
 
-      padding: 30% 12% 15% 15%;
 
-      position: relative;
 
-      .txtBoxTit{
 
-        position: absolute;
 
-        width: 100%;
 
-        top: 30px;
 
-        left: 0;
 
-        text-align: center;
 
-        &>img{
 
-          width: 160px;
 
-        }
 
-      }
 
-      .txtBoxMain{
 
-        width: 100%;
 
-        height: 100%;
 
-        overflow-y: auto;
 
-        padding-right: 20px;
 
-        letter-spacing: 2px;
 
-        padding-bottom: 10px;
 
-        &::-webkit-scrollbar{
 
-          width: 2px;
 
-        }
 
-      }
 
-    }
 
-    .introSw1{
 
-      margin: 10px auto 8px;
 
-      width: 160px;
 
-      height: 40px;
 
-      background-size: 100% 100%;
 
-      display: flex;
 
-      justify-content: center;
 
-      align-items: center;
 
-      font-size: 18px;
 
-      font-weight: 700;
 
-      color: var(--themeColor);
 
-    }
 
-    .introSw2{
 
-      width: 100%;
 
-      height: 130px;
 
-      padding: 0 60px;
 
-      position: relative;
 
-      .swiper {
 
-        height: 100%;
 
-        .swiper-slide {
 
-          border: 3px solid #fff;
 
-          border-radius: 4px;
 
-
 
-          .swImg {
 
-            width: 100%;
 
-            height: 100%;
 
-          }
 
-        }
 
-
 
-
 
-      }
 
-      .swiper-button-prev {
 
-        position: absolute;
 
-        outline: none;
 
-        cursor: default;
 
-        left: 4px;
 
-        width: 30px;
 
-        height: 60px;
 
-        background-size: 100% 100%;
 
-        top: 50%;
 
-        transform: translateY(-50%);
 
-        margin-top: 0;
 
-
 
-        &::after {
 
-          opacity: 0;
 
-        }
 
-      }
 
-
 
-      .swiper-button-next {
 
-        position: absolute;
 
-        outline: none;
 
-        cursor: default;
 
-        right: 4px;
 
-        width: 30px;
 
-        height: 60px;
 
-        background-size: 100% 100%;
 
-        top: 50%;
 
-        transform: translateY(-50%);
 
-        margin-top: 0;
 
-
 
-        &::after {
 
-          opacity: 0;
 
-        }
 
-      }
 
-
 
-      .sw-disable {
 
-        opacity: .5;
 
-        pointer-events: none;
 
-        width: 30px;
 
-        height: 60px;
 
-        background-size: 100% 100%;
 
-        top: 50%;
 
-        transform: translateY(-50%);
 
-        margin-top: 0;
 
-      }
 
-    }
 
-  }
 
-}

+ 0 - 141
src/pages/A4IntroM/index.tsx
Xem Tập Tin 

@@ -1,141 +0,0 @@
 
-import React, { useCallback, useMemo } from "react";
 
-import styles from "./index.module.scss";
 
-import { useSelector } from "react-redux";
 
-import { RootState } from "@/store";
 
-import { baseURL } from "@/utils/http";
 
-import backImg from "@/assets/img/back.png";
 
-import history from "@/utils/history";
 
-
 
-// 轮播图
 
-import { Swiper, SwiperSlide } from "swiper/react";
 
-import { Navigation } from "swiper";
 
-import "swiper/css";
 
-import "swiper/css/navigation";
 
-import { ImageViewer } from "antd-mobile";
 
-
 
-function A4IntroM() {
 
-  const data = useSelector((state: RootState) => state.A0Layout.dataAll.Home);
 
-
 
-  const dataRes = data.introduce || {};
 
-
 
-  const imgArr = useMemo(() => {
 
-    const num = dataRes.imgNum || 0;
 
-
 
-    const dom: number[] = [];
 
-
 
-    for (let i = 0; i < num; i++) {
 
-      dom.push(i);
 
-    }
 
-    return dom;
 
-  }, [dataRes.imgNum]);
 
-
 
-  const lookArr = useCallback(() => {
 
-    const arr = [] as string[];
 
-
 
-    imgArr.forEach((v, i) => {
 
-      arr.push(`${baseURL}/4Intro/pc/${i + 1}.jpg`);
 
-    });
 
-
 
-    return arr;
 
-  }, [imgArr]);
 
-
 
-  const lookBigImgFu = useCallback(
 
-    (i: number) => {
 
-      ImageViewer.Multi.show({
 
-        images: lookArr(),
 
-        defaultIndex: i,
 
-      });
 
-    },
 
-    [lookArr]
 
-  );
 
-
 
-  return (
 
-    <div
 
-      className={styles.A4IntroM}
 
-      style={{ backgroundImage: `url(${baseURL}/4Intro/mobile/bac.jpg)` }}
 
-    >
 
-      {/* 返回按钮 */}
 
-      <div className="introBack" onClick={() => history.push("/")}>
 
-        <img src={backImg} alt="" />
 
-      </div>
 
-
 
-      {/* 文字主体 */}
 
-      <div
 
-        className="txtBox"
 
-        style={{ backgroundImage: `url(${baseURL}/4Intro/mobile/txtBac.png)` }}
 
-      >
 
-        {/* 场馆介绍 */}
 
-        <div className="txtBoxTit">
 
-          <img src={`${baseURL}/4Intro/mobile/txt1.png`} alt="" />
 
-        </div>
 
-
 
-        <div
 
-          className="txtBoxMain mySorrl"
 
-          dangerouslySetInnerHTML={{ __html: dataRes.txt }}
 
-        ></div>
 
-      </div>
 
-
 
-      {/* 轮播图 */}
 
-      <div
 
-        className="introSw1"
 
-        style={{ backgroundImage: `url(${baseURL}/4Intro/pc/txt2.png)` }}
 
-      >
 
-        场 馆 风 采
 
-      </div>
 
-
 
-      <div className="introSw2">
 
-        <Swiper
 
-          modules={[Navigation]}
 
-          spaceBetween={0}
 
-          slidesPerView={1}
 
-          // noSwipingClass='swImg'
 
-          navigation={{
 
-            nextEl: ".swiper-button-next",
 
-            prevEl: ".swiper-button-prev",
 
-            disabledClass: "sw-disable", // 当导航按钮变为不可用时添加的class,也就是当swiper索引为0时上一张没有prevEl的class类名就会添加一个disable，也就是.swiper-button-prev .disable
 
-          }}
 
-          // onSlideChange={() => console.log("slide change")}
 
-          // onSwiper={(swiper) => console.log(swiper)}
 
-        >
 
-          {imgArr.map((v, i) => (
 
-            <SwiperSlide
 
-              key={v}
 
-              onClick={
 
-                () => lookBigImgFu(i)
 
-
 
-                // store.dispatch({
 
-                //   type: "layout/lookBigImg",
 
-                //   payload: {
 
-                //     show: true,
 
-                //     url: lookArr(),
 
-                //     current: i,
 
-                //   },
 
-                // })
 
-              }
 
-            >
 
-              <img
 
-                className="swImg"
 
-                src={`${baseURL}/4Intro/pc/${v + 1}.jpg`}
 
-                alt=""
 
-              />
 
-            </SwiperSlide>
 
-          ))}
 
-        </Swiper>
 
-
 
-        {/* 左右按钮 */}
 
-        <div
 
-          className="swiper-button-prev"
 
-          style={{ backgroundImage: `url(${baseURL}/4Intro/pc/left.png)` }}
 
-        ></div>
 
-        <div
 
-          className="swiper-button-next"
 
-          style={{ backgroundImage: `url(${baseURL}/4Intro/pc/right.png)` }}
 
-        ></div>
 
-      </div>
 
-    </div>
 
-  );
 
-}
 
-
 
-const MemoA4IntroM = React.memo(A4IntroM);
 
-
 
-export default MemoA4IntroM;

+ 8 - 7
src/types/api/layot.d.ts
Xem Tập Tin 

@@ -7,7 +7,7 @@ export type LookDomType = {
 
 export type Goods = {
 
   id: number;
 
   name: string;
 
-  name2:string
 
+  name2: string;
 
   type1: string;
 
   type2: string;
 
   num: string;
 
@@ -16,16 +16,17 @@ export type Goods = {
 
   size: string;
 
   level: string;
 
   state: string;
 
-  modelNum?:number
 
+  modelNum?: number;
 
 };
 
 
 export type DataAllType = {
 
   Home: {
 
-    vr: string;
 
-    introduce: {
 
-      txt: string;
 
-      imgNum: number;
 
-    };
 
+    scene: {
 
+      id: number;
 
+      name: string;
 
+      path: string;
 
+    }[];
 
+    vr:string
 
   };
 
   goods: Goods[];
 
 };