no message

src/api/config.js

@@ -9,5 +9,8 @@ export const REQ_STATUS={
 // export const BASE_API="https://api.24680.com/";
 export const BASE_API="https://api.ouro777.com/";
 // export const APP_ROUTES="routes";
+//路由
 export const APP_ROUTES="game/routes";
+//page 模块
+export const APP_PAGE_MODULES="game/pageModules";
 

src/app/store.js

@@ -1,10 +1,12 @@
 import {configureStore} from '@reduxjs/toolkit';
 import TodosReducer from '../features/todos/todosSlice';
 import MainReducer from '@features/mainSlice';
+import PageReducer from '@features/pageSlice';
 
 export default configureStore({
     reducer: {
         todos: TodosReducer,
         main:MainReducer,
+        page:PageReducer
     }
 });

src/components/AutoBanner/styles.module.scss

@@ -1,5 +1,4 @@
 .banner_container{
-  margin-top: 1rem;
   @media screen and (max-width: 621px) {
     margin-top: 0rem;
   }

src/components/AutoWinList/index.jsx

@@ -24,86 +24,86 @@ const AutoWinList=({data})=>{
     const navigate=useNavigate();
     const lvicon=[lv_1,lv_2,lv_3];
     if (data==null)data={};
-    data={
-        title:"win_list.big_wins",
-        tabs:[
-            {type:0,title:'win_list.tab_all'},
-            {type:1,title:'win_list.tab_slots'},
-        ],
-        list:[
-            {
-                img:'https://bc.imgix.net/game/image/e64b58eb7f.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'xllsdfag',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/eef9a463-c2e9-416a-9922-4ccd65e4898f.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/8eb116c0-8c55-4016-9d50-683c444666bf.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/898a5bb528.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },
-            {
-                img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            },{
-                img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
-                gtype:'1',
-                uid:'1234567',
-                nick:'XDFLASKDJGLA',
-                lv:1,
-                win:79893
-            }
-        ]
-    }
+    // data={
+    //     title:"win_list.big_wins",
+    //     tabs:[
+    //         {type:0,title:'win_list.tab_all'},
+    //         {type:1,title:'win_list.tab_slots'},
+    //     ],
+    //     list:[
+    //         {
+    //             img:'https://bc.imgix.net/game/image/e64b58eb7f.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'xllsdfag',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/eef9a463-c2e9-416a-9922-4ccd65e4898f.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/8eb116c0-8c55-4016-9d50-683c444666bf.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/898a5bb528.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },
+    //         {
+    //             img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         },{
+    //             img:'https://bc.imgix.net/game/image/f7274b14-e905-4daf-a0c3-4be958022190.png?auto=format&dpr=2&w=200',
+    //             gtype:'1',
+    //             uid:'1234567',
+    //             nick:'XDFLASKDJGLA',
+    //             lv:1,
+    //             win:79893
+    //         }
+    //     ]
+    // }
     const renderTitle=()=>{
         return (
             <p className={styles.list_title}>
@@ -136,7 +136,7 @@ const AutoWinList=({data})=>{
     }
     const getAutoList=()=>{
         let list=[];
-        let all=data.list;
+        let all=data.data;
         if (all!=null){
             if (currIndex==0)list=all.slice(0);
             else
@@ -262,7 +262,7 @@ const AutoWinList=({data})=>{
         }
     }, [swiper]);
     const renderVAuto=()=>{
-        let all=data.list;
+        let all=data.data;
         let list=all==null?[]:all.slice(0);
         return(
             <>

src/components/GameItem/styles.module.scss

@@ -1,4 +1,7 @@
 .grid_item{
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
   scroll-snap-align: start;
   width: 100%;
   background-color: var(--widget-grid-bg);
@@ -9,6 +12,8 @@
     position: relative;
     & .game_img{
       position: relative;
+      width: 100%;
+      aspect-ratio:1;
       img{
         width: 100%;
         height: 100%;

src/components/GameList/index.jsx

@@ -3,71 +3,71 @@ import React from "react";
 import GameItem from "@components/GameItem";
 const i18n =global.i18n;
 const GameList=({data})=>{
-    data={
-        type:0,//游戏分类
-        page:1,
-        pageSize:40,
-        total:42,
-        totalPage:1,
-        data:[
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:1006,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-        ]
-    }
+    // data={
+    //     type:0,//游戏分类
+    //     page:1,
+    //     pageSize:40,
+    //     total:42,
+    //     totalPage:1,
+    //     data:[
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:1006,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //     ]
+    // }
     const renderGameList=()=>{
         let list=data.data;
         if (list==null)list=[];

src/components/GameSmallList/index.jsx

@@ -12,68 +12,68 @@ const GameSmallList=({data})=>{
     const gridListRef=useRef(null);
     //0 滚动条顶部 1滚动条中间 2滚动条底部
     const [pageState, setPageState] = useState(0);
-    data={
-        title:"BC Originals",
-        data:[
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:1006,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-            {
-                gid:0,//gameid
-                img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
-                link:"",//跳转的链接
-                online:100,//游戏人数
-                desc:"BC Originals",//描述
-            },
-        ],
-        link:""//view all
-    }
+    // data={
+    //     title:"BC Originals",
+    //     data:[
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:1006,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/f76d3f4a-9712-4bd1-9426-f3ab7069b6a2.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/ff0b0511-1f48-43d1-8dd3-294bb6437b4b.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/d33b3fad-b6df-450b-bd85-528a17383043.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //         {
+    //             gid:0,//gameid
+    //             img:"https://bc.imgix.net/game/image/5b3a4099-9462-4d3c-a854-ade78aad0d60.png?auto=format&dpr=3&w=200",//图片
+    //             link:"",//跳转的链接
+    //             online:100,//游戏人数
+    //             desc:"BC Originals",//描述
+    //         },
+    //     ],
+    //     link:""//view all
+    // }
     let list=data.data;
     if (list==null)list=[];
     const handleScroll=()=>{

src/components/GameTabs/index.jsx

@@ -1,23 +1,24 @@
 import styles from "@components/GameTabs/styles.module.scss";
-import React, {useState} from "react";
+import React, {Fragment, useState} from "react";
 import symbol from '@assets/symbol-defs.svg';
+import AllWidgets from "@widgets/index";
 
 const GameTabs=({data})=>{
-    const [tabIndex, setTabIndex] = useState(0);
-    data={
-        tabs:[
-            {type:0,title:'Lobby',icon:'icon_Lobby'},
-            {type:1,title:'Top Picks',icon: 'icon_ClassicDice'},
-            {type:2,title:'Slots',icon: 'icon_Slots'},
-            {type:3,title:'Hot Games',icon: 'icon_HotGame'},
-            {type:4,title:'Live Casino',icon: 'icon_LiveCasino'},
-            {type:5,title:'Table Games',icon: 'icon_TableGame'},
-            {type:6,title:'New Releases',icon: 'icon_NewReleases'},
-        ],
-        data:{
-
-        }
-    }
+    const [tabIndex, setTabIndex] = useState(1);
+    // data={
+    //     tabs:[
+    //         {type:0,title:'Lobby',icon:'icon_Lobby'},
+    //         {type:1,title:'Top Picks',icon: 'icon_ClassicDice'},
+    //         {type:2,title:'Slots',icon: 'icon_Slots'},
+    //         {type:3,title:'Hot Games',icon: 'icon_HotGame'},
+    //         {type:4,title:'Live Casino',icon: 'icon_LiveCasino'},
+    //         {type:5,title:'Table Games',icon: 'icon_TableGame'},
+    //         {type:6,title:'New Releases',icon: 'icon_NewReleases'},
+    //     ],
+    //     data:{
+    //
+    //     }
+    // }
     const changeTab=(tabIndex)=>{
         setTabIndex(tabIndex);
     }
@@ -30,8 +31,8 @@ const GameTabs=({data})=>{
                     tabs.map((item,index)=>{
                         return (
                             <button key={index} onClick={()=>{
-                                changeTab(item.type);
-                            }} className={`${styles.tab_item} ${item.type==tabIndex?styles.active:''}`}>
+                                changeTab(item.tabtype);
+                            }} className={`${styles.tab_item} ${item.tabtype==tabIndex?styles.active:''}`}>
                                 <svg className={styles.icon}>
                                     <use xlinkHref={`${symbol}#${item.icon}`} />
                                 </svg>
@@ -43,9 +44,41 @@ const GameTabs=({data})=>{
             </div>
         )
     }
+    const getModules=()=>{
+        let modules=data.data;
+        let list=[];
+        if (modules){
+            for (let i = 0; i < modules.length; i++) {
+                let item=modules[i];
+                if (item.tabtype===tabIndex){
+                    list.push(item);
+                }
+            }
+        }
+        return list;
+    }
+    const renderModule=()=>{
+        let list=getModules();
+        return (
+            <>
+                {
+                    list.map((item,index)=>{
+                        let Comp=AllWidgets[item.type];
+                        if (Comp==null)return (<></>);
+                        return (
+                            <Fragment key={index}>
+                                <Comp data={item}></Comp>
+                            </Fragment>
+                        )
+                    })
+                }
+            </>
+        )
+    }
     return (
-        <div className={`w-100 ${styles.container}`}>
+        <div className={`w-100 layout ${styles.container}`}>
             {renderTabs()}
+            {renderModule()}
         </div>
     )
 }

src/features/api.js

@@ -1,5 +1,5 @@
 import {createAsyncThunk} from "@reduxjs/toolkit";
-import {APP_ROUTES, REQ_STATUS} from "@api/config";
+import {APP_PAGE_MODULES, APP_ROUTES, REQ_STATUS} from "@api/config";
 import Http from "@api/request";
 
 export const buildReqReducer=(builder,thunk,callback)=>{
@@ -28,4 +28,13 @@ export const reqGetRoutes = createAsyncThunk(
         return response;
     },
 )
+//page 信息 pageID 为路由ID
+export const reqPageModules=createAsyncThunk(
+    APP_PAGE_MODULES,
+    async (pageID,thunkAPI) => {
+        const response = await Http.get({url:APP_PAGE_MODULES+"/"+pageID});
+        if (response)response.pageID=pageID;
+        return response;
+    },
+)
 //api

src/features/pageSlice.js

@@ -0,0 +1,34 @@
+import {createSlice} from "@reduxjs/toolkit";
+import {REQ_STATUS} from "@api/config";
+import {buildReqReducer, reqPageModules} from "@features/api";
+import {routesMap} from "@features/mainSlice";
+const reducerPage=(state,action)=>{
+    let json=action.payload;
+    if (json&&json.code===0){
+        let data=json.data==null?[]:json.data;
+        state.pageData[json.pageID]=data;
+    }
+}
+export const Page=createSlice({
+    name: 'page',
+    initialState: {
+        status:REQ_STATUS.NONE,
+        pageData:{}
+    },
+    reducers: {
+    },
+    extraReducers: (builder) => {
+        buildReqReducer(builder,reqPageModules,reducerPage);
+    },
+})
+export const {} = Page.actions;
+export const getFetchStatus=(state)=>{
+    return state.page.status;
+}
+export const getModules=(pageID)=>(state)=>{
+    let pageData=state.page.pageData;
+    if (pageData==null)return [];
+    return pageData[pageID];
+}
+export default Page.reducer;
+

src/layout/Routes/RouteWrapper.jsx

@@ -13,7 +13,7 @@ const RouteWrapper = (props) => {
         return (
             <>
                 {
-                    isexit?<Comp />:<></>
+                    isexit?<Comp pageID={route.id} />:<></>
                 }
             </>
         );
@@ -25,7 +25,7 @@ const RouteWrapper = (props) => {
         let comp=(<></>);
         if (Comp!=null)comp=Comp;
         return(
-            <Popup open={true} onClose={handleClose}>
+            <Popup pageID={route.id} open={true} onClose={handleClose}>
                 <div className="pop_content">
                     {comp}
                 </div>

src/layout/Routes/index.jsx

@@ -7,7 +7,8 @@ const PageNotFound = lazy(() => import('@pages/PageNotFound'));
 
 const createRoute=(props)=>{
     const {route,basePath}=props;
-    const Component = route.component && AllComponents[route.component];
+    const component=(route.component!=null&&route.component!="")?route.component:"ModulePage";
+    const Component = AllComponents[component];
     const checkLogin=()=>{
         return (
             <RouteWrapper {...{ ...props, Comp: Component, route: route }}  />

src/pages/ModulePage.jsx

@@ -0,0 +1,10 @@
+import ModuleGroup from "@widgets/ModuleGroup";
+const ModulePage=({pageID})=>{
+
+    return (
+      <>
+          <ModuleGroup pageID={pageID} />
+      </>
+    );
+}
+export default ModulePage;

src/pages/index.jsx

@@ -1,6 +1,7 @@
 import {lazy} from "react";
-
+const ModulePage=lazy(()=>import('@pages/ModulePage'));
 const Home=lazy(()=>import('@pages/Home'));
 export default {
+    ModulePage:ModulePage,
     Home:Home,
 }

src/widgets/AutoBigWin/index.jsx

@@ -3,11 +3,34 @@ import Spring from "@components/Spring";
 import AutoWinList from "@components/AutoWinList";
 import {useThemeProvider} from "@contexts/themeContext";
 
-const AutoBigWin=()=>{
+const AutoBigWin=({data})=>{
     const {isMobile} = useThemeProvider();
+    const cdata=Object.assign({tabs:[]},data);
+    const formatData=()=>{
+        if (cdata){
+            if (cdata.title==null)cdata.title="win_list.big_wins";
+            let tabs=cdata.tabs;
+            if (tabs){
+                let isexit=false;
+                for (var i=0;i<tabs.length;i++){
+                    let tab=tabs[i];
+                    if (tab&&tab.type===0){
+                        isexit=true;
+                        break;
+                    }
+                }
+                if (!isexit){
+                    tabs=tabs.slice(0);
+                    tabs.unshift({type:0,title:'win_list.tab_all'});
+                    cdata.tabs=tabs;
+                }
+            }
+        }
+    }
+    formatData();
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
-            <AutoWinList data={{}}></AutoWinList>
+        <div className={``}>
+            <AutoWinList data={cdata}></AutoWinList>
         </div>
     )
 }

src/widgets/Banner/index.jsx

@@ -6,83 +6,54 @@ import React from "react";
 import ColorCard from "@components/ColorCards/ColorCard";
 import ColorCardsGrid from "@components/ColorCards/ColorCardsGrid";
 
-const Banner=()=>{
+const Banner=({data})=>{
     const {isMobile} = useThemeProvider();
-    const testdata=[
-        {
-            img:'http://localhost:3000/banner/1.png',
-            alt:'1',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/2.png',
-            alt:'2',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/3.png',
-            alt:'3',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/4.png',
-            alt:'4',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/1.png',
-            alt:'1',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/2.png',
-            alt:'2',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/3.png',
-            alt:'3',
-            link:'http://localhost:3000/'
-        },
-        {
-            img:'http://localhost:3000/banner/4.png',
-            alt:'4',
-            link:'http://localhost:3000/'
-        }
-    ];
-    const Test=()=>{
-        var jsonUrl = 'test/skeleton.json';
-        var atlasUrl = 'test/skeleton.atlas';
-
-
-        setTimeout(()=>{
-            var player=new SpinePlayer("aztec", {
-                jsonUrl: jsonUrl,
-                atlasUrl: atlasUrl,
-                animation: 'A',
-                premultipliedAlpha: false,
-                // backgroundColor: 'rgba(241,118,118,0.71)',
-                showControls: false,
-                viewport: {
-                    debugRender: false,
-                    width:10,
-                    height:10,
-                },
-                alpha:true,
-                // showControls: true,
-            });
-        },1000);
-        // return <div id="container-aztec"></div>;
-        // return (<div id="container-aztec"></div>);
-        return (
-            <div id={"aztec"} style={{width:'50px',height:'50px'}}>
-
-            </div>
-        )
-    }
+    const list=data.data?data.data:[];
+    // const testdata=[
+    //     {
+    //         img:'http://localhost:3000/banner/1.png',
+    //         alt:'1',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/2.png',
+    //         alt:'2',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/3.png',
+    //         alt:'3',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/4.png',
+    //         alt:'4',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/1.png',
+    //         alt:'1',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/2.png',
+    //         alt:'2',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/3.png',
+    //         alt:'3',
+    //         link:'http://localhost:3000/'
+    //     },
+    //     {
+    //         img:'http://localhost:3000/banner/4.png',
+    //         alt:'4',
+    //         link:'http://localhost:3000/'
+    //     }
+    // ];
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
-            <AutoBanner data={testdata}>
+        <div className={``}>
+            <AutoBanner data={list}>
 
             </AutoBanner>
             {/*<Test></Test>*/}

src/widgets/ModuleGameList/index.jsx

@@ -2,11 +2,11 @@ import React from "react";
 import GameList from "@components/GameList";
 import {useThemeProvider} from "@contexts/themeContext";
 
-const ModuleGameList=()=>{
+const ModuleGameList=({data})=>{
     const {isMobile} = useThemeProvider();
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
-            <GameList>
+        <div className={``}>
+            <GameList data={data}>
 
             </GameList>
         </div>

src/widgets/ModuleGameSearch/index.jsx

@@ -5,7 +5,7 @@ import GameSearch from "@components/GameSearch";
 const ModuleGameSearch=()=>{
     const {isMobile} = useThemeProvider();
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
+        <div className={``}>
             <GameSearch>
 
             </GameSearch>

src/widgets/ModuleGameSmallList/index.jsx

@@ -2,11 +2,11 @@ import React from "react";
 import GameSmallList from "@components/GameSmallList";
 import {useThemeProvider} from "@contexts/themeContext";
 
-const ModuleGameSmallList=()=>{
+const ModuleGameSmallList=({data})=>{
     const {isMobile} = useThemeProvider();
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
-            <GameSmallList>
+        <div className={``}>
+            <GameSmallList data={data}>
 
             </GameSmallList>
         </div>

src/widgets/ModuleGameTabs/index.jsx

@@ -2,11 +2,32 @@ import {useThemeProvider} from "@contexts/themeContext";
 import React from "react";
 import GameTabs from "@components/GameTabs";
 
-const ModuleGameTabs=()=>{
+const ModuleGameTabs=({data})=>{
     const {isMobile} = useThemeProvider();
+    if (data==null)data={data:[]}
+    const tabdata={};
+    const parseTabs=()=>{
+        let tabs=[];
+        let items=data.data;
+        if (items){
+            let temp={};
+            for (let i = 0; i < items.length; i++) {
+                let item=items[i];
+                if (item){
+                    let tabtype=item.tabtype;
+                    if (temp[tabtype])continue;
+                    tabs.push({tabtype:tabtype,title:item.title,icon:item.icon});
+                    temp[tabtype]=true;
+                }
+            }
+        }
+        tabdata.tabs=tabs;
+        tabdata.data=items;
+    }
+    parseTabs();
     return (
-        <div className={`${isMobile()?'':'page-max-width-wrap'}`}>
-            <GameTabs>
+        <div className={``}>
+            <GameTabs data={tabdata}>
 
             </GameTabs>
         </div>

src/widgets/ModuleGroup/index.jsx

@@ -0,0 +1,53 @@
+import {useDispatch, useSelector} from "react-redux";
+import {getFetchStatus, getModules} from "@features/pageSlice";
+import {useThemeProvider} from "@contexts/themeContext";
+import {Fragment, Suspense, useEffect} from "react";
+import {reqPageModules} from "@features/api";
+import {REQ_STATUS} from "@api/config";
+import LoadingScreen from "@components/LoadingScreen";
+import AllWidgets from "@widgets/index";
+import styles from "./styles.module.scss";
+
+const ModuleGroup=({pageID})=>{
+    const dispatch = useDispatch();
+    const status=useSelector(getFetchStatus);
+    const modules=useSelector(getModules(pageID));
+    const {isMobile} = useThemeProvider();
+    useEffect(() => {
+        dispatch(reqPageModules(pageID));
+    }, [pageID]);
+    const renderModules=()=>{
+        if (status===REQ_STATUS.IDLE){
+            if (modules==null)return (<></>)
+            return (
+                <Suspense fallback={<LoadingScreen />}>
+                    <div className={`${styles.container} ${isMobile()?'':'page-max-width-wrap'}`}>
+                        {
+                            modules.map((item,index)=>{
+                                let Comp=AllWidgets[item.type];
+                                if (Comp==null)return (<></>);
+                                return (
+                                    <Fragment key={index}>
+                                        <Comp data={item}></Comp>
+                                    </Fragment>
+                                )
+                            })
+                        }
+                    </div>
+                </Suspense>
+            )
+        }
+        else
+        {
+            return (<LoadingScreen />)
+        }
+    }
+    return (
+        <>
+            {
+                renderModules()
+            }
+        </>
+    );
+}
+export default ModuleGroup;

src/widgets/ModuleGroup/styles.module.scss

@@ -0,0 +1,7 @@
+.container{
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  margin-top:1.25rem;
+  margin-bottom: 2rem;
+}

src/widgets/index.jsx

@@ -0,0 +1,16 @@
+import {lazy} from "react";
+const Banner=lazy(()=>import('@widgets/Banner'));
+const ModuleWinList=lazy(()=>import('@widgets/AutoBigWin'));
+const ModuleSearch=lazy(()=>import('@widgets/ModuleGameSearch'));
+const ModuleGameTabs=lazy(()=>import('@widgets/ModuleGameTabs'));
+const ModuleSmallGameList=lazy(()=>import('@widgets/ModuleGameSmallList'));
+const ModuleGameList=lazy(()=>import('@widgets/ModuleGameList'));
+
+export default {
+    ModuleAutoBanner:Banner,
+    ModuleWinList:ModuleWinList,
+    ModuleSearch:ModuleSearch,
+    ModuleGameTabs:ModuleGameTabs,
+    ModuleSmallGameList:ModuleSmallGameList,
+    ModuleGameList:ModuleGameList
+}