调整锁仓时间

src/views/Announcement/index.tsx

@@ -146,7 +146,7 @@ const Announcement: React.FC = () => {
     const innerHeight = window.innerHeight
     const screenH = Math.ceil(innerHeight + window.scrollY)
     const eleH = document.documentElement.offsetHeight
-    if (screenH >= eleH) {
+    if (screenH >= eleH && list.length > 0) {
       setPage(pageNum + 1)
     }
   }

src/views/Board/components/BoardCard/BoardCard.tsx

@@ -1,4 +1,5 @@
-import React, { useMemo, useState } from 'react'
+import React, { useMemo, useState, useEffect } from 'react'
+import dayjs from 'dayjs'
 import BigNumber from 'bignumber.js'
 import styled, { keyframes } from 'styled-components'
 import { Flex, Text, Skeleton } from '@pancakeswap/uikit'
@@ -94,6 +95,29 @@ interface NodeCardProps {
 
 const BoardCard: React.FC<NodeCardProps> = ({ board, account }) => {
   const { t } = useTranslation()
+  const [countDown, setCountDown] = useState('')
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      if (board.userData?.unlockTime) {
+        const time = board.userData?.unlockTime * 1000
+        if (time > 0) {
+          countDownFun(time - 1)
+        }
+      }
+    }, 1000)
+    return () => clearInterval(interval)
+  }, [countDown, board])
+
+  const countDownFun = (date) => {
+    const date1 = dayjs()
+    const date2 = dayjs(date)
+    const time = date2.diff(date1)
+    const hour = Math.floor((time / (1000 * 60 * 60)) % 24)
+    const minute = Math.floor((time / (1000 * 60)) % 60)
+    const second = Math.round((time / 1000) % 60)
+    setCountDown(`${hour}:${minute}:${second}`)
+  }
 
   const [showExpandableSection, setShowExpandableSection] = useState(false)
   return (
@@ -103,11 +127,7 @@ const BoardCard: React.FC<NodeCardProps> = ({ board, account }) => {
       <CardDiv>
         <div>
           <FlexText name={t('HCC Currency amount')} value={board.userData?.amount} />
-          {board.userData?.name === 'Board' ? (
-            <FlexText name={t('Lock up time')} value={board.userData?.unlockTime} />
-          ) : (
-            ''
-          )}
+          {board.userData?.name === 'Board' ? <FlexText name={t('Lock up time')} value={countDown} /> : ''}
           <FlexText name={t('possess LP')} value={board.userData?.rewardDebt} />
         </div>
         <CardActionsContainer board={board} account={account} />

src/views/Board/components/BoardCard/CardHeading.tsx

@@ -69,6 +69,7 @@ const HeaderFlex = styled(Flex)``
 
 const CardHeading: React.FC<ExpandableSectionProps> = ({ name, img, tokenSymbol }) => {
   const { t } = useTranslation()
+
   return (
     <Wrapper justifyContent="space-between" alignItems="center" mb="12px">
       {/* <Image src={`/images/nodes/${img}.png`} width={64} height={64} /> */}
@@ -77,7 +78,7 @@ const CardHeading: React.FC<ExpandableSectionProps> = ({ name, img, tokenSymbol
         {/* <Question text={t('To join board, you need to stake at least 0.1% total supply of Token')} /> */}
       </HeaderFlex>
       {/* <div className="ribbon">
-        <div className="ribbon1">已质押</div>
+        <div className="ribbon1">{t('Staked')}</div>
       </div> */}
     </Wrapper>
   )

src/views/Board/index.tsx

@@ -43,6 +43,7 @@ const FlexLayoutMain = styled(FlexLayout)`
 const Boards: React.FC = () => {
   const { t } = useTranslation()
   const boardsList = useBoards()
+  // console.log('boardsList', boardsList)
   const account = useAccount()
 
   const dispatch = useDispatch()