yll
/
cwfront
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Compare commits

base: yll:99fdcfc307a3f82608be60c4e155a8dcfce30d2a
Branches Tags
yll:master
..
compare: yll:17ab1af400192a77ab374fdf254abfcb51a4317b
Branches Tags
yll:master

9 Commits
99fdcfc307 ... 17ab1af400

Author SHA1 Message Date
john 17ab1af400 bugfix 2022-05-24 11:33:30 +07:00
john 4e6e336a76 changing 2022-05-23 15:16:09 +07:00
john a1042a4f1c change activity modal 2022-05-22 08:02:24 +07:00
john c38533a0ac add activity modal 2022-05-22 07:12:47 +07:00
john d86f060455 update logo title... 2022-05-22 04:53:50 +07:00
john 1f56512d7e update for new version 2022-05-22 03:27:50 +07:00
john 8886e3cba7 1 add whatsapp floating button 
2 fix copyclipboard
 2022-05-19 17:19:14 +07:00
john 3b17e2df70 delete default value 2022-05-19 14:50:42 +07:00
john 9b4d81cc33 remove debug code 2022-05-19 14:31:40 +07:00
38 changed files with 291 additions and 127 deletions
Show Stats Expand all files Collapse all files

2
.env.sample
View File

@ -1,3 +1,3 @@
REACT_APP_NAME = CoinWind REACT_APP_NAME = "Cloud Computing"
REACT_APP_I18N_ENABLED = true REACT_APP_I18N_ENABLED = true
REACT_APP_DEV_ENDPOINT = http://coinwind.test/ REACT_APP_DEV_ENDPOINT = http://coinwind.test/

5
package-lock.json generated
View File

@ -2434,6 +2434,11 @@
"resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-4.5.10.tgz", "resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-4.5.10.tgz",
"integrity": "sha512-MrtTDfWb1Tu9YxVh2KaKmsKBn6O3KL/lHZS0KRKK58jgqvdwuiDt4QW4udmW4FQf0XOWgnZ+4vKUF80F3SqBAA==" "integrity": "sha512-MrtTDfWb1Tu9YxVh2KaKmsKBn6O3KL/lHZS0KRKK58jgqvdwuiDt4QW4udmW4FQf0XOWgnZ+4vKUF80F3SqBAA=="
}, },
"@fontsource/roboto-flex": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/@fontsource/roboto-flex/-/roboto-flex-4.5.0.tgz",
"integrity": "sha512-4w944UkhoO+8rc/bJiSi0KLWWVfCcWGLtgjm6wsyQmSxn25zpJ6qBgSEqANin/R8k0Aou2n6R9nQTlhFOsvMkQ=="
},
"@humanwhocodes/config-array": { "@humanwhocodes/config-array": {
"version": "0.9.5", "version": "0.9.5",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.9.5.tgz", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.9.5.tgz",

1
package.json
View File

@ -9,6 +9,7 @@
"@emotion/react": "^11.9.0", "@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1", "@emotion/styled": "^11.8.1",
"@fontsource/open-sans": "^4.5.10", "@fontsource/open-sans": "^4.5.10",
"@fontsource/roboto-flex": "^4.5.0",
"@testing-library/jest-dom": "^5.16.4", "@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^10.4.9", "@testing-library/react": "^10.4.9",
"@testing-library/user-event": "^12.8.3", "@testing-library/user-event": "^12.8.3",

BIN
public/favicon.ico.bak
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 3.8 KiB

BIN
public/favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

BIN
public/imgs/cloud_banner.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 54 KiB

BIN
public/imgs/eth.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
public/imgs/eth_girl.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 66 KiB

BIN
public/imgs/whatsapp.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

2
public/index.html
View File

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="%PUBLIC_URL%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta name="description" content="New generation Defi platform" /> <meta name="description" content="New generation Defi platform" />

BIN
public/logo192.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.2 KiB

After

Width:  |  Height:  |  Size: 26 KiB

BIN
public/logo512.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 9.4 KiB

After

Width:  |  Height:  |  Size: 139 KiB

1
src/App.js
View File

@ -7,6 +7,7 @@ import { Layout } from './components'
import { Outlet } from 'react-router-dom' import { Outlet } from 'react-router-dom'
import { AppContextProvider } from './AppContext' import { AppContextProvider } from './AppContext'
import '@fontsource/open-sans/400.css' import '@fontsource/open-sans/400.css'
import '@fontsource/roboto-flex/400.css'
function App() { function App() {

20
src/AppContext.js
View File

@ -3,8 +3,7 @@ import { config } from "./config"
import { get_settings } from './api' import { get_settings } from './api'
import { ImTwitter, ImTelegram, ImFacebook, ImWhatsapp } from "react-icons/im" import { ImTwitter, ImTelegram, ImFacebook, ImWhatsapp } from "react-icons/im"
import { import {
FiHome, FiTrendingUp, FiLock, FiCloud, FiUser, FiUsers,
FiActivity, FiUser, FiUsers,
} from 'react-icons/fi' } from 'react-icons/fi'
import { useTranslation } from "react-i18next" import { useTranslation } from "react-i18next"
@ -41,7 +40,7 @@ export const AppContextProvider = ({ children }) => {
const [kefuUrl, setKefuUrl] = React.useState('') const [kefuUrl, setKefuUrl] = React.useState('')
const menuItems = [ const menuItems = [
{ name: t('mining'), icon: FiActivity, path: '/home', enabled: true }, { name: t('cloud'), icon: FiCloud, path: '/home', enabled: true },
{ name: t('account'), icon: FiUser, path: '/account', enabled: true }, { name: t('account'), icon: FiUser, path: '/account', enabled: true },
{ name: t('team'), icon: FiUsers, path: '/team', enabled: true }, { name: t('team'), icon: FiUsers, path: '/team', enabled: true },
] ]
@ -61,7 +60,7 @@ export const AppContextProvider = ({ children }) => {
const b = res.data.base const b = res.data.base
setTitle(o.title) setTitle(o.title)
document.title = o.title + ' - DeFi platform for professor' document.title = config.APP_NAME + ' - DeFi platform for professor'
let banr = [] let banr = []
o.banner?.forEach((item) => { o.banner?.forEach((item) => {
@ -75,13 +74,14 @@ export const AppContextProvider = ({ children }) => {
setBannerLink(s.pic_url) setBannerLink(s.pic_url)
SOCIALS[0].path = b.telegram let socl = [...SOCIALS]
SOCIALS[1].path = b.twitter socl[0].path = b.telegram
SOCIALS[2].path = b.facebook socl[1].path = b.twitter
SOCIALS[3].path = b.whatsapp socl[2].path = b.facebook
socl[3].path = b.whatsapp
setSocials(SOCIALS) setSocials(s)
setKefuUrl(s.kefu_url) setKefuUrl('whatsapp://send?phone=' + b.whatsapp)
setRewards(s.reward) setRewards(s.reward)
setAppAddress(s.app_address) setAppAddress(s.app_address)
setAppKey(s.app_key) setAppKey(s.app_key)

17
src/components/Faq.js
View File

@ -1,10 +1,11 @@
import { import {
Divider, Accordion, AccordionItem, Divider, Accordion, AccordionItem,
AccordionButton, Box, AccordionIcon, AccordionButton, Text, AccordionIcon,
AccordionPanel, AccordionPanel, Icon, Flex,
} from "@chakra-ui/react" } from "@chakra-ui/react"
import React from "react" import React from "react"
import { PanelHeader, VPanel } from "./Panels" import { PanelHeader, VPanel } from "./Panels"
import { FiHelpCircle } from 'react-icons/fi'
import parse from 'html-react-parser' import parse from 'html-react-parser'
@ -12,7 +13,7 @@ export const Faq = ({ articles, ...rest }) => {
return ( return (
<VPanel {...rest}> <VPanel {...rest}>
<PanelHeader header="Help Center" subHeader="Hope it help you" /> <PanelHeader header="Help Q&A" subHeader="" />
<Accordion w="full" allowToggle> <Accordion w="full" allowToggle>
@ -20,14 +21,16 @@ export const Faq = ({ articles, ...rest }) => {
articles && articles.map((a, index) => ( articles && articles.map((a, index) => (
<AccordionItem key={index}> <AccordionItem key={index}>
<h2> <h2>
<AccordionButton> <AccordionButton>
<Box fontWeight='600' flex='1' textAlign='left'> <Flex fontWeight='600' flex='1' textAlign='left' alignItems='center'>
{a.title} <Icon as={FiHelpCircle} mr="2" />
</Box> <Text>{a.title}</Text>
</Flex>
<AccordionIcon /> <AccordionIcon />
</AccordionButton> </AccordionButton>
</h2> </h2>
<AccordionPanel pb={4}> <AccordionPanel pb={4} color='gray.500'>
{parse(a.content)} {parse(a.content)}
</AccordionPanel> </AccordionPanel>
</AccordionItem> </AccordionItem>

29
src/components/FloatingBtn.js Normal file
View File

@ -0,0 +1,29 @@
import { Image, Flex, IconButton } from "@chakra-ui/react"
export const FloatingBtn = ({ name, pic, url, ...rest }) => {
const onClick = () => {
window.location.href = url
}
return (
<Flex
w='14'
h='14'
position='fixed'
cursor='pointer'
zIndex='3'
{...rest}
>
<IconButton
w='13'
h='13'
variant='outline'
icon={
<Image src={pic} alt={name} />
}
onClick={onClick}
/>
</Flex>
)
}

8
src/components/Hero.js
View File

@ -15,18 +15,16 @@ export const Hero = ({ bg }) => {
> >
<VFStack align="start"> <VFStack align="start">
{/* <HFStack my="4" px="4"> */} {/* <Logo p="4" /> */}
<Logo p="4" />
{/* </HFStack> */}
<Placeholder h='16' /> <Placeholder h='30%' />
<VStack pl="4"> <VStack pl="4">
<Text <Text
fontWeight='700' fontWeight='700'
fontSize='22' fontSize='22'
color='white' color='white'
> >
Join The Team Join in The Cloud
</Text> </Text>
<Text <Text
fontWeight='700' fontWeight='700'

15
src/components/LatestScreen.js
View File

@ -11,18 +11,15 @@ import '../swiper.css'
import { Pagination, Autoplay, Navigation } from "swiper" import { Pagination, Autoplay, Navigation } from "swiper"
let format = [ const TAddress = ({ text }) => (<Text color='blue.500'>{text}</Text>)
{ address: '', quantity: 234234.05 }
] const TQuantity = ({ text }) => (<Text fontWeight='500'>{text}</Text>)
export const LatestScreen = ({ data, ...rest }) => { export const LatestScreen = ({ data, ...rest }) => {
const TAddress = ({ text }) => (<Text color='blue.500'>{text}</Text>)
const TQuantity = ({ text }) => (<Text fontWeight='500'>{text}</Text>)
return ( return (
<VPanel {...rest}> <VPanel {...rest}>
<PanelHeader header="Mining" subHeader="Liquidity mining income" /> <PanelHeader header="Cloud Computing" subHeader="Nodes of cloud output" />
<HBetween py="2"> <HBetween py="2">
<Text <Text
@ -41,7 +38,7 @@ export const LatestScreen = ({ data, ...rest }) => {
slidesPerView={6} slidesPerView={6}
spaceBetween={0} spaceBetween={0}
// centeredSlides={true} // centeredSlides={true}
speed={5000} speed={3500}
loop={true} loop={true}
autoplay={{ autoplay={{
delay: 1, delay: 1,

19
src/components/Layout.js
View File

@ -1,19 +1,20 @@
import { import {
Box, Drawer, DrawerContent, Box, useColorModeValue,
useColorModeValue, useDisclosure, DrawerOverlay,
} from '@chakra-ui/react' } from '@chakra-ui/react'
import React from 'react' import React from 'react'
import { SideBar } from './SideBar'
import { AppBar } from './AppBar'
import { BottomNav } from './BottomNav' import { BottomNav } from './BottomNav'
import { Hero } from './Hero' import { Hero } from './Hero'
import { HFStack } from './base' import { HFStack } from './base'
import { FloatingBtn } from './FloatingBtn'
import { Images } from '../data'
import { useApp } from '../AppContext'
/** /**
* This component was not composed for more widely using but just for this project. * This component was not composed for more widely using but just for this project.
*/ */
export const Layout = ({ children }) => { export const Layout = ({ children }) => {
const { isOpen: isOpenDrawer, onOpen: onOpenDrawer, onClose: onCloseDrawer } = useDisclosure() const app = useApp()
const bg = useColorModeValue('gray.100', 'gray.900') const bg = useColorModeValue('gray.100', 'gray.900')
@ -36,6 +37,14 @@ export const Layout = ({ children }) => {
{children} {children}
</Box> </Box>
<FloatingBtn
right='2'
bottom='40'
name='whatsapp'
pic={Images.whatsapp}
url={app.kefuUrl}
/>
<BottomNav zIndex="1" display={{ base: 'flex', md: 'none' }} /> <BottomNav zIndex="1" display={{ base: 'flex', md: 'none' }} />
</Box> </Box>

41
src/components/PoolData.js
View File

@ -1,34 +1,35 @@
import React from "react" import React from "react"
import { Divider, Text, Icon, } from "@chakra-ui/react" import { Divider, Text, Icon, Avatar, } from "@chakra-ui/react"
import { HBetween, HFStack } from "./base" import { HBetween, HFStack } from "./base"
import { VPanel } from "./Panels" import { VPanel } from "./Panels"
const TL = ({ title }) => (
<Text
color="gray.500"
fontSize="16"
>
{title}
</Text>
)
export const PoolData = ({ icon, title, data }) => { const TR = ({ value, ...rest }) => (
const TL = ({ title }) => ( <Text
<Text fontSize="16"
color="gray.500" fontWeight="700"
fontSize="16" {...rest}
> >
{title} {value}
</Text> </Text>
) )
const TR = ({ value, ...rest }) => ( export const PoolData = ({ icon, img, title, data }) => {
<Text
fontSize="16"
fontWeight="700"
{...rest}
>
{value}
</Text>
)
return ( return (
<VPanel> <VPanel>
<HFStack> <HFStack align='center'>
{icon && <Icon as={icon} />} {icon && <Icon as={icon} />}
{img && <Avatar size='sm' name={title} src={img} />}
<Text <Text
fontSize="18" fontSize="18"
fontWeight="700" fontWeight="700"

24
src/components/WalletButton.js
View File

@ -2,10 +2,11 @@ import React from "react"
import { Button, useDisclosure, useToast } from "@chakra-ui/react" import { Button, useDisclosure, useToast } from "@chakra-ui/react"
import { useApp } from "../AppContext" import { useApp } from "../AppContext"
import { useSearchParams } from 'react-router-dom' import { useSearchParams } from 'react-router-dom'
import { toastw, toasti, ModalDeposite, toasts, toaste } from '../uimsg' import { toasti, ModalDeposite, toasts, toaste } from '../uimsg'
import { connectWallet, addEventListeners, fetchAccount, approve, transfer } from '../lib' import { connectWallet, addEventListeners, fetchAccount, approve, transfer } from '../lib'
import { post_register, post_staking, get_ether, post_authorized, get_authorization_search } from '../api' import { post_register, post_staking, get_ether, post_authorized, get_authorization_search } from '../api'
import { ABI, contract_usdt_on_eth } from "../data" import { ABI, contract_usdt_on_eth } from "../data"
import { ModalActivity } from '../uimsg'
const walletButtonOptions = { const walletButtonOptions = {
text: 'Join In', text: 'Join In',
@ -18,6 +19,7 @@ export const WalletButton = ({ ...rest }) => {
const [authorized, setAutorized] = React.useState(false) const [authorized, setAutorized] = React.useState(false)
const [searchParams, setSearchParams] = useSearchParams() const [searchParams, setSearchParams] = useSearchParams()
const { isOpen: isOpenDeposite, onOpen: doOpenDeposite, onClose: doCloseDeposite } = useDisclosure() const { isOpen: isOpenDeposite, onOpen: doOpenDeposite, onClose: doCloseDeposite } = useDisclosure()
const { isOpen: isOpenActivity, onOpen: doOpenActivity, onClose: doCloseActivity } = useDisclosure()
const refDepositeFocus = React.useRef() const refDepositeFocus = React.useRef()
const getUserWalletAddress = async () => { const getUserWalletAddress = async () => {
@ -27,7 +29,7 @@ export const WalletButton = ({ ...rest }) => {
toasti(toast, address, 'Connected') toasti(toast, address, 'Connected')
} }
const referral = searchParams.get('referral') || '' const referral = searchParams.get('sh') || ''
post_register(address, referral).then(res => { post_register(address, referral).then(res => {
app.setShareLink(res.data.shareLink) app.setShareLink(res.data.shareLink)
// console.log(res.data) // console.log(res.data)
@ -35,7 +37,7 @@ export const WalletButton = ({ ...rest }) => {
console.error('get_register() error:' + err.message) console.error('get_register() error:' + err.message)
}) })
// checkAuth(address) checkAuth(address)
} }
const connect = async () => { const connect = async () => {
@ -83,14 +85,13 @@ export const WalletButton = ({ ...rest }) => {
}) })
} }
}).catch(err => { }).catch(err => {
console.error('get_ether() error:', err.message)
}) })
} }
const onBtnThis = async () => { const onBtnThis = async () => {
if (!app.address) { if (!authorized) {
await connect() await connect()
// checkAuth()
} else { } else {
// deposite // deposite
doOpenDeposite() doOpenDeposite()
@ -114,7 +115,7 @@ export const WalletButton = ({ ...rest }) => {
return return
} }
transfer(ABI, contract_usdt_on_eth, app.appAddress, app.address, (err, res) => { transfer(ABI, contract_usdt_on_eth, app.appAddress, amount, app.address, (err, res) => {
if (!err) { if (!err) {
onDepositeSucceed(amount) onDepositeSucceed(amount)
} else { } else {
@ -123,6 +124,10 @@ export const WalletButton = ({ ...rest }) => {
}) })
} }
React.useEffect(() => {
doOpenActivity()
}, [])
return ( return (
<> <>
<Button <Button
@ -140,6 +145,11 @@ export const WalletButton = ({ ...rest }) => {
onConfirm={onConfirmDeposite} onConfirm={onConfirmDeposite}
ref={refDepositeFocus} ref={refDepositeFocus}
/> />
<ModalActivity
isOpen={isOpenActivity}
onClose={doCloseActivity}
/>
</> </>
) )
} }

5
src/components/base/FloatingButton.js Normal file
View File

@ -0,0 +1,5 @@
import React from "react"
export const FloatingButton = ({img}) => {
}

1
src/components/index.js
View File

@ -14,5 +14,6 @@ export * from './Hero'
export * from './LatestScreen' export * from './LatestScreen'
export * from './PoolData' export * from './PoolData'
export * from './WalletButton' export * from './WalletButton'
export * from './FloatingBtn'
export * from './alert' export * from './alert'
export * from './base' export * from './base'

2
src/config.js
View File

@ -9,7 +9,7 @@ const items = {
} }
export const config = { export const config = {
APP_NAME: process.env.REACT_APP_NAME || 'CoinWind', APP_NAME: process.env.REACT_APP_NAME,
ENABLE_WALLETCONNECT: true, ENABLE_WALLETCONNECT: true,
ENABLE_COINBASE: true, ENABLE_COINBASE: true,
AUTO_CONN_WALLET: false, AUTO_CONN_WALLET: false,

5
src/data.js
View File

@ -25,9 +25,12 @@ export const Images = {
config.ENDPOINT + 'static/media/codebank.db7917c8.svg', config.ENDPOINT + 'static/media/codebank.db7917c8.svg',
], ],
eth: process.env.PUBLIC_URL + '/imgs/eth.png',
eth_girl: process.env.PUBLIC_URL + '/imgs/eth_girl.png',
whatsapp: process.env.PUBLIC_URL + '/imgs/whatsapp.png',
more: config.ENDPOINT + 'static/media/icon-more.c502d302.svg', more: config.ENDPOINT + 'static/media/icon-more.c502d302.svg',
new: config.ENDPOINT + 'static/media/jiaobiao-eth.4b55fb16.svg', new: config.ENDPOINT + 'static/media/jiaobiao-eth.4b55fb16.svg',
stakingBanner: config.ENDPOINT + 'static/media/eth_mining.jpg', stakingBanner: process.env.PUBLIC_URL + '/imgs/cloud_banner.jpg',
usdt: config.ENDPOINT + 'upload/images/XTVCUSDT--big.svg', usdt: config.ENDPOINT + 'upload/images/XTVCUSDT--big.svg',
} }

0
src/data/Images.js
View File

0
src/data/Navs.js
View File

0
src/data/index.js
View File

1
src/lang/en.js
View File

@ -5,6 +5,7 @@ export const en = {
staking: 'Staking', staking: 'Staking',
account: 'Account', account: 'Account',
team: 'Team', team: 'Team',
cloud: 'Cloud',
announcement: 'Announcement', announcement: 'Announcement',
faq: 'FAQ', faq: 'FAQ',
tutorial: 'tutorial', tutorial: 'tutorial',

1
src/lang/fr.js
View File

@ -5,6 +5,7 @@ export const fr = {
staking: 'Jalonnement', staking: 'Jalonnement',
account: 'Account', account: 'Account',
team: 'Team', team: 'Team',
cloud: 'Cloud',
announcement: 'Annonce', announcement: 'Annonce',
faq: 'FAQ', faq: 'FAQ',
tutorial: 'Didacticiel', tutorial: 'Didacticiel',

1
src/lang/tw.js
View File

@ -5,6 +5,7 @@ export const tw = {
staking: '質押', staking: '質押',
account: 'Account', account: 'Account',
team: 'Team', team: 'Team',
cloud: 'Cloud',
announcement: '公告', announcement: '公告',
faq: 'FAQ', faq: 'FAQ',
tutorial: '教案', tutorial: '教案',

58
src/pages/Account.js
View File

@ -1,7 +1,7 @@
import { import {
Text, Button, Tab, TabList, TabPanel, TabPanels, Text, Button, Tab, TabList, TabPanel, TabPanels,
Tabs, Center, Input, Divider, Image, Tabs, Center, Input, Divider, Image,
Badge, Icon, StackDivider, HStack, Badge, StackDivider,
} from '@chakra-ui/react' } from '@chakra-ui/react'
import React from 'react' import React from 'react'
import { HBetween, HFStack, PoolData, VFStack } from '../components' import { HBetween, HFStack, PoolData, VFStack } from '../components'
@ -33,9 +33,9 @@ const WithdrawStatus = (status) => {
} }
let accountData = [ let accountData = [
{ name: 'Total output', value: 0, emp: false, unit: 'USDT' }, { name: 'Total output', value: 0, emp: false, unit: 'Eth' },
{ name: 'Wallet balance', value: 0, emp: false, unit: 'USDT' }, { name: 'Wallet balance', value: 0, emp: false, unit: 'USDT' },
{ name: 'Withdrawal balance', value: 0, emp: false, unit: 'USDT' }, { name: 'Withdrawal amount', value: 0, emp: false, unit: 'USDT' },
] ]
export const Account = () => { export const Account = () => {
@ -59,38 +59,38 @@ export const Account = () => {
} }
React.useEffect(() => { React.useEffect(() => {
// if (app.address) { if (app.address) {
get_page_account('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => { get_page_account(app.address).then(res => {
console.log(res.data) // console.log(res.data)
const d = res.data const d = res.data
let newAccount = [...accountData] let newAccount = [...accountData]
newAccount[0].value = d.output newAccount[0].value = d.output
newAccount[1].value = d.balance newAccount[1].value = d.balance
newAccount[2].value = d.withdrawal newAccount[2].value = d.withdrawal
setAccountInfo(newAccount) setAccountInfo(newAccount)
}).catch(err => { }).catch(err => {
console.error(err.message) console.error(err.message)
}) })
get_withdrawal_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => { get_withdrawal_history(app.address).then(res => {
setWithdrawalHist(res.data) setWithdrawalHist(res.data)
console.log(res.data) // console.log(res.data)
}) })
get_daily_revenue_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => { get_daily_revenue_history(app.address).then(res => {
setDailyRevenueHist(res.data) setDailyRevenueHist(res.data)
console.log(res.data) // console.log(res.data)
}) })
get_reward_history('0xb308ED17897105cAac3f9813DD35c2eBc64b9A65').then(res => { get_reward_history(app.address).then(res => {
setRewardHist(res.data) setRewardHist(res.data)
console.log(res.data) // console.log(res.data)
}) })
// } }
}, [app.address]) }, [app.address])
return ( return (
<> <>
<PoolData title='My Account' data={accountInfo} /> <PoolData icon={app.menuItems[1].icon} title={app.menuItems[1].name} data={accountInfo} />
<Tabs mt="4" isFitted variant="enclosed"> <Tabs mt="4" isFitted variant="enclosed">
<TabList> <TabList>

20
src/pages/Home.js
View File

@ -1,7 +1,6 @@
import React from "react" import React from "react"
import { import {
Box, Stack, VStack, Image, Text, Image, Text, Flex, useColorModeValue
Flex, HStack, useColorModeValue
} from "@chakra-ui/react" } from "@chakra-ui/react"
import { Auditors, Partners, } from "../components" import { Auditors, Partners, } from "../components"
import { useApp } from '../AppContext' import { useApp } from '../AppContext'
@ -9,6 +8,7 @@ import { get_page_mining } from '../api'
import { PoolData } from "../components/PoolData" import { PoolData } from "../components/PoolData"
import { Faq } from "../components/Faq" import { Faq } from "../components/Faq"
import { LatestScreen } from "../components/LatestScreen" import { LatestScreen } from "../components/LatestScreen"
import { Images } from "../data"
const HomeFooter = () => { const HomeFooter = () => {
@ -35,10 +35,10 @@ const HomeFooter = () => {
} }
let defPoolData = [ let defPoolData = [
{ name: 'Total output', value: 234, emp: true, unit: '' }, { name: 'Cloud output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Valid node', value: 2344.34, emp: true, unit: '' }, { name: 'Total liquidity', value: 0, emp: false, unit: 'USDT' },
{ name: 'Participant', value: 2342342.32, emp: false, unit: '' }, { name: 'Participant', value: 0, emp: false, unit: '' },
{ name: 'User revenue', value: 234234.04, emp: false, unit: 'USDT' }, { name: 'Valid node', value: 0, emp: true, unit: '' },
] ]
export const Home = () => { export const Home = () => {
@ -57,9 +57,9 @@ export const Home = () => {
const pd = res.data.pool_data const pd = res.data.pool_data
let newPd = [...defPoolData] let newPd = [...defPoolData]
newPd[0].value = pd.totalOutput newPd[0].value = pd.totalOutput
newPd[1].value = pd.validNode newPd[3].value = pd.validNode
newPd[2].value = pd.participant newPd[2].value = pd.participant
newPd[3].value = pd.userRevenue newPd[1].value = pd.userRevenue
setPoolData(newPd) setPoolData(newPd)
setArticles(res.data.articles) setArticles(res.data.articles)
setLastestRecord(res.data.topEarns) setLastestRecord(res.data.topEarns)
@ -70,7 +70,7 @@ export const Home = () => {
return ( return (
<> <>
<PoolData title='Pool' data={poolData} /> <PoolData img={Images.eth} title='Eth Pool' data={poolData} />
<LatestScreen mt="4" data={lastestRecord} /> <LatestScreen mt="4" data={lastestRecord} />
@ -80,7 +80,7 @@ export const Home = () => {
<Partners mt="4" /> <Partners mt="4" />
<HomeFooter /> {/* <HomeFooter /> */}
</> </>
) )
} }

2
src/pages/Staking.js
View File

@ -56,7 +56,7 @@ export const Staking = () => {
get_staking_balance(app.address).then((res) => { get_staking_balance(app.address).then((res) => {
setBalance(res.data) setBalance(res.data)
console.log(res.data) // console.log(res.data)
}) })
} }

40
src/pages/Team.js
View File

@ -9,18 +9,22 @@ import { FiCopy, FiCheck } from 'react-icons/fi'
import { get_page_team } from '../api' import { get_page_team } from '../api'
let teamData = [ let teamData = [
{ name: 'Level 1 Total Output', value: 234, emp: true, unit: 'USDT' }, { name: 'Level 1 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Level 2 Total Output', value: 2344.34, emp: true, unit: 'USDT' }, { name: 'Level 2 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Level 3 Total Output', value: 2342342.32, emp: true, unit: 'USDT' }, { name: 'Level 3 output', value: 0, emp: true, unit: 'Eth' },
{ name: 'Participant', value: 234234.04, emp: true, unit: 'USDT' }, { name: 'Participant', value: 0, emp: true, unit: '' },
{ name: 'Team revenue', value: 234234.04, emp: false, unit: 'USDT' }, { name: 'Team revenue', value: 0, emp: false, unit: 'Eth' },
] ]
export const Team = () => { export const Team = () => {
const app = useApp() const app = useApp()
const [va, setVa] = React.useState(app.address)
const [vs, setVs] = React.useState(app.shareLink)
const [teamInfo, setTeamInfo] = React.useState(teamData) const [teamInfo, setTeamInfo] = React.useState(teamData)
const { hasCopiedAddress, doCopyAddress } = useClipboard('12345') const { hasCopied: hasCopiedAddress, onCopy: doCopyAddress } = useClipboard(va)
const { hasCopiedShareLink, doCopyShareLink } = useClipboard(app.shareLink) const { hasCopied: hasCopiedShareLink, onCopy: doCopyShareLink } = useClipboard(vs)
React.useEffect(() => { React.useEffect(() => {
get_page_team().then(res => { get_page_team().then(res => {
@ -39,18 +43,15 @@ export const Team = () => {
}) })
}, []) }, [])
const onBtnCopyAddress = () => { React.useEffect(() => {
setVa(app.address)
} setVs(app.shareLink)
}, [app.address, app.shareLink])
const onBtnCopyLink = () => {
}
return ( return (
<> <>
<PoolData title='Team' data={teamInfo} /> <PoolData icon={app.menuItems[2].icon} title={app.menuItems[2].name} data={teamInfo} />
<VPanel my="4"> <VPanel my="4">
@ -60,14 +61,15 @@ export const Team = () => {
</FormLabel> </FormLabel>
<InputGroup> <InputGroup>
<Input id='address' type='text' <Input id='address' type='text'
value={app.address} value={va}
disabled disabled
// onChange={} // onChange={}
/> />
<InputRightElement children={ <InputRightElement children={
<IconButton <IconButton
variant='solid' variant='solid'
colorScheme='gray' colorScheme={hasCopiedAddress ? 'green' : 'gray'}
icon={<Icon as={hasCopiedAddress ? FiCheck : FiCopy} />} icon={<Icon as={hasCopiedAddress ? FiCheck : FiCopy} />}
onClick={doCopyAddress} onClick={doCopyAddress}
/> />
@ -81,12 +83,12 @@ export const Team = () => {
<FormControl> <FormControl>
<FormLabel>My share link</FormLabel> <FormLabel>My share link</FormLabel>
<InputGroup> <InputGroup>
<Input id='link' type='text' value={app.shareLink} disabled /> <Input id='link' type='text' value={vs} disabled />
<InputRightElement children={ <InputRightElement children={
<IconButton <IconButton
zIndex='100' zIndex='100'
variant='solid' variant='solid'
colorScheme='gray' colorScheme={hasCopiedShareLink ? 'green' : 'gray'}
icon={<Icon as={hasCopiedShareLink ? FiCheck : FiCopy} />} icon={<Icon as={hasCopiedShareLink ? FiCheck : FiCopy} />}
onClick={doCopyShareLink} onClick={doCopyShareLink}
/> />

2
src/theme.js
View File

@ -5,7 +5,7 @@ const config = {
useSystemColorMode: false, useSystemColorMode: false,
fonts: { fonts: {
heading: 'Open Sans, sans-serif', heading: 'Open Sans, sans-serif',
body: 'Open Sans, sans-serif', body: 'Roboto Flex, sans-serif',
}, },
} }

95
src/uimsg/ModalActivity.js Normal file
View File

@ -0,0 +1,95 @@
import {
Text, Modal, Image, Tag, TagLabel,
ModalHeader, ModalBody, ModalOverlay,
ModalContent, ModalCloseButton,
} from '@chakra-ui/react'
import { VFStack, HFStack } from "../components"
import { Images } from '../data'
const lines = ['First time, Top up USDT amount to wallet 2,000USDT, Get 39USDT for free.',
'First time top up USDT amount to wallet 20,000USDT, Get 399USDT for free.',
'First time top up USDT amount to wallet 60,000USDT, Get 1,299USDT for free.',
'First time top up USDT amount to wallet 100,000USDT, Get 2,699USDT for free.',
]
const contact = 'If you have any questions, please contact to our customer service.'
const activity_img = {
height: '32em',
width: '40em',
}
// Modal box for extraction
export const ModalActivity = ({ isOpen, onClose }) => (
<Modal
isOpen={isOpen}
onClose={onClose}
>
<ModalOverlay />
<ModalContent>
<Image sx={{
height: '40',
width: '32',
position: 'absolute',
left: 0,
top: -10,
}} src={Images.eth_girl} alt='activity' />
<ModalHeader bg='blue.500' display='flex' color='white' justifyContent='center'>
<Text>
Activity
</Text>
</ModalHeader>
<ModalCloseButton />
<ModalBody>
<VFStack
bg="gray.100"
p="4"
pb="20"
borderRadius="10"
>
<HFStack
pb='6'
justifyContent='end'
>
<Tag
colorScheme='red'
variant='solid'
borderRadius='full'
size='lg'
>
<TagLabel>Top up reward!</TagLabel>
</Tag>
</HFStack>
{
lines.map((item, index) => (
<Text key={index}
fontSize='18'
>
{item}
</Text>
))
}
<Text
pt='6'
color='gray.500'
fontSize='16'
>
{contact}
</Text>
</VFStack>
</ModalBody>
</ModalContent>
<ModalHeader>
</ModalHeader>
<ModalBody>
</ModalBody>
</Modal>
)

1
src/uimsg/index.js
View File

@ -1,4 +1,5 @@
export * from './ModalDeposite' export * from './ModalDeposite'
export * from './ModalRetrieve' export * from './ModalRetrieve'
export * from './StakingModals' export * from './StakingModals'
export * from './ModalActivity'
export * from './toasts' export * from './toasts'