RouteContainer.jsx 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. import {ROUTE_TYPE_FULL, ROUTE_TYPE_IN, ROUTE_TYPE_POP, ROUTE_TYPE_POP_OR_FULL,ROUTE_TYPE_CUSTOM} from "@constants/routes";
  2. import React, {cloneElement} from "react";
  3. import Popup from "@components/Popup";
  4. import SubScreen from "@components/SubScreen";
  5. import {useNavigate} from "react-router-dom";
  6. import {useThemeProvider} from "@contexts/themeContext";
  7. const RouteContainer=(props)=>{
  8. const { children, route,open} = props;
  9. const navigate = useNavigate()
  10. const {isMobile} = useThemeProvider();
  11. const renderIn=()=>{
  12. return (
  13. <>
  14. {children}
  15. </>
  16. );
  17. }
  18. const renderPop=()=>{
  19. return(
  20. <Popup {...props} popupClass={`${isMobile()?'':'popup-big'}`}>
  21. {children}
  22. </Popup>
  23. )
  24. }
  25. const renderSub=()=>{
  26. return (
  27. <SubScreen {...props}>
  28. {children}
  29. </SubScreen>
  30. )
  31. }
  32. const renderPopOrFull=()=>{
  33. return (
  34. <>
  35. {
  36. isMobile()?renderSub():renderPop()
  37. }
  38. </>
  39. )
  40. }
  41. const renderCustom=()=>{
  42. return (
  43. <>
  44. {children}
  45. </>
  46. );
  47. }
  48. const renderComp=()=>{
  49. let comp=(<></>);
  50. if (route.type===ROUTE_TYPE_FULL||route.type===ROUTE_TYPE_IN){
  51. comp=renderIn();
  52. }
  53. else if (route.type===ROUTE_TYPE_POP_OR_FULL){
  54. comp=renderPopOrFull();
  55. }
  56. else if (route.type===ROUTE_TYPE_POP){
  57. comp=renderPop();
  58. }
  59. else if (route.type===ROUTE_TYPE_CUSTOM){
  60. comp=renderCustom();
  61. }
  62. return comp;
  63. }
  64. return (
  65. renderComp()
  66. );
  67. }
  68. export default RouteContainer;