zhejiushizhuce 2 år sedan
förälder
incheckning
8024455530

+ 1 - 1
package.json

@@ -20,7 +20,6 @@
     "@emotion/cache": "^11.10.5",
     "@emotion/react": "^11.10.6",
     "@emotion/styled": "^11.10.5",
-    "@esotericsoftware/spine-player": "^4.2.35",
     "@loadable/component": "^5.15.3",
     "@mui/base": "^5.0.0-beta.19",
     "@mui/material": "^5.11.4",
@@ -35,6 +34,7 @@
     "craco": "^0.0.3",
     "dayjs": "^1.11.7",
     "gsap": "^3.12.5",
+    "http-proxy-middleware": "^3.0.0",
     "i18next": "^23.8.2",
     "i18next-browser-languagedetector": "^7.2.0",
     "lottie-react": "^2.4.0",

+ 29 - 3
src/api/request.js

@@ -2,16 +2,24 @@
 // Create axios instance
 import {BASE_API} from "./config";
 import axios from "axios";
+import {localStorageGet} from "@utils/helpers";
+import {LOCAL_SIGN} from "@constants/localkey";
 
+// axios.defaults.withCredentials = true
+const getSign=()=>{
+    const sign=localStorageGet(LOCAL_SIGN,"");
+    return sign;
+}
 const service = axios.create({
     baseURL: BASE_API,
-    // withCredentials: true,
+    withCredentials: true,
     timeout: 10000, // Request timeout
 });
 
 // Request intercepter
 service.interceptors.request.use(
     config => {
+        // console.log(config);
         return config;
     },
     error => {
@@ -24,7 +32,7 @@ service.interceptors.request.use(
 // response pre-processing
 service.interceptors.response.use(
     response => {
-
+        // console.log(response);
         return response.data;
     },
     error => {
@@ -37,25 +45,43 @@ service.interceptors.response.use(
 
 
 const get=(params={})=>{
+    let sign=getSign();
+    if (sign!=null&&sign!=""){
+        let url=params.url;
+        if (url.indexOf("?")===-1)url=url+"?sign="+getSign();
+        else url=url+"&sign="+getSign();
+        params.url=url;
+    }
     return service({
         method: 'get',
         ...params
     });
 }
 const post=(params={})=>{
-
+    let sign=getSign();
+    if (sign!=null&&sign!=""){
+        params.sign=getSign();
+    }
     return service({
         method: 'post',
         ...params
     });
 }
 const put=(params={})=>{
+    let sign=getSign();
+    if (sign!=null&&sign!=""){
+        params.sign=getSign();
+    }
     return service({
         method: 'put',
         ...params
     });
 }
 const adelete=(params={})=>{
+    let sign=getSign();
+    if (sign!=null&&sign!=""){
+        params.sign=getSign();
+    }
     return service({
         method: 'delete',
         ...params

+ 2 - 1
src/constants/localkey.js

@@ -1,4 +1,5 @@
 const BASE="SG_";
 const LOCAL_USER_INFO="USER_INFO";
 const LOCAL_IS_LOGIN="IS_LOGIN";
-export {LOCAL_USER_INFO,LOCAL_IS_LOGIN};
+const LOCAL_SIGN="G_SIGN";
+export {LOCAL_USER_INFO,LOCAL_IS_LOGIN,LOCAL_SIGN};

+ 1 - 0
src/features/api.js

@@ -81,6 +81,7 @@ export const reqLogin=createAsyncThunk(
             data:data
         }
         const response = await Http.post(params);
+        // const response = await Http.get(params);
         return response;
     },
 )

+ 25 - 10
src/features/mainSlice.js

@@ -11,7 +11,7 @@ import {REQ_STATUS} from "@api/config";
 import {buildReqReducer, reqGetRoutes, reqLogin, reqLogout, reqRegister} from "@features/api";
 import {toast} from 'react-toastify';
 import {localStorageGet, localStorageSet} from "@utils/helpers";
-import {LOCAL_IS_LOGIN, LOCAL_USER_INFO} from "@constants/localkey";
+import {LOCAL_IS_LOGIN, LOCAL_SIGN, LOCAL_USER_INFO} from "@constants/localkey";
 const i18n=global.i18n;
 const generateNavs=(routes)=>{
     const navs=[];
@@ -118,7 +118,16 @@ const reducerRoutes=(state,action)=>{
         let generData=generateRoutes(state.routes,data);
         let styles=parseStyles(json.styles);
         let blocks=parseBlocks(json.blocks);
-        Object.assign(state, {routes:state.routes,asyncRoutes:data,styles:styles,blocks:blocks,...generData});
+        let user=json.user;
+        let isLogin=0;
+        let userInfo={};
+        if (user){
+            if (typeof user=="object"){
+                isLogin=1;
+                userInfo=user;
+            }
+        }
+        Object.assign(state, {routes:state.routes,asyncRoutes:data,styles:styles,blocks:blocks,...generData,isLogin:isLogin,userInfo:userInfo});
     }
 }
 const routesStatus=(state,status,arg)=>{
@@ -159,8 +168,10 @@ const parseLogin=(state,action,arg)=>{
         let data=payload.data;
         state.userInfo=data;
         state.isLogin=1;
-        localStorageSet(LOCAL_USER_INFO,JSON.stringify(data));
-        localStorageSet(LOCAL_IS_LOGIN,1);
+        // localStorageSet(LOCAL_USER_INFO,JSON.stringify(data));
+        // localStorageSet(LOCAL_IS_LOGIN,1);
+        let sign=data.sign;
+        if (sign!=null)localStorageSet(LOCAL_SIGN,sign);
         toast.success(msg);
     }
     else
@@ -190,8 +201,9 @@ const reducerLogout=(state,action,arg)=>{
     if (code==200){
         state.userInfo={};
         state.isLogin=0;
-        localStorageSet(LOCAL_USER_INFO,"");
-        localStorageSet(LOCAL_IS_LOGIN,0);
+        localStorageSet(LOCAL_SIGN,"");
+        // localStorageSet(LOCAL_USER_INFO,"");
+        // localStorageSet(LOCAL_IS_LOGIN,0);
         toast.success(msg);
     }
     else
@@ -217,15 +229,15 @@ export const Main=createSlice({
             register:REQ_STATUS.NONE,
             logout:REQ_STATUS.NONE,
         },
-        userInfo:getLocalUserInfo(),
-        isLogin:getLocalIsLogin()
+        userInfo: {},
+        isLogin:0
     },
     reducers: {
         logout:(state, action)=>{
             state.userInfo={};
             state.isLogin=0;
-            localStorageSet(LOCAL_USER_INFO,"");
-            localStorageSet(LOCAL_IS_LOGIN,0);
+            // localStorageSet(LOCAL_USER_INFO,"");
+            // localStorageSet(LOCAL_IS_LOGIN,0);
         }
     },
     extraReducers: (builder) => {
@@ -320,6 +332,9 @@ export const isLogined=(state)=>{
     return state.main.isLogin;
     // return 1;
 }
+export const getUserInfo=(state)=>{
+    return state.main.userInfo;
+}
 //数据获取
 export default Main.reducer;
 

+ 10 - 0
src/index.js

@@ -24,7 +24,17 @@ Sentry.init({
     replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
     replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
 });
+const test=()=>{
+    let isCookieEnabled = (window.navigator.cookieEnabled) ? true : false;
+    if (typeof window.navigator.cookieEnabled == "undefined" && !isCookieEnabled) {
+        // 尝试设置一个测试cookie
+        document.cookie = "testcookie";
+        // 检查cookie是否已设置
+        isCookieEnabled = (document.cookie.indexOf("testcookie") != -1) ? true : false;
+    }
 
+    return isCookieEnabled;
+}
 
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(

+ 34 - 3
src/layout/Navbar/index.jsx

@@ -24,7 +24,9 @@ import {useSpring} from "@react-spring/core";
 import {useWindowSize} from "react-use";
 import ResizeObserver from "resize-observer-polyfill";
 import {useSelector} from "react-redux";
-import {allTopNavs, getRoute, getRouteChain, isLogin, isLogined} from "@features/mainSlice";
+import {allTopNavs, getRoute, getRouteChain, getUserInfo, isLogin, isLogined} from "@features/mainSlice";
+import LazyImage from "@components/LazyImage";
+import {numFormatter} from "@utils/helpers";
 const i18n=global.i18n;
 
 const StyledToggleGroup= styled(ToggleButtonGroup)`
@@ -138,7 +140,10 @@ const DesktopSignInUp=()=>{
                             navigate("#/signup");
                         }}>{i18n.t('sign_up')}</Button>
                     </>
-                ):(<></>)
+                ):(
+                    <>
+                    </>
+                )
             }
             <Button  className="m-button">
                 <svg className={"ls-icon"} style={{width:'20px',height:'20px'}}>
@@ -146,11 +151,14 @@ const DesktopSignInUp=()=>{
                 </svg>
                 <div className="chat-green-dont"></div>
             </Button>
-            <Button  className="m-button" style={{marginLeft: '0.5rem'}}>
+            <Button  className="m-button" style={{marginLeft: '0.5rem',marginRight:'0.5rem'}}>
                 <svg className={"ls-icon"} style={{width:'20px',height:'20px'}}>
                     <use xlinkHref={`${symbol}#icon_Language`} />
                 </svg>
             </Button>
+            {
+                isLogin?(<UserInfo />):(<></>)
+            }
         </div>
     )
 }
@@ -202,9 +210,32 @@ const MobileNav=()=>{
                 <Logo size="sm"/>
             </div>
             <MobileSignInUp/>
+            <UserInfo />
         </div>
     )
 }
+const UserInfo=()=>{
+    const isLogin=useSelector(isLogined);
+    const user=useSelector(getUserInfo);
+    const navigate=useNavigate();
+    return (
+        <>
+            {
+                isLogin?(
+                    <div className={`d-flex align-items-center ${styles.user_info}`} onClick={()=>{
+                        navigate('#/settings');
+                    }}>
+                        <div className={styles.info}>
+                            <div className={styles.nick}>{user.NickName}</div>
+                            <div className={styles.score}>{"$"+numFormatter(user.Score)}</div>
+                        </div>
+                        <LazyImage wrapperClassName={styles.avatar} src={user.img} alt={"Head"}/>
+                    </div>
+                ):(<></>)
+            }
+        </>
+    )
+}
 const PageHeader = () => {
     const LINKS=useSelector(allTopNavs);
     const {initHeaderHeight} = useThemeProvider();

+ 28 - 0
src/layout/Navbar/styles.module.scss

@@ -104,3 +104,31 @@
     height: 1.28rem;
   }
 }
+.user_info{
+  position: relative;
+  justify-content: flex-end;
+  gap: 0.5rem;
+  & .avatar{
+    img{
+      height: 3rem;
+      width: auto;
+      border-radius: 50%;
+    }
+  }
+  & .info{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-end;
+    & .nick{
+      font-size: 0.875rem;
+      font-weight: 600;
+      color: var(--text);
+    }
+    & .score{
+      font-size: 0.9rem;
+      font-weight: 700;
+      color: #edc349;
+    }
+  }
+}

+ 1 - 0
src/layout/Sidebar/index.jsx

@@ -384,6 +384,7 @@ const Sidebar = () => {
                     isLogin?(
                         <StyledButton open={open} className="h4" onClick={()=>{
                             dispatch(reqLogout());
+                            setOpen(false);
                         }}>
                             <SvgIcon className={"icon"} herf={"icon_Logout"}/>
                             {open?i18n.t("links.log_out"):""}

+ 1 - 1
src/utils/helpers.js

@@ -10,7 +10,7 @@ import CLUBS from '@constants/clubs';
 // represent large numbers in a shortened format
 export const numFormatter = (num, decimals = 0) => {
     if (num > 999 && num < 1000000) {
-        return (num / 1000).toFixed(decimals) + 'k';
+        return (num / 1000).toFixed(decimals) + 'K';
     } else if (num > 1000000) {
         return (num / 1000000).toFixed(1) + 'M';
     } else if (num < 900) {

+ 1 - 1
src/widgets/Banner/index.jsx

@@ -1,7 +1,7 @@
 import AutoBanner from "@components/AutoBanner";
 import {useThemeProvider} from "@contexts/themeContext";
 
-import { SpinePlayer } from '@esotericsoftware/spine-player';
+// import { SpinePlayer } from '@esotericsoftware/spine-player';
 import React from "react";
 import ColorCard from "@components/ColorCards/ColorCard";
 import ColorCardsGrid from "@components/ColorCards/ColorCardsGrid";