Merge remote-tracking branch 'origin/dev' into dev

next.config.mjs

@@ -5,10 +5,9 @@ const withNextIntl = createNextIntlPlugin();
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  output: 'standalone',
   reactStrictMode: true,
-  output:"standalone",
   transpilePackages: ['antd-mobile'],
-
   sassOptions: {
     prependData: `@import "./src/styles/variables.scss";`
   },

package.json

@@ -4,10 +4,11 @@
   "private": true,
   "scripts": {
     "dev": "next dev",
-    "build": "next build",
+    "build": "next build && npm run move",
     "start": "next start",
     "lint": "next lint",
-    "preinstall": "npx only-allow pnpm"
+    "preinstall": "npx only-allow pnpm",
+    "move": "xcopy /e /i .next\\static .next\\standalone\\.next\\static"    
   },
   "dependencies": {
     "@nextui-org/react": "^2.4.2",

src/app/[locale]/(ordinary)/deposit/page.scss

@@ -1,11 +1,12 @@
 .deposit-box {
+    flex: 1;
     width: 100%;
-    min-height: 100vh;
-    padding: 0 .14rem;
-    padding: .44rem .18rem;
+    overflow-y: auto;
+    padding: 0.1rem .18rem;
     background-color: #1f1f1f;
     display: flex;
     flex-direction: column;
+
     .img-box {
       width: .8rem;
       height: .27rem;
@@ -13,6 +14,7 @@
       background: url('/img/pixImg.png') no-repeat center;
       background-size: 100% 100%;
     }
+
     .btn-box {
       margin: .1rem 0;
       height: .3rem;
@@ -138,7 +140,7 @@
     .topUp {
       width: 100%;
       height: auto;
-      margin: .24rem 0 .19rem;
+      margin: .24rem 0 .4rem;
     }
   }
   

src/app/[locale]/(ordinary)/deposit/page.tsx

@@ -70,6 +70,7 @@ const Deposit: FC<Props> = () => {
                     {t("DepositarAgora")}
                 </ButtonOwn>
             </div>
+            
         </div>
     );
 };

src/app/[locale]/(ordinary)/layout.tsx

@@ -12,8 +12,8 @@ export default async function LocaleLayout({
 }) {
     const messages = await getMessages();
     return (
-        <div>
-            <HeaderBack />
+        <div style={{width:'100%', height:'100vh', display: 'flex', flexDirection:'column'}}>
+            <HeaderBack showBack={false}/>
             {children}
             <Footer />
         </div>

src/app/[locale]/(ordinary)/profile/component/ModalCom/style.scss

@@ -5,12 +5,9 @@
   height: .34rem;
   line-height: .34rem;
   display: block;
-  margin: .1rem auto .3rem;
+  margin: .5rem auto .3rem;
   text-align: center;
   cursor: pointer;
-  margin: 0 auto;
-  position: relative;
-  top: calc(100vh - 3.3rem);
 }
 
 .body1-box {

src/app/[locale]/(ordinary)/profile/page.scss

@@ -1,10 +1,9 @@
 .profile-box {
-    padding: .44rem 0 .6rem;
-    height: 100vh;
+    flex: 1;
+    width: 100%;
     overflow-y: auto;
+    padding-bottom: .4rem;
     background-color: #1f1f1f;
-    -webkit-box-sizing: border-box;
-    box-sizing: border-box;
     display: flex;
     flex-direction: column;
 

src/app/[locale]/(ordinary)/profile/page.tsx

@@ -5,13 +5,14 @@ import { useGlobalStore } from "@/stores";
 import clsx from "clsx";
 import { useTranslations } from "next-intl";
 import { FC, useEffect, useState } from "react";
-import ItemCom from "./component/ItemCom";
-import MaskCom from "./component/MaskCom";
-import ModalCom from "./component/ModalCom";
+import dynamic from "next/dynamic";
 import "./page.scss";
 
 interface Props {}
 
+const ItemCom = dynamic(() => import('./component/ItemCom'));
+const MaskCom = dynamic(() => import('./component/MaskCom'));
+const ModalCom = dynamic(() => import('./component/ModalCom'));
 const Profile: FC<Props> = () => {
     const t = useTranslations("ProfilePage");
 

src/app/[locale]/(ordinary)/sports/page.scss

@@ -0,0 +1,13 @@
+.sports-box {
+    flex: 1;
+    width: 100%;
+    overflow-y: auto;
+    // -webkit-overflow-scrolling: touch;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: .2rem;
+    background-color: #1f1f1f;
+    color: #fff;
+    font-size: .16rem;
+}

src/app/[locale]/(ordinary)/sports/page.tsx

@@ -0,0 +1,20 @@
+"use client";
+import { useGlobalStore } from "@/stores";
+import { useTranslations } from "next-intl";
+import { FC } from "react";
+import "./page.scss";
+
+interface Props {}
+
+const Sports: FC<Props> = () => {
+    const t = useTranslations("ProfilePage");
+    const { token, userInfo, setUserInfo } = useGlobalStore();
+
+    return (
+        <div className="sports-box">
+            to by continued
+        </div>
+    );
+};
+
+export default Sports;

src/app/[locale]/(ordinary)/withdraw/page.tsx

@@ -1,119 +0,0 @@
-"use client";
-import ButtonOwn from "@/components/ButtonOwn";
-import { ActionSheet } from "antd-mobile";
-import type { Action } from "antd-mobile/es/components/action-sheet";
-import { useTranslations } from "next-intl";
-import Link from "next/link";
-import { ChangeEvent, FC, useState } from "react";
-import "./page.scss";
-
-interface Props {}
-
-const Withdraw: FC<Props> = () => {
-    const t = useTranslations("WithdrawPage");
-
-    const actions: Action[] = [
-        { text: "CPF", key: "CPF" },
-        { text: t("Número"), key: "Celular" },
-        { text: "EMAIL", key: "EMAIL" },
-    ];
-    let amount = 50;
-    let [account, setAccount] = useState({
-        secretKey: "",
-        money: "",
-    });
-    const setInputVal = (e: ChangeEvent<HTMLInputElement>) => {
-        const { name, value } = e.target;
-        setAccount({
-            ...account,
-            [name]: value,
-        });
-    };
-
-    let [visible, setVisible] = useState(false);
-    let [prefix, setPrefix] = useState("CPF");
-    let [placeholder, setPlaceholder] = useState("000.000.000-00");
-    const onAction = (action: any) => {
-        setPrefix(action.text as any);
-        if (action.key == "CPF") {
-            setPlaceholder("000.000.000-00");
-            return;
-        }
-        if (action.key == "Celular") {
-            setPlaceholder("11 dígitos");
-            return;
-        }
-        if (action.key == "EMAIL") {
-            setPlaceholder("EMAIL");
-            return;
-        }
-    };
-
-    return (
-        <div className="withdraw-box">
-            <div className="img-box"></div>
-            <p className="btn-box" color="primary">
-                PIX V
-            </p>
-            <h1>{t("Certifique")}</h1>
-            <div className="amount-box">
-                <span>{t("Tipo")}</span>
-                <div className="input-box">
-                    <label onClick={() => setVisible(true)}>
-                        {prefix} <span className="iconfont icon-xialaxuanze"></span>
-                    </label>
-                    <input
-                        name="secretKey"
-                        type="number"
-                        value={account.secretKey}
-                        onChange={setInputVal}
-                        placeholder={placeholder}
-                    />
-                </div>
-            </div>
-            <h1>{t("Vincule")}</h1>
-            <div className="amount-box">
-                <span>{t("Montante")} (BRL):</span>
-                <div className="input-box">
-                    <input
-                        name="money"
-                        type="number"
-                        value={account.money}
-                        onChange={setInputVal}
-                        placeholder="Mín. 10.00"
-                    />
-                </div>
-            </div>
-            <ul className="ul-box">
-                <li>
-                    {t("SaqueDisponivel")} <span className="tip">0 BRL</span>
-                </li>
-                <li>
-                    {t("Valor")} <span className="tip">0 BRL</span>{" "}
-                    <span className="iconfont icon-iconhelp"></span>
-                </li>
-                <li>
-                    {t("Para")},{" "}
-                    <Link href="/" className="toHome router-link-active" replace>
-                        {t("Aposte")}
-                    </Link>
-                </li>
-            </ul>
-            <div className="topUp">
-                <ButtonOwn active={amount > 0 ? true : false}>{t("Saque")}</ButtonOwn>
-            </div>
-
-            <ActionSheet
-                extra=""
-                cancelText={t("Cancelar")}
-                visible={visible}
-                actions={actions}
-                closeOnAction={true}
-                onAction={onAction}
-                onClose={() => setVisible(false)}
-            />
-        </div>
-    );
-};
-
-export default Withdraw;

src/app/[locale]/layout.tsx

@@ -4,6 +4,7 @@ import { NextIntlClientProvider } from "next-intl";
 import { getMessages } from "next-intl/server";
 import { Inter as FontSans } from "next/font/google";
 import { ReactNode } from "react";
+import Head from "next/head";
 import "../globals.css";
 
 import PageTransitionEffect from "@/components/PageTransitionEffect";
@@ -31,6 +32,18 @@ export default async function LocaleLayout({
 
     return (
         <html lang={locale} suppressHydrationWarning>
+            <Head>
+                <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+                <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
+                <meta name="keywords" content=""/>
+                <meta name="description" content=""/>
+                <meta http-equiv="Cache-control" content="no-cache, no-store, must-revalidate"/>
+                <meta http-equiv="Pragma" content="no-cache"/>
+                <meta http-equiv="Expires" content="0"/>
+                <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+                <meta name="format-detection" content="telphone=no, email=no" />
+                <meta name="viewport" content="viewport-fil=cover" />
+            </Head>
             <body className={clsx("font-sans", fontSans.variable)}>
                 <Providers themeProps={{ defaultTheme: "dark", attribute: "class" }}>
                     <NextIntlClientProvider messages={messages}>

src/app/[locale]/login/component/FromCom/style.scss

@@ -1,8 +1,8 @@
 .FromCom {
+  width: 100%;
+  height: auto;
   background-color: #1f1f1f;
   padding: 0 .18rem;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
 
   .passwordInput {
     margin: .13rem 0 .04rem;
@@ -52,6 +52,7 @@
   }
 
   .link {
+    margin-bottom: .2rem;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;

src/app/[locale]/login/component/GoogleCom/style.scss

@@ -1,8 +1,8 @@
 .GoogleCom {
+  width: 100%;
+  height: auto;
   background-color: #1f1f1f;
   padding: .72rem .18rem 0;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
 
   .title {
     font-size: .16rem;

src/app/[locale]/login/page.scss

@@ -1,7 +1,15 @@
 .login-box, .register-box {
     width: 100%;
-    min-height: 100vh;
+    height: 100vh;
     background-color: rgb(31, 31, 31);
     display: flex;
     flex-direction: column;
+
+    .content-box {
+        flex: 1;
+        width: 100%;
+        overflow-y: auto;
+        display: flex;
+        flex-direction: column;
+    }
 }

src/app/[locale]/login/page.tsx

@@ -1,19 +1,21 @@
 "use client";
 import { getLoginApi, getUserInfoApi } from "@/api/user";
-import DomainFooter from "@/components/DomainFooter";
-import HeaderBack from "@/components/HeaderBack";
 import { useRouter } from "@/i18n";
 import { useGlobalStore } from "@/stores";
 import { Toast } from "antd-mobile";
 import { useTranslations } from "next-intl";
 import { useSearchParams } from "next/navigation";
+import dynamic from "next/dynamic";
 import { FC, useState } from "react";
-import FromCom from "./component/FromCom";
-import GoogleCom from "./component/GoogleCom";
 import "./page.scss";
 
 interface Props {}
 
+const HeaderBack = dynamic(() => import('@/components/HeaderBack'));
+const FromCom = dynamic(() => import('./component/FromCom'));
+const GoogleCom = dynamic(() => import('./component/GoogleCom'));
+const DomainFooter = dynamic(() => import('@/components/DomainFooter'));
+
 const Login: FC<Props> = () => {
     const t = useTranslations("LoginPage");
     const { setToken, setUserInfo } = useGlobalStore();
@@ -49,10 +51,12 @@ const Login: FC<Props> = () => {
 
     return (
         <div className="login-box">
-            <HeaderBack />
-            <GoogleCom />
-            <FromCom callbackFun={loginRequest} msgError={msgError} />
-            <DomainFooter />
+            <HeaderBack showBack={false}/>
+            <div className="content-box">
+                <GoogleCom />
+                <FromCom callbackFun={loginRequest} msgError={msgError} />
+                <DomainFooter />
+            </div>
         </div>
     );
 };

src/app/[locale]/register/page.tsx

@@ -1,17 +1,19 @@
 "use client";
 import { getRegisterApi } from "@/api/user";
-import DomainFooter from "@/components/DomainFooter";
-import HeaderBack from "@/components/HeaderBack";
 import { useRouter } from "@/i18n";
 import { Toast } from "antd-mobile";
 import { useTranslations } from "next-intl";
 import { FC, useState } from "react";
-import FromCom from "../login/component/FromCom";
-import GoogleCom from "../login/component/GoogleCom";
+import dynamic from "next/dynamic";
 import "../login/page.scss";
 
 interface Props {}
 
+const HeaderBack = dynamic(() => import('@/components/HeaderBack'));
+const FromCom = dynamic(() => import('../login/component/FromCom'));
+const GoogleCom = dynamic(() => import('../login/component/GoogleCom'));
+const DomainFooter = dynamic(() => import('@/components/DomainFooter'));
+
 const Register: FC<Props> = () => {
     const t = useTranslations("LoginPage");
     const router: any = useRouter();
@@ -31,9 +33,11 @@ const Register: FC<Props> = () => {
     return (
         <div className="register-box">
             <HeaderBack />
-            <GoogleCom title={t("registerGoogletitle")} text={t("registerGoogletext")} />
-            <FromCom type="register" callbackFun={registerRequest} msgError={msgError} />
-            <DomainFooter />
+            <div className="content-box">
+                <GoogleCom title={t("registerGoogletitle")} text={t("registerGoogletext")} />
+                <FromCom type="register" callbackFun={registerRequest} msgError={msgError} />
+                <DomainFooter />
+            </div>
         </div>
     );
 };

src/app/[locale]/(ordinary)/withdraw/page.scss → src/app/[locale]/withdraw/page.scss

@@ -1,7 +1,8 @@
 .withdraw-box {
     width: 100%;
-    min-height: 100vh;
-    padding: .44rem .18rem .6rem;
+    height: calc(100vh - .44rem);
+    overflow-y: auto;
+    padding: 0 .18rem .6rem;
     background-color: #1f1f1f;
     display: flex;
     flex-direction: column;

src/app/[locale]/withdraw/page.tsx

@@ -0,0 +1,124 @@
+"use client";
+import ButtonOwn from "@/components/ButtonOwn";
+import { ActionSheet } from "antd-mobile";
+import type { Action } from "antd-mobile/es/components/action-sheet";
+import { useTranslations } from "next-intl";
+import Link from "next/link";
+import { ChangeEvent, FC, useState } from "react";
+import HeaderBack from "@/components/HeaderBack";
+import "./page.scss";
+
+interface Props {}
+
+const Withdraw: FC<Props> = () => {
+    const t = useTranslations("WithdrawPage");
+
+    const actions: Action[] = [
+        { text: "CPF", key: "CPF" },
+        { text: t("Número"), key: "Celular" },
+        { text: "EMAIL", key: "EMAIL" },
+    ];
+    let amount = 50;
+    let [account, setAccount] = useState({
+        secretKey: "",
+        money: "",
+    });
+    const setInputVal = (e: ChangeEvent<HTMLInputElement>) => {
+        const { name, value } = e.target;
+        setAccount({
+            ...account,
+            [name]: value,
+        });
+    };
+
+    let [visible, setVisible] = useState(false);
+    let [prefix, setPrefix] = useState("CPF");
+    let [placeholder, setPlaceholder] = useState("000.000.000-00");
+    const onAction = (action: any) => {
+        setPrefix(action.text as any);
+        if (action.key == "CPF") {
+            setPlaceholder("000.000.000-00");
+            return;
+        }
+        if (action.key == "Celular") {
+            setPlaceholder("11 dígitos");
+            return;
+        }
+        if (action.key == "EMAIL") {
+            setPlaceholder("EMAIL");
+            return;
+        }
+    };
+
+    return (
+        <>
+            <HeaderBack />
+            <div className="withdraw-box">
+                
+                <div className="img-box"></div>
+                <p className="btn-box" color="primary">
+                    PIX V
+                </p>
+                <h1>{t("Certifique")}</h1>
+                <div className="amount-box">
+                    <span>{t("Tipo")}</span>
+                    <div className="input-box">
+                        <label onClick={() => setVisible(true)}>
+                            {prefix} <span className="iconfont icon-xialaxuanze"></span>
+                        </label>
+                        <input
+                            name="secretKey"
+                            type="number"
+                            value={account.secretKey}
+                            onChange={setInputVal}
+                            placeholder={placeholder}
+                        />
+                    </div>
+                </div>
+                <h1>{t("Vincule")}</h1>
+                <div className="amount-box">
+                    <span>{t("Montante")} (BRL):</span>
+                    <div className="input-box">
+                        <input
+                            name="money"
+                            type="number"
+                            value={account.money}
+                            onChange={setInputVal}
+                            placeholder="Mín. 10.00"
+                        />
+                    </div>
+                </div>
+                <ul className="ul-box">
+                    <li>
+                        {t("SaqueDisponivel")} <span className="tip">0 BRL</span>
+                    </li>
+                    <li>
+                        {t("Valor")} <span className="tip">0 BRL</span>{" "}
+                        <span className="iconfont icon-iconhelp"></span>
+                    </li>
+                    <li>
+                        {t("Para")},{" "}
+                        <Link href="/" className="toHome router-link-active" replace>
+                            {t("Aposte")}
+                        </Link>
+                    </li>
+                </ul>
+                <div className="topUp">
+                    <ButtonOwn active={amount > 0 ? true : false}>{t("Saque")}</ButtonOwn>
+                </div>
+
+                <ActionSheet
+                    extra=""
+                    cancelText={t("Cancelar")}
+                    visible={visible}
+                    actions={actions}
+                    closeOnAction={true}
+                    onAction={onAction}
+                    onClose={() => setVisible(false)}
+                />
+            </div>
+        </>
+    );
+};
+
+export default Withdraw;

src/app/globals.css

@@ -22,9 +22,8 @@
   --bg-color:#000000;
 }
 
-
-html {
-    font-size: 144px;
+* { 
+  box-sizing: border-box;
 }
 
 ::-webkit-scrollbar {
@@ -32,24 +31,30 @@ html {
 }
 
 html, body {
-  /* width: 100vw; */
-  height: 100%;
-  min-height: 80%;
+  width: 100vw;
+  height: 100vh;
   font-family: helvetica neue, Helvetica, apple sd gothic neo, malgun gothic, Arial, sans-serif;
   overflow: hidden;
-  background: #f8f8f8;
+  background-color: #f8f8f8;
+}
+
+html {
+  font-size: 144px;
+  transform: translate3d(0, 0, 0);
 }
 
 #app {
+    width: 100%;
     max-width: 4.02rem;
-    width: 100vw;
-    height: auto;
+    height: 100vh;
     margin: 0 auto;
     font-size: 0.14rem;
-    position: relative;
     background-color: var(--bg-color);
 }
 
+input {
+  line-height: normal;
+}
 
 /* ant-design-ui */
 .adm-toast-mask .adm-toast-main-icon .adm-toast-icon svg {

src/components/DomainFooter/style.module.scss

@@ -1,6 +1,7 @@
 .footer-box {
   width: 100%;
   flex: 1;
+  min-height: .81rem;
   display: flex;
   flex-direction: column;
   justify-content: end;

src/components/Footer/index.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { usePathname, useRouter } from "@/i18n";
 import clsx from "clsx";
-import { FC, PropsWithChildren, ReactNode } from "react";
+import { FC, PropsWithChildren, ReactNode, useEffect, useState } from "react";
 import "./style.scss";
 import { useGlobalStore } from "@/stores";
 
@@ -36,7 +36,7 @@ const Footer: FC<PropsWithChildren> = () => {
         {
             iconSpanName: "icon-tiyu",
             label: "Esportes",
-            path: "/",
+            path: "/sports",
         },
         {
             iconSpanName: "icon-yonghu",
@@ -46,13 +46,20 @@ const Footer: FC<PropsWithChildren> = () => {
     ];
 
     const pathname = usePathname();
+    const [tabActiveName, setTabActiveName] = useState('/')
+
+    useEffect(() => {
+        setTabActiveName(pathname)
+    }, [pathname])
 
     const router = useRouter();
+    
     const goPage = (path = "/") => {
         if(!token && (path == '/deposit' || path == "/profile")) {
-            router.replace(`/login?redirect=${path}`)
+            router.push(`/login?redirect=${path}`)
             return
         }
+        setTabActiveName(path)
         router.push(path);
     };
 
@@ -62,7 +69,7 @@ const Footer: FC<PropsWithChildren> = () => {
                 {tabList.map((item, index) => {
                     return (
                         <li
-                            className={clsx(item.path == pathname && "active")}
+                            className={clsx(item.path == tabActiveName && "active")}
                             onClick={() => goPage(item.path)}
                             key={index}
                         >

src/components/Footer/style.scss

@@ -1,9 +1,5 @@
 .footer-box {
-  position: fixed;
-  bottom: 0;
-  z-index: 10;
-  width: 100vw;
-  max-width: 4.02rem;
+  width: 100%;
   height: .6rem;
   background-color: #292929;
 
@@ -17,6 +13,7 @@
 
     li {
       position: relative;
+      z-index: 10;
       width: 20%;
       display: flex;
       flex-direction: column;

src/components/HeaderBack/index.tsx

@@ -14,10 +14,11 @@ import { useTranslations } from "next-intl";
 export interface HeaderBackProps {
     title?: string;
     children?: ReactNode;
+    showBack?: Boolean;
     headerRender?: () => ReactNode;
 }
 
-const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', children}) => {
+const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', showBack = true, children}) => {
     const t = useTranslations("HeaderBack");
 
     const iconClassName1 = clsx({
@@ -52,8 +53,8 @@ const HeaderBack: FC<PropsWithChildren<HeaderBackProps>> = ({title = '', childre
 
     return (
         <div className={styles.headerBack}>
-            <div className={styles.left} onClick={() => goPage()}>
-                <span className={iconClassName1}></span>
+            <div className={styles.left}>
+                { showBack && <span className={iconClassName1} onClick={() => goPage()}></span> }
             </div>
             {(title || selfTitle) && <span className={styles.title}>{title || selfTitle}</span>}
             {children}

src/components/HeaderBack/style.module.scss

@@ -1,14 +1,9 @@
 
 .headerBack {
-  position: fixed;
-  z-index: 10;
   width: 100%;
-  max-width: 4.02rem;
   height: .44rem;
   background-color: #000;
   padding: 0 .14rem;
-  box-sizing: border-box;
-  transform: translateZ(0);
   display: flex;
   align-items: center;
   justify-content: space-between;

src/utils/server/axios.ts

@@ -1,5 +1,6 @@
 import { Toast } from "antd-mobile";
 import axios, { AxiosInstance, AxiosResponse, InternalAxiosRequestConfig } from "axios";
+
 import type { AxiosOptions } from "./type";
 type Result<T = any> = {
     code: number;
@@ -60,6 +61,7 @@ export default class Request {
                         });
                     }
                 }
+                
                 return config;
             },
             (error) => {
@@ -80,6 +82,7 @@ export default class Request {
                 return res;
             },
             (error) => {
+
                 if (responseInterceptorCatch) {
                     responseInterceptorCatch(error);
                 }