修改页面bug

7 months ago · c5eb870f65
20 changed files with 10920 additions and 80 deletions
--- a/env.md
+++ b/env.md
@ -1,4 +1,4 @@
 SKIP_PREFLIGHT_CHECK=true
 GENERATE_SOURCEMAP=false
-REACT_APP_CHAINID=97
-REACT_APP_DAY_TIME=60
+REACT_APP_CHAINID=56
+REACT_APP_DAY_TIME=86400
--- a/package.json
+++ b/package.json
@ -82,6 +82,7 @@
    "build": "node scripts/build.js",
    "test": "node scripts/test.js",
    "deploy:dev": "npm run build && scp -r ./build/* vps:/home/ubuntu/pzy/sofil",
+    "deploy:test": "npm run build && scp -r ./build/* dcfilefast_prod:/home/web/code/test-app.sofil.io",
    "deploy:prod": "npm run build && scp -r ./build/* vpsDcminer:/data/wwwroot/sofil"
  },
  "eslintConfig": {
--- a/src/assets/menu/menu-bg-1.png
+++ b/src/assets/menu/menu-bg-1.png
--- a/src/contract/api.ts
+++ b/src/contract/api.ts
@ -8,9 +8,10 @@ import {
 } from "~/types/api.d";
 import { toFixed2 } from "~/utils";
 import { fromWei, toBigInt, toWei } from "~/utils/wei";
+import { Pledge } from "./typechain-types";
 const { _contract } = store.state.contract;

-const { Pledge__factory } = _contract;
+const Pledge__factory =(_contract ? _contract.Pledge__factory : {} ) as Pledge;

 const eth_pledgeRecords = async (_owner: string) => {
  const _recordPs = Pledge__factory.getPledgeRecords(_owner); //質押記錄
--- a/src/contract/index.tsx
+++ b/src/contract/index.tsx
@ -5,16 +5,16 @@ import store from '~/store';
 import { ContractType } from '~/types/store';
 // 0x7a89c2D92Bf53160ab58d7889966741cA8Eb5855
 export const config = {
-  56: {
-    chainId: 56,
-    rpc: "https://bsc-dataseed1.defibit.io",
-    address: {
-      FIL__factory: "0x0d8ce2a99bb6e3b7db580ed848240e4a0f9ae153",
-      NFT__factory: "0x5fd156B6B47Bb0B363fa3D4e2E31a8394Ee7A630",
-      Pool__factory: "0xC31cEb39961076d8fAD3936D88489972c02b4D83",
-      Pledge__factory: "0x2F3d8761c8214627743F84F9890A8eEeD914ddf1",
-    }
-  },
+  // 56: {
+  //   chainId: 56,
+  //   rpc: "https://bsc-dataseed1.defibit.io",
+  //   address: {
+  //     FIL__factory: "0x0d8ce2a99bb6e3b7db580ed848240e4a0f9ae153",
+  //     NFT__factory: "0x5fd156B6B47Bb0B363fa3D4e2E31a8394Ee7A630",
+  //     Pool__factory: "0xC31cEb39961076d8fAD3936D88489972c02b4D83",
+  //     Pledge__factory: "0x2F3d8761c8214627743F84F9890A8eEeD914ddf1",
+  //   }
+  // },
  97: {
    chainId: 97,
    rpc: "https://bsc-testnet.blockpi.network/v1/rpc/public",
@ -34,7 +34,7 @@ export const config = {
      Pool__factory: "0xCf7Ed3AccA5a467e9e704C703E8D87F634fB0Fc9",
      Pledge__factory: "0x5FC8d32690cc91D4c39d9d3abcBD16989F875707",
    }
-  }
+  },
 } as any
 // 57.333333333333333332
 const contractObj = {
@ -75,42 +75,46 @@ const switchNetWork = () => {

 export const initContract = async () => {

-  let chainId = Number(process.env.REACT_APP_CHAINID);
-  let account = [] as string[];
+  try {
+    let chainId = Number(process.env.REACT_APP_CHAINID);
+    let account = [] as string[];

-  let _contract: { [key: string]: any } = {
-    _contract: {},
-    _provider: null
-  };
+    let _contract: { [key: string]: any } = {
+      _contract: {},
+      _provider: null
+    };


-  if (window.ethereum) {
-    account = await window.ethereum.request({
-      method: 'eth_accounts'
-    });
-    chainId = ethers.toNumber(await window.ethereum.request({
-      method: 'eth_chainId'
-    })) 
-  }
+    if (window.ethereum) {
+      account = await window.ethereum.request({
+        method: 'eth_accounts'
+      });
+      chainId = ethers.toNumber(await window.ethereum.request({
+        method: 'eth_chainId'
+      }))
+    }
+
+    if (!config[chainId]) {
+      chainId = Number(process.env.REACT_APP_CHAINID)
+    };
+
+    const contractAddress = config[chainId];
+    let _provider = null as any;
+
+    if (account.length <= 0) {
+      _provider = new ethers.JsonRpcProvider(contractAddress.rpc)
+    } else {
+      _provider = await new ethers.BrowserProvider(window.ethereum).getSigner()
+    }
+
+    _contract._provider = _provider;

-  if(!config[chainId]){
-    chainId = Number(process.env.REACT_APP_CHAINID)
-  };
+    Object.keys(contractAddress.address).forEach((item) => {
+      _contract._contract[item] = contractObj[item].connect(contractAddress.address[item], _provider);
+    })
+    store.setContract(_contract as ContractType);
+  } catch (error) {

-  const contractAddress = config[chainId];
-  let _provider = null as any;
-  
-  if (account.length <= 0) {
-    _provider = new ethers.JsonRpcProvider(contractAddress.rpc)
-  } else {
-    _provider = await new ethers.BrowserProvider(window.ethereum).getSigner()
  }
-  
-  _contract._provider = _provider;

-  Object.keys(contractAddress.address).forEach((item) => {
-    _contract._contract[item] = contractObj[item].connect(contractAddress.address[item], _provider);
-  })
-  store.setContract(_contract as ContractType);
-  
 }
--- a/src/language/hk.json
+++ b/src/language/hk.json
@ -81,7 +81,7 @@
  "WITHDRAW":"提取",
  "No. of Staking Contracts":"持有的質押合約",
  "Contract(NFT)":"合約NFT",
-  "Withdrawable":"可提取總額",
+  "Withdrawable":"可提取收益",
  "Maturity Date":"到期日",
  "Status":"狀態",
  "Active":"未到期",
@ -90,8 +90,9 @@
  "No records":"暫無記錄",
  "Accumulative Stake":"總質押",
  "Accumulative Rewards Withdraw":"總提取收益",
-  "Withdraw":"質押",
-  "Stake":"提取",
+  "Accumulative Rewards":"總收益",
+  "Withdraw":"提取",
+  "Stake":"質押",
  "Create Contract(NFT)":"創建合約（NFT）",
  "Contract Address":"合約地址",
  "Copy Success":"複製成功",
@ -125,7 +126,7 @@
  "Addresses": "錢包地址",
  "Contributed": "獎勵貢獻",
  "Binding Time": "綁定時間",
-  "Contreact(Rewards) Details": "合約(奖励)明細",
+  "Contract(Rewards) Details": "合約(奖励)明細",
  "Days Staking": "天質押",
  "Rewards Details": "收益及提取明細"
 }
--- a/src/language/zh.json
+++ b/src/language/zh.json
@ -81,7 +81,7 @@
  "WITHDRAW": "提取",
  "No. of Staking Contracts": "持有的质押合约",
  "Contract(NFT)": "合约NFT",
-  "Withdrawable": "可提取总额",
+  "Withdrawable": "可提取收益",
  "Maturity Date": "到期日",
  "Status": "状态",
  "Active": "未到期",
@ -90,8 +90,9 @@
  "No records": "暂无记录",
  "Accumulative Stake": "总质押",
  "Accumulative Rewards Withdraw": "总提取收益",
-  "Withdraw": "质押",
-  "Stake": "提取",
+  "Accumulative Rewards":"总收益",
+  "Withdraw": "提取",
+  "Stake": "质押",
  "Create Contract(NFT)": "创建合约（NFT）",
  "Contract Address": "合约地址",
  "Copy Success": "复制成功",
@ -125,7 +126,7 @@
  "Addresses": "钱包地址",
  "Contributed": "奖励贡献",
  "Binding Time": "绑定时间",
-  "Contreact(Rewards) Details": "合约(奖励)明细",
+  "Contract(Rewards) Details": "合约(奖励)明细",
  "Days Staking": "天质押",
  "Rewards Details": "收益及提取明细"
 }
--- a/src/pages/home/index.tsx
+++ b/src/pages/home/index.tsx
@ -5,6 +5,7 @@ import Button from '~/components/Button'
 import { eth_pledgeProducts } from '~/contract/api'
 import { useRouter } from '~/hooks/useRouter'
 import '~/styles/home.scss'
+import { openGitBook } from '~/utils'

 const Home = () => {

@ -109,7 +110,9 @@ const Home = () => {
          <img src={require('~/assets/group.png')} className='img' alt="" />
          <div className='box p-2'>
            <div className='fz-wb-550 tac'>{t('Up To 7% of Referees Staking Rewards')}</div>
-            <div className='row-center mt-1 plr-1'>
+            <div className='row-center mt-1 plr-1' onClick={() => {
+              push('/myPledge')
+            }}>
              <div className='tac fz-14'>{t('By sharing your referral code and introducing your friends to SOFIL and stake, you can earn referral rewards and withdraw everyday.')}</div>
              <div className='iconfont icon-arrow fz-26'></div>
            </div>
@ -129,7 +132,9 @@ const Home = () => {
          }
        </Collapse>
        <div className='row-center'>
-          <Button className='understand-button mt-3 fz-wb-550'>{t('Learn More')}</Button>
+          <Button className='understand-button mt-3 fz-wb-550' onClick={() => {
+            openGitBook()
+          }}>{t('Learn More')}</Button>
        </div>
      </div>
    </div>
--- a/src/pages/invitation-detail/index.tsx
+++ b/src/pages/invitation-detail/index.tsx
@ -77,7 +77,7 @@ const InvitationDetail = () => {
        <div className='box plr-3'>
          <div className='row-items pt-3'>
            <div className='iconfont icon-back_light fz-34' onClick={() => push(-1)}></div>
-            <div className='fz-24'>{t('Contreact(Rewards) Details')}</div>
+            <div className='fz-24'>{t('Contract(Rewards) Details')}</div>
          </div>
        </div>
      </div>
--- a/src/pages/invitation/index.tsx
+++ b/src/pages/invitation/index.tsx
@ -16,7 +16,7 @@ import { useTranslation } from 'react-i18next'

 const Invitation = () => {

-  const { t } = useTranslation()
+  const { t,i18n } = useTranslation()
  const { walletAddress, contract } = store.state
  const { copyVal } = useCopyLink()
  const [tabIndex, setTabIndex] = useState(0)
@ -94,6 +94,20 @@ const Invitation = () => {
    }
  }, [])

+  const renderTitle = ()=>{
+    if(i18n.language === 'en'){
+      return (
+        <div className='tac mt-1 fz-15'>Up To <span className='fz-24 fz-wb-550'>7%</span> of Referees Staking Rewards</div>
+      )
+    }
+    if(i18n.language === 'hk'){
+      return (
+        <div className='tac mt-1 fz-15'>高達質押人賺取的 <span className='fz-24 fz-wb-550'>7%</span> </div>
+      )
+    }
+    return <div className='tac mt-1 fz-15'>高达质押人赚取的 <span className='fz-24 fz-wb-550'>7%</span> </div>
+  }
+
  return (
    <div className="invitation">
      <div className="watermark-1"></div>
@ -104,7 +118,8 @@ const Invitation = () => {
        </div>
        <div className='learn-box white'>
          <div className='notify-img'></div>
-          <div className='tac mt-1 fz-15'>{t('Up To 7% of Referees Staking Rewards')}</div>
+          {renderTitle()}
+          {/* <div className='tac mt-1 fz-15'>{t('Up To 7% of Referees Staking Rewards')}</div> */}
          <div className='row-center mt-1'>
            <Button className='modal-button'>{t('Learn More')}</Button>
          </div>
--- a/src/pages/my-pledge/index.tsx
+++ b/src/pages/my-pledge/index.tsx
@ -8,11 +8,10 @@ import { useRouter } from '~/hooks/useRouter';
 import UnLogin from '~/components/Unlogin';
 import { eth_pledgeInfo, eth_pledgeRecords } from '~/contract/api';
 import { PledgeInfoType, PledgeWithdrawRecordType } from '~/types/api.d';
-import { calcIncome, getTime, splitAddress, toFixed2 } from '~/utils';
+import { calcExtractableAmount, calcIncome, getTime, splitAddress, toFixed2 } from '~/utils';
 import ModalLoading from '~/components/ModalLoading';
 import { copy } from '~/utils/copy';
 import { useTranslation } from 'react-i18next';
-import { t } from 'i18next';

 const MyPledge = () => {

@ -201,6 +200,7 @@ const PledgeContract = (props: PledgeContractProps) => {
  const { data, currentTime, filBalance, pledgeToast, withdrawAmount, pledgeInfosLength, withdrawIncome, hash, setVisible, visible, status, loading } = props
  const { push } = useRouter()
  const [tabIndex, setTabIndex] = useState(0)
+  const {t} = useTranslation()

  return (
    <div>
@ -256,7 +256,7 @@ const PledgeContract = (props: PledgeContractProps) => {
                  </div>
                </div>
              </div>
-              <div className='flex-2'>{toFixed2(calcIncome(item), 2)} FIL</div>
+              <div className='flex-2'>{toFixed2(calcExtractableAmount(item,currentTime), 2)} FIL</div>
              <div className='flex-2 row-center'>
                {
                  tabIndex === 0 && (
@ -302,6 +302,7 @@ const Record = (props: RecordProps) => {

  const [tabIndex, setTabIndex] = useState(0)
  const { totalPledge, totalWithdraw, pledgeRecord, pledgeWithdrawRecord, contractAddress } = props;
+  const {t} = useTranslation()

  return (
    <div className='record'>
--- a/src/pages/nft-detail/index.tsx
+++ b/src/pages/nft-detail/index.tsx
@ -1,7 +1,7 @@

-import { t } from 'i18next'
 import { observer } from 'mobx-react'
 import { useEffect, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
 import Button from '~/components/Button'
 import Modal from '~/components/Modal'
 import ModalLoading from '~/components/ModalLoading'
@ -11,11 +11,12 @@ import { useRouter } from '~/hooks/useRouter'
 import store from '~/store'
 import '~/styles/pledge.scss'
 import { PledgeInfoType } from '~/types/api.d'
-import { calcExtractableAmount, calcReleasedIncome, calcWithdrawnAmount, getTime, splitAddress } from '~/utils'
+import { calcExtractableAmount, calcIncome, calcReleasedIncome, calcWithdrawnAmount, getTime, splitAddress } from '~/utils'
 import { toBigInt } from '~/utils/wei'

 const NFTDetail = () => {

+  const {t} = useTranslation()
  const { contract, walletAddress } = store.state
  const { copyVal } = useCopyLink()
  const { push, location } = useRouter()
@ -186,12 +187,17 @@ const NFTDetail = () => {
          </div>
          <div className='divider mt-2'></div>
          {/*  */}
+          
          <div>
            <div className='fz-18 fz-wb-550 mt-2'>{t('Rewards & Withdrawals Details')}</div>
            <div className='mt-1 row-between'>
              <div>{t('Rewards Start Time')}</div>
              <div>{getTime(data.startTime * 1000)}</div>
            </div>
+            <div className='mt-1 row-between'>
+              <div>{t('Accumulative Rewards')}</div>
+              <div>{calcIncome(data)} FIL</div>
+            </div>
            <div className='mt-1 row-between'>
              <div>{t('Rewards Distributed')}</div>
              <div>{calcReleasedIncome(data, currentTime)} FIL</div>
--- a/src/pages/pledge/index.tsx
+++ b/src/pages/pledge/index.tsx
@ -2,24 +2,26 @@ import { ethers } from 'ethers';
 import { observer } from 'mobx-react';
 import { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Dialog, Toast } from 'react-vant';
+import { Toast } from 'react-vant';
 import Button from '~/components/Button';
-import Loading from '~/components/Loading';
 import Modal from '~/components/Modal';
 import ModalLoading from '~/components/ModalLoading';
 import { eth_pledgeProducts } from '~/contract/api';
 import { useRouter } from '~/hooks/useRouter';
 import store from '~/store';
 import '~/styles/pledge.scss'
+import { Contract_Factory } from '~/types/store';
 import { toFixed2 } from '~/utils';
-import { fromWei, toBigInt, toWei, wei } from '~/utils/wei';
+import { toBigInt, toWei, wei } from '~/utils/wei';
 // 
 const Pledge = () => {

  const { t } = useTranslation()
  const { location } = useRouter()

-  const { filBalance, walletAddress, contract: { _contract: { Pledge__factory, FIL__factory, Pool__factory } } } = store.state
+  const { filBalance, walletAddress, contract } = store.state
+  const {Pledge__factory, FIL__factory, Pool__factory } = contract._contract ? contract._contract : {} as Contract_Factory
+
  const [pledgeList, setPledgeList] = useState([
    { day: 180, rate: 14 },
    { day: 270, rate: 15 },
--- a/src/router/layout/Navbar.tsx
+++ b/src/router/layout/Navbar.tsx
@ -9,6 +9,7 @@ import { useRouter } from '~/hooks/useRouter'
 import { SOFIL_LANGUAGE } from '~/language'
 import store from '~/store'
 import '~/styles/layout.scss'
+import { openGitBook } from '~/utils'
 import { toBigInt } from '~/utils/wei'

 interface NavbarProps {
@ -42,15 +43,9 @@ const Navbar = (props: NavbarProps) => {
  const langs = useMemo(() => [
    { title: 'English', key: 'en' },
    { title: '简体中文', key: 'zh' },
-    { title: '繁体中文', key: 'hk' },
+    { title: '繁體中文', key: 'hk' },
  ], [])

-  const gitbooks = useMemo(() => ({
-    'en': 'https://sofil.gitbook.io/main',
-    'zh': 'https://sofil.gitbook.io/main/v/cn',
-    'hk': 'https://sofil.gitbook.io/main/v/tc'
-  } as { [key: string]: string }), [])
-
  const [currentLang, setCurrentLang] = useState(2)

  const setLang = (index: number) => {
@ -148,8 +143,7 @@ const Navbar = (props: NavbarProps) => {
                      push(item.path)
                      setVisible(false)
                    } else {
-                      const key = langs[currentLang].key;
-                      window.open(gitbooks[key])
+                      openGitBook()
                    }
                  }}>
                    <div></div>
--- a/src/styles/admin.scss
+++ b/src/styles/admin.scss
@ -1,4 +1,6 @@
 .admin{
+  background-color: #433978;
+  color: #fff;
  .rv-tabs__nav {
    background: none;
  }
--- a/src/styles/home.scss
+++ b/src/styles/home.scss
@ -14,7 +14,6 @@
      box-sizing: border-box;
      border: 1px solid #4ee1f9;
      box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.1608);
-      border: none;
      font-weight: bold;
    }

@ -49,7 +48,6 @@
    background-size: 100% 100%;
    object-fit: cover;
    position: relative;
-    z-index: 1;
    color: $white;
    .box {
      width: 391px;
@ -209,11 +207,11 @@
  .rv-cell {
    background: $white;
    border-radius: 10px;
-    box-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.1608);
  }

  .rv-collapse-item {
    border-radius: 20px;
+    box-shadow: 0px 6px 6px 0px rgba(0, 0, 0, 0.1608);
  }

  .rv-collapse-item__title--expanded {
--- a/src/styles/pledge.scss
+++ b/src/styles/pledge.scss
@ -94,6 +94,10 @@
      border: none;
      background: none;
      color: $white;
+
+      &::placeholder{
+        font-size: 14px;
+      }
    }
    .button {
      width: 70px;
--- a/src/types/store.d.ts
+++ b/src/types/store.d.ts
@ -28,4 +28,4 @@ interface ContractType {
  _provider: Web3Provider | JsonRpcProvider;
 }

-export { StoreLocalStorageKey, ContractType };
+export { StoreLocalStorageKey, ContractType,Contract_Factory };
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@ -3,6 +3,17 @@ import { Toast } from "react-vant";
 import { PledgeInfoType } from "~/types/api";
 import { toBigInt, toWei } from "./wei";
 import { t } from "i18next";
+import { SOFIL_LANGUAGE } from "~/language";
+
+const openGitBook = ()=>{
+  const obj = {
+    'en': 'https://sofil.gitbook.io/main',
+    'zh': 'https://sofil.gitbook.io/main/v/cn',
+    'hk': 'https://sofil.gitbook.io/main/v/tc'
+  } as {[key:string]:string}
+  const key = window.sessionStorage.getItem(SOFIL_LANGUAGE) || 'hk'
+  window.open(obj[key])
+}

 // 切割字符中 ''...''
 const splitAddress = (address: any, index?: number) => {
@ -184,4 +195,5 @@ export {
  calcIncome,
  calcExtractableAmount,
  calcWithdrawnAmount,
+  openGitBook
 };
--- a/yarn.lock
+++ b/yarn.lock