upp

Code/public/myData/myData.js

@@ -2054,9 +2054,9 @@ const myDataTemp = {
   visit2: {
     进入室内: 'visit2/进入室内.mp4',
     进入院落: 'visit2/进入院落.mp4',
-    btnArr: ['贵宾', '门生'],
+    btnArr: ['贵宾'],
     baiXiBg: 'visit2/waiBg.jpg',
-    baixiArr: ['吹火', '顶棍', '踏鼓舞', '相扑', '掷丸'],
+    baixiArr: ['吹火', '相扑', '掷丸'],
     hot: erYuanArr
   },
 
@@ -2076,7 +2076,7 @@ const myDataTemp = {
     hot: danceHotArr,
 
     // 底部动作
-    floor: ['伴奏', '击鼓'],
+    floor: ['伴奏', '击鼓', '顶棍', '踏鼓舞'],
 
     // 最后的过场动画路径+名字
     lastVideo: 'dance/end.mp4'
@@ -2286,7 +2286,7 @@ const myDataTemp = {
         <p>中耕是我国传统农业生产技术体系中的重要环节。汉代继承这一优良传统，《沦胜之书》把“旱锄”作为“凡耕之本”中的一个重要环节，对各种作物都要求“有草锄之，不厌数多”。汉代农具中有专门用除草松土的铁锄。</p>
         `,
 
-        hot: plowHotArr.filter(v => v.type === '中耕' || v.isChang)
+        hot: plowHotArr.filter(v => v.type === '中耕' || v.type === '施肥' || v.isChang)
       },
       {
         name: '施肥',
@@ -2415,6 +2415,20 @@ const myDataTemp = {
             top: '15%',
             left: '20%'
           }
+        },
+        {
+          name: '仙居世界',
+          // 左边图片所在路径+名字
+          leftImg: 'xianJu/mulu.png',
+          // pc鼠标移入显示的热点图片路径+名字
+          hoverSrc: 'more/hot/hot6.png',
+          // 跳转路径
+          path: '/xianJu',
+          // 热点定位百分比
+          loc: {
+            top: '25%',
+            left: '27%'
+          }
         }
       ]
     },
@@ -2435,32 +2449,47 @@ const myDataTemp = {
                 name: '迎宾',
                 imgSrc: 'more/ren/yingBin.jpg',
                 videoSrc: 'more/ren/yinBin.mp4',
-                path: '/visit'
+                path: '/visit',
+                pagetop: '60%',
+                pageLeft: '5%',
+                zIndex: 2
               },
               {
                 name: '投壶',
                 imgSrc: 'more/ren/touHu.jpg',
-                path: '/unend/game3?r=ren'
+                path: '/unend/game3?r=ren',
+                pagetop: '36%',
+                pageLeft: '17%',
+                noShow: true
               },
               {
                 name: '安排座次',
                 imgSrc: 'more/ren/anPaiZuoCi.jpg',
-                path: '/unend/game2?r=ren'
+                path: '/unend/game2?r=ren',
+                pagetop: '30%',
+                pageLeft: '37%',
+                zIndex: 4
               },
               {
                 name: '宴饮',
                 imgSrc: 'more/ren/yanYin.jpg',
-                path: '/banquet'
+                path: '/banquet',
+                pagetop: '33%',
+                pageLeft: '34%',
+                zIndex: 3
               },
               {
                 name: '乐舞百戏',
                 imgSrc: 'more/ren/yueWuBaiXi.jpg',
-                path: '/dance'
+                path: '/dance',
+                noShow: true
               },
               {
                 name: '冥想',
                 imgSrc: 'more/ren/minXiang.jpg',
-                path: '/xianJu'
+                path: '/xianJu',
+                pagetop: '27%',
+                pageLeft: '27%'
               }
             ]
           },
@@ -2470,39 +2499,52 @@ const myDataTemp = {
               {
                 name: '投名帖',
                 imgSrc: 'more/ren/touMingTie.jpg',
-                path: '/base?r=ren'
+                path: '/base?r=ren',
+                noShow: true
               },
               {
                 name: '车骑拜谒',
                 imgSrc: 'more/ren/cheQiBaiYe.jpg',
                 videoSrc: 'base/end.mp4',
-                path: '/visit'
+                path: '/visit',
+                pagetop: '68%',
+                pageLeft: '-11%'
               },
               {
                 name: '羊酒贺礼',
                 imgSrc: 'more/ren/yangJiuHeLi.jpg',
-                path: '/visit2'
+                path: '/visit2',
+                pagetop: '62%',
+                pageLeft: '0%'
               },
               {
                 name: '投壶',
                 imgSrc: 'more/ren/touHu.jpg',
-                path: '/unend/game3?r=ren'
+                path: '/unend/game3?r=ren',
+                pagetop: '35%',
+                pageLeft: '25%'
               },
               {
                 name: '宴饮',
                 imgSrc: 'more/ren/yanYin.jpg',
-                path: '/banquet'
+                path: '/banquet',
+                pagetop: '30%',
+                pageLeft: '43%',
+                noShow: true
               },
               {
                 name: '乐舞',
                 imgSrc: 'more/ren/yueWu.jpg',
-                path: '/dance'
+                path: '/dance',
+                noShow: true
               },
               {
                 name: '离场',
                 imgSrc: 'more/ren/liChang.jpg',
                 videoSrc: 'xianJu/end.mp4',
-                path: '/end'
+                path: '/end',
+                pagetop: '57%',
+                pageLeft: '-6%'
               }
             ]
           },
@@ -2513,23 +2555,31 @@ const myDataTemp = {
                 name: '扫地',
                 imgSrc: 'more/ren/saoDi.jpg',
                 videoSrc: 'more/ren/saoDi.mp4',
-                path: '/visit'
+                path: '/visit',
+                pagetop: '69%',
+                pageLeft: '18%'
               },
               {
                 name: '备宴',
                 imgSrc: 'more/ren/beiYan.jpg',
-                path: '/chef'
+                path: '/chef',
+                pagetop: '27%',
+                pageLeft: '57%'
               },
               {
                 name: '耕作',
                 imgSrc: 'more/ren/gengZuo.jpg',
-                path: '/plow'
+                path: '/plow',
+                pagetop: '20%',
+                pageLeft: '20%'
               },
               {
                 name: '巡夜',
                 imgSrc: 'more/ren/xunYe.jpg',
                 videoSrc: 'more/ren/xunYe.mp4',
-                path: '/end'
+                path: '/end',
+                pagetop: '38%',
+                pageLeft: '65%'
               }
             ]
           },
@@ -2539,12 +2589,17 @@ const myDataTemp = {
               {
                 name: '乐舞',
                 imgSrc: 'more/ren/yueWu.jpg',
-                path: '/dance?r=ren'
+                path: '/dance?r=ren',
+                pagetop: '30%',
+                pageLeft: '32%',
+                zIndex: 2
               },
               {
                 name: '百戏',
                 imgSrc: 'more/ren/baiXi.jpg',
-                path: '/visit2?r=ren'
+                path: '/visit2?r=ren',
+                pagetop: '42%',
+                pageLeft: '32%'
               }
             ]
           }

Code/src/components/BaseImg/index.module.scss

@@ -7,7 +7,14 @@
   z-index: 11;
   opacity: 1;
   transition: opacity 1s;
-  background-color: rgba(0, 0, 0, 0.4);
+  &::after {
+    content: '';
+    position: absolute;
+    pointer-events: none;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.4);
+  }
 
   :global {
     .BIcon {
@@ -21,14 +28,33 @@
     }
 
     .BIlogo {
+      z-index: 5;
       position: absolute;
-      top: 0px;
+      top: -70px;
       width: 650px;
       max-width: 90%;
       left: 50%;
       transform: translateX(-50%);
     }
 
+    .BItxt {
+      color: #fffddc;
+      font-size: 14px;
+      letter-spacing: 3px;
+      line-height: 22px;
+      position: absolute;
+      top: 28%;
+      left: 50%;
+      transform: translateX(-50%);
+      z-index: 10;
+      width: 80%;
+      height: 90px;
+      overflow-y: auto;
+      &::-webkit-scrollbar {
+        display: none;
+      }
+    }
+
     .BIbaseBtn {
       position: absolute;
       bottom: 40px;
@@ -75,6 +101,7 @@
       width: 120px;
       padding: 0 10px;
       height: 2px;
+      z-index: 10;
       & > div {
         width: 100%;
         height: 100%;

Code/src/components/CatVideo/index.tsx

@@ -10,9 +10,11 @@ type Props = {
   parentFu: () => void
   noBtn?: boolean //没有跳过按钮
   openYin?: boolean //打开声音播放
+  // 不用删除自己
+  noDel?: boolean
 }
 
-function CatVideo({ isShow, src, parentFu, noBtn, openYin }: Props) {
+function CatVideo({ isShow, src, parentFu, noBtn, openYin, noDel }: Props) {
   const videoRef = useRef<HTMLVideoElement>(null)
 
   useEffect(() => {
@@ -25,11 +27,14 @@ function CatVideo({ isShow, src, parentFu, noBtn, openYin }: Props) {
 
   const playEndFu = useCallback(() => {
     parentFu()
-    // 0.5s之后删除过度视频
-    setTimeout(() => {
-      domDelOwnFu('#CatVideo')
-    }, 500)
-  }, [parentFu])
+
+    if (!noDel) {
+      // 0.5s之后删除过度视频
+      setTimeout(() => {
+        domDelOwnFu('#CatVideo')
+      }, 500)
+    }
+  }, [noDel, parentFu])
 
   return (
     <div id='CatVideo' className={classNames(styles.CatVideo, isShow ? '' : styles.CatVideoHide)}>

Code/src/components/FloorBtn/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import styles from './index.module.scss'
 import history from '@/utils/history'
+import { renClickPageFu } from '@/pages/B1more/data'
 
 type Props = {
   unityId?: '1' | '2'
@@ -10,7 +11,7 @@ type Props = {
 
 function FloorBtn({ unityId, gameFu, plowFu }: Props) {
   return (
-    <div className={styles.FloorBtn}>
+    <div className={styles.FloorBtn} id='FloorBtn'>
       {gameFu ? <div title='游戏' className='FloorBtn0' onClick={gameFu}></div> : null}
       {plowFu ? <div title='汉代庄园田耕记' className='FloorBtn3' onClick={plowFu}></div> : null}
 
@@ -24,9 +25,12 @@ function FloorBtn({ unityId, gameFu, plowFu }: Props) {
       <div
         title='更多'
         className='FloorBtn2'
-        onClick={() =>
-          history.push(window.location.href.includes('r=ren') ? '/more?r=ren' : '/more')
-        }
+        onClick={() => {
+          const txt = renClickPageFu()
+          if (txt) {
+            txt === '1' ? history.replace('/more?r=ren1') : history.replace('/more?r=ren0')
+          } else history.push('/more')
+        }}
       ></div>
     </div>
   )

Code/src/pages/A1_1base/index.tsx

@@ -5,8 +5,9 @@ import classNames from 'classnames'
 import EndVideo from '@/components/EndVideo'
 import useLoding from '@/components/ownUse/useLoding'
 import BtnRight from '@/components/BtnRight'
-import CatVideo from '@/components/CatVideo'
 import history from '@/utils/history'
+import FloorBtn from '@/components/FloorBtn'
+import { renClickPageFu } from '../B1more/data'
 
 function A11base() {
   // 先加载背景图 序列帧等 在加载视频
@@ -102,6 +103,9 @@ function A11base() {
               </div>
             </div>
           )}
+
+          {/* 右下角按钮 */}
+          {loding >= 100 ? <FloorBtn /> : null}
         </div>
       ) : null}
 
@@ -119,8 +123,10 @@ function A11base() {
             <BtnRight
               title='返回'
               clickSon={() => {
-                if (window.location.href.includes('?r=ren')) history.push('/more?r=ren')
-                else setTieShow(false)
+                const txt = renClickPageFu()
+                if (txt) {
+                  txt === '1' ? history.replace('/more?r=ren1') : history.replace('/more?r=ren0')
+                } else setTieShow(false)
               }}
               imgName='back'
             />

Code/src/pages/A1home/index.module.scss

@@ -145,6 +145,11 @@
         opacity: 1;
         pointer-events: auto;
       }
+
+      #FloorBtn {
+        bottom: 15px;
+        right: 20px;
+      }
     }
     .A1baseHide {
       opacity: 0;

Code/src/pages/A1home/index.tsx

@@ -6,6 +6,7 @@ import EndVideo from '@/components/EndVideo'
 import VideoModel from '@/components/VideoModel'
 import useLoding from '@/components/ownUse/useLoding'
 import CatVideo from '@/components/CatVideo'
+import FloorBtn from '@/components/FloorBtn'
 
 function A1home() {
   // 初始视频
@@ -166,6 +167,9 @@ function A1home() {
                 closeFu={() => setLeftVideo(false)}
               />
             ) : null}
+
+            {/* 右下角按钮 */}
+            {loding >= 100 ? <FloorBtn /> : null}
           </div>
 
           {/* 最后一个过长动画 */}

Code/src/pages/A2visit2/index.module.scss

@@ -42,20 +42,17 @@
         display: flex;
 
         .A22btnRow {
-          width: 50px;
-          height: 50px;
-          background-size: 100% 100%;
           cursor: pointer;
-          transition: all 0.3s;
-          margin: 0 10px;
+          width: 100px;
+          height: 32px;
           display: flex;
           justify-content: center;
           align-items: center;
-          font-size: 14px;
-          padding-bottom: 3px;
+          color: #fffddc;
+          background-size: 100% 100%;
+          transition: transform 0.3s;
           &:hover {
-            background-image: url('../../assets/img/leftAc.png') !important;
-            color: #bd7656 !important;
+            transform: scale(1.1);
           }
         }
       }

Code/src/pages/A2visit2/index.tsx

@@ -10,6 +10,8 @@ import A22Pano from './A22Pano'
 import BtnRight from '@/components/BtnRight'
 import classNames from 'classnames'
 import history from '@/utils/history'
+import Hot1 from '../A2visit/PanoVideo/Hot1'
+import { renClickPageFu } from '../B1more/data'
 
 function A2visit2() {
   const [loding, setLoding] = useState(myData.isLdong ? 0 : 100)
@@ -34,6 +36,12 @@ function A2visit2() {
   const [videoPlay, setVideoPlay] = useState(false)
   const videoRef = useRef<HTMLVideoElement>(null)
 
+  useEffect(() => {
+    setTimeout(() => {
+      if (videoRef.current) videoRef.current.play()
+    }, 100)
+  }, [])
+
   //  进入院落 全景图显示
   const [panoShow, setPanoShow] = useState(window.location.href.includes('?v=v2') ? true : false)
 
@@ -45,6 +53,9 @@ function A2visit2() {
 
   const [xiAc, setXiAc] = useState('')
 
+  // 点击周礼9拜打开热点
+  const [hotShow, setHotShow] = useState(false)
+
   return (
     <div className={styles.A2visit2}>
       {window.location.href.includes('?v=v2') ? null : (
@@ -64,19 +75,20 @@ function A2visit2() {
               <div
                 onClick={() => {
                   setBtnAc(item)
-                  setVideoPlay(true)
-                  setTimeout(() => {
-                    if (videoRef.current) videoRef.current.play()
-                  }, 100)
+
+                  // 打开热点
+                  setHotShow(true)
+
+                  // setVideoPlay(true)
+                  // setTimeout(() => {
+                  //   if (videoRef.current) videoRef.current.play()
+                  // }, 100)
                 }}
                 key={index}
                 className='A22btnRow'
-                style={{
-                  backgroundImage: `url(${baseURL}plow/left${btnAc === item ? 'Ac' : ''}.png)`,
-                  color: btnAc === item ? '#BD7656' : '#DACB8B'
-                }}
+                style={{ backgroundImage: `url(${baseURL}chef/chuBtn.png)` }}
               >
-                {item}
+                周礼九拜
               </div>
             ))}
           </div>
@@ -105,6 +117,7 @@ function A2visit2() {
                   webkit-playsinline='true'
                   x5-video-player-type='h5'
                   onEnded={() => setVideoPlay(false)}
+                  loop
                 >
                   <source type='video/mp4' src={`${baseURL}visit2/${item}.mp4`} />
                   Your browser does not support the video tag.
@@ -235,8 +248,9 @@ function A2visit2() {
         <BtnRight
           title='返回'
           clickSon={() => {
-            if (window.location.href.includes('?r=ren')) {
-              history.go(-1)
+            const txt = renClickPageFu()
+            if (txt) {
+              txt === '1' ? history.replace('/more?r=ren1') : history.replace('/more?r=ren0')
             } else {
               setBaiXi(false)
               setXiAc('')
@@ -253,6 +267,8 @@ function A2visit2() {
         path='/banquet'
         delDom='.A22Pano'
       />
+
+      {hotShow ? <Hot1 data={myData.visit.hot[0].data} closeFu={() => setHotShow(false)} /> : null}
     </div>
   )
 }

Code/src/pages/A3banPano/index.module.scss

@@ -1,5 +1,10 @@
 .A3banPano {
   :global {
+    video {
+      width: 100%;
+      height: 100%;
+      object-fit: fill !important;
+    }
   }
 }
 

Code/src/pages/A3banPano/index.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from 'react'
 import styles from './index.module.scss'
 import { useParams } from 'react-router-dom'
 import { HotSpot, Krpano, Scene, View } from '@dage/krpano'
-import { myData, otherUrl } from '@/utils/http'
+import { baseURL, myData, otherUrl } from '@/utils/http'
 import HotIcon from '@/components/HotIcon'
 import Hot2 from '../A2visit/PanoVideo/Hot2'
 import history from '@/utils/history'
@@ -10,6 +10,7 @@ import FloorHotspotIcon from '@/assets/img/icon-flo-1.png'
 import { ArrowLeftOutlined } from '@ant-design/icons'
 import FloorBtn from '@/components/FloorBtn'
 import { KrpanoMiddleware } from '@/components/KrpanoMiddleware'
+import CatVideo from '@/components/CatVideo'
 // import { myData } from '@/utils/http'
 
 window.draggbleHotspotEvent = (ath: number, atv: number) => {
@@ -38,6 +39,9 @@ function A3banPano() {
     return infoRes
   }, [acName])
 
+  // 点击观赏庭院 先播放视频
+  const [videoPlay, setVideoPlay] = useState(false)
+
   return (
     <div className={styles.A3banPano}>
       <KrpanoMiddleware>
@@ -128,6 +132,8 @@ function A3banPano() {
               bg={false}
               onClick={() => {
                 history.replace('/banPano/3')
+
+                setVideoPlay(true)
               }}
             >
               <div className={styles.courtyardHotspot}>
@@ -179,14 +185,23 @@ function A3banPano() {
             </HotSpot>
           </Scene>
         </Krpano>
+      </KrpanoMiddleware>
 
-        {/* 右下角按钮 */}
-        <FloorBtn />
+      <CatVideo
+        isShow={videoPlay}
+        src={baseURL + 'visit2/观赏庭院.mp4'}
+        noDel={true}
+        parentFu={() => {
+          setVideoPlay(false)
+        }}
+      />
 
-        {acName && info && info.data ? (
-          <Hot2 data={info.data} closeFu={() => setAcName('')} name={info.name} />
-        ) : null}
-      </KrpanoMiddleware>
+      {/* 右下角按钮 */}
+      {videoPlay ? null : <FloorBtn />}
+
+      {acName && info && info.data ? (
+        <Hot2 data={info.data} closeFu={() => setAcName('')} name={info.name} />
+      ) : null}
     </div>
   )
 }

Code/src/pages/A6plow/index.tsx

@@ -193,6 +193,7 @@ function A6plow() {
           >
             {myData.plow.info.map((item, index) => (
               <div
+                hidden={item.name === '施肥'}
                 key={index}
                 className='A6LbtnRow'
                 onClick={() => leftAcFu(index)}
@@ -261,7 +262,7 @@ function A6plow() {
           </div>
 
           {/* 跳到下一章 */}
-          <NextPage clickSon={() => setLastVideo(true)} txt='仙居' />
+          <NextPage clickSon={() => setLastVideo(true)} txt='结束饮宴' />
           {/* 右下角按钮 */}
           <FloorBtn plowFu={() => setCode(true)} />
         </div>

Code/src/pages/A6xian/index.tsx

@@ -42,16 +42,55 @@ function A6xian() {
 
   const xianRef = useRef<HTMLDivElement>(null)
 
+  // 监听3S没有操作
+  const [action, setAction] = useState(false)
+
+  const actionRef = useRef(-1)
+
+  const actionFu = useCallback(
+    (val?: boolean) => {
+      if (xianShow || val) {
+        setAction(false)
+        clearTimeout(actionRef.current)
+        actionRef.current = window.setTimeout(() => {
+          setAction(true)
+        }, 3000)
+      }
+    },
+    [xianShow]
+  )
+
+  const actionMoveRef = useRef(-1)
+
+  useEffect(() => {
+    if (xianShow) {
+      clearInterval(actionMoveRef.current)
+      if (action) {
+        actionMoveRef.current = window.setInterval(() => {
+          if (xianRef.current) {
+            const nowMove = xianRef.current.scrollLeft
+            xianRef.current.scrollLeft = nowMove + 2
+
+            if (xianRef.current.scrollLeft >= 2988) xianRef.current.scrollLeft = 0
+          }
+        }, 50)
+      }
+    }
+  }, [action, xianShow])
+
   const mousemoveFu = useCallback(
     (ev: any, flag?: boolean) => {
       if (xianRef.current) {
         if (flag && !isFlag) {
+          actionFu()
+
           const nowMove = xianRef.current.scrollLeft
           // 滚轮
           let num = 50
           if (ev.deltaY < 0) num = -num
           xianRef.current.scrollLeft = nowMove + num
         } else if (isFlag) {
+          actionFu()
           const nowMove = xianRef.current.scrollLeft
 
           // 鼠标按住移动
@@ -59,7 +98,7 @@ function A6xian() {
         }
       }
     },
-    [isFlag]
+    [actionFu, isFlag]
   )
 
   const videoRef = useRef<HTMLVideoElement>(null)
@@ -92,7 +131,7 @@ function A6xian() {
         bgImg={`${baseURL}${myData.xianJu.bgImg}`}
         imgNow={imgNow}
         imgNumFu={imgNumFu}
-        num={50}
+        num={70}
         bird='xianJu'
       />
 
@@ -155,16 +194,23 @@ function A6xian() {
               setTimeout(() => {
                 if (videoRef.current) videoRef.current.play()
               }, 100)
+
+              // 开启滚动动画
+              actionFu(true)
             }}
           >
             升仙之途
           </div>
+
+          <FloorBtn />
         </div>
       ) : null}
 
       {/* 点击升仙之途 出来的长 滚动 页面 */}
       {imgNow || window.location.href.includes('t=xian') ? (
         <div
+          onTouchStart={() => actionFu()}
+          onClick={() => actionFu()}
           className='A6XimgBox'
           style={{ opacity: xianShow ? '1' : '0', pointerEvents: xianShow ? 'auto' : 'none' }}
         >

Code/src/pages/A7end/index.tsx

@@ -3,6 +3,7 @@ import styles from './index.module.scss'
 import { baseURL, myData } from '@/utils/http'
 import classNames from 'classnames'
 import history from '@/utils/history'
+import FloorBtn from '@/components/FloorBtn'
 
 function A7end() {
   const [isShow, setIsShow] = useState(false)
@@ -33,6 +34,7 @@ function A7end() {
           <div onClick={() => history.push('/')}>重新开始</div>
         </div>
       </div>
+      <FloorBtn />
     </div>
   )
 }

Code/src/pages/B1more/S1manor/index.module.scss

@@ -60,5 +60,112 @@
       width: 50%;
       height: 100%;
     }
+
+    // 场景 人物 切换
+    .S1tab {
+      position: absolute;
+      z-index: 5;
+      right: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      & > div {
+        cursor: pointer;
+        width: 90px;
+        height: 36px;
+        background-image: url('../../../assets/img/more/tab.png');
+        background-size: 100% 100%;
+        margin: 5px 0;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 20px;
+        padding-left: 12px;
+        transition: all 0.3s;
+        &:hover {
+          color: #a55b41;
+          background-image: url('../../../assets/img/more/tabAc.png');
+        }
+      }
+      .S1tabAc {
+        color: #a55b41;
+        background-image: url('../../../assets/img/more/tabAc.png');
+      }
+    }
+
+    // 人物列表
+
+    // 人-----
+
+    .S1renList {
+      width: 50%;
+      height: 100%;
+      background-size: 100% 100%;
+      padding: 50px 100px 70px 25px;
+      .S2renBox {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        .S2renBox1 {
+          width: 70px;
+          .S2renRow {
+            width: 54px;
+            height: 54px;
+            background-size: 100% 100%;
+            cursor: pointer;
+            transition: all 0.3s;
+            margin: 10px 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            font-size: 14px;
+            padding-bottom: 3px;
+            &:hover {
+              background-image: url('../../../assets/img/leftAc2.png') !important;
+              color: #eacf60 !important;
+            }
+          }
+        }
+        .S2renBox2 {
+          width: 120px;
+          height: 100%;
+
+          & > div {
+            width: 100%;
+            height: 100%;
+            overflow: auto;
+            padding-right: 10px;
+
+            flex-direction: column;
+            justify-content: center;
+            &::-webkit-scrollbar {
+              width: 2px;
+            }
+            &::-webkit-scrollbar-thumb {
+              background: var(--themeColor2);
+            }
+
+            .S2ren2Row {
+              cursor: pointer;
+              width: 108px;
+              height: 56px;
+              border-radius: 4px;
+              overflow: hidden;
+              margin-bottom: 10px;
+              border: 1px solid transparent;
+              transition: all 0.3s;
+              & > img {
+                pointer-events: none;
+                width: 100%;
+                height: 100%;
+                object-fit: fill !important;
+              }
+              &:hover {
+                border-color: var(--themeColor2);
+              }
+            }
+          }
+        }
+      }
+    }
   }
 }

Code/src/pages/B1more/S1manor/index.tsx

@@ -1,16 +1,22 @@
-import React, { useCallback, useMemo, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import styles from './index.module.scss'
 import { baseURL, isPc, myData } from '@/utils/http'
 import HotIcon from '@/components/HotIcon'
 import history from '@/utils/history'
+import { renClickPageFu } from '../data'
+import classNames from 'classnames'
+import { RenListType } from '../type'
+
+const tabArr: ('场景' | '人物')[] = ['场景', '人物']
 
 type Props = {
   hidden: boolean
+  setLastVideo: (info: any) => void
 }
 
 const data = myData.more['探索庄园']
 
-function S1manor({ hidden }: Props) {
+function S1manor({ hidden, setLastVideo }: Props) {
   const [adInd, setAcInd] = useState(0)
 
   const hotInfo = useMemo(() => {
@@ -23,6 +29,52 @@ function S1manor({ hidden }: Props) {
     else setAcInd(index)
   }, [])
 
+  // 场景和人物的切换
+  const [tab, setTab] = useState<'场景' | '人物'>(renClickPageFu() === '0' ? '人物' : '场景')
+
+  const renArr = useMemo(() => {
+    const arr: RenListType[] = []
+
+    const arrTemp = myData.more['汉代百科']['人'].skArr
+
+    arrTemp.forEach(v1 => {
+      v1.son.forEach(v2 => {
+        if (!v2.noShow) {
+          arr.push(v2)
+        }
+      })
+    })
+
+    // 器具连连看
+    arr.push({
+      name: '宴饮',
+      imgSrc: 'more/ren/lianLianKan.jpg',
+      path: '/unend/game1?r=ren',
+      pagetop: '30%',
+      pageLeft: '47%',
+      zIndex: 5
+    })
+
+    return arr
+  }, [])
+
+  // 人---------------
+  // 一级选中
+  const [renAc1, setRenAc1] = useState('庄园主')
+
+  useEffect(() => {
+    if (renSorrlRef.current) {
+      renSorrlRef.current.scrollTo({ top: 0, behavior: 'smooth' })
+    }
+  }, [renAc1])
+
+  // 一级选中的数据
+  const renAcData = useMemo(() => {
+    return myData.more.汉代百科.人.skArr.find(v => v.name === renAc1)!.son
+  }, [renAc1])
+
+  const renSorrlRef = useRef<HTMLDivElement>(null)
+
   return (
     <div
       hidden={hidden}
@@ -30,7 +82,11 @@ function S1manor({ hidden }: Props) {
       style={{ backgroundImage: `url(${baseURL + data.bg})` }}
     >
       {/* 左侧图标 */}
-      <div className='S1left' style={{ backgroundImage: `url(${baseURL}more/s1Zhe.png)` }}>
+      <div
+        className='S1left'
+        hidden={tab === '人物'}
+        style={{ backgroundImage: `url(${baseURL}more/s1Zhe.png)` }}
+      >
         <img className='SlL1' src={baseURL + hotInfo.leftImg} alt='' />
 
         <div className='SlL2' onClick={() => history.push(hotInfo.path)}>
@@ -39,7 +95,7 @@ function S1manor({ hidden }: Props) {
         </div>
       </div>
 
-      <div className='S1hotBox'>
+      <div className='S1hotBox' hidden={tab === '人物'}>
         {data.hot.map((item, index) => (
           // 热点图标
           <HotIcon
@@ -59,6 +115,95 @@ function S1manor({ hidden }: Props) {
           />
         ))}
       </div>
+
+      {/* 右侧tab */}
+      <div className='S1tab'>
+        {tabArr.map(v => (
+          <div onClick={() => setTab(v)} className={classNames(tab === v ? 'S1tabAc' : '')} key={v}>
+            {v}
+          </div>
+        ))}
+      </div>
+
+      {/* 人物左侧列表 */}
+      <div
+        className='S1renList'
+        hidden={tab === '场景'}
+        style={{ backgroundImage: `url(${baseURL}more/s1Zhe.png)` }}
+      >
+        {/* 人------------- */}
+        <div className='S2renBox'>
+          {/* 左侧 */}
+          <div className='S2renBox1'>
+            {myData.more.汉代百科.人.skArr.map((item, index) => (
+              <div
+                style={{
+                  backgroundImage: `url(${baseURL}plow/left${
+                    renAc1 === item.name ? 'Ac2' : ''
+                  }.png)`,
+                  color: renAc1 === item.name ? '#EACF60' : '#DACB8B'
+                }}
+                key={index}
+                className='S2renRow'
+                onClick={() => setRenAc1(item.name)}
+              >
+                {item.name}
+              </div>
+            ))}
+          </div>
+
+          {/* 右侧图文信息 */}
+          <div className='S2renBox2'>
+            <div
+              className='mySorrl'
+              ref={renSorrlRef}
+              style={{
+                display: renAcData.length < 4 ? 'flex' : 'block',
+                paddingBottom: renAcData.length < 4 ? '30px' : '0'
+              }}
+            >
+              {renAcData.map((item, index) => (
+                <div
+                  className='S2ren2Row'
+                  key={index}
+                  onClick={() => {
+                    const path = item.path.includes('?r=') ? item.path + '0' : item.path
+                    if (item.videoSrc) {
+                      setLastVideo({ src: item.videoSrc, path: path })
+                    } else history.push(path)
+                  }}
+                >
+                  <img src={baseURL + item.imgSrc} alt='' />
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div className='S1hotBox' hidden={tab === '场景'}>
+        {renArr.map((item, index) => (
+          // 热点图标
+          <HotIcon
+            isModel={false}
+            key={index}
+            index={index}
+            zIndex={item.zIndex ? item.zIndex : 1}
+            clickSon={() => {
+              const path = item.path.includes('?r=') ? item.path + '0' : item.path
+              if (item.videoSrc) {
+                setLastVideo({ src: item.videoSrc, path: path })
+              } else history.push(path)
+            }}
+            isXiao={0.6}
+            hoverSrc={item.imgSrc.replace('ren/', 'ren/tag_').replace('.jpg', '.png')}
+            style={{
+              top: item.pagetop,
+              left: item.pageLeft
+            }}
+          />
+        ))}
+      </div>
     </div>
   )
 }

Code/src/pages/B1more/S2mien/index.module.scss

@@ -52,73 +52,6 @@
           }
         }
       }
-
-      // 人-----
-      .S2renBox {
-        width: 100%;
-        height: 100%;
-        display: flex;
-        .S2renBox1 {
-          width: 70px;
-          .S2renRow {
-            width: 54px;
-            height: 54px;
-            background-size: 100% 100%;
-            cursor: pointer;
-            transition: all 0.3s;
-            margin: 10px 0;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 14px;
-            padding-bottom: 3px;
-            &:hover {
-              background-image: url('../../../assets/img/leftAc2.png') !important;
-              color: #eacf60 !important;
-            }
-          }
-        }
-        .S2renBox2 {
-          width: 120px;
-          height: 100%;
-
-          & > div {
-            width: 100%;
-            height: 100%;
-            overflow: auto;
-            padding-right: 10px;
-
-            flex-direction: column;
-            justify-content: center;
-            &::-webkit-scrollbar {
-              width: 2px;
-            }
-            &::-webkit-scrollbar-thumb {
-              background: var(--themeColor2);
-            }
-
-            .S2ren2Row {
-              cursor: pointer;
-              width: 108px;
-              height: 56px;
-              border-radius: 4px;
-              overflow: hidden;
-              margin-bottom: 10px;
-              border: 1px solid transparent;
-              transition: all 0.3s;
-              & > img {
-                pointer-events: none;
-                width: 100%;
-                height: 100%;
-                object-fit: fill !important;
-              }
-              &:hover {
-                border-color: var(--themeColor2);
-              }
-            }
-          }
-        }
-      }
     }
 
     .S2right {

Code/src/pages/B1more/S2mien/index.tsx

@@ -9,25 +9,15 @@ import history from '@/utils/history'
 
 type Props = {
   hidden: boolean
-  setLastVideo: (info: any) => void
 }
-type TitType = '物' | '人'
-
-const leftFloorArr: TitType[] = ['物', '人']
 
 const dataTemp = myData.more['汉代百科']
 
 const data1 = dataTemp['物']
 
-function S2mien({ hidden, setLastVideo }: Props) {
+function S2mien({ hidden }: Props) {
   const sroolDomRef = useRef<HTMLDivElement>(null)
 
-  const [tit, setTit] = useState<TitType>('物')
-
-  useEffect(() => {
-    if (window.location.href.includes('r=ren')) setTit('人')
-  }, [])
-
   // 选中的索引
   const [hotInd, setHotInd] = useState(-1)
 
@@ -63,23 +53,6 @@ function S2mien({ hidden, setLastVideo }: Props) {
     return name
   }, [opnInd])
 
-  // 人---------------
-  // 一级选中
-  const [renAc1, setRenAc1] = useState('庄园主')
-
-  useEffect(() => {
-    if (renSorrlRef.current) {
-      renSorrlRef.current.scrollTo({ top: 0, behavior: 'smooth' })
-    }
-  }, [renAc1])
-
-  // 一级选中的数据
-  const renAcData = useMemo(() => {
-    return myData.more.汉代百科.人.skArr.find(v => v.name === renAc1)!.son
-  }, [renAc1])
-
-  const renSorrlRef = useRef<HTMLDivElement>(null)
-
   return (
     <div
       hidden={hidden}
@@ -92,7 +65,7 @@ function S2mien({ hidden, setLastVideo }: Props) {
         style={{ backgroundImage: `url(${baseURL}more/s1Zhe.png)`, opacity: opnInd > -1 ? 0 : 1 }}
       >
         {/* 物----------- */}
-        <div ref={sroolDomRef} className='S2leftMain' hidden={tit !== '物'}>
+        <div ref={sroolDomRef} className='S2leftMain'>
           {data1.hot.map((item, index) => (
             <div
               onClick={() => clickSon(index)}
@@ -103,58 +76,10 @@ function S2mien({ hidden, setLastVideo }: Props) {
             </div>
           ))}
         </div>
-
-        {/* 人------------- */}
-        <div className='S2renBox' hidden={tit !== '人'}>
-          {/* 左侧 */}
-          <div className='S2renBox1'>
-            {myData.more.汉代百科.人.skArr.map((item, index) => (
-              <div
-                style={{
-                  backgroundImage: `url(${baseURL}plow/left${
-                    renAc1 === item.name ? 'Ac2' : ''
-                  }.png)`,
-                  color: renAc1 === item.name ? '#EACF60' : '#DACB8B'
-                }}
-                key={index}
-                className='S2renRow'
-                onClick={() => setRenAc1(item.name)}
-              >
-                {item.name}
-              </div>
-            ))}
-          </div>
-
-          {/* 右侧图文信息 */}
-          <div className='S2renBox2'>
-            <div
-              className='mySorrl'
-              ref={renSorrlRef}
-              style={{
-                display: renAcData.length < 4 ? 'flex' : 'block',
-                paddingBottom: renAcData.length < 4 ? '30px' : '0'
-              }}
-            >
-              {renAcData.map((item, index) => (
-                <div
-                  className='S2ren2Row'
-                  key={index}
-                  onClick={() => {
-                    if (item.videoSrc) {
-                      setLastVideo({ src: item.videoSrc, path: item.path })
-                    } else history.push(item.path)
-                  }}
-                >
-                  <img src={baseURL + item.imgSrc} alt='' />
-                </div>
-              ))}
-            </div>
-          </div>
-        </div>
       </div>
 
       {/* 物-----------右侧 */}
-      <div className='S2right' hidden={tit !== '物'}>
+      <div className='S2right'>
         {/* 热点图标 */}
         {data1.hot.map((item, index) => (
           <HotIcon
@@ -186,15 +111,6 @@ function S2mien({ hidden, setLastVideo }: Props) {
           <Hot2 data={data1.hot[opnInd].data} closeFu={() => setOpenInd(-1)} name={hotName} />
         )
       ) : null}
-
-      {/* 人和物的选择 */}
-      <div className='S2btn'>
-        {leftFloorArr.map(v => (
-          <div key={v} onClick={() => setTit(v)} className={classNames(tit === v ? 'S2btnAc' : '')}>
-            {v}
-          </div>
-        ))}
-      </div>
     </div>
   )
 }

Code/src/pages/B1more/data.ts

@@ -0,0 +1,7 @@
+export const renClickPageFu = () => {
+  let txt: '' | '0' | '1' = ''
+  const Urltxt = window.location.href.split('?r=')[1]
+  if (Urltxt && Urltxt === 'ren0') txt = '0'
+  else if (Urltxt && Urltxt === 'ren1') txt = '1'
+  return txt
+}

Code/src/pages/B1more/index.tsx

@@ -11,6 +11,7 @@ import BtnRight from '@/components/BtnRight'
 import useLoding from '@/components/ownUse/useLoding'
 import { domDelOwnFu } from '@/utils/utilsSome'
 import VideoModel from '@/components/VideoModel'
+import { renClickPageFu } from './data'
 
 const videoObj = {
   探索庄园: {
@@ -33,10 +34,10 @@ const floorArr: TxtType[] = ['探索庄园', '汉代百科', '文物欣赏']
 
 function B1more() {
   const [floorTxt, setFloorTxt] = useState<TxtType>(
-    window.location.href.includes('r=ren') ? '汉代百科' : '探索庄园'
+    renClickPageFu() === '1' ? '汉代百科' : '探索庄园'
   )
 
-  const floorRef = useRef<TxtType>(window.location.href.includes('r=ren') ? '汉代百科' : '探索庄园')
+  const floorRef = useRef<TxtType>(renClickPageFu() === '1' ? '汉代百科' : '探索庄园')
 
   // 需要播放的视频路径
   const [videoSrc, setVideoSrc] = useState('')
@@ -103,11 +104,11 @@ function B1more() {
 
       {imgNow ? (
         <>
-          <S1manor hidden={!!videoSrc || floorTxt !== '探索庄园'} />
-          <S2mien
-            hidden={!!videoSrc || floorTxt !== '汉代百科'}
+          <S1manor
+            hidden={!!videoSrc || floorTxt !== '探索庄园'}
             setLastVideo={info => setLastVideo(info)}
           />
+          <S2mien hidden={!!videoSrc || floorTxt !== '汉代百科'} />
           <S3goods hidden={!!videoSrc || floorTxt !== '文物欣赏'} />
         </>
       ) : null}

Code/src/pages/B1more/type.d.ts

@@ -0,0 +1,10 @@
+export type RenListType = {
+  name: string
+  imgSrc: string
+  videoSrc?: string
+  path: string
+  pagetop: string
+  pageLeft: string
+  noShow?: boolean
+  zIndex?: number
+}

Code/src/pages/C2unityEnd/index.tsx

@@ -3,6 +3,7 @@ import styles from './index.module.scss'
 import { isPc, otherUrl } from '@/utils/http'
 import { useParams } from 'react-router-dom'
 import history from '@/utils/history'
+import { renClickPageFu } from '../B1more/data'
 
 const obj = {
   end: {
@@ -31,7 +32,7 @@ function C2unityEnd() {
   useEffect(() => {
     const key = urlObj.key
 
-    console.log(123, key)
+    // console.log(123, key)
 
     const objTemp = Reflect.get(obj, key)
     const res = Reflect.get(objTemp, isPc ? 'pc' : 'app')
@@ -63,8 +64,11 @@ function C2unityEnd() {
       console.log('从unity点击返回')
 
       // 退出
-      if (window.location.href.includes('r=ren')) history.replace('/more?r=ren')
-      else if (window.location.href.includes('v=v2')) history.replace('/visit2?v=v2')
+
+      const txt = renClickPageFu()
+      if (txt) {
+        txt === '1' ? history.replace('/more?r=ren1') : history.replace('/more?r=ren0')
+      } else if (window.location.href.includes('v=v2')) history.replace('/visit2?v=v2')
       else history.go(-1)
     }
   }, [])

Code/src/types/declaration.d.ts

@@ -208,6 +208,9 @@ type MyDataType = {
             imgSrc: string
             videoSrc?: string
             path: string
+            pagetop: string
+            pageLeft: string
+            noShow?: boolean
           }[]
         }[]
       }