no message

.env

@@ -0,0 +1 @@
+GENERATE_SOURCEMAP = false

src/components/GameItem/index.jsx

@@ -7,7 +7,7 @@ import {ROUTE_PATH} from "@constants/routes";
 import {localStorageSet} from "@utils/helpers";
 import {LOCAL_GAME_URL} from "@constants/localkey";
 
-const GameItem=({data})=>{
+const GameItem=({data,index,onClickItem,...props})=>{
     const navigate=useNavigate();
     const renderOlicon=()=>{
         return (
@@ -30,38 +30,51 @@ const GameItem=({data})=>{
         global.authLockPath=path;
         navigate(path);
     }
-    //to={ROUTE_PATH.GAME+"/"+data.id+"?url="+data.link}
+    // return (
+    //     <div className={styles.grid_item}>
+    //         <button onClick={()=>{
+    //             onEnterGame();
+    //         }} className={styles.game_img_wrap}>
+    //             <LazyLoadImage
+    //                 src={data.img}
+    //                 alt={"game-icon"}
+    //                 effect={"blur"}
+    //                 wrapperClassName={`lazy-image ${styles.game_img}`}
+    //             />
+    //             <div className={styles.online}>
+    //                 {
+    //                     renderOlicon()
+    //                 }
+    //                 <span>{formatNum(data.online)}</span>
+    //             </div>
+    //         </button>
+    //         <div className={styles.bot_info}>
+    //             <div className={styles.game_tit}>
+    //                 <NavLink className={styles.game_desc}>
+    //                     {data.brand}
+    //                 </NavLink>
+    //                 <button>
+    //                     <svg className={`${styles.game_desc_icon}`}>
+    //                         <use xlinkHref={`${symbol}#icon_Inform`} />
+    //                     </svg>
+    //                 </button>
+    //             </div>
+    //         </div>
+    //     </div>
+    // )
     return (
-        <div className={styles.grid_item}>
-            {/*<NavLink to={data.link} className={styles.game_img_wrap}>*/}
-            <button onClick={()=>{
-                onEnterGame();
-            }} className={styles.game_img_wrap}>
+        <div className={`${styles.grid_item}`} {...props}>
+            <button className={styles.game_img_wrap} onClick={(e)=>{
+                // onEnterGame();
+                if (onClickItem)onClickItem(e,index);
+            }}>
                 <LazyLoadImage
                     src={data.img}
                     alt={"game-icon"}
                     effect={"blur"}
                     wrapperClassName={`lazy-image ${styles.game_img}`}
                 />
-                <div className={styles.online}>
-                    {
-                        renderOlicon()
-                    }
-                    <span>{formatNum(data.online)}</span>
-                </div>
             </button>
-            <div className={styles.bot_info}>
-                <div className={styles.game_tit}>
-                    <NavLink className={styles.game_desc}>
-                        {data.brand}
-                    </NavLink>
-                    <button>
-                        <svg className={`${styles.game_desc_icon}`}>
-                            <use xlinkHref={`${symbol}#icon_Inform`} />
-                        </svg>
-                    </button>
-                </div>
-            </div>
         </div>
     )
 }

src/components/GameItem/styles.module.scss

@@ -4,21 +4,26 @@
   justify-content: space-between;
   scroll-snap-align: start;
   width: 100%;
-  background-color: var(--widget-grid-bg);
-  border-radius: var(--border-radius);
+  //border-radius: var(--border-radius);
+  transition: all var(--transition);
   & .game_img_wrap{
+    display: flex;
+    flex-direction: column;
     width: 100%;
-    display: block;
+    //display: block;
     position: relative;
+    background-color: var(--widget-grid-bg);
+    border-radius: 0.8rem;
     & .game_img{
       position: relative;
       width: 100%;
-      aspect-ratio:1;
+      aspect-ratio:384/516;
       img{
         width: 100%;
         height: 100%;
-        border-top-left-radius: var(--border-radius);
-        border-top-right-radius: var(--border-radius);
+        //height: auto;
+        //border-top-left-radius: var(--border-radius);
+        //border-top-right-radius: var(--border-radius);
       }
     }
     & .online{

src/components/GameList/index.jsx

@@ -1,5 +1,5 @@
 import styles from "@components/GameList/styles.module.scss";
-import React from "react";
+import React, {useEffect, useState} from "react";
 import GameItem from "@components/GameItem";
 import {REQ_STATUS} from "@api/config";
 import SmallLoading from "@components/SmallLoading";
@@ -70,15 +70,48 @@ const GameList=({data,status,reqMore})=>{
     //         },
     //     ]
     // }
+    const [selected,setSelected]=useState(-1);
+    const getColNum=()=>{
+        let num=3;
+        let gamelist=document.querySelector('#gameList');
+        if(gamelist){
+            let style=window.getComputedStyle(gamelist);
+            if (style!=null){
+                let columns=style["grid-template-columns"];
+                let arr=columns.split(" ");
+                num=arr.length;
+            }
+        }
+        return num;
+    }
+    const handleSelect=(e,i)=>{
+        setSelected(i);
+    }
     const renderGameList=()=>{
         let list=data.data;
         if (list==null)list=[];
         return (
-            <div className={styles.game_list}>
+            <div id={"gameList"} className={styles.game_list}>
                 {
                     list.map((item,index)=>{
+                        let itemStyle={}
+                        if (selected!==-1){
+                            if (index!==selected){
+                                itemStyle.filter="brightness(60%)"
+                            }
+                            else
+                            {
+                                itemStyle.transform="scale(1.05)";
+                            }
+                            let col=getColNum();
+                            let s_row=Math.floor(selected/col);
+                            let row=Math.floor(index/col);
+                            if (s_row===row){
+                                itemStyle.marginBottom="100px";
+                            }
+                        }
                         return (
-                            <GameItem key={index} data={item}></GameItem>
+                            <GameItem style={itemStyle} key={index} data={item} index={index} onClickItem={handleSelect}></GameItem>
                         )
                     })
                 }

src/widgets/WGame/index.jsx

@@ -45,6 +45,9 @@ const WGame=()=>{
             else if (data.cmd==="fullScreen"){
                 openFullScreen();
             }
+            else if (data.cmd==="closeLoading"){
+                setIsGameLoad(true);
+            }
         }
     }
     const parseURL=()=>{