Block explorer blocks mined page fixed

This commit is contained in:
Chris Fenos 2018-08-21 12:45:37 -04:00
parent ffbaa8b20f
commit 4bea6ac814
3 changed files with 25 additions and 32 deletions

View file

@ -33,18 +33,18 @@ class BlocksMinedTable extends Component {
let combinedClasses = ['responsive-table', classes.table]; let combinedClasses = ['responsive-table', classes.table];
return ( return (
<table className={combinedClasses.join(' ')}> <table className={combinedClasses.join(' ')}>
<thead className={classes.tHead}> <thead>
<tr> <tr>
<th scope="col">Height</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Height</th>
<th scope="col">Block Hash</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Block Hash</th>
<th scope="col">Age</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Age</th>
<th scope="col">Txn</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Txn</th>
<th scope="col">Uncles</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Uncles</th>
<th scope="col">Coinbase</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Coinbase</th>
<th scope="col">GasUsed</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>GasUsed</th>
<th scope="col">GasLimit</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>GasLimit</th>
<th scope="col">Avg.GasPrice</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Avg.GasPrice</th>
<th scope="col">Reward</th> <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Reward</th>
</tr> </tr>
</thead> </thead>
{table} {table}

View file

@ -5,19 +5,19 @@ import { Link } from 'react-router-dom'
const MinedBlockTable = (props) => { const MinedBlockTable = (props) => {
return ( return (
<tbody> <tbody>
<tr> <tr style={{ borderTop: '1px solid #e0defb' }}>
<td><Link to="/blocks/detail" onClick={() => props.detailBlockHandler(props.Number)}> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}><Link to="/blocks/detail" onClick={() => props.detailBlockHandler(props.Number)}>
{props.Number} {props.Number}
</Link></td> </Link></td>
<td className={classes.addressTag}>{props.Hash}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}>{props.Hash}</td>
<td>{props.AgeGet}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.AgeGet}</td>
<td>{props.TxCount}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.TxCount}</td>
<td>{props.UncleCount}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.UncleCount}</td>
<td className={classes.addressTag}>{props.Coinbase}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}className={classes.addressTag}>{props.Coinbase}</td>
<td>{props.GasUsed}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.GasUsed}</td>
<td>{props.GasLimit}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.GasLimit}</td>
<td>TBD</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>TBD</td>
<td>{props.Reward}</td> <td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.Reward}</td>
</tr> </tr>
</tbody> </tbody>
) )

View file

@ -72,11 +72,9 @@ class App extends Component {
detailAccountHandler = async(addr) => { detailAccountHandler = async(addr) => {
console.log("[DETAIL ACCOUNT Handler]");
try { try {
const response = await axios.get(`http://localhost:8080/api/get_account_txs/${addr}`) const response = await axios.get(`http://localhost:8080/api/get_account_txs/${addr}`)
await this.setState({ accountDetailData: response.data, reqAccount: addr, overlayTriggered: true, overlayContent: "account" }) await this.setState({ accountDetailData: response.data, reqAccount: addr, overlayTriggered: false })
} }
catch(error) { catch(error) {
console.log(error) console.log(error)
@ -258,8 +256,6 @@ class App extends Component {
<Route path="/mined/blocks" exact render={({match}) => <Route path="/mined/blocks" exact render={({match}) =>
<div> <div>
<BlockCoinbaseHeader
coinbase={this.state.reqCoinbase}/>
<BlocksMinedTable <BlocksMinedTable
getBlockTransactions={this.getBlockTransactions} getBlockTransactions={this.getBlockTransactions}
getBlocksMined={this.getBlocksMined} getBlocksMined={this.getBlocksMined}
@ -269,9 +265,6 @@ class App extends Component {
<Route path="/account/detail" exact render={({match}) => <Route path="/account/detail" exact render={({match}) =>
<div> <div>
{/* <AccountDetailHeader
addr={this.state.reqAccount}
data={this.state.accountDetailData}/> */}
<DetailAccountsTable <DetailAccountsTable
transactionDetailHandler={this.detailTransactionHandler} transactionDetailHandler={this.detailTransactionHandler}
addr={this.state.reqAccount} addr={this.state.reqAccount}