增加中英文存到仓库的逻辑

src/App.tsx

@@ -7,10 +7,11 @@ import SpinLoding from './components/SpinLoding'
 import store, { RootState } from './store'
 import { useSelector } from 'react-redux'
 import NotFound from '@/components/NotFound'
-import { baseURL, envFlag, isLoc, myData } from './utils/http'
+import { baseURL, envFlag, isLoc } from './utils/http'
 import AsyncSpinLoding from './components/AsyncSpinLoding'
 import { Image } from 'antd'
 import MessageCom from '@/components/Message'
+import { setStoreLangueFu } from './utils/storage'
 
 // import Vconsole from 'vconsole'
 // new Vconsole()
@@ -52,6 +53,13 @@ const planSize = {
 }
 
 export default function App() {
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
+  // 判断是中文还是英文
+  useEffect(() => {
+    setStoreLangueFu()
+  }, [])
+
   useEffect(() => {
     // 打包环境 刷新页面从 首页 开始
     if (!isLoc && myData.isLdong) {
@@ -59,7 +67,7 @@ export default function App() {
         window.location.href = window.location.href.split('#')[0] + '#/'
       }
     }
-  }, [])
+  }, [myData.isLdong])
 
   const lookBigImg = useSelector((state: RootState) => state.A0Layout.lookBigImg)
 
@@ -199,54 +207,52 @@ export default function App() {
     }
   }, [])
 
-
-
   useEffect(() => {
     // 添加状态跟踪自动旋转
-    let timer: NodeJS.Timeout;
+    let timer: NodeJS.Timeout
 
     window.onModelControlled = () => {
-      callIframeFu('setModelAutoRotation', 0);
+      callIframeFu('setModelAutoRotation', 0)
       resetTimer()
     }
 
     const resetTimer = () => {
       // 清除现有计时器
-      if (timer) clearTimeout(timer);
+      if (timer) clearTimeout(timer)
 
       // 重置计时器并检查旋转状态
       timer = setTimeout(() => {
         if (window.currentChangePanelIndex === 0 || window.currentChangePanelIndex === 4) {
-          console.log(window.currentChangePanelIndex);
-          callIframeFu('setModelAutoRotation', -0.5);
-          isAutoRotating.current = true;
+          console.log(window.currentChangePanelIndex)
+          callIframeFu('setModelAutoRotation', -0.5)
+          isAutoRotating.current = true
         }
-      }, 3000);
+      }, 3000)
 
       // 如果正在旋转则取消
       if (isAutoRotating.current) {
-        callIframeFu('setModelAutoRotation', 0);
-        isAutoRotating.current = false;
+        callIframeFu('setModelAutoRotation', 0)
+        isAutoRotating.current = false
       }
-    };
+    }
 
     // 初始化计时器
-    resetTimer();
+    resetTimer()
 
     // 操作事件监听
     const handleUserAction = () => {
-      resetTimer();
-    };
+      resetTimer()
+    }
 
-    document.addEventListener('click', handleUserAction);
-    document.addEventListener('touchstart', handleUserAction);
+    document.addEventListener('click', handleUserAction)
+    document.addEventListener('touchstart', handleUserAction)
 
     return () => {
-      clearTimeout(timer);
-      document.removeEventListener('click', handleUserAction);
-      document.removeEventListener('touchstart', handleUserAction);
-    };
-  }, []);
+      clearTimeout(timer)
+      document.removeEventListener('click', handleUserAction)
+      document.removeEventListener('touchstart', handleUserAction)
+    }
+  }, [])
 
   document.addEventListener('click', () => {
     if (window.currentChangePanelIndex === 0 || window.currentChangePanelIndex === 4) {
@@ -255,8 +261,6 @@ export default function App() {
     }
   })
 
-
-
   // 更新unity页面
   useEffect(() => {
     if (envFlag) {
@@ -264,8 +268,7 @@ export default function App() {
         if (e.code === 'Enter') {
           callIframeFu(
             'refreshAppSettings',
-            JSON.stringify(
-              {
+            JSON.stringify({
               panels: [
                 {
                   name: 'DefaultVirtualCamera',
@@ -579,7 +582,8 @@ export default function App() {
                   }
                 }
               ]
-            }),'json'
+            }),
+            'json'
           )
         }
       })

src/components/BaseVideo/index.module.scss

@@ -1,82 +0,0 @@
-.BaseVideo {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  z-index: 11;
-  opacity: 1;
-  transition: opacity 0.5s;
-  :global {
-    .BVBIcon {
-      position: absolute;
-      top: -60px;
-      left: 50%;
-      transform: translateX(-50%);
-      width: 30px;
-      z-index: 10;
-      cursor: pointer;
-    }
-
-    .BaseVideoIcon {
-      position: absolute;
-      top: 0;
-      width: 650px;
-      max-width: 90%;
-      left: 50%;
-      transform: translateX(-50%);
-    }
-
-    .BVbaseBtn {
-      position: absolute;
-      bottom: 40px;
-      left: 50%;
-      transform: translateX(-50%);
-      cursor: pointer;
-      width: 100px;
-      height: auto;
-      z-index: 10;
-      & > img {
-        width: 100%;
-      }
-
-      .BVBtxt {
-        position: absolute;
-        top: 0;
-        left: 0;
-        color: #fffddc;
-        width: 100%;
-        height: 100%;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        transition: color 0.3s;
-        &:hover {
-          color: #ead98f;
-        }
-      }
-      .BVBxian {
-        position: absolute;
-        bottom: -10px;
-        left: 0;
-        width: 100%;
-        padding: 0 10px;
-        height: 2px;
-        & > div {
-          width: 100%;
-          height: 100%;
-          background-color: rgba(231, 214, 142, 0.6);
-          & > div {
-            width: 0%;
-            height: 100%;
-
-            background-color: #fffddc;
-          }
-        }
-      }
-    }
-  }
-}
-
-.BaseVideoHide {
-  opacity: 0;
-  pointer-events: none;
-}

src/components/BaseVideo/index.tsx

@@ -1,89 +0,0 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react'
-import styles from './index.module.scss'
-import classNames from 'classnames'
-import { baseURL, myData } from '@/utils/http'
-import { domDelOwnFu } from '@/utils/utilsSome'
-
-type Props = {
-  isShow: boolean //是否显示
-  imgSrc: string //标题图片的路径
-  videoSrc: string //视频路径
-  parentFu: () => void //点击继续的方法（调用父亲）
-}
-
-function BaseVideo({ isShow, imgSrc, videoSrc, parentFu }: Props) {
-  const baseVideoRef = useRef<HTMLVideoElement>(null)
-
-  useEffect(() => {
-    setTimeout(() => {
-      if (baseVideoRef.current) {
-        baseVideoRef.current.play()
-      }
-    }, 100)
-  }, [])
-
-  const [loding, setLoding] = useState(myData.isLdong ? 0 : 100)
-
-  const timeRR = useRef(-1)
-
-  useEffect(() => {
-    clearInterval(timeRR.current)
-    timeRR.current = window.setInterval(() => {
-      if (loding >= 100) {
-        clearInterval(timeRR.current)
-        return
-      }
-      setLoding(loding + 1)
-    }, 30)
-  }, [loding])
-
-  const btnStartFu = useCallback(() => {
-    if (loding >= 100) {
-      parentFu()
-      // 0.5s之后删除初始视频
-      setTimeout(() => {
-        domDelOwnFu('#BaseVideo')
-      }, 500)
-    }
-  }, [loding, parentFu])
-
-  return (
-    <div
-      id='BaseVideo'
-      className={classNames(styles.BaseVideo, isShow ? '' : styles.BaseVideoHide)}
-    >
-      <img className='BaseVideoIcon' src={imgSrc} alt='' />
-      <div className='BVbaseBtn' onClick={btnStartFu}>
-        {/* anpg动图 */}
-        <div className='BVBIcon'>
-          <img src={`${baseURL}visit/arrow.png`} alt='' />
-        </div>
-
-        <img src={`${baseURL}visit/btn.png`} alt='' />
-
-        <div className='BVBtxt'>{loding >= 100 ? '点击继续' : '加载中'}</div>
-        {loding >= 100 ? null : (
-          <div className='BVBxian'>
-            <div>
-              <div style={{ width: loding + '%' }}></div>
-            </div>
-          </div>
-        )}
-      </div>
-
-      <video
-        ref={baseVideoRef}
-        src={videoSrc}
-        playsInline
-        muted
-        webkit-playsinline='true'
-        x5-video-player-type='h5'
-        loop
-      />
-    </div>
-  )
-}
-
-const MemoBaseVideo = React.memo(BaseVideo)
-
-export default MemoBaseVideo

src/components/CatVideo/index.module.scss

@@ -1,16 +0,0 @@
-.CatVideo {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  z-index: 15;
-  opacity: 1;
-  top: 0;
-  left: 0;
-  // :global {
-
-  // }
-}
-.CatVideoHide {
-  opacity: 0;
-  pointer-events: none;
-}

src/components/CatVideo/index.tsx

@@ -1,63 +0,0 @@
-import React, { useCallback, useEffect, useRef } from 'react'
-import styles from './index.module.scss'
-import classNames from 'classnames'
-import { domDelOwnFu } from '@/utils/utilsSome'
-import BtnRight from '../BtnRight'
-
-type Props = {
-  isShow: boolean
-  src: string
-  parentFu: () => void
-  noBtn?: boolean //没有跳过按钮
-  openYin?: boolean //打开声音播放
-  // 不用删除自己
-  noDel?: boolean
-}
-
-function CatVideo({ isShow, src, parentFu, noBtn, openYin, noDel }: Props) {
-  const videoRef = useRef<HTMLVideoElement>(null)
-
-  useEffect(() => {
-    if (isShow) {
-      setTimeout(() => {
-        if (videoRef.current) videoRef.current.play()
-      }, 100)
-    }
-  }, [isShow])
-
-  const playEndFu = useCallback(() => {
-    parentFu()
-
-    if (!noDel) {
-      // 0.5s之后删除过度视频
-      setTimeout(() => {
-        domDelOwnFu('#CatVideo')
-      }, 500)
-    }
-  }, [noDel, parentFu])
-
-  return (
-    <div id='CatVideo' className={classNames(styles.CatVideo, isShow ? '' : styles.CatVideoHide)}>
-      <video
-        ref={videoRef}
-        playsInline
-        muted={!openYin}
-        webkit-playsinline='true'
-        x5-video-player-type='h5'
-        onEnded={playEndFu}
-      >
-        <source type='video/mp4' src={src} />
-        Your browser does not support the video tag.
-      </video>
-
-      {/* 右下角的跳过按钮 */}
-      <BtnRight imgName='skip' clickSon={() => playEndFu()} title='跳过' />
-      {/* {noBtn && myData.isLdong ? null : (
-      )} */}
-    </div>
-  )
-}
-
-const MemoCatVideo = React.memo(CatVideo)
-
-export default MemoCatVideo

src/components/EndVideo/index.module.scss

@@ -1,18 +0,0 @@
-.EndVideo {
-  width: 100%;
-  height: 100%;
-  position: absolute;
-  z-index: 100;
-  top: 0;
-  left: 0;
-  opacity: 0;
-  pointer-events: none;
-  transition: all 1s;
-  // :global {
-
-  // }
-}
-.EndVideoAc {
-  opacity: 1;
-  pointer-events: auto;
-}

src/components/EndVideo/index.tsx

@@ -1,62 +0,0 @@
-import React, { useEffect, useRef } from 'react'
-import styles from './index.module.scss'
-import classNames from 'classnames'
-import { domDelOwnFu } from '@/utils/utilsSome'
-import history from '@/utils/history'
-import BtnRight from '../BtnRight'
-// import { myData } from '@/utils/http'
-
-type Props = {
-  lastVideo: boolean //是否显示
-  src: string //视频路径
-  path: string //点击跳过 或者视频播完 跳路由的路径
-  delDom?: string //有的话 就删除这个dom
-  noBtn?: boolean //没有跳过按钮
-}
-
-// 页面结尾的视频
-function EndVideo({ lastVideo, delDom, src, path, noBtn }: Props) {
-  const videoRefLast = useRef<HTMLVideoElement>(null)
-
-  useEffect(() => {
-    if (lastVideo) {
-      setTimeout(() => {
-        if (videoRefLast.current) {
-          videoRefLast.current.play()
-        }
-      }, 100)
-
-      // 0.5s之后删除上级元素
-      if (delDom) {
-        setTimeout(() => {
-          domDelOwnFu(delDom)
-        }, 500)
-      }
-    }
-  }, [delDom, lastVideo])
-
-  return (
-    <div className={classNames(styles.EndVideo, lastVideo ? styles.EndVideoAc : '')}>
-      <video
-        ref={videoRefLast}
-        playsInline
-        muted
-        webkit-playsinline='true'
-        x5-video-player-type='h5'
-        onEnded={() => window.location.replace(path)}
-      >
-        <source type='video/mp4' src={src} />
-        Your browser does not support the video tag.
-      </video>
-
-      {/* 右下角的跳过按钮 */}
-      <BtnRight imgName='skip' clickSon={() => window.location.replace(path)} title='跳过' />
-      {/* {noBtn && myData.isLdong ? null : (
-      )} */}
-    </div>
-  )
-}
-
-const MemoEndVideo = React.memo(EndVideo)
-
-export default MemoEndVideo

src/components/HotIcon/index.module.scss

@@ -1,51 +0,0 @@
-.HotIcon {
-  display: inline-block;
-  min-width: 30px;
-  height: 30px;
-  width: auto;
-  :global {
-    img {
-      cursor: pointer;
-      position: relative;
-      top: 0;
-      left: 0;
-      height: 100%;
-      transition: all 0.3s;
-    }
-    .HotIconHover {
-      opacity: 0;
-      pointer-events: none;
-    }
-    .HotIconBase {
-      position: absolute;
-      top: 0;
-      left: 0;
-      &:hover {
-        opacity: 0;
-      }
-      &:hover + .HotIconHover {
-        opacity: 1;
-      }
-    }
-  }
-}
-
-.HotIconAc {
-  :global {
-    .HotIconHover {
-      opacity: 1;
-      // pointer-events: auto;
-    }
-    .HotIconBase {
-      opacity: 0;
-    }
-  }
-}
-.HotIconZhan {
-  :global {
-    .HotIconHover {
-      opacity: 1;
-      pointer-events: auto;
-    }
-  }
-}

src/components/HotIcon/index.tsx

@@ -1,108 +0,0 @@
-import React, { useCallback } from 'react'
-import styles from './index.module.scss'
-import { baseURL } from '@/utils/http'
-import classNames from 'classnames'
-
-type Props = {
-  // 是否是模型
-  isModel: boolean
-  index: number
-  clickSon?: (index: number) => void //点击
-  hoverSrc: string //鼠标移入显示的图片
-  style?: { top: string; left: string } //是否定位（除了全景视频和全景图）
-  zIndex?: number //层级问题，如果碰到遮挡 把这个值设置大一点
-  // 更多模块的热点逻辑参数
-  isHoverAc?: boolean //鼠标移入索引
-  hoverFu?: (index: number) => void //鼠标移入事件
-  isZhan?: boolean //是否全部展开
-  // 全景视频和全景图的宽度
-  panoWidth?: string
-  isXiao?: number
-  // 是否在全景中
-  isPano?: boolean
-}
-
-function HotIcon({
-  isModel,
-  index,
-  clickSon,
-  hoverSrc,
-  style,
-  isHoverAc,
-  hoverFu,
-  isZhan,
-  zIndex,
-  panoWidth,
-  isXiao,
-  isPano
-}: Props) {
-  const onMouseEnter = useCallback(() => {
-    if (hoverFu) {
-      hoverFu(index)
-    }
-  }, [hoverFu, index])
-
-  const clickSonFu = useCallback(() => {
-    if (clickSon) clickSon(index)
-  }, [clickSon, index])
-
-  return (
-    <div
-      id='HotIcon'
-      style={{
-        position: style ? 'absolute' : 'relative',
-        top: style ? style.top : 0,
-        left: style ? style.left : 0,
-        zIndex: zIndex || 1,
-        width: panoWidth ? panoWidth : 'auto',
-        transform: isXiao ? `scale(${isXiao})` : ''
-      }}
-      className={classNames(
-        styles.HotIcon,
-        isHoverAc ? styles.HotIconAc : '',
-        isZhan ? styles.HotIconZhan : ''
-      )}
-      key={index}
-    >
-      {(!isPano || !isHoverAc) && (
-        <img
-          onMouseEnter={onMouseEnter}
-          onClick={clickSonFu}
-          className='HotIconBase'
-          src={`${baseURL}visit/hot/hotBase${isModel ? '2' : ''}.png`}
-          alt=''
-          style={
-            isPano
-              ? {
-                  position: 'relative',
-                  maxWidth: 'unset',
-                  maxHeight: 'unset'
-                }
-              : undefined
-          }
-        />
-      )}
-      {(!isPano || isHoverAc) && (
-        <img
-          onMouseEnter={onMouseEnter}
-          onClick={clickSonFu}
-          className='HotIconHover'
-          src={baseURL + hoverSrc}
-          alt=''
-          style={
-            isPano
-              ? {
-                  maxWidth: 'unset',
-                  maxHeight: 'unset'
-                }
-              : undefined
-          }
-        />
-      )}
-    </div>
-  )
-}
-
-const MemoHotIcon = React.memo(HotIcon)
-
-export default MemoHotIcon

src/i18n.ts

@@ -1,38 +0,0 @@
-import i18n from 'i18next';
-import { initReactI18next } from 'react-i18next';
-
-// 异步加载语言包（核心）
-const loadLocale = async ({locale}:{locale:string}) => {
-  let messages;
-  if (locale === 'zh-CN') {
-    // 动态加载 public/data.js
-    const module = await import('./utils/http');
-    messages = module.myData;
-  } else if (locale === 'en-EN') {
-    const module = await import('./utils/http');
-    messages = module.myData;
-  }
-  // 注入到 i18n
-  i18n.addResourceBundle(locale, 'translation', messages);
-  // 切换语言
-  i18n.changeLanguage(locale);
-  return messages;
-};
-
-// 初始化加载默认语言
-loadLocale({ locale: 'zh-CN' });
-
-i18n
-  .use(initReactI18next)
-  .init({
-    resources: {},
-    lng: 'zh-CN', // 默认中文
-    fallbackLng: 'zh-CN',
-    interpolation: {
-      escapeValue: false
-    }
-  });
-
-export default i18n;
-
-export {};

src/pages/A0base/index.tsx

@@ -1,12 +1,14 @@
 import React, { useEffect, useState } from 'react'
 import styles from './index.module.scss'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import classNames from 'classnames'
 import IsDev from '@/components/IsDev'
-
-
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function A0base() {
+  const { myData, myLangue } = useSelector((state: RootState) => state.A0Layout)
+
   const [currentBase, setCurrentBase] = useState(0)
   const [isOpenInteract, setIsOpenInteract] = useState(false)
   const [showIsDev, setShowIsDev] = useState(false)
@@ -18,9 +20,10 @@ function A0base() {
   }
 
   useEffect(() => {
-    showIsDev && setTimeout(() => {
-      setShowIsDev(false)
-    }, 2000)
+    showIsDev &&
+      setTimeout(() => {
+        setShowIsDev(false)
+      }, 2000)
   }, [showIsDev])
 
   return (
@@ -29,16 +32,27 @@ function A0base() {
         <div className={`content`}>
           <div className='title myFont'>{myData.baseInfo[currentBase].title}</div>
           <div className='text'>{myData.baseInfo[currentBase].text}</div>
-          <div className='btn' onClick={(e) => goto(e, myData.baseInfo[currentBase].path)}>查看详情</div>
+          <div className='btn' onClick={e => goto(e, myData.baseInfo[currentBase].path)}>
+            {myLangue==='ZH'?'查看详情':'view details'}
+          </div>
         </div>
         <div className='baseContent'>
-          <div className={`base ${currentBase === 0 ? 'baseAc' : ''}`} onClick={() => setCurrentBase(0)}>
+          <div
+            className={`base ${currentBase === 0 ? 'baseAc' : ''}`}
+            onClick={() => setCurrentBase(0)}
+          >
             {myData.baseInfo[0].title}
           </div>
-          <div className={`base ${currentBase === 1 ? 'baseAc' : ''}`} onClick={() => setCurrentBase(1)}>
+          <div
+            className={`base ${currentBase === 1 ? 'baseAc' : ''}`}
+            onClick={() => setCurrentBase(1)}
+          >
             {myData.baseInfo[1].title}
           </div>
-          <div className={`base ${currentBase === 2 ? 'baseAc' : ''}`} onClick={() => setCurrentBase(2)}>
+          <div
+            className={`base ${currentBase === 2 ? 'baseAc' : ''}`}
+            onClick={() => setCurrentBase(2)}
+          >
             {myData.baseInfo[2].title}
           </div>
         </div>
@@ -46,17 +60,22 @@ function A0base() {
 
       {/* 互动 */}
       <div className='interact'>
-        <div className={`inter_content ${isOpenInteract ? 'inter_content_active' : ''}`} >
-
-          <div className='inter' onClick={() => window.location.replace('#/byzh')}>碑影智绘</div>
-          <div className='inter' onClick={() => setShowIsDev(true)}>展览图谱</div>
-          <div className='inter' onClick={() => setShowIsDev(true)}>AI问答</div>
+        <div className={`inter_content ${isOpenInteract ? 'inter_content_active' : ''}`}>
+          <div className='inter' onClick={() => window.location.replace('#/byzh')}>
+            碑影智绘
+          </div>
+          <div className='inter' onClick={() => setShowIsDev(true)}>
+            展览图谱
+          </div>
+          <div className='inter' onClick={() => setShowIsDev(true)}>
+            AI问答
+          </div>
         </div>
 
         <div className='icon' onClick={() => setIsOpenInteract(!isOpenInteract)}>
           <img src={require('@/assets/img/interaction.png')} alt='' />
         </div>
-      </div >
+      </div>
 
       <div className='home' onClick={e => goto(e, '/')}>
         <img src={require('@/assets/img/home.png')} alt='' />
@@ -69,8 +88,7 @@ function A0base() {
       </div>
 
       <IsDev txt='开发中' isShow={showIsDev} />
-
-    </div >
+    </div>
   )
 }
 

src/pages/A1home/index.tsx

@@ -4,6 +4,9 @@ import classNames from 'classnames'
 import { isPc } from '@/utils/http'
 
 function A1home() {
+
+
+
   // 点击进入
   const [baseFlag, setBaseFlag] = useState(false)
   const [isClickedSkip, setIsClickedSkip] = useState(false)

src/pages/A1home2/index.tsx

@@ -3,9 +3,13 @@ import styles from './index.module.scss'
 import classNames from 'classnames'
 import { isPc } from '@/utils/http'
 import { domDelOwnFu } from '@/utils/utilsSome'
-import store from '@/store'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function A1home() {
+
+  const {myLangue} = useSelector((state: RootState) => state.A0Layout)
+
   // 先加载背景图片
   const [baseImg, setBaseImg] = useState(false)
 
@@ -62,9 +66,9 @@ function A1home() {
         onPause: () => {}, // 触发暂停事件
         onEnded: () => {
           // 视频播放完了
-          const homeVideoFlag = store.getState().A0Layout.homeVideoFlag
-          console.log('home结尾视频播放完毕', !homeVideoFlag)
-          if (!homeVideoFlag) window.location.replace('#/base')
+
+          console.log('home结尾视频播放完毕')
+          window.location.replace('#/base')
         }, // 触发播放结束事件
         onSourceEstablished: () => {
           setVideoOk(true)
@@ -143,7 +147,7 @@ function A1home() {
           )}
         </div>
         <div className='progress' style={{ opacity: progress === 100 ? 0 : 1 }}>
-          加载{progress}%...
+          {myLangue==='ZH'?'加载':'Loding'}{progress}%...
         </div>
       </div>
       {/* ------------微信浏览器不让视频自动播放，用ts的方式*/}
@@ -156,11 +160,10 @@ function A1home() {
               // 删除第二个动画
               playerRef.current.destroy()
               domDelOwnFu('.A1video')
-              store.dispatch({ type: 'layout/homeVideoFlag', payload: true })
               window.location.replace('#/base')
             }}
           >
-            跳过
+            {myLangue==='ZH'?'跳过':'skip'}
             <img src={require('@/assets/sgImg/icon_skip.png')} alt='' />
           </div>
         </div>

src/pages/A2yblm/components/Detail/index.tsx

@@ -1,8 +1,10 @@
 import React from "react";
 import styles from "./index.module.scss";
-import { isPc, myData } from "@/utils/http";
+import { isPc } from "@/utils/http";
 import { callIframeFu } from "@/utils/history";
 import classNames from 'classnames'
+import { useSelector } from "react-redux";
+import { RootState } from "@/store";
 
 type DetailProps = {
   currentTagIndex: number,
@@ -10,6 +12,7 @@ type DetailProps = {
   setIsShowTag: (isShow: boolean) => void
 }
 function Detail({ currentTagIndex, setCurrentTagIndex, setIsShowTag }: DetailProps) {
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
 
   const handleHot = (index: number) => {
     setCurrentTagIndex(index)

src/pages/A2yblm/components/Intro/index.tsx

@@ -1,10 +1,14 @@
 import React from "react";
 import styles from "./index.module.scss";
-import { isPc, myData } from "@/utils/http";
+import { isPc } from "@/utils/http";
 import classNames from 'classnames'
+import { useSelector } from "react-redux";
+import { RootState } from "@/store";
 
 function Intro() {
 
+   const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   return (
     <div className={classNames(styles.Intro,isPc?'':styles.IntroMo)}>
       <div className="titleLogo">

src/pages/A2yblm/components/ModalTxt/index.tsx

@@ -1,11 +1,13 @@
 /* eslint-disable jsx-a11y/anchor-is-valid */
 import React, { useState, useEffect, useRef } from 'react'
 import styles from './index.module.scss'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import { Tooltip } from 'antd'
 import { callIframeFu, isMobiileFu } from '@/utils/history'
 import classNames from 'classnames'
 import { modalTxtTab } from './data'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function ModalTxt({
   setIsShowTabBar,
@@ -16,6 +18,9 @@ function ModalTxt({
   setIsShowMzmTitle: (isShowMzmTitle: boolean) => void
   setBottomTxt: (val: string) => void
 }) {
+
+ const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [selectedTab, setSelectedTab] = useState(0)
   const selectedTabRef = useRef(0)
   useEffect(() => {

src/pages/A2yblm/index.tsx

@@ -4,11 +4,16 @@ import { callIframeFu } from '@/utils/history'
 import Intro from '@/pages/A2yblm/components/Intro'
 import Detail from '@/pages/A2yblm/components/Detail'
 import ModalTxt from '@/pages/A2yblm/components/ModalTxt'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import MenuSider from '@/components/MenuSider'
 import classNames from 'classnames'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function A2yblm() {
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [currentTab, setCurrentTab] = useState('tab1')
 
   useEffect(() => {

src/pages/A4quanwen/index.tsx

@@ -1,10 +1,15 @@
 import React, { useState, useEffect, useCallback } from 'react'
 import styles from './index.module.scss'
 import { callIframeFu } from '@/utils/history'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import classNames from 'classnames'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function A4quanwen() {
+
+   const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [isHighlight, setIsHighlight] = useState(true)
   useEffect(() => {
     callIframeFu('showInscription', 10)

src/pages/A6ybwx/A6_1_zxys/index.tsx

@@ -1,14 +1,18 @@
 import React, { useState } from 'react'
 import styles from './index.module.scss'
-import store from '@/store'
-import { isPc, myData } from '@/utils/http'
+import store, { RootState } from '@/store'
+import { isPc } from '@/utils/http'
 import classNames from 'classnames'
+import { useSelector } from 'react-redux'
 
 function Zaoxiang() {
+
+ const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [currentType, setCurrentType] = useState('')
   const [isShowDetail, setIsShowDetail] = useState(false)
 
-  const currentItem = React.useMemo(() => myData.zaoxiangDataDetail.find(item => item.type === currentType), [currentType])
+  const currentItem = React.useMemo(() => myData.zaoxiangDataDetail.find(item => item.type === currentType), [currentType, myData.zaoxiangDataDetail])
 
   const handleDotClick = (type: string) => {
     setCurrentType(type)

src/pages/A6ybwx/A6_2_zxzgh/index.tsx

@@ -1,7 +1,11 @@
 import React, { useState, useRef } from 'react'
 import styles from './index.module.scss'
-import { myData } from '@/utils/http'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 function Sinicize() {
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [currentTab, setCurrentTab] = useState(0)
   const [selectedTime, setSelectedTime] = useState(0)
   const [isShowTip, setIsShowTip] = useState(false)

src/pages/A6ybwx/Genealogy/components/Graph/index.tsx

@@ -2,14 +2,19 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'
 import styles from './index.module.scss'
 import { NodeTurnRight, NodeRight, NodeBottom, RightLineDash, NodeActive, NodeTurnBottomRight } from '../Utils'
 import { useDrag } from '@use-gesture/react'
-import { myData } from '@/utils/http'
 import { isMobiileFu } from '@/utils/history'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 const MAIN_CONTENT_WIDTH = 1920
 const MAIN_CONTENT_HEIGHT = 945
 const MINIMAP_SCALE = 0.045
 
 function Graph({ setCurrentNodeIndex }: { setCurrentNodeIndex: (index: number) => void }) {
+
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   // 新增拖拽相关状态
   const [isDragging, setIsDragging] = useState(false)
   const [startX, setStartX] = useState(0)

src/pages/A7wjwj/conponents/Discover/index.tsx

@@ -1,9 +1,15 @@
 import React, { useState } from 'react'
 import styles from './index.module.scss'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import classNames from 'classnames'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function Discover(props: { style?: React.CSSProperties }) {
+
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   // 将隐藏的页面打开，全景图->诗歌->大场景
   const lookScene = () => {
     const panoramicRoot = document.getElementById('panoramic-root') as HTMLElement

src/pages/A7wjwj/conponents/Shuxing/index.tsx

@@ -1,7 +1,8 @@
 import React, { useCallback, useState } from 'react'
 import styles from './index.module.scss'
-import { myData } from '@/utils/http'
 import { forwardRef, useImperativeHandle } from 'react'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 type Props ={
   style:React.CSSProperties
@@ -9,6 +10,9 @@ type Props ={
 }
 
 function Shuxing({ style }:Props,ref:any) {
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [currentIndex, setCurrentIndex] = useState(0)
   const [isShowDetail, setIsShowDetail] = useState(false)
 

src/pages/A7wjwj/index.tsx

@@ -3,10 +3,15 @@ import styles from './index.module.scss'
 import MenuSider from '@/components/MenuSider'
 import Discover from './conponents/Discover'
 import Shuxing from './conponents/Shuxing'
-import { isPc, myData } from '@/utils/http'
+import { isPc } from '@/utils/http'
 import classNames from 'classnames'
+import { useSelector } from 'react-redux'
+import { RootState } from '@/store'
 
 function A7Wjwj() {
+
+  const {myData} = useSelector((state: RootState) => state.A0Layout)
+
   const [currentTab, setCurrentTab] = useState(0)
 
   // 判断是 返回 属性之辩 上一级 还是说 返回上级页面

src/store/reducer/layout.ts

@@ -27,8 +27,9 @@ const initState = {
     fu: () => {},
     state: false
   },
-  // home视频点击跳过
-  homeVideoFlag: false
+  // 总数据 - 中英文切换
+  myData: {} as MyDataType,
+  myLangue: 'ZH' as 'ZH' | 'EN'
 }
 
 // 定义 action 类型
@@ -38,7 +39,8 @@ type LayoutActionType =
   | { type: 'layout/lookBigImg'; payload: { url: string; show: boolean } }
   | { type: 'layout/lookDom'; payload: LookDomType }
   | { type: 'layout/message'; payload: MessageType }
-  | { type: 'layout/homeVideoFlag'; payload: boolean }
+  | { type: 'layout/myData'; payload: MyDataType }
+  | { type: 'layout/myLangue'; payload: 'ZH' | 'EN' }
   | {
       type: 'layout/closeUpFile'
       payload: {
@@ -67,9 +69,11 @@ export default function layoutReducer(state = initState, action: LayoutActionTyp
     // 上传文件点击取消
     case 'layout/closeUpFile':
       return { ...state, closeUpFile: action.payload }
-    // home视频点击跳过
-    case 'layout/homeVideoFlag':
-      return { ...state, homeVideoFlag: action.payload }
+    // 中英文切换
+    case 'layout/myData':
+      return { ...state, myData: action.payload }
+    case 'layout/myLangue':
+      return { ...state, myLangue: action.payload }
 
     default:
       return state

src/types/declaration.d.ts

@@ -20,7 +20,7 @@ declare const apiUrlTemp: string
 // 微信浏览器--视频转画布
 declare const F_Video: any
 
-type MyDataType = {
+ type MyDataType = {
   isLdong: boolean
   baseInfo: { title: string; text: string; path: string }[]
   introInfo: { title: string; text: string }[]

src/utils/http.ts

@@ -3,8 +3,6 @@ export const isLoc = true
 
 export const baseURL = isLoc ? baseUrlLoc : baseUrlAtl
 
-// 所有数据
-export const myData = myDataTemp 
 
 // 是不是pc端
 export const isPc = isPcTemp

src/utils/storage.ts

@@ -1,17 +1,26 @@
+import store from '@/store'
+
 // ----------------------中英文本地存储
-// 点赞的本时间戳
 const LANGUE_KEY = 'CZB_WEB_LANGUE'
 
 /**
  * 从本地缓存中获取语言
  */
-const locGetLangue = (): string => {
-  return localStorage.getItem(LANGUE_KEY) || 'ZH'
+export const locGetLangue = (): 'ZH' | 'EN' => {
+  return (localStorage.getItem(LANGUE_KEY) || 'ZH') as 'ZH' | 'EN'
 }
 
 /**
  * 从本地存语言
  */
-const locSetLangue = (val: 'ZH' | 'EN') => {
+export const locSetLangue = (val: 'ZH' | 'EN') => {
   localStorage.setItem(LANGUE_KEY, val)
 }
+
+// 设置仓库语言
+export const setStoreLangueFu = () => {
+  const val = locGetLangue()
+  store.dispatch({ type: 'layout/myLangue', payload: val })
+  const myData = val === 'ZH' ? myDataTemp : myDataTemp2
+  store.dispatch({ type: 'layout/myData', payload: myData })
+}