App.tsx 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. import '@/assets/styles/base.css'
  2. // 关于路由
  3. import React, { useCallback, useEffect } from 'react'
  4. import { Router, Route, Switch } from 'react-router-dom'
  5. import history, { isMobileFu } from './utils/history'
  6. import SpinLoding from './components/SpinLoding'
  7. import AsyncSpinLoding from './components/AsyncSpinLoding'
  8. import UpAsyncLoding from './components/UpAsyncLoding'
  9. import MessageCom from './components/Message'
  10. import screenImg from '@/assets/img/landtip.png'
  11. const A1home = React.lazy(() => import('./pages/A1home'))
  12. export default function App() {
  13. // 从仓库中获取查看图片的信息
  14. // const lookBigImg = useSelector((state: RootState) => state.A0Layout.lookBigImg)
  15. const rootDomFu = useCallback(() => {
  16. const rootDom: HTMLDivElement = document.querySelector('#root')!
  17. if (rootDom) {
  18. rootDom.style.height = window.innerHeight + 'px'
  19. }
  20. }, [])
  21. useEffect(() => {
  22. window.addEventListener('resize', rootDomFu, true)
  23. rootDomFu()
  24. }, [rootDomFu])
  25. return (
  26. <>
  27. {/* 关于路由 */}
  28. <Router history={history}>
  29. <React.Suspense fallback={<SpinLoding />}>
  30. <Switch>
  31. {/* <Route path='/codeSucc/:id' component={A3codeSucc} /> */}
  32. <Route path='/' component={A1home} />
  33. </Switch>
  34. </React.Suspense>
  35. </Router>
  36. {/* 发送请求的加载组件 */}
  37. <AsyncSpinLoding />
  38. {/* 所有图片点击预览查看大图 */}
  39. {/* <Image
  40. preview={{
  41. visible: lookBigImg.show,
  42. src: lookBigImg.url,
  43. onVisibleChange: value => {
  44. // 清除仓库信息
  45. store.dispatch({
  46. type: 'layout/lookBigImg',
  47. payload: { url: '', show: false }
  48. })
  49. }
  50. }}
  51. /> */}
  52. {/* 上传附件的进度条元素 */}
  53. <UpAsyncLoding />
  54. {/* 查看视频音频 */}
  55. {/* <LookDom /> */}
  56. {/* antd 轻提示 ---兼容360浏览器 */}
  57. <MessageCom />
  58. {/* 横屏提示 */}
  59. {isMobileFu() ? (
  60. <div id='ScreenChange'>
  61. <img src={screenImg} alt='' />
  62. <p>请在竖屏模式浏览</p>
  63. </div>
  64. ) : null}
  65. </>
  66. )
  67. }