diff --git a/.env b/.env index 79e0939..22598e5 100644 --- a/.env +++ b/.env @@ -1,3 +1,3 @@ SKIP_PREFLIGHT_CHECK=true GENERATE_SOURCEMAP=false -REACT_APP_BASEURL='https://matontrading.com' \ No newline at end of file +REACT_APP_BASEURL='http://203.161.61.234:8082' \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index 3e4c6e1..e2d0071 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,23 +1,23 @@ import { Suspense, lazy } from "react"; import RenderRouter from "./router"; import { HashRouter, Route, Routes } from 'react-router-dom'; +import { Spin } from "antd"; +import { useRouter } from "./hooks/useRouter"; const Submit = lazy(() => import("./pages/submit")); function App() { + return ( -
- {/* */} -
加载中...
-
+ }> } />
- + {}
); } diff --git a/src/components/CountdownTimer.tsx b/src/components/CountdownTimer.tsx index 29a9d1d..de07bae 100644 --- a/src/components/CountdownTimer.tsx +++ b/src/components/CountdownTimer.tsx @@ -19,7 +19,7 @@ const CountdownTimer = forwardRef((props const { t } = useTranslation() const [seconds, setSeconds] = useState(initialSeconds); const [isActive, setIsActive] = useState(false); - const [title, setTitle] = useState(t('Send verification code')) + const [title, setTitle] = useState('Send verification code') useImperativeHandle(ref, () => ({ handleStop, @@ -30,7 +30,7 @@ const CountdownTimer = forwardRef((props const handleStop = () => { setIsActive(false); - setTitle(t('Send verification code')) + setTitle('Send verification code') }; const handleStart = () => { @@ -46,8 +46,6 @@ const CountdownTimer = forwardRef((props useEffect(() => { let interval: any = null; - console.log(seconds); - console.log(isActive); if (isActive && seconds > 0) { interval = setInterval(() => { @@ -55,7 +53,7 @@ const CountdownTimer = forwardRef((props }, 1000); } else { clearInterval(interval) - seconds <= 0 && setTitle(t('Resend')) + seconds <= 0 && setTitle('Resend') setIsActive(false) // onComplete && onComplete(seconds) } @@ -64,7 +62,7 @@ const CountdownTimer = forwardRef((props }, [isActive, seconds, onComplete]); return ( -
{isActive ? {seconds}s : title}
+
{isActive ? {seconds}s : t(title)}
); }); diff --git a/src/components/SearchForm/index.tsx b/src/components/SearchForm/index.tsx index 8eb76e5..1ff1c39 100644 --- a/src/components/SearchForm/index.tsx +++ b/src/components/SearchForm/index.tsx @@ -1,5 +1,6 @@ import React, { forwardRef, useImperativeHandle, FC } from 'react' import { Form, Button } from 'antd' +import { useTranslation } from 'react-i18next'; interface SearchProps { config: object[]; @@ -12,6 +13,7 @@ interface SearchProps { const SearchForm: FC = forwardRef( (props: SearchProps, ref) => { const { config, handleSearch, beforeSearch, onFieldsChange } = props + const { t } = useTranslation() const [form] = Form.useForm() const getFields = (): JSX.Element[] => { return config.map((item: any) => { @@ -62,7 +64,7 @@ const SearchForm: FC = forwardRef( {getFields()} diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx index b464dc9..e9bba9d 100644 --- a/src/components/layout/Header.tsx +++ b/src/components/layout/Header.tsx @@ -8,6 +8,8 @@ import Slider from "./Slider" import { useRouter } from "../../hooks/useRouter" import { AiOutlineMenuUnfold, AiOutlineMenuFold } from "react-icons/ai"; import { IoIosArrowDown } from "react-icons/io"; +import LanguageMenu from "../LanguageMenu" +import { useTranslation } from "react-i18next" const Header = () => { @@ -17,6 +19,7 @@ const Header = () => { const [open, setOpen] = useState(false); const [openMenu, setOpenMenu] = useState(false); const fileInputRef = useRef(null) + const { t } = useTranslation() const panelStyle: React.CSSProperties = { background: 'none', @@ -26,49 +29,49 @@ const Header = () => { const PopoverData = [ { - label: '资金管理', + label: t('Assets Manage'), key: '1', style: panelStyle, children: (
-

to('/transfer')}>资金划转

-

to('/assetsRecords')}>账单记录

-

to('/escrowRecords')}>托管记录

+

to('/transfer')}>{t('Assets transfer')}

+

to('/assetsRecords')}>{t('Billing records')}

+

to('/escrowRecords')}>{t('Escrow records')}

) }, { - label: '存款', + label: t('Deposit'), style: panelStyle, key: '2', children: (
-

push('/deposit')}>转账存款

-

push('/depositRecords')}>存款记录

+

push('/deposit')}>{t('Transfer deposit')}

+

push('/depositRecords')}>{t('Deposit records')}

) }, { - label: '取款', + label: t('Withdraw'), style: panelStyle, key: '3', children: (
-

push('/account')}>收款账户

-

push('/withdraw')}>办理取款

-

push('/withdrawRecords')}>取款记录

+

push('/account')}>{t('Collection account')}

+

push('/withdraw')}>{t('Handle withdraw')}

+

push('/withdrawRecords')}>{t('Withdraw records')}

) }, { - label: '我的团队', + label: t('My team'), style: panelStyle, key: '4', children: (
-

push('/link')}>推广链接

-

to('/team')}>团队详情

-

push('/bonusRecords')}>奖金明细

+

push('/link')}>{t('Sponsored link')}

+

to('/team')}>{t('Team details')}

+

push('/bonusRecords')}>{t('Bonus details')}

) @@ -94,10 +97,10 @@ const Header = () => { const popoverAvatar = (
-
您好,{userInfo.name}!
-
push('/security')}>安全设定
+
{t('Hello')},{userInfo.name}!
+
push('/security')}>{t('Security settings')}
-
退出登录
+
{t('Log out')}
) @@ -109,7 +112,7 @@ const Header = () => {
取款
*/} { PopoverData.map((item, index) => ( -
+
{item.label}
@@ -130,6 +133,9 @@ const Header = () => {
+
+ +
) @@ -141,7 +147,12 @@ const Header = () => { -
+
+
+
+ +
+
) diff --git a/src/components/layout/Slider.tsx b/src/components/layout/Slider.tsx index 3067952..4efabd4 100644 --- a/src/components/layout/Slider.tsx +++ b/src/components/layout/Slider.tsx @@ -12,21 +12,23 @@ import { BiMoneyWithdraw } from "react-icons/bi"; import { GrUserSettings } from "react-icons/gr"; import { MdOutlineSecurity } from "react-icons/md"; import { CiWallet } from "react-icons/ci"; +import { useTranslation } from "react-i18next"; const Slider = () => { const { push } = useRouter() const { screenWidth, userInfo } = store.state + const { t } = useTranslation() const tabs = [ - { title: 'Android 下载', id: 1, Icon: }, - { title: 'IPhone 下载', id: 2, Icon: }, - { title: '仪表盘', id: 3, Icon: }, - { title: '办理存款', id: 4, Icon: }, - { title: '资金划转', id: 5, Icon: }, - { title: '办理取款', id: 6, Icon: }, - { title: '收款账户', id: 7, Icon: }, - { title: '安全设定', id: 8, Icon: }, + { title: 'Android Download', id: 1, Icon: }, + { title: 'IPhone Download', id: 2, Icon: }, + { title: 'Dashboard', id: 3, Icon: }, + { title: 'Handle deposit', id: 4, Icon: }, + { title: 'Assets transfer', id: 5, Icon: }, + { title: 'Handle withdraw', id: 6, Icon: }, + { title: 'Collection account', id: 7, Icon: }, + { title: 'Security settings', id: 8, Icon: }, ] const handleLeftMenu = (id: number) => { @@ -70,7 +72,7 @@ const Slider = () => {
@@ -81,7 +83,7 @@ const Slider = () => {
handleLeftMenu(item.id)}>
{item.Icon}
-
{item.title}
+
{t(item.title)}
)) diff --git a/src/components/profitChart.tsx b/src/components/profitChart.tsx index 636386e..7f4bfb5 100644 --- a/src/components/profitChart.tsx +++ b/src/components/profitChart.tsx @@ -1,15 +1,17 @@ import React, { useEffect, useRef } from 'react'; import ReactECharts from 'echarts-for-react'; import echarts from 'echarts/types/dist/echarts'; +import { useTranslation } from 'react-i18next'; const ProfitChart = (props: any) => { const { data } = props const reactECharts = useRef(null) + const { t, i18n } = useTranslation() const option = { title: { - text: '我的收益走势', + text: t('My earnings trend'), left: 'left', textStyle: { color: '#333', @@ -26,7 +28,7 @@ const ProfitChart = (props: any) => { }, tooltip: { trigger: 'axis', - formatter: '{b0}
Profit: {c0}', + formatter: `{b0}
${t('Profit')}: {c0}`, backgroundColor: 'rgba(255, 255, 255, 0.9)', borderColor: '#ccc', borderWidth: 1, @@ -90,19 +92,20 @@ const ProfitChart = (props: any) => { ] }; - useEffect(() => { + const handleResize = () => { + if (!reactECharts.current) return + const instance = reactECharts.current.getEchartsInstance() + instance.resize() + } - const handleResize = () => { - if (!reactECharts.current) return - const instance = reactECharts.current.getEchartsInstance() - instance.resize() - } + useEffect(() => { window.addEventListener('resize', handleResize) return () => { window.removeEventListener('resize', handleResize) } }, []) + return ( ); diff --git a/src/language/index.ts b/src/language/index.ts index b73b4f2..a174d56 100644 --- a/src/language/index.ts +++ b/src/language/index.ts @@ -12,7 +12,7 @@ const resources = { i18n.use(initReactI18next).init({ resources, - lng: window.sessionStorage.getItem(TRADER_LANGUAGE) || "zh", + lng: window.localStorage.getItem(TRADER_LANGUAGE) || "zh", interpolation: { escapeValue: false, }, diff --git a/src/language/zh.json b/src/language/zh.json index fb1822d..c37cd92 100644 --- a/src/language/zh.json +++ b/src/language/zh.json @@ -20,5 +20,134 @@ "Resend": "重新发送", "Register Successful": "注册成功", "Verification code sent successfully": "验证码发送成功", - "Failed to send verification code": "验证码发送失败" + "Failed to send verification code": "验证码发送失败", + "total assets": "总资产", + "Android Download": "安卓下载", + "IPhone Download": "IOS下载", + "Dashboard": "仪表盘", + "Handle deposit": "办理存款", + "Assets transfer": "资金划转", + "Handle withdraw": "办理取款", + "Collection account": "收款账户", + "Security settings": "安全设定", + "Assets Manage": "资金管理", + "Deposit": "存款", + "Withdraw": "取款", + "My team": "我的团队", + "Billing records": "账单记录", + "Escrow records": "托管记录", + "Transfer deposit": "转账存款", + "Deposit records": "存款记录", + "Withdraw records": "取款记录", + "Sponsored link": "推荐链接", + "Team details": "团队详情", + "Bonus details": "奖金明细", + "Hello": "您好", + "Log out": "退出登录", + "Total revenue": "总收益", + "My earnings trend": "我的收益走势", + "Profit": "收益", + "Account": "账户", + "Capital": "资本", + "Balance": "余额", + "Creditworthiness": "信用度", + "net worth": "净值", + "Account status": "账户状态", + "Assets transfer-matters needing attention": "资金划转-注意事项", + "1.Please ensure the safety of the equipment during use,Prevent data from being tampered with or leaked。": "1.在使用过程中请务必确认设备安全,防止数据被篡改或泄露。", + "2.In the process of fund transfer, if there is a delay or other situation,Please handle it later or contact customer service。": "2.资金转账过程中如遇卡顿等情况,请稍后处理或联系客服。", + "3.After fund transfer operation,There may be delays in the system;If exceeding10Minutes have not yet arrived,Please contact customer service。": "3.资金转账操作后,系统会有延时情况;如超过10分钟仍未到账,请联系客服。", + "Assets operations": "资金操作", + "Please select an operation type...": "请选择操作类型...", + "Wallet balance": "钱包余额", + "Asset account amount": "资产账户金额", + "Capital account": "资金账户", + "Member account": "会员账号", + "Please enter the other party’s login account (email)": "请输入对方登录账户(邮箱)", + "Email format error": "邮箱格式错误", + "Please enter the transfer amount": "请输入转账金额", + "Transfer amount": "转账金额", + "submit": "提交", + "Submit": "提交", + "Submit success": "提交成功", + "Cash Wallet-Asset Account": "现金钱包-资产账户", + "Asset Account-Cash Wallet": "资产账户-现金钱包", + "Cash Wallet-Other Members": "现金钱包-其他会员", + "Status": "状态", + "Time": "时间", + "Event": "事件", + "Order": "订单", + "Amount": "金额", + "Describe": "描述", + "Remaining": "剩余", + "Assets account records": "资金账户记录", + "Start time": "开始时间", + "End time": "结束时间", + "Transfer amount must be greater than 0": "转账金额必须大于 0", + "Please upload payment voucher": "请上传付款凭证", + "Strategy Quantitative Deposit-Deposit Notes": "策略量化存款-存款注意事项", + "Dear customer, please be sure to carefully check that all wallet addresses are consistent when transferring funds. After the transfer is completed, please upload the transfer voucher in time.": "尊敬的客户,请您转账时务必仔细检查钱包地址全部一致。转账完毕后,请及时上传转账凭证。", + "Deposit To": "存款到", + "Deposit amount": "存款金额", + "Please enter the deposit amount": "请输入存款金额", + "Next": "下一步", + "Please transfer money to the account below": "请向下方账户转账", + "Wallet type": "钱包类型", + "Wallet Address": "钱包地址", + "Upload payment voucher": "上传付款凭证", + "Delete": "删除", + "Cancel": "取消", + "Amount received": "到账金额", + "Payment amount": "付款金额", + "Symbol": "币种", + "Added successfully": "添加成功", + "Strips are bound": "条已绑定", + "Fill in the payment account": "填写收款账户", + "Valid": "有效", + "Add payment account": "添加收款账户", + "Receive methods": "收款方式", + "Please choose receive methods": "请选择收款方式", + "Please enter a chain type": "请输入链类型", + "Please enter a wallet type": "请输入钱包地址", + "Save": "保存", + "Chain type": "链类型", + "Insufficient balance": "余额不足", + "Hint": "提示", + "Please make sure the device is safe during use to prevent data tampering or leakage.": "在使用过程中请务必确认设备安全,防止数据篡改或泄露。", + "Withdraw account": "取款账号", + "Cash Wallet": "现金钱包", + "Please enter the withdrawal amount": "请输入取款金额", + "Please select a receive method...": "请选择收款方式...", + "please enter verification code": "请输入验证码", + "Withdraw amount": "取款金额", + "Account name": "收款户名", + "Receive address": "收款地址", + "Promotion links": "推广链接", + "Agent promotion link": "代理推广链接", + "Referral code": "推荐码", + "Copy link": "复制链接", + "Copy successfully": "复制成功", + "Please choose the type": "请选择类型", + "Trading profit": "交易利润", + "Profit dividends": "盈利分红", + "Super reward": "超级奖励", + "Trading commissions": "交易佣金", + "Star reward": "星级奖励", + "All types": "全部类型", + "Order number": "订单号", + "Please enter order number": "请输入订单号", + "Please enter the capital account": "请输入资金账户", + "From": "来自", + "Search": "搜索", + "Platform announcement": "平台公告", + "Modification successful, please log in again": "修改成功,请重新登录", + "Please enter a new password": "请输入新密码", + "Password must contain letters and numbers and be 8-32 characters long": "密码必须包含字母和数字,长度为8-32位", + "Change login password": "修改登录密码", + "1. Please make sure the device is safe during use to prevent data from being tampered with or leaked.": "1.在使用过程中请务必确认设备安全,防止数据被篡改或泄露。", + "2. The email verification code may be delayed, please wait patiently.": "2.邮箱验证码可能会延时送达,请您耐心等待。", + "Password must be a combination of letters and numbers":"密码必须是字母加数字的组合", + "New password":"新密码", + "Please enter a account":"请输入账号", + "Please enter a password":"请输入密码" } \ No newline at end of file diff --git a/src/pages/account/index.tsx b/src/pages/account/index.tsx index e653bf8..5631fb7 100644 --- a/src/pages/account/index.tsx +++ b/src/pages/account/index.tsx @@ -5,6 +5,7 @@ import store from '../../store' import { getTime } from '../../utils' import { useEffect, useState } from 'react' import { http_addReceiveAccount, http_token } from '../../http/api' +import { useTranslation } from 'react-i18next' const Account = () => { @@ -13,6 +14,7 @@ const Account = () => { const [visible, setVisible] = useState(false) const [options, setOptions] = useState([]) const [tokenId, setTokenId] = useState(-1) + const { t } = useTranslation() const getData = async () => { const res: any = await http_token() @@ -20,7 +22,7 @@ const Account = () => { if (res.code === 0) { res.data.forEach((item: any) => { _options.push({ - label: `${item.symbol}取款 - 币种:${item.symbol}`, + label: `${item.symbol} ${t('Withdraw')} - ${t('Symbol')}:${item.symbol}`, value: item.id }) }) @@ -36,7 +38,7 @@ const Account = () => { if (res.code === 0) { store.getReceiveAccount() notification.success({ - message: '添加成功' + message: t('Added successfully') }) form.resetFields() setTokenId(-1) @@ -46,37 +48,37 @@ const Account = () => { useEffect(() => { getData() - }, []) + }, [t]) return (
-
办理存款
-
{receiveAccount.length}条
-
已绑定
+
{t('Handle deposit')}
+
{receiveAccount.length}
+
{t('Strips are bound')}
-
setVisible(true)}>填写收款账户
+
setVisible(true)}>+{t('Fill in the payment account')}
{ receiveAccount.map(item => (
-
有效
+
{t('Valid')}
{item.type}
-
钱包类型
+
{t('Wallet type')}
{item.address}
-
钱包地址
+
{t('Wallet Address')}
-
时间 {getTime(item.time * 1000)}
+
{t('Time')} {getTime(item.time * 1000)}
)) } setVisible(false)} - title="添加收款账户" + title={t('Add payment account')} footer={null} >
{ className='mt-2' onFinish={onFinish} > - 收款方式}> - setTokenId(val)} /> { tokenId >= 0 && ( <> - 链类型}> - + {t('Chain type')}}> + - 钱包地址}> - + {t('Wallet Address')}}> + ) }
- - + +
diff --git a/src/pages/deposit/index.tsx b/src/pages/deposit/index.tsx index 3550e5e..ccb0987 100644 --- a/src/pages/deposit/index.tsx +++ b/src/pages/deposit/index.tsx @@ -6,6 +6,7 @@ import { observer } from 'mobx-react' import store from '../../store' import { copy } from '../../utils' import imageCompression from 'browser-image-compression'; +import { useTranslation } from 'react-i18next' const Deposit = () => { @@ -19,6 +20,7 @@ const Deposit = () => { const [imgUrl, setImgUrl] = useState([] as string[]) const fileRef = useRef(null) let [loading, setLoading] = useState([] as any) + const { t } = useTranslation() const getData = async () => { const res: any = await http_depositAddress() @@ -39,10 +41,10 @@ const Deposit = () => { const validateAmount = (_: any, value: string) => { if (!value) { - return Promise.reject(new Error('请输入转账金额')) + return Promise.reject(new Error(t('Please enter the transfer amount'))) } if (Number(value) <= 0) { - return Promise.reject(new Error('转账金额必须大于 0')) + return Promise.reject(new Error(t('Transfer amount must be greater than 0'))) } return Promise.resolve(); } @@ -59,7 +61,7 @@ const Deposit = () => { const submit = async (index: number) => { const file = urls[index] - if (!file) return notification.warning({ message: '请上传付款凭证' }); + if (!file) return notification.warning({ message: t('Please upload payment voucher') }); try { loading[index] = true setLoading([...loading]) @@ -69,7 +71,6 @@ const Deposit = () => { useWebWorker: true, initialQuality: 1 }); - const result: any = await http_upload(compressedFile) if (result.code === 0) { const res: any = await http_transferDeposit({ @@ -85,7 +86,7 @@ const Deposit = () => { visibles[index] = false setVisibles([...visibles]) notification.success({ - message: '提交成功' + message: t('Submit success') }) } } @@ -100,7 +101,7 @@ const Deposit = () => { try { if (fileList && fileList.length > 0) { urls[index] = fileList[0] - console.log('当前文件大小', fileList[0].size / 1024 / 1024); + // console.log('当前文件大小', fileList[0].size / 1024 / 1024); setUrls([...urls]) fileToBase64(fileList[0]).then((res: any) => { if (res) { @@ -121,14 +122,13 @@ const Deposit = () => { return (
-
setVisibles(receiveAdds.map(v => false))}>办理存款
- +
{t('Handle deposit')}
{ receiveAdds.map((item, index) => !visibles[index] && (
-
策略量化存款-存款注意事项
-
尊敬的客户,请您转账时务必仔细检查钱包地址全部一致。转账完毕后,请及时上传转账凭证。
+
{t('Strategy Quantitative Deposit-Deposit Notes')}
+
{t('Dear customer, please be sure to carefully check that all wallet addresses are consistent when transferring funds. After the transfer is completed, please upload the transfer voucher in time.')}
@@ -137,15 +137,15 @@ const Deposit = () => { onFinish={val => onFinish(val, index)} form={form} > - 存款到}> - - 存款金额}> - + {t('Deposit amount')}}> +
- +
@@ -158,24 +158,24 @@ const Deposit = () => { receiveAdds.map((item: any, index: number) => visibles[index] && (
-
策略量化存款-存款注意事项
-
尊敬的客户,请您转账时务必仔细检查钱包地址全部一致。转账完毕后,请及时上传转账凭证。
+
{t('Strategy Quantitative Deposit-Deposit Notes')}
+
{t('Dear customer, please be sure to carefully check that all wallet addresses are consistent when transferring funds. After the transfer is completed, please upload the transfer voucher in time.')}
-
请向下方账户转账
+
{t('Please transfer money to the account below')}
-
钱包类型
+
{t('Wallet type')}
{item.type}
-
钱包地址
+
{t('Wallet Address')}
copy(item.address)}>{item.address}
-
上传付款凭证
+
{t('Upload payment voucher')}
onChange(e.target.files, index)} style={{ display: 'none' }} />
{ @@ -186,7 +186,7 @@ const Deposit = () => { imgUrl[index] = '' fileRef.current!.value = '' setImgUrl([...imgUrl]) - }}>删除 + }}>{t('Delete')} { ) : (
fileRef.current!.click()}>
+
-
上传付款凭证
+
{t('Upload payment voucher')}
) } @@ -204,7 +204,14 @@ const Deposit = () => {
- + +
diff --git a/src/pages/home/index.tsx b/src/pages/home/index.tsx index 781c5e8..150c280 100644 --- a/src/pages/home/index.tsx +++ b/src/pages/home/index.tsx @@ -6,10 +6,12 @@ import { useEffect, useState } from 'react'; import store from '../../store'; import { http_earn_trend } from '../../http/api'; import { observer } from 'mobx-react'; +import { useTranslation } from 'react-i18next'; const Home = () => { const { token, userInfo } = store.state + const { t } = useTranslation() const [chartData, setChartData] = useState({ times: [], values: [] @@ -43,14 +45,14 @@ const Home = () => { return (
-
仪表盘
+
{t('Dashboard')}
-
总收益
+
{t('Total revenue')}
`$${userInfo.total_income || 0}`} />
@@ -58,7 +60,7 @@ const Home = () => {
-
CFD 账户 {userInfo.account}
+
CFD {t('Account')} {userInfo.account}
@@ -66,28 +68,28 @@ const Home = () => { -

资本

+

{t('Capital')}

${userInfo.account_capital || 0}

-

余额

+

{t('Balance')}

${userInfo.account_balance || 0}

-

信用度

+

{t('Creditworthiness')}

${userInfo.account_credit || 0}

-

净值

+

{t('net worth')}

${userInfo.account_net_worth || 0}

@@ -95,7 +97,7 @@ const Home = () => {
-
账户状态:{userInfo.account_status}
+
{t('Account status')}:{userInfo.account_status}
diff --git a/src/pages/link/index.tsx b/src/pages/link/index.tsx index 3db66af..5fc5a23 100644 --- a/src/pages/link/index.tsx +++ b/src/pages/link/index.tsx @@ -5,24 +5,26 @@ import { IoCopyOutline } from "react-icons/io5"; import { copy } from '../../utils'; import { observer } from 'mobx-react'; import store from '../../store'; +import { useTranslation } from 'react-i18next'; const Link = () => { const { userInfo } = store.state + const { t } = useTranslation() return (
-
推广链接
+
{t('Promotion links')}
-
代理推广链接
+
{t('Agent promotion link')}
- 推荐码: + {t('Referral code')}: {userInfo.inviti_code} copy(userInfo.inviti_code)} />
@@ -40,7 +42,7 @@ const Link = () => { backgroundColor: '#007DBA' }} onClick={() => copy(`${window.origin}/#/createProxy?code=${userInfo.inviti_code}`)} - >链接复制 + >{t('Copy link')}
diff --git a/src/pages/record/assets/index.tsx b/src/pages/record/assets/index.tsx index 90ff2e6..7c00adf 100644 --- a/src/pages/record/assets/index.tsx +++ b/src/pages/record/assets/index.tsx @@ -7,11 +7,12 @@ import { useMemo } from 'react' import { ConfigProvider, Tabs } from 'antd' import { http_account_assetsRecords, http_cash } from '../../../http/api' import { getTime } from '../../../utils' +import { useTranslation } from 'react-i18next' const AssetsRecords = () => { const { screenWidth } = store.state - + const { t } = useTranslation() const containerWidth = useMemo(() => { if (screenWidth > 1420) { return 1420 - 310 @@ -28,12 +29,12 @@ const AssetsRecords = () => { apiFun={http_account_assetsRecords} columns={[ { - title: '状态', + title: t('Status'), dataIndex: 'status', width: 150 }, { - title: '时间', + title: t('Time'), dataIndex: 'time', width: 200, render: (time: number) => ( @@ -41,28 +42,28 @@ const AssetsRecords = () => { ) }, { - title: '事件', + title: t('Event'), dataIndex: 'event', width: 150 }, { - title: '订单', + title: t('Order'), dataIndex: 'order', width: 120 }, { - title: '账户', + title: t('Account'), dataIndex: 'account' }, { - title: '金额', + title: t('Amount'), dataIndex: 'amount', render: (val: string) => ( ${val} ) }, { - title: '描述', + title: t('Describe'), dataIndex: 'describe' }, @@ -78,7 +79,7 @@ const AssetsRecords = () => { extraProps={{ type: 1 }} columns={[ { - title: '时间', + title: t('Time'), dataIndex: 'time', width: 200, render: (time: number) => ( @@ -86,26 +87,26 @@ const AssetsRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order', }, { - title: '描述', + title: t('Describe'), dataIndex: 'describe', }, { - title: '金额', + title: t('Describe'), dataIndex: 'amount' }, { - title: '剩余', + title: t('Remaining'), dataIndex: 'balance', render: (val: string) => ( ${val} ) }, { - title: '状态', + title: t('Status'), dataIndex: 'status' }, ]} @@ -120,7 +121,7 @@ const AssetsRecords = () => { extraProps={{ type: 2 }} columns={[ { - title: '时间', + title: t('Time'), dataIndex: 'time', width: 200, render: (time: number) => ( @@ -128,26 +129,26 @@ const AssetsRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order', }, { - title: '描述', + title: t('Describe'), dataIndex: 'describe', }, { - title: '金额', + title: t('Amount'), dataIndex: 'amount' }, { - title: '剩余', + title: t('Remaining'), dataIndex: 'balance', render: (val: string) => ( ${val} ) }, { - title: '状态', + title: t('Status'), dataIndex: 'status' }, ]} @@ -162,7 +163,7 @@ const AssetsRecords = () => { extraProps={{ type: 3 }} columns={[ { - title: '时间', + title: t('Time'), dataIndex: 'time', width: 200, render: (time: number) => ( @@ -170,26 +171,26 @@ const AssetsRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order', }, { - title: '描述', + title: t('Describe'), dataIndex: 'describe', }, { - title: '金额', + title: t('Amount'), dataIndex: 'amount' }, { - title: '剩余', + title: t('Remaining'), dataIndex: 'balance', render: (val: string) => ( ${val} ) }, { - title: '状态', + title: t('Status'), dataIndex: 'status' }, ]} @@ -199,7 +200,7 @@ const AssetsRecords = () => { return (
-
账单记录
+
{t('Billing records')}
{ 资金账户', + label: t('Cash Wallet-Asset Account'), children: WalletToAsseetRecord(), }, { key: '3', - label: '现金钱包->其他会员', + label: t('Cash Wallet-Other Members'), children: AssetToVipRecords(), }, { key: '4', - label: '资产账户->现金钱包', + label: t('Asset Account-Cash Wallet'), children: AssetToWalletRecords(), } ]} /> diff --git a/src/pages/record/bonus/index.tsx b/src/pages/record/bonus/index.tsx index 9e23613..2693410 100644 --- a/src/pages/record/bonus/index.tsx +++ b/src/pages/record/bonus/index.tsx @@ -7,10 +7,12 @@ import { useMemo } from 'react' import { http_bonus } from '../../../http/api' import { getTime } from '../../../utils' import { Input, Select } from 'antd' +import { useTranslation } from 'react-i18next' const BonusRecords = () => { const { screenWidth } = store.state + const { t } = useTranslation() const containerWidth = useMemo(() => { if (screenWidth > 1420) { @@ -23,48 +25,48 @@ const BonusRecords = () => { }, [screenWidth]) const options = [ - { label: '请选择类型', value: 0 }, - { label: '交易利润', value: 1 }, - { label: '盈利分红', value: 2 }, - { label: '超级奖励', value: 3 }, - { label: '交易佣金', value: 4 }, - { label: '星级奖励', value: 5 }, + { label: t('Please choose the type'), value: 0 }, + { label: t('Trading profit'), value: 1 }, + { label: t('Profit dividends'), value: 2 }, + { label: t('Super reward'), value: 3 }, + { label: t('Trading commissions'), value: 4 }, + { label: t('Star reward'), value: 5 }, ] const searchConfigList = [ { key: 'type', name: 'type', - label: '全部类型', + label: t('All types'), initialValue: 0, - slot: }, { key: 'order', name: 'order', - label: '订单号', + label: t('Order number'), initialValue: '', - slot: + slot: }, { key: 'assets', name: 'assets', - label: '资金账户', + label: t('Capital account'), initialValue: '', - slot: + slot: } ] return (
-
奖金明细
+
{t('Bonus details')}
( @@ -72,30 +74,30 @@ const BonusRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order' }, { - title: '事件', + title: t('Event'), dataIndex: 'event', width: 200 }, { - title: '来自', + title: t('From'), dataIndex: 'source' }, // { // title: '受益' // }, { - title: '金额', + title: t('Amount'), dataIndex: 'amount', render: (val: string) => ( ${val} ) }, { - title: '余额', + title: t('Balance'), dataIndex: 'balance', render: (val: string) => ( ${val} diff --git a/src/pages/record/deposit/index.tsx b/src/pages/record/deposit/index.tsx index 920cda7..3ae6528 100644 --- a/src/pages/record/deposit/index.tsx +++ b/src/pages/record/deposit/index.tsx @@ -6,11 +6,12 @@ import store from '../../../store' import { useMemo } from 'react' import { http_depositHistory, http_withdrawRecords } from '../../../http/api' import { getTime } from '../../../utils' +import { useTranslation } from 'react-i18next' const DepositRecords = () => { const { screenWidth } = store.state - + const { t } = useTranslation() const containerWidth = useMemo(() => { if (screenWidth > 1420) { return 1420 - 310 @@ -23,18 +24,18 @@ const DepositRecords = () => { return (
-
存款记录
+
{t('Deposit records')}
( @@ -42,11 +43,11 @@ const DepositRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order' }, { - title: '到账金额', + title: t('Amount received'), dataIndex: 'amount', width: 160, render: (val: string) => ( @@ -54,7 +55,7 @@ const DepositRecords = () => { ) }, { - title: '付款金额', + title: t('Payment amount'), dataIndex: 'payment_amount', width: 160, render: (val: string) => ( @@ -62,7 +63,7 @@ const DepositRecords = () => { ) }, { - title: '账号', + title: t('Account'), dataIndex: 'account' } ]} diff --git a/src/pages/record/escrow/index.tsx b/src/pages/record/escrow/index.tsx index 106449e..5ec3b1a 100644 --- a/src/pages/record/escrow/index.tsx +++ b/src/pages/record/escrow/index.tsx @@ -6,10 +6,12 @@ import store from '../../../store' import { useMemo } from 'react' import { http_escrowRecords } from '../../../http/api' import { getTime } from '../../../utils' +import { useTranslation } from 'react-i18next' const EscrowRecords = () => { const { screenWidth } = store.state + const { t } = useTranslation() const containerWidth = useMemo(() => { if (screenWidth > 1420) { @@ -23,18 +25,18 @@ const EscrowRecords = () => { return (
-
托管记录
+
{t('Escrow records')}
( @@ -42,7 +44,7 @@ const EscrowRecords = () => { ) }, { - title: '结束时间', + title: t('End time'), dataIndex: 'end_time', width: 200, render: (time: number) => ( @@ -50,7 +52,7 @@ const EscrowRecords = () => { ) }, { - title: '金额', + title: t('Amount'), dataIndex: 'amount', width: 160, render: (val: string) => ( diff --git a/src/pages/record/withdraw/index.tsx b/src/pages/record/withdraw/index.tsx index 52fa766..a2e4952 100644 --- a/src/pages/record/withdraw/index.tsx +++ b/src/pages/record/withdraw/index.tsx @@ -6,10 +6,12 @@ import store from '../../../store' import { useMemo } from 'react' import { http_withdrawRecords } from '../../../http/api' import { getTime } from '../../../utils' +import { useTranslation } from 'react-i18next' const WithdrawRecords = () => { const { screenWidth } = store.state + const { t } = useTranslation() const containerWidth = useMemo(() => { if (screenWidth > 1420) { @@ -23,18 +25,18 @@ const WithdrawRecords = () => { return (
-
取款记录
+
{t('Withdraw records')}
( @@ -42,33 +44,33 @@ const WithdrawRecords = () => { ) }, { - title: '订单', + title: t('Order'), dataIndex: 'order' }, { - title: '取款金额', + title: t('Withdraw amount'), dataIndex: 'amount', render: (val: string) => ( ${val} ) }, { - title: '到账金额', + title: t('Amount received'), dataIndex: 'receipt_amount', render: (val: string) => ( ${val} ) }, { - title: '账号', + title: t('Account'), dataIndex: 'account' }, { - title: '收款户名', + title: t('Account name'), dataIndex: 'type' }, { - title: '收款地址', + title: t('Receive address'), dataIndex: 'address' } ]} diff --git a/src/pages/security/index.tsx b/src/pages/security/index.tsx index 0a2a093..831485d 100644 --- a/src/pages/security/index.tsx +++ b/src/pages/security/index.tsx @@ -6,18 +6,20 @@ import CountdownTimer, { CountdownTimerRef } from "../../components/CountdownTim import { useRef } from "react" import { observer } from "mobx-react" import store from "../../store" +import { useTranslation } from "react-i18next" const Security = () => { const { userInfo } = store.state const [form] = Form.useForm() const countdownRef = useRef(null) + const { t } = useTranslation() const onFinish: FormProps['onFinish'] = async (values) => { const res: any = await http_reset_password(values) if (res.code === 0) { notification.success({ - message: '修改成功,请重新登录' + message: t('Modification successful, please log in again') }) store.setToken('') } @@ -25,11 +27,11 @@ const Security = () => { const validatePassword = (_: any, value: string) => { if (!value) { - return Promise.reject(new Error("请输入新密码")); + return Promise.reject(new Error(t('Please enter a new password'))); } const regex = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,32}$/; if (!regex.test(value)) { - return Promise.reject(new Error("密码必须包含字母和数字,长度为8-32位")); + return Promise.reject(new Error(t('Password must contain letters and numbers and be 8-32 characters long'))); } return Promise.resolve(); }; @@ -44,11 +46,11 @@ const Security = () => { }) if (res.code === 0) { notification.success({ - message: '验证码发送成功' + message: t('Verification code sent successfully') }) } else { notification.error({ - message: '验证码发送失败' + message: t('Failed to send verification code') }) countdownRef.current?.handleStop() } @@ -61,31 +63,31 @@ const Security = () => { return (
-
办理存款
+
{t('Security settings')}
-
修改登录密码
+
{t('Change login password')}
-

1.在使用过程中请务必确认设备安全,防止数据被篡改或泄露。

-

2.邮箱验证码可能会延时送达,请您耐心等待。

+

{t('1. Please make sure the device is safe during use to prevent data from being tampered with or leaked.')}

+

{t('2. The email verification code may be delayed, please wait patiently.')}

- 新密码}> - + {t('New password')}}> + - 验证码}> + {t('Verification Code')}}>
- -
- +
diff --git a/src/pages/submit/index.tsx b/src/pages/submit/index.tsx index 1f91ab1..223e372 100644 --- a/src/pages/submit/index.tsx +++ b/src/pages/submit/index.tsx @@ -5,6 +5,8 @@ import { useRouter } from '../../hooks/useRouter' import store from '../../store' import { useEffect, useState } from 'react' import { http_code, http_login, http_submit } from '../../http/api' +import { useTranslation } from 'react-i18next' +import LanguageMenu from '../../components/LanguageMenu' type FieldType = { account: string; password: string; @@ -13,6 +15,7 @@ type FieldType = { const Submit = () => { const [form] = Form.useForm() + const { t } = useTranslation() const onFinish: FormProps['onFinish'] = async (values) => { const res: any = await http_submit({ @@ -20,7 +23,7 @@ const Submit = () => { }) if (res.code === 0) { notification.success({ - message: '提交成功' + message: t('Submit success') }) form.resetFields() } @@ -31,8 +34,12 @@ const Submit = () => { }, []) return ( -
+
+
+ +
+
@@ -47,25 +54,25 @@ const Submit = () => { rules={[ { required: true, - message: '请输入账号!', + message: t('Please enter a account'), }, ]} > - + - + - +
diff --git a/src/pages/team/index.tsx b/src/pages/team/index.tsx index 33a9376..44fa867 100644 --- a/src/pages/team/index.tsx +++ b/src/pages/team/index.tsx @@ -4,12 +4,14 @@ import { useEffect, useState } from 'react' import { http_team } from '../../http/api' import { observer } from 'mobx-react' import store from '../../store' +import { useTranslation } from 'react-i18next' const Team = () => { const { token } = store.state const [rootAccount, setRootState] = useState('') const [teamAccount, setTeamAccount] = useState([]) + const { t } = useTranslation() useEffect(() => { const getData = async () => { @@ -25,7 +27,7 @@ const Team = () => { return (
-
团队详情
+
{t('Team details')}
diff --git a/src/pages/transfer/index.tsx b/src/pages/transfer/index.tsx index 9def1c2..a751334 100644 --- a/src/pages/transfer/index.tsx +++ b/src/pages/transfer/index.tsx @@ -4,15 +4,17 @@ import { useState } from 'react' import { observer } from 'mobx-react' import store from '../../store' import { http_transfer } from '../../http/api' +import { useTranslation } from 'react-i18next' const Transfer = () => { const { userInfo } = store.state const [form] = Form.useForm() + const { t } = useTranslation() const options = [ - { label: '现金钱包-资产账户', value: 1 }, - { label: '现金钱包-其他会员', value: 2 }, - { label: '资产账户-现金钱包', value: 3 } + { label: t('Cash Wallet-Asset Account'), value: 1 }, + { label: t('Cash Wallet-Other Members'), value: 2 }, + { label: t('Asset Account-Cash Wallet'), value: 3 } ] const [type, setType] = useState(-1) @@ -30,7 +32,7 @@ const Transfer = () => { store.getUserInfo() form.resetFields() notification.success({ - message: '提交成功' + message: t('Submit success') }) } @@ -38,14 +40,14 @@ const Transfer = () => { return (
-
资金划转
+
{t('Assets transfer')}
-
资金转账-注意事项
+
{t('Assets transfer-matters needing attention')}
-

1.在使用过程中请务必确认设备安全,防止数据被篡改或泄露。

-

2.资金转账过程中如遇卡顿等情况,请稍后处理或联系客服。

-

3.资金转账操作后,系统会有延时情况;如超过10分钟仍未到账,请联系客服。

+

{t('1.Please ensure the safety of the equipment during use,Prevent data from being tampered with or leaked。')}

+

{t('2.In the process of fund transfer, if there is a delay or other situation,Please handle it later or contact customer service。')}

+

{t('3.After fund transfer operation,There may be delays in the system;If exceeding10Minutes have not yet arrived,Please contact customer service。')}

@@ -55,17 +57,17 @@ const Transfer = () => { onFinish={onFinish} form={form} > - 资金操作}> - { type < 3 ? (
- 钱包金额: + {t('Wallet balance')}: ${userInfo.balance}
) : (
- 资产账户金额: + {t('Asset account amount')}: ${userInfo.account_balance}
) @@ -74,35 +76,35 @@ const Transfer = () => { { type === 2 && ( - - + + ) } { type === 1 && ( - 资金账户}> - + {t('Capital account')}}> + ) } { type === 3 && ( - 资金账户}> - + {t('Capital account')}}> + ) } - 转账金额}> - + {t('Transfer amount')}}> +
- +
diff --git a/src/pages/withdraw/index.tsx b/src/pages/withdraw/index.tsx index 6b16c22..39ffa62 100644 --- a/src/pages/withdraw/index.tsx +++ b/src/pages/withdraw/index.tsx @@ -5,12 +5,14 @@ import store from '../../store' import { useMemo, useRef, useState } from 'react' import CountdownTimer, { CountdownTimerRef } from '../../components/CountdownTimer' import { http_send_email, http_withdraw } from '../../http/api' +import { useTranslation } from 'react-i18next' const Withdraw = () => { const [form] = Form.useForm() const { receiveAccount, userInfo } = store.state const countdownRef = useRef(null) + const { t } = useTranslation() const options = useMemo(() => { const map = receiveAccount.map(item => ({ @@ -24,7 +26,7 @@ const Withdraw = () => { if (Number(values.amount) > Number(userInfo.balance)) { notification.warning({ - message: '余额不足' + message: t('Insufficient balance') }) return } @@ -36,7 +38,7 @@ const Withdraw = () => { if (res.code === 0) { form.resetFields() notification.success({ - message: '提交成功' + message: t('Submit success') }) } @@ -52,11 +54,11 @@ const Withdraw = () => { }) if (res.code === 0) { notification.success({ - message: '验证码发送成功' + message: t('Verification code sent successfully') }) } else { notification.error({ - message: '验证码发送失败' + message: t('Failed to send verification code') }) countdownRef.current?.handleStop() } @@ -68,11 +70,11 @@ const Withdraw = () => { return (
-
办理取款
+
{t('Handle withdraw')}
-
提示
-
在使用过程中请务必确认设备安全,防止数据篡改或泄露。
+
{t('Hint')}
+
{t('Please make sure the device is safe during use to prevent data tampering or leakage.')}
@@ -82,25 +84,25 @@ const Withdraw = () => { form={form} >
- 取款账号}> - - 取款金额}> + {t('Withdraw amount')}}>
- +
USD
- 收款方式}> - - 验证码}> + {t('Verification Code')}}>
- -
@@ -109,7 +111,7 @@ const Withdraw = () => {
- +
diff --git a/src/router/index.tsx b/src/router/index.tsx index 7ee8867..3354895 100644 --- a/src/router/index.tsx +++ b/src/router/index.tsx @@ -10,6 +10,7 @@ import { unLoginPath } from "./routes"; import { Divider, Modal } from "antd"; import { NotifyStatus_Type } from "../types"; import { http_notify } from "../http/api"; +import { useTranslation } from "react-i18next"; import LanguageMenu from "../components/LanguageMenu"; const LayoutRouter = () => { @@ -18,6 +19,8 @@ const LayoutRouter = () => { const [visible, setVisible] = useState(false) const { token, screenWidth } = store.state const [notifys, setNotifys] = useState([] as any) + const { t } = useTranslation() + // useEffect(() => { @@ -31,6 +34,7 @@ const LayoutRouter = () => { } }, []) + useEffect(() => { if (!token && !unLoginPath.includes(location.pathname) && location.pathname !== "/submit") { @@ -46,8 +50,6 @@ const LayoutRouter = () => { try { const res: any = await http_notify() if (res.code === 0) { - console.log(res); - setNotifys(res.data) const type = window.localStorage.getItem('NotifyStatus') || NotifyStatus_Type.show if (type === NotifyStatus_Type.show && res.data && res.data.length > 0) { @@ -72,14 +74,16 @@ const LayoutRouter = () => { } }, [token]) + if (location.pathname === '/submit') return <> + return ( <> { !token ? ( <> - {/*
- -
*/} +
+ +
) : ( @@ -103,7 +107,7 @@ const LayoutRouter = () => { onCancel={() => setVisible(false)} footer={() => null} width={screenWidth > 1000 ? '60%' : '90%'} - title="平台公告" + title={t('Platform announcement')} >
{ diff --git a/src/router/renderRouter.tsx b/src/router/renderRouter.tsx index 24c7974..1a0ed18 100644 --- a/src/router/renderRouter.tsx +++ b/src/router/renderRouter.tsx @@ -2,14 +2,12 @@ import { Suspense } from "react"; import { Route, Routes } from "react-router-dom"; import routes from "./routes"; import { observer } from "mobx-react"; +import { Spin } from "antd"; const RenderRouter = () => { return ( -
- {/* */} -
加载中...
-
+
}> {routes.map(item => { diff --git a/src/router/routes.tsx b/src/router/routes.tsx index 7731ad7..d025620 100644 --- a/src/router/routes.tsx +++ b/src/router/routes.tsx @@ -74,10 +74,6 @@ const routes = [ path: "/assetsRecords", element: }, - { - path: "/personal", - element: - }, { path: '/withdrawRecords', element: diff --git a/src/styles/app.scss b/src/styles/app.scss index 7751b99..3c1eddd 100644 --- a/src/styles/app.scss +++ b/src/styles/app.scss @@ -58,7 +58,7 @@ } .balance-button { - width: 158px; + width: 188px; height: 58px; border-radius: 29px; background-color: #fff; @@ -66,6 +66,7 @@ font-size: 14px; font-weight: normal; text-align: center; + overflow: hidden; } } diff --git a/src/styles/home.scss b/src/styles/home.scss index f33ccd1..eafd4ac 100644 --- a/src/styles/home.scss +++ b/src/styles/home.scss @@ -62,7 +62,7 @@ border-radius: 5px; } - .upload{ + .upload { width: 100px; height: 100px; border-style: dashed; @@ -73,14 +73,15 @@ user-select: none; overflow: hidden; position: relative; - .delete{ + + .delete { position: absolute; top: 0; right: 0; z-index: 1; } - &:active{ + &:active { opacity: 0.6; } } @@ -190,8 +191,10 @@ } } -.ant-tabs-nav-wrap { - overflow: hidden; - overflow-x: scroll; - width: 400px; +@media (max-width:1000px) { + .ant-tabs-nav-wrap { + overflow: hidden; + overflow-x: scroll; + max-width: calc(var(--width) - 30px); + } } \ No newline at end of file diff --git a/src/utils/index.ts b/src/utils/index.ts index 9dea92c..b1dd039 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,4 +1,5 @@ import { notification } from "antd" +import i18next from "i18next" export function copy(value: string, cb?: Function) { // 动态创建 textarea 标签 @@ -18,7 +19,7 @@ export function copy(value: string, cb?: Function) { document.execCommand('Copy') document.body.removeChild(textarea) notification.success({ - message: '复制成功' + message: i18next.t('Copy successfully') }) if (cb && Object.prototype.toString.call(cb) === '[object Function]') { cb()