{"version":3,"sources":["modules/about-us/index.tsx","assets/about-us/about-us-timeline.png","modules/about-us/PCAbout-us.tsx","utils/effects.ts"],"names":["Home","isMobile","aboutBanner","useState","window","innerHeight","windowHeight","setWindowHeight","handleSize","useEffect","addEventListener","removeEventListener","style","height","position","className","loop","muted","autoPlay","id","src","type","intl","get","AppConsumer","data","useRef","useHashScroll","current","scrollLeft","scrollWidth","LazyComponent","ref","timeLineImg","alt","scrollToAnchor","locationHash","hashParts","split","length","hash","slice","ele","document","querySelector","scrollIntoView","scrollTo","history","useHistory","location","setTimeout"],"mappings":"8HAAA,2CAWeA,UAJF,WACX,OAAOC,cAAa,kBAAC,UAAD,Q,kHCRP,MAA0B,8CC4BzC,IAAMC,EAAc,WAAM,MAGgBC,mBAASC,OAAOC,aAHhC,mBAGjBC,EAHiB,KAGHC,EAHG,KAMlBC,EAAa,WACbJ,OAAOC,YAAc,IACvBE,EAAgBH,OAAOC,aAEvBE,EAAgB,MAWpB,OAPAE,qBAAU,WAER,OADAL,OAAOM,iBAAiB,SAAUF,GAC3B,WACLJ,OAAOO,oBAAoB,SAAUH,MAEtC,IAGD,yBAAKI,MAAO,CAAEC,OAAQP,EAAcQ,SAAU,aAC5C,yBAAKC,UAAU,cAjCjB,2BAAOC,MAAI,EAACC,OAAK,EAACC,UAAQ,EAACC,GAAG,kBAC5B,4BACEC,IAAI,qFACJC,KAAK,cAHT,yDAkCE,yBAAKN,UAAU,kBACb,4BAAKO,IAAKC,IAAI,0BACd,2BAAID,IAAKC,IAAI,0BA8HNC,uBAxHG,WAClB,IAAMC,EAAOC,iBAA8B,MAOzC,OANFC,cACElB,qBAAU,WACU,IAAD,EAAdgB,EAAKG,UACNH,EAAKG,QAAQC,YAAa,UAAAJ,EAAKG,eAAL,eAAcE,cAAe,KAExD,IAED,yBAAKf,UAAU,YACZb,IACD,yBAAKa,UAAU,6BACb,yBAAKI,GAAG,mBAAmBJ,UAAU,gBAClCgB,YAAc,IAAK,yBAAKhB,UAAU,cACnC,yBAAKA,UAAU,4BACb,4BAAKO,IAAKC,IAAI,oCACd,yBAAKR,UAAU,sBACf,2BAAIO,IAAKC,IAAI,iCACb,2BAAID,IAAKC,IAAI,oCAInB,yBAAKJ,GAAG,UAAUJ,UAAU,+BAC1B,yBAAKA,UAAU,2BACb,yBAAKA,UAAU,8BACb,4BAAKO,IAAKC,IAAI,sCACd,yBAAKR,UAAU,sBACf,2BAAIO,IAAKC,IAAI,mCACb,2BAAID,IAAKC,IAAI,oCAEdQ,YAAc,IAAK,yBAAKhB,UAAU,eAGvC,yBAAKI,GAAG,aAAaJ,UAAU,uBAC7B,yBAAKA,UAAU,mBACZgB,YAAc,IAAK,yBAAKhB,UAAU,YACnC,yBAAKA,UAAU,sBACb,4BAAKO,IAAKC,IAAI,8BACd,yBAAKR,UAAU,sBACf,0BAAMA,UAAU,SACd,yBAAKA,UAAU,eAAf,UACA,2BAAIO,IAAKC,IAAI,gCAEf,0BAAMR,UAAU,eACd,yBAAKA,UAAU,eAAf,gBACA,2BAAIO,IAAKC,IAAI,qCACb,2BAAID,IAAKC,IAAI,gDAKrB,yBAAKJ,GAAG,aAAaJ,UAAU,uBAC5BgB,YACC,IACA,yBAAKhB,UAAU,mBACb,yBAAKA,UAAU,sBACb,4BAAKO,IAAKC,IAAI,8BACd,yBAAKR,UAAU,yBAwBrB,yBAAKA,UAAU,YACb,yBAAKA,UAAU,oBAAoBI,GAAG,YAAYa,IAAKP,GACnD,yBAAKV,UAAU,eAAeK,IAAKa,EAAaC,IAAI,a,qDC/IlE,oDAIaC,EAAiB,SAACC,GAC7B,IAAMC,EAAYD,EAAaE,MAAM,KACrC,GAAID,EAAUE,QAAU,EAAG,CACzB,IAAMC,EAAOH,EAAUI,OAAO,GAAG,GAC3BC,EAAMC,SAASC,cAAT,WAA2BJ,IAEvC,GAAIE,EACF,OAAOA,EAAIG,iBAKf,OAAOzC,OAAO0C,SAAS,EAAG,IAGrB,SAASnB,IACd,IAAMoB,EAAUC,cAEhBvC,qBAAU,WACR0B,EAAeY,EAAQE,SAAST,QAC/B,CAACO,EAAQE,SAAST,OAGrB/B,qBAAU,WACRyC,YAAW,WACTf,EAAeY,EAAQE,SAAST,QAC/B,OACF,CAACO","file":"static/js/2.60f2f791.chunk.js","sourcesContent":["import React, { useEffect } from 'react';\nimport { connect } from 'react-redux';\nimport { RouteComponentProps } from 'react-router-dom';\n// import { RootState, Dispatch } from '../../store';\nimport { isMobile } from '../../utils/helpers';\nimport PCAboutUs from './PCAbout-us';\n\nconst Home = () => {\n  return isMobile() ? <PCAboutUs /> : <PCAboutUs />;\n};\n\nexport default Home;\n","export default __webpack_public_path__ + \"static/media/about-us-timeline.ddb92063.png\";","/* eslint-disable react-hooks/rules-of-hooks */\n/* eslint-disable react/no-this-in-sfc */\n/* eslint-disable react/destructuring-assignment */\n/* eslint-disable jsx-a11y/media-has-caption */\nimport React, { useContext, useEffect, useMemo, useRef, useState } from 'react';\nimport intl from 'react-intl-universal';\nimport { AppConsumer } from '../../context/AppContext';\nimport { isCNMode } from '../../utils/helpers';\n// const bg_video = require('../../assets/about-us/bg-all.mp4');\n// import bgtime from '../../assets/about-us/bg-time.png';\nimport './PCAbout-us.scss';\nimport { useHashScroll, VoiceContext } from '../../utils/effects';\nimport { LazyComponent } from '../../utils/decorators';\nimport timeLineImg from '../../assets/about-us/about-us-timeline.png';\nimport { VideoVoiceButton } from '../../components/Video';\n\nfunction Video() {\n  return (\n    <video loop muted autoPlay id=\"kuaishou-video\">\n      <source\n        src=\"https://static.yximgs.com/udata/pkg/EE-PA-PUBLIC/english-website/home-video.v1.mp4\"\n        type=\"video/mp4\"\n      />\n      Sorry, your browser does not support embedded video.\n    </video>\n  );\n}\n\nconst aboutBanner = () => {\n  // const ref = useRef<HTMLVideoElement | null>(null);\n\n  const [windowHeight, setWindowHeight] = useState(window.innerHeight);\n\n  // 自适应浏览器的高度\n  const handleSize = () => {\n    if (window.innerHeight > 900) {\n      setWindowHeight(window.innerHeight);\n    } else {\n      setWindowHeight(900);\n    }\n  };\n\n  useEffect(() => {\n    window.addEventListener('resize', handleSize);\n    return () => {\n      window.removeEventListener('resize', handleSize);\n    };\n  }, []);\n\n  return (\n    <div style={{ height: windowHeight, position: 'relative' }}>\n      <div className=\"video-wrap\">{Video()}</div>\n      <div className=\"banner-content\">\n        <h1>{intl.get('about-us.banner.title')}</h1>\n        <p>{intl.get('about-us.banner.p1')}</p>\n      </div>\n    </div>\n  );\n};\n\nconst PCAboutUs = () => {\nconst data = useRef<HTMLDivElement | null>(null);\nuseHashScroll();\n  useEffect(() => {\n    if(data.current) {\n      data.current.scrollLeft = data.current?.scrollWidth || 0;\n    }\n  }, []);\n  return (\n    <div className=\"about-us\">\n      {aboutBanner()}\n      <div className=\"about-us-company-overview\">\n        <div id=\"company-overview\" className=\"company-wrap\">\n          {LazyComponent(500, <div className=\"building\" />)}\n          <div className=\"company-overview-content\">\n            <h1>{intl.get('about-us.company-overview.title')}</h1>\n            <div className=\"decoration-border\" />\n            <p>{intl.get('about-us.company-overview.p1')}</p>\n            <p>{intl.get('about-us.company-overview.p2')}</p>\n          </div>\n        </div>\n      </div>\n      <div id=\"culture\" className=\"about-us-culture-and-values\">\n        <div className=\"culture-and-values-wrap\">\n          <div className=\"culture-and-values-content\">\n            <h1>{intl.get('about-us.culture-and-values.title')}</h1>\n            <div className=\"decoration-border\" />\n            <p>{intl.get('about-us.culture-and-values.p1')}</p>\n            <p>{intl.get('about-us.culture-and-values.p2')}</p>\n          </div>\n          {LazyComponent(500, <div className=\"culture\" />)}\n        </div>\n      </div>\n      <div id=\"leadership\" className=\"about-us-leadership\">\n        <div className=\"leadership-wrap\">\n          {LazyComponent(500, <div className=\"leader\" />)}\n          <div className=\"leadership-content\">\n            <h1>{intl.get('about-us.leadership.title')}</h1>\n            <div className=\"decoration-border\" />\n            <span className=\"suhua\">\n              <div className=\"leader-name\">Su Hua</div>\n              <p>{intl.get('about-us.leadership.su-hua')}</p>\n            </span>\n            <span className=\"chengyixiao\">\n              <div className=\"leader-name\">Cheng Yixiao</div>\n              <p>{intl.get('about-us.leadership.cheng-yixiao')}</p>\n              <p>{intl.get('about-us.leadership.cheng-yixiao-second')}</p>\n            </span>\n          </div>\n        </div>\n      </div>\n      <div id=\"milestones\" className=\"about-us-milestones\">\n        {LazyComponent(\n          500,\n          <div className=\"milestones-logo\">\n            <div className=\"milestones-content\">\n              <h1>{intl.get('about-us.milestones.title')}</h1>\n              <div className=\"decoration-border\" />\n            </div>\n          </div>\n        )}\n        {/* <div className=\"context-top\"> */}\n        {/*  <div className=\"p2011\">{intl.get(\"about-us.milestones.p2011\")}</div> */}\n        {/*  <div className=\"p2013\">{intl.get(\"about-us.milestones.p2013\")}</div> */}\n        {/*  <div className=\"p2017\">{intl.get(\"about-us.milestones.p2017\")}</div> */}\n        {/*  <div className=\"p2019\"> */}\n        {/*    <ul> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2019-1\")} */}\n        {/*      </li> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2019-2\")} */}\n        {/*      </li> */}\n        {/*    </ul> */}\n        {/*  </div> */}\n        {/*  <div className=\"p2021\"> */}\n        {/*    {intl.get(\"about-us.milestones.p2021\")} */}\n        {/*  </div> */}\n        {/* </div> */}\n        <div className=\"img-time\">\n          <div className=\"about-us-timeline\" id='time-line' ref={data}>\n              <img className=\"img-time-img\" src={timeLineImg} alt=\"\" />\n          </div>\n          {/* <div className=\"gray-border\" /> */}\n        </div>\n        {/* <div className=\"context-bottom\"> */}\n        {/*  <div className=\"p2012\">{intl.get(\"about-us.milestones.p2012\")}</div> */}\n        {/*  <div className=\"p2016\">{intl.get(\"about-us.milestones.p2016\")}</div> */}\n        {/*  <div className=\"p2018\"> */}\n        {/*    <ul> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2018-1\")} */}\n        {/*      </li> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2018-2\")} */}\n        {/*      </li> */}\n        {/*    </ul> */}\n        {/*  </div> */}\n        {/*  <div className=\"p2020\"> */}\n        {/*    <ul> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2020-1\")} */}\n        {/*      </li> */}\n        {/*      <li> */}\n        {/*        <div className=\"marker\" /> */}\n        {/*        {intl.get(\"about-us.milestones.p2020-2\")} */}\n        {/*      </li> */}\n        {/*    </ul> */}\n        {/*  </div> */}\n        {/* </div> */}\n      </div>\n    </div>\n  );\n};\n\nexport default AppConsumer(PCAboutUs);\n","/* eslint-disable import/no-duplicates */\nimport React, { useEffect } from 'react';\nimport { useHistory } from 'react-router-dom';\n\nexport const scrollToAnchor = (locationHash) => {\n  const hashParts = locationHash.split('#');\n  if (hashParts.length >= 2) {\n    const hash = hashParts.slice(-1)[0];\n    const ele = document.querySelector(`#${hash}`);\n    // eslint-disable-next-line no-unused-expressions\n    if (ele) {\n      return ele.scrollIntoView();\n    }\n  }\n\n  // 默认情况下滚动到页面顶部\n  return window.scrollTo(0, 0);\n};\n\nexport function useHashScroll() {\n  const history = useHistory();\n  // 如果没有切页面，只是hash变化，页面不会重新渲染\n  useEffect(() => {\n    scrollToAnchor(history.location.hash);\n  }, [history.location.hash]);\n\n  // 如果切了页面，需要等待元素渲染结束，图片加载完成\n  useEffect(() => {\n    setTimeout(() => {\n      scrollToAnchor(history.location.hash);\n    }, 100);\n  }, [history]);\n}\n\ninterface IProps {\n  voice: boolean;\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  toggleVoice: any;\n}\n\nexport const VoiceContext = React.createContext<Partial<IProps>>({\n  voice: true,\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  toggleVoice: () => {}\n});\n"],"sourceRoot":""}