From dbf3d8bedc705443012c6883ddcfe4e2aeab2ddc Mon Sep 17 00:00:00 2001
From: myf <>
Date: Thu, 28 Apr 2022 14:28:12 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B5=84=E9=87=91=E6=B1=A0=E6=80=BB=E9=A2=9D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
public/images/nft/23.svg | 13 +++
public/images/nft/24.svg | 13 +++
public/images/nft/blindbox.svg | 19 ++++
src/state/boards/fetchBoardsUser.ts | 4 +-
src/views/Board/components/HeaderItem.tsx | 6 +-
src/views/Board/index.tsx | 59 ++++++-------
src/views/Nft/component/StepCom.tsx | 31 ++++++-
src/views/Nft/index.tsx | 102 ++++++++++++++++------
8 files changed, 182 insertions(+), 65 deletions(-)
create mode 100644 public/images/nft/23.svg
create mode 100644 public/images/nft/24.svg
create mode 100644 public/images/nft/blindbox.svg
diff --git a/public/images/nft/23.svg b/public/images/nft/23.svg
new file mode 100644
index 0000000..8635728
--- /dev/null
+++ b/public/images/nft/23.svg
@@ -0,0 +1,13 @@
+
diff --git a/public/images/nft/24.svg b/public/images/nft/24.svg
new file mode 100644
index 0000000..e5aea50
--- /dev/null
+++ b/public/images/nft/24.svg
@@ -0,0 +1,13 @@
+
diff --git a/public/images/nft/blindbox.svg b/public/images/nft/blindbox.svg
new file mode 100644
index 0000000..b3c3bc2
--- /dev/null
+++ b/public/images/nft/blindbox.svg
@@ -0,0 +1,19 @@
+
diff --git a/src/state/boards/fetchBoardsUser.ts b/src/state/boards/fetchBoardsUser.ts
index ed2b299..28174d5 100644
--- a/src/state/boards/fetchBoardsUser.ts
+++ b/src/state/boards/fetchBoardsUser.ts
@@ -8,8 +8,8 @@ import { getAddress, getBoardAddress } from 'utils/addressHelpers'
export const fetchBoardUserAllowances = async (account: string) => {
const calls = boardsConfig.map((board) => {
const tokenAddresses = getAddress(board.tokenAddresses)
- const boardChefAddress = getAddress(board.contractAddress)
- return { address: tokenAddresses, name: 'allowance', params: [account, boardChefAddress] }
+ const boardChefAdress = getAddress(board.contractAddress)
+ return { address: tokenAddresses, name: 'allowance', params: [account, boardChefAdress] }
})
const rawLpAllowances = await multicall(erc20ABI, calls)
diff --git a/src/views/Board/components/HeaderItem.tsx b/src/views/Board/components/HeaderItem.tsx
index f40c3f0..444881c 100644
--- a/src/views/Board/components/HeaderItem.tsx
+++ b/src/views/Board/components/HeaderItem.tsx
@@ -1,5 +1,6 @@
import React from 'react'
import { Text } from '@pancakeswap/uikit'
+import Balance from 'components/Balance'
import styled from 'styled-components'
interface InfoProps {
@@ -22,9 +23,10 @@ const HeaderItem: React.FC = ({ title, price }) => {
return (
<>
-
+ {/*
{price}
-
+ */}
+
{title}
diff --git a/src/views/Board/index.tsx b/src/views/Board/index.tsx
index 50a4e77..2527aa1 100644
--- a/src/views/Board/index.tsx
+++ b/src/views/Board/index.tsx
@@ -1,10 +1,13 @@
+import BigNumber from 'bignumber.js'
import React, { useEffect, useCallback, useMemo, useState, useRef } from 'react'
import { Route, useRouteMatch, useLocation } from 'react-router-dom'
import { useDispatch } from 'react-redux'
-import BigNumber from 'bignumber.js'
-import erc20 from 'config/abi/erc20.json'
+import boardsConfig from 'config/constants/boards'
+import { getAddress, getBoardAddress } from 'utils/addressHelpers'
+import boardABI from 'config/abi/board.json'
import multicall from 'utils/multicall'
import { useWeb3React } from '@web3-react/core'
+import Balance from 'components/Balance'
import { Image, Heading, RowType, Toggle, Text } from '@pancakeswap/uikit'
import styled from 'styled-components'
import FlexLayout from 'components/Layout/Flex'
@@ -41,27 +44,28 @@ const Boards: React.FC = () => {
const dispatch = useDispatch()
const { fastRefresh } = useRefresh()
+ // 资金池总额
+ const [totalAmount, setTotalAmount] = useState(0)
+ // 获取资金池总额
+ const getCapital = async () => {
+ const calls = boardsConfig.map((board) => {
+ const contractAddress = getAddress(board.contractAddress)
+ return {
+ address: contractAddress,
+ name: '_poolInfo',
+ }
+ })
+ const boardsPoolInfo = await multicall(boardABI, calls)
+ console.log('boardsPoolInfo:', boardsPoolInfo)
+ boardsPoolInfo.forEach((item) => {
+ setTotalAmount(totalAmount + Number(new BigNumber(item.totalAmount._hex).toJSON()))
+ })
+ }
useEffect(() => {
dispatch(fetchBoardsPublicDataAsync())
if (account) {
dispatch(fetchBoardUserDataAsync(account))
-
- const calls = [
- // 查节点的代币数量
- {
- address: tokenAddress,
- name: 'balanceOf',
- params: [BoardChefAddress],
- },
- // Token decimals
- {
- address: tokenAddress,
- name: 'decimals',
- },
- ]
- // eslint-disable-next-line prefer-const
- let [tokenBalance, tokenDecimals] = await multicall(erc20, calls)
- tokenBalance = new BigNumber(tokenBalance).div(new BigNumber(10).pow(tokenDecimals))
+ getCapital()
}
}, [account, dispatch, fastRefresh])
@@ -78,28 +82,21 @@ const Boards: React.FC = () => {
}
return (
- <>
+
{t('Total capital pool')}
- {/*
- {t(
- 'Joining the board of directors will obtain the governance token xcandy \n participate in the governance of the project, vote, obtain additional pledge income, \n and have a higher invitation airdrop reward',
- )}
- */}
-
- 1.000.000.000.000
-
+
-
+ {/* */}
- {renderContent()}
-
+ {renderContent()}
+
)
}
diff --git a/src/views/Nft/component/StepCom.tsx b/src/views/Nft/component/StepCom.tsx
index 0d64451..55d1826 100644
--- a/src/views/Nft/component/StepCom.tsx
+++ b/src/views/Nft/component/StepCom.tsx
@@ -1,6 +1,29 @@
import React, { useState } from 'react'
import styled from 'styled-components'
-import { Text, Flex, Image } from '@pancakeswap/uikit'
+import { Text, Flex, Image, Button } from '@pancakeswap/uikit'
+
+const SubButton = styled(Button)`
+ width: 25px;
+ height: 25px;
+ background: rgba(239, 232, 247, 0.39);
+ border: 1px solid rgba(255, 255, 255, 0.0588235294117647);
+ box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.25);
+ font-size: 18px;
+ color: #ada5ba;
+ border-radius: 5px;
+ padding: 0;
+`
+
+const AddButton = styled(Button)`
+ width: 25px;
+ height: 25px;
+ background: linear-gradient(180deg, #6eddfa 0%, #ac74f1 100%);
+ box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.25);
+ font-size: 18px;
+ color: #fff;
+ border-radius: 5px;
+ padding: 0;
+`
export default function StepCom() {
const [valNumber, setInputState] = useState(1)
@@ -16,11 +39,13 @@ export default function StepCom() {
return (
- onAdd('sub')} width={25} height={25} />
+ {/* onAdd('sub')} width={25} height={25} /> */}
+ onAdd('sub')}>-
{valNumber}
- onAdd('add')} width={25} height={25} />
+ onAdd('add')}>+
+ {/* onAdd('add')} width={25} height={25} /> */}
)
}
diff --git a/src/views/Nft/index.tsx b/src/views/Nft/index.tsx
index eca1979..933b4b4 100644
--- a/src/views/Nft/index.tsx
+++ b/src/views/Nft/index.tsx
@@ -46,12 +46,29 @@ const StyledPage = styled.div`
`
const BodyWrapper = styled(Card)`
+ padding-bottom: 20px;
border-radius: 24px;
- max-width: 500px;
- width: 100%;
+ /* width: 60%; */
+ width: 500px;
overflow: visible;
position: relative;
`
+const TextKey = styled(Text)`
+ font-size: 26px;
+ color: #999999;
+`
+const TextVal = styled(Text)`
+ font-size: 26px;
+ color: #1fc7d4;
+ margin-left: 10px;
+`
+
+const FlexTime = styled(Flex)`
+ position: absolute;
+ width: 100%;
+ top: 20px;
+ justify-content: center;
+`
const HindDiv = styled.div`
width: 32px;
@@ -77,10 +94,12 @@ const Divs = styled.div`
min-height: calc(100vh - 104px);
background: ${({ theme }) => theme.colors.gradients.bubblegum};
`
-
+const DetailDiv = styled.div`
+ margin-top: -100px;
+`
const DetailInfo = styled(Flex)`
padding: 0 21px;
- margin-top: 24px;
+ margin-top: 15px;
`
const SwiperDiv = styled(Swiper)`
@@ -105,7 +124,31 @@ const SwiperDiv = styled(Swiper)`
const Nft: React.FC = () => {
const [blindboxList] = useState([{ id: 1 }, { id: 2 }, { id: 3 }])
-
+ const [hour, setHour] = useState('0')
+ const [minute, setMinute] = useState('0')
+ const [second, setSecond] = useState('0')
+ const countFun = (time) => {
+ // const timer: any = null
+ // let sys_second = new Date(time).getTime() - new Date().getTime()
+ // timer = setInterval(() => {
+ // // 防止倒计时出现负数
+ // if (sys_second > 1000) {
+ // sys_second -= 1000
+ // // let day = Math.floor(sys_second / 1000 / 3600 / 24)
+ // setHour(Math.floor((sys_second / 1000 / 3600) % 24))
+ // setMinute(Math.floor((sys_second / 1000 / 60) % 60))
+ // setSecond(Math.floor((sys_second / 1000) % 60))
+ // // this.setState({
+ // // day: day,
+ // // hour: hour < 10 ? '0' + hour : hour,
+ // // minute: minute < 10 ? '0' + minute : minute,
+ // // second: second < 10 ? '0' + second : second,
+ // // })
+ // } else {
+ // clearInterval(timer)
+ // }
+ // }, 1000)
+ }
return (
{
-
-
-
-
+ {/*
-
-
- 系列
- 法式盛宴
-
-
- 价格
-
-
- 500
-
- 黄油
-
-
-
- 数量
-
-
+ */}
+
+ 剩余时间
+ 7小时
+
+
+
+
+ 系列
+ 法式盛宴
+
+
+ 价格
+
+
+ 500
+
+ 黄油
+
+
+
+ 数量
+
+
+
+