feat: 新增 FarmItem组件

.gitignore

@@ -24,3 +24,4 @@ yarn-error.log*
 scripts/upload.js
 package.json
 package-lock.json
+.idea

src/features/farm/components/FarmItem.js

@@ -0,0 +1,19 @@
+import React, {useState, useEffect} from 'react';
+import classNames from "classnames";
+import {makeStyles} from "@material-ui/core/styles";
+import farmItemStyle from "../jss/sections/farmItemStyle";
+import Button from "../../../components/CustomButtons/Button";
+
+const useStyles = makeStyles(farmItemStyle);
+
+export default (props) => {
+  const {style, index, farmInfo} = props;
+  const classes = useStyles();
+  return (
+    <div style={style} className={classNames({
+      [classes.flexColumnCenter]: true
+    })}>
+      <Button href={`/#/farm/pool/${index + 1}`}>抵押</Button>
+    </div>
+  )
+}

src/features/farm/jss/sections/farmItemStyle.js

@@ -0,0 +1,10 @@
+const farmItemStyle = theme => ({
+  flexColumnCenter: {
+    display: 'flex',
+    flexDirection: 'column',
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+});
+
+export default farmItemStyle;

src/features/farm/redux/initialState.js

@@ -20,11 +20,11 @@ const pools = [
 		description: '',
 		token: 'MEFI/ETH',
 		tokenDescription: '',
-		tokenDecimals: 18,
+		tokenDecimals: 8,
 		tokenAddress: '0xa1d0E215a23d7030842FC67cE582a6aFa3CCaB83',
 		earnedToken: 'MEFI',
 		earnedTokenDescription: '',
-		earnedTokenDecimals: 6,
+		earnedTokenDecimals: 8,
 		earnedTokenAddress: '0x72Cf258c852Dc485a853370171d46B9D29fD3184',
 		earnContractAddress: '0x6CA21695CB12A251bB19aE73Bda6964f1BBc48De',
 		earnContractAbi: pool4Abi

src/features/farm/sections/FarmPools.js

@@ -1,21 +1,22 @@
-import React,{ useState, useEffect } from 'react';
+import React, {useState, useEffect} from 'react';
 import classNames from "classnames";
-import { useTranslation } from 'react-i18next';
-import { makeStyles } from "@material-ui/core/styles";
-import { farmPoolsStyle } from "../jss/sections/farmPoolsStyle";
+import {useTranslation} from 'react-i18next';
+import {makeStyles} from "@material-ui/core/styles";
+import {farmPoolsStyle} from "../jss/sections/farmPoolsStyle";
 import Grid from '@material-ui/core/Grid';
 // core components
 import Button from "components/CustomButtons/Button.js";
-import { useFetchPoolsInfo } from '../redux/hooks';
+import {useFetchPoolsInfo} from '../redux/hooks';
+import FarmItem from "../components/FarmItem";
 
 const useStyles = makeStyles(farmPoolsStyle);
 
 export default function FarmPools(props) {
   const classes = useStyles();
-  const { t, i18n } = useTranslation();
-  const { pools } = useFetchPoolsInfo();
+  const {t, i18n} = useTranslation();
+  const {pools} = useFetchPoolsInfo();
   console.log(pools)
-  
+
   return (
     <Grid container style={{paddingTop: '4px'}}>
       <Grid item xs={12}>
@@ -24,7 +25,7 @@ export default function FarmPools(props) {
       </Grid>
       {pools.map((pool, index) => (
         <Grid item xs={3} key={index}>
-          <Button href={`/#/farm/pool/${index + 1}`}>抵押</Button>
+          <FarmItem style={{background: ""}} farmInfo={pool} index={index}/>
         </Grid>
       ))}
     </Grid>