This commit is contained in:
john 2022-05-14 15:21:22 +07:00
commit c37abdec94
6 changed files with 192 additions and 56 deletions

View File

@ -43,9 +43,9 @@ export const AppContextProvider = ({ children }) => {
]
const docItems = [
{ name: t('announcement'), icon: '', path: '', enabled: true },
{ name: t('faq'), icon: '', path: '', enabled: true },
{ name: t('tutorial'), icon: '', path: '', enabled: true },
{ name: t('announcement'), icon: '', path: '/ann', enabled: true },
{ name: t('faq'), icon: '', path: '/faq', enabled: true },
{ name: t('tutorial'), icon: '', path: '/tut', enabled: true },
]
React.useEffect(() => {

View File

@ -18,6 +18,7 @@ import {
} from "../api"
import { approve, transfer } from '../lib'
import { ModalBox } from '../components'
import { ModalDeposite } from '../uimsg'
let DEF_LOCK = {
count: 0,
@ -248,19 +249,12 @@ export const Farm = () => {
</ModalBox>
{/* deposite box */}
<ModalBox
title="Deposite"
<ModalDeposite
isOpen={isDepositeOpen}
onClose={onDepositeClose}
onConfirm={onDepositeConfirmed}
focusRef={depositeRef}
>
<Box>
<FormControl>Amount</FormControl>
<Input ref={depositeRef} placeholder="deposite amount" />
</Box>
</ModalBox>
ref={depositeRef}
/>
</>
)
}

View File

@ -11,6 +11,9 @@ import {
StakingModalCertificate, ModalBox,
VFStack, HFStack, HBetween,
} from "../components"
import {
ModalDeposite
} from '../uimsg'
import { useApp } from "../AppContext"
import { config } from "../config"
import { ABI, Images } from "../data"
@ -22,6 +25,7 @@ import {
get_authorization_one,
get_authorization_search,
retrieve_all,
get_upBalance,
} from "../api"
import { approve, transfer } from '../lib'
import { useTranslation } from "react-i18next"
@ -85,6 +89,7 @@ export const Staking = () => {
const [coins, setCoins] = React.useState([])
const [strategyIndex, setStrategyIndex] = React.useState(-1)
const [certificateIndex, setCertificateIndex] = React.useState(-1)
const [depositeIndex, setDepositeIndex] = React.useState(-1)
const app = useApp()
const toast = useToast()
@ -93,6 +98,9 @@ export const Staking = () => {
const { isOpen: isOpenStrategy, onOpen: onOpenStrategy, onClose: onCloseStrategy } = useDisclosure()
const { isOpen: isOpenCertificate, onOpen: onOpenCertificate, onClose: onCloseCertificate } = useDisclosure()
const { isOpen: isOpenExtract, onOpen: onOpenExtract, onClose: onCloseExtract } = useDisclosure()
const { isOpen: isOpenDeposite, onOpen: onOpenDeposite, onClose: onCloseDeposite } = useDisclosure()
const refDepositeFocus = React.useRef()
const { t } = useTranslation()
@ -113,27 +121,62 @@ export const Staking = () => {
onOpenStrategy()
}
// click certificate / deposite button
const onCertificate = (index) => {
setCertificateIndex(index)
onOpenCertificate()
}
const onConfirmExtract = () => {
console.log('extract')
}
// clicked Certificate
const onConfirmCertificate = (index) => {
if (index < 0 || index >= coins.length) {
console.error('index out of range')
console.warning('index out of range')
return
}
let _coins = [...coins]
if (_coins[index].authorized) {
if (coins[index].authorized) {
setDepositeIndex(prev => index)
onOpenDeposite()
} else {
onOpenCertificate()
}
}
// ModalDeposite callback
const onConfirmDeposite = () => {
if (depositeIndex < 0 || depositeIndex >= coins.length) {
console.error(depositeIndex, ' out of range')
return
}
const amount = refDepositeFocus.current.value
transfer(ABI, coins[depositeIndex].address, app.appAddress, amount, app.address, (err, res) => {
if (!err) {
toast({
title: 'Succeed',
description: "You have successfully deposited " + amount + " " + coins[depositeIndex].name,
status: 'success',
duration: 9000,
isClosable: true,
})
// TODO 提交充值记录
get_upBalance(app.address).then(res => {
}).catch(err => {
console.error('get_upBalance() error:' + err.message)
})
} else {
toast({
title: 'Failed',
description: "Your operation has not been completed.",
status: 'info',
duration: 9000,
isClosable: true,
})
console.error('transfer() error:' + err.message)
}
})
}
// ModalExtract callback
const onConfirmExtract = () => {
if (!app.address) {
toast({
title: 'Wallet not connected',
@ -144,6 +187,53 @@ export const Staking = () => {
})
return
}
if (balance.USDT_T <= 0 && balance.USDC_T <= 0) {
toast({
title: '',
description: "Has no income",
status: 'info',
duration: 9000,
isClosable: true,
})
return
}
retrieve_all(app.address).then(res => {
_getVaultBalance()
toast({
title: 'Succeed',
description: "Operation succeed.",
status: 'success',
duration: 9000,
isClosable: true,
})
}).catch(err => {
console.error('retrieve_all() error:', err.message)
})
}
// Modal certificate callback
const onConfirmCertificate = (index) => {
if (index < 0 || index >= coins.length) {
console.error('index out of range')
return
}
if (!app.address) {
toast({
title: 'Wallet not connected',
description: "Please connect your wallet first to perform the operation",
status: 'warning',
duration: 9000,
isClosable: true,
})
return
}
let _coins = [...coins]
// make button loading
_coins[index].loading = true
setCoins(_coins)
@ -177,7 +267,6 @@ export const Staking = () => {
setCoins(_coins)
})
}
}
React.useEffect(() => {
_getVaultBalance()
@ -302,6 +391,15 @@ export const Staking = () => {
/>
<ModalRetrieve isOpen={isOpenExtract} onClose={onCloseExtract} onConfirm={onConfirmExtract} />
<ModalDeposite
isOpen={isOpenDeposite}
onClose={onCloseDeposite}
onConfirm={onConfirmDeposite}
ref={refDepositeFocus}
/>
<ModalRetrieve isOpen={isOpenExtract} onClose={onCloseExtract} onConfirm={onConfirmExtract} />
</>
)
}

View File

@ -0,0 +1,24 @@
import { useTranslation } from "react-i18next"
import { ModalBox } from "../components"
import { Box, FormControl, Input } from "@chakra-ui/react"
import React from "react"
export const ModalDeposite = React.forwardRef((props, ref) => {
const { t } = useTranslation()
return (
<ModalBox
title={t('deposite')}
isOpen={props.isOpen}
onClose={props.onClose}
onConfirm={props.onConfirm}
focusRef={ref}
>
<Box>
<FormControl>Amount</FormControl>
<Input ref={ref} placeholder="deposite amount" />
</Box>
</ModalBox>
)
})

2
src/uimsg/index.js Normal file
View File

@ -0,0 +1,2 @@
export * from './ModalDeposite'
export * from './toasts'

18
src/uimsg/toasts.js Normal file
View File

@ -0,0 +1,18 @@
const toast = (t, content = '', title = '', duration = 9000, status = 'warning') => {
t({
title: title,
description: content,
status: status,
duration: duration,
isClosable: true,
})
}
export const toastw = (t, content = '', title = '', duration = 9000) => toast(t, content, title, duration)
export const toasti = (t, content = '', title = '', duration = 9000) => toast(t, content, title, duration, 'info')
export const toasts = (t, content = '', title = '', duration = 9000) => toast(t, content, title, duration, 'success')
export const toaste = (t, content = '', title = '', duration = 9000) => toast(t, content, title, duration, 'error')