mirror of
https://github.com/ethereum/go-ethereum.git
synced 2026-08-19 10:22:23 +00:00
Table scaling issue resolved, internal tx size fixed, txHash detailed transaction data issue fixed, inline styles removed for tables
This commit is contained in:
Chris Fenos
parent
f77a50b4e1
commit
9035fc1a9f
12 changed files with 204 additions and 123 deletions
|
|
@ -1,18 +1,20 @@
|
|||
import React from 'react';
|
||||
import classes from './accounts.css';
|
||||
import classes from './table.css';
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
const AccountsTable = (props) => {
|
||||
return (
|
||||
<tbody>
|
||||
<tr style={{ borderTop: '1px solid #e0defb' }}>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Rank}</td>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}><Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.Addr)}>
|
||||
<tr className={classes.border}>
|
||||
<td className={classes.tdItem}>{props.Rank}</td>
|
||||
<td className={classes.tdItem}>
|
||||
<Link className={classes.tdLink} to="/account/detail" onClick={() => props.detailAccountHandler(props.Addr)}>
|
||||
{props.Addr}
|
||||
</Link></td>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Balance}</td>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Percentage}%</td>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.AccountNonce}</td>
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}> {props.Balance} </td>
|
||||
<td className={classes.tdItem}> {props.Percentage}% </td>
|
||||
<td className={classes.tdItem}> {props.AccountNonce} </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,52 +1,49 @@
|
|||
.table {
|
||||
border-spacing: 100rem;
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
background-color: white;
|
||||
top: 107pt;
|
||||
left: 2.5%;
|
||||
position: absolute;
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: aliceblue;
|
||||
padding-right: 10px;
|
||||
background-color: white;
|
||||
padding: 15pt 30pt ;
|
||||
color: #593c83;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
.thItem {
|
||||
font-size: 8pt;
|
||||
background-color: white;
|
||||
color: #4f2e7e;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 6pt;
|
||||
background-color: white;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tdItem {
|
||||
padding-left: 30pt;
|
||||
padding-bottom: 7.5pt;
|
||||
padding-top: 7.5pt;
|
||||
}
|
||||
|
||||
.tdLink {
|
||||
color: #8f67c9;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-top: 1px solid #e0defb;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
pointer-events: none;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.incoming {
|
||||
height: 25px;
|
||||
width: 35px;
|
||||
border: 1px forestgreen;
|
||||
border-radius: 5px;
|
||||
background-color: #4f2e7e;
|
||||
color: white;
|
||||
font-size: 1rem;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.out {
|
||||
height: 25px;
|
||||
width: 35px;
|
||||
border: 1px orangered;
|
||||
border-radius: 5px;
|
||||
background-color: orangered;
|
||||
color: white;
|
||||
font-size: .8rem;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -46,16 +46,16 @@ class BlocksTable extends Component {
|
|||
<table className={combinedClasses.join(' ')}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Height</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Block Hash</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Age</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Txn</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Uncles</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >Coinbase</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>GasUsed</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>GasLimit</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Avg.GasPrice</th>
|
||||
<th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Reward</th>
|
||||
<th scope="col" className={classes.thItem}> Height </th>
|
||||
<th scope="col" className={classes.thItem}> Block Hash </th>
|
||||
<th scope="col" className={classes.thItem}> Age </th>
|
||||
<th scope="col" className={classes.thItem}> Txn </th>
|
||||
<th scope="col" className={classes.thItem}> Uncles </th>
|
||||
<th scope="col" className={classes.thItem}> Coinbase </th>
|
||||
<th scope="col" className={classes.thItem}> GasUsed </th>
|
||||
<th scope="col" className={classes.thItem}> GasLimit </th>
|
||||
<th scope="col" className={classes.thItem}> Avg.GasPrice </th>
|
||||
<th scope="col" className={classes.thItem}> Reward </th>
|
||||
</tr>
|
||||
</thead>
|
||||
{table}
|
||||
|
|
|
|||
|
|
@ -5,17 +5,23 @@ import { Link } from 'react-router-dom'
|
|||
const BlockTable = (props) => {
|
||||
return (
|
||||
<tbody>
|
||||
<tr style={{ borderTop: '1px solid #e0defb' }}>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.height} ><Link to="/blocks" style={{ color: '#8f67c9' }} onClick={() => props.detailBlockHandler(props.Number)}>
|
||||
<tr className={classes.border}>
|
||||
<td className={classes.tdItem}>
|
||||
<Link to="/blocks" style={{ color: '#8f67c9' }} onClick={() => props.detailBlockHandler(props.Number)}>
|
||||
{props.Number}
|
||||
</Link></td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.hash}>{props.Hash}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.AgeGet}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.TxCount}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.UncleCount}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.addressTag}><Link to="/mined/blocks" style={{ color: '#8f67c9' }} onClick={() => props.getBlocksMined(props.Coinbase)}>{props.Coinbase}</Link></td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.GasUsed}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.GasLimit}</td>
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}> {props.Hash} </td>
|
||||
<td className={classes.tdItem}> {props.AgeGet} </td>
|
||||
<td className={classes.tdItem}> {props.TxCount} </td>
|
||||
<td className={classes.tdItem}> {props.UncleCount} </td>
|
||||
<td className={classes.tdItem}>
|
||||
<Link to="/mined/blocks" style={{ color: '#8f67c9' }} onClick={() => props.getBlocksMined(props.Coinbase)}>
|
||||
{props.Coinbase}
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}> {props.GasUsed} </td>
|
||||
<td className={classes.tdItem}> {props.GasLimit} </td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>TBD</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.Reward}</td>
|
||||
</tr>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
.table {
|
||||
border-spacing: 100rem;
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
background-color: white;
|
||||
top: 107pt;
|
||||
left: 2.5%;
|
||||
position: absolute;
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
th {
|
||||
|
|
@ -15,8 +15,35 @@ th {
|
|||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
.thItem {
|
||||
font-size: 8pt;
|
||||
background-color: white;
|
||||
color: #4f2e7e;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 6pt;
|
||||
background-color: white;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tdItem {
|
||||
padding-left: 30pt;
|
||||
padding-bottom: 7.5pt;
|
||||
padding-top: 7.5pt;
|
||||
}
|
||||
|
||||
.tdLink {
|
||||
color: #8f67c9;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-top: 1px solid #e0defb;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
pointer-events: none;
|
||||
color: black;
|
||||
}
|
||||
|
|
@ -13,9 +13,6 @@ class InternalTransactionsTable extends Component {
|
|||
}
|
||||
|
||||
async componentDidMount() {
|
||||
|
||||
console.log("in table row component");
|
||||
|
||||
try {
|
||||
const response = await axios.get("http://localhost:8080/api/get_internal_transactions/");
|
||||
await this.setState({data: response.data});
|
||||
|
|
@ -50,17 +47,17 @@ class InternalTransactionsTable extends Component {
|
|||
<table className={combinedClasses.join(' ')}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" className={classes.blockHash} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >Block Hash</th>
|
||||
<th scope="col" className={classes.action} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >Action</th>
|
||||
<th scope="col" className={classes.to} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >To</th>
|
||||
<th scope="col" className={classes.from} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >From</th>
|
||||
<th scope="col" className={classes.gas} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >Gas</th>
|
||||
<th scope="col" className={classes.gasUsed} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }} >Gas Used</th>
|
||||
<th scope="col" className={classes.id} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }}>ID</th>
|
||||
<th scope="col" className={classes.input} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }}>Input</th>
|
||||
<th scope="col" className={classes.output} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }}>Output</th>
|
||||
<th scope="col" className={classes.time} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }}>Time</th>
|
||||
<th scope="col" className={classes.value} style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e" }}>Value</th>
|
||||
<th scope="col" className={classes.thItem}> Block Hash </th>
|
||||
<th scope="col" className={classes.thItem}> Action </th>
|
||||
<th scope="col" className={classes.thItem}> To </th>
|
||||
<th scope="col" className={classes.thItem}> From </th>
|
||||
<th scope="col" className={classes.thItem}> Gas </th>
|
||||
<th scope="col" className={classes.thItem}> Gas Used</th>
|
||||
<th scope="col" className={classes.thItem}> ID </th>
|
||||
<th scope="col" className={classes.thItem}> Input </th>
|
||||
<th scope="col" className={classes.thItem}> Output </th>
|
||||
<th scope="col" className={classes.thItem}> Time </th>
|
||||
<th scope="col" className={classes.thItem}> Value </th>
|
||||
</tr>
|
||||
</thead>
|
||||
{table}
|
||||
|
|
|
|||
|
|
@ -6,28 +6,28 @@ import Button from 'react-bootstrap/lib/Button';
|
|||
const InternalTable = (props) => {
|
||||
return (
|
||||
<tbody>
|
||||
<tr style={{ borderTop: '1px solid #e0defb' }}>
|
||||
<td style={{ paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >
|
||||
<div style={{ color: '#8f67c9' }} onClick={() => props.detailInternalHandler(props.Hash)}>
|
||||
<tr className={classes.border}>
|
||||
<td className={classes.tdItem}>
|
||||
<div className={classes.tdLink} onClick={() => props.detailInternalHandler(props.Hash)}>
|
||||
{props.Hash}
|
||||
</div>
|
||||
</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} >{props.Action}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.To}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.From}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.Gas}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.GasUsed}></td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.ID}</td>
|
||||
<td style={{paddingLeft: '18pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>
|
||||
<Button style={{color: '#8f67c9'}} bsStyle="link" bsSize="small" onClick={()=>alert( props.Input )}> Show Input </Button>
|
||||
<td className={classes.tdItem}>{props.Action}</td>
|
||||
<td className={classes.tdItem}>{props.To}</td>
|
||||
<td className={classes.tdItem}>{props.From}</td>
|
||||
<td className={classes.tdItem}>{props.Gas}</td>
|
||||
<td className={classes.tdItem}> {props.GasUsed} </td>
|
||||
<td className={classes.tdItem}>{props.ID}</td>
|
||||
<td className={classes.tdItem}>
|
||||
<div className={classes.tdLink} onClick={()=>alert( props.Input )}> Show Input
|
||||
<input type="hidden" id={"input" + props.Hash} value={props.Input} /> </div>
|
||||
</td>
|
||||
<td style={{paddingLeft: '18pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>
|
||||
<Button style={{color: '#8f67c9'}} bsStyle="link" bsSize="small" onClick={()=>alert(props.Output)}> Show Output </Button>
|
||||
<td className={classes.tdItem}>
|
||||
<div className={classes.tdLink} onClick={()=>alert(props.Output)}> Show Output
|
||||
<input type="hidden" id={"output" + props.Hash} value={props.Output} /> </div>
|
||||
</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.Time}</td>
|
||||
<td style={{paddingLeft: '30pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.Value}</td>
|
||||
<input type="hidden" id={"input" + props.Hash} value={props.Input} />
|
||||
<input type="hidden" id={"output" + props.Hash} value={props.Output} />
|
||||
<td className={classes.tdItem}>{props.Time}</td>
|
||||
<td className={classes.tdItem}>{props.Value}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
.table {
|
||||
border-spacing: 100rem;
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
background-color: white;
|
||||
top: 107pt;
|
||||
left: 2.5%;
|
||||
position: absolute;
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
th {
|
||||
|
|
@ -15,10 +15,32 @@ th {
|
|||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
.thItem {
|
||||
font-size: 8pt;
|
||||
background-color: white;
|
||||
color: #4f2e7e;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 6pt;
|
||||
background-color: white;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tdItem {
|
||||
padding-left: 30pt;
|
||||
padding-bottom: 7.5pt;
|
||||
padding-top: 7.5pt;
|
||||
}
|
||||
|
||||
.tdLink {
|
||||
color: #8f67c9;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-top: 1px solid #e0defb;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
|
|
|
|||
|
|
@ -1,14 +1,13 @@
|
|||
.table {
|
||||
border-spacing: 100rem;
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
background-color: white;
|
||||
top: 107pt;
|
||||
left: 2.5%;
|
||||
position: absolute;
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
|
||||
th {
|
||||
background-color: white;
|
||||
padding: 15pt 30pt ;
|
||||
|
|
@ -16,10 +15,32 @@ th {
|
|||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
.thItem {
|
||||
font-size: 8pt;
|
||||
background-color: white;
|
||||
color: #4f2e7e;
|
||||
}
|
||||
|
||||
td {
|
||||
font-size: 6pt;
|
||||
background-color: white;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tdItem {
|
||||
padding-left: 30pt;
|
||||
padding-bottom: 7.5pt;
|
||||
padding-top: 7.5pt;
|
||||
}
|
||||
|
||||
.tdLink {
|
||||
color: #8f67c9;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-top: 1px solid #e0defb;
|
||||
}
|
||||
|
||||
.disabled {
|
||||
|
|
|
|||
|
|
@ -45,13 +45,13 @@ class TransactionTable extends Component {
|
|||
<table key={this.state.data.TxHash} className={combinedClasses.join(' ')}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxHash</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Block</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Age</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>From</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>To</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Value</th>
|
||||
<th scope="col" style={{paddingLeft: '15pt', fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}} >TxFee</th>
|
||||
<th scope="col" className={classes.thItem}> TxHash </th>
|
||||
<th scope="col" className={classes.thItem}> Block </th>
|
||||
<th scope="col" className={classes.thItem}> Age </th>
|
||||
<th scope="col" className={classes.thItem}> From </th>
|
||||
<th scope="col" className={classes.thItem}> To </th>
|
||||
<th scope="col" className={classes.thItem}> Value </th>
|
||||
<th scope="col" className={classes.thItem}> TxFee </th>
|
||||
</tr>
|
||||
</thead>
|
||||
{table}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
import React from 'react';
|
||||
import classes from './table.css';
|
||||
import arrow from '../../assets/arrow_right_black.png';
|
||||
import { Link } from 'react-router-dom'
|
||||
|
||||
const TransactionTable = (props) => {
|
||||
|
|
@ -16,17 +15,30 @@ const TransactionTable = (props) => {
|
|||
|
||||
return (
|
||||
<tbody>
|
||||
<tr style={{ borderTop: '1px solid #e0defb' }}>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt'}} className={classes.addressTag}>
|
||||
<tr className={classes.border}>
|
||||
<td className={classes.tdItem}>
|
||||
<Link to="/transactions" style={{ color: '#8f67c9' }} className={flag ? "" : classes.disabled} onClick={() => props.detailTransactionHandler(props.txHash)}>
|
||||
{props.txHash}</Link>
|
||||
{props.txHash}
|
||||
</Link>
|
||||
</td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}><Link style={{ color: '#8f67c9' }} to="/block/transactions" onClick={() => props.getBlockTransactions(props.blockNumber)}>{props.blockNumber}</Link></td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.age}</td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={flag ? classes.fromTag : classes.disabled }><Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.from)}>{props.from}</Link></td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }} className={classes.toTag}><Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.to)}>{props.to}</Link></td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.value}</td>
|
||||
<td style={{ paddingLeft: '15pt', paddingBottom: '7.5pt', paddingTop: '7.5pt' }}>{props.cost}</td>
|
||||
<td className={classes.tdItem}>
|
||||
<Link style={{ color: '#8f67c9' }} to="/block/transactions" onClick={() => props.getBlockTransactions(props.blockNumber)}>
|
||||
{props.blockNumber}
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}>{props.age}</td>
|
||||
<td className={[flag ? classes.fromTag : classes.disabled, classes.tdItem ]}>
|
||||
<Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.from)}>
|
||||
{props.from}
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}>
|
||||
<Link style={{ color: '#8f67c9' }} to="/account/detail" onClick={() => props.detailAccountHandler(props.to)}>
|
||||
{props.to}
|
||||
</Link>
|
||||
</td>
|
||||
<td className={classes.tdItem}> {props.value} </td>
|
||||
<td className={classes.tdItem}> {props.cost} </td>
|
||||
</tr>
|
||||
</tbody>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -147,7 +147,7 @@ class App extends Component {
|
|||
if (dataEntry["To"] === null) {
|
||||
delete dataEntry["To"]
|
||||
}
|
||||
if( key === "Input" || key === "Output") {
|
||||
if( key === "Input" || key === "Output" || key === "Data") {
|
||||
components.push(
|
||||
<Grid>
|
||||
<Row className="show-grid">
|
||||
|
|
@ -179,12 +179,10 @@ class App extends Component {
|
|||
}
|
||||
|
||||
renderOverlay = () => {
|
||||
|
||||
const page = this.state.overlayContent;
|
||||
let data, title;
|
||||
let keys = [];
|
||||
let values = [];
|
||||
|
||||
switch (page) {
|
||||
case "block" :
|
||||
title = "BLOCK OVERVIEW";
|
||||
|
|
@ -204,7 +202,6 @@ class App extends Component {
|
|||
break;
|
||||
default: console.log("error");
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="static-modal">
|
||||
<Modal.Dialog>
|
||||
|
|
@ -233,11 +230,11 @@ class App extends Component {
|
|||
this.state.overlayTriggered ? this.renderOverlay() : null
|
||||
}
|
||||
|
||||
<div style={ this.state.overlayTriggered ? {backgroundColor:"#f7f8f9", paddingBottom:"5%", opacity:0.5, zIndex: -10000, height: '100%'} : {backgroundColor:"#f7f8f9", paddingBottom:"5%", height: '100%' } }>
|
||||
<div style={ this.state.overlayTriggered ? {backgroundColor:"#f7f8f9", paddingBottom:"5%", opacity:0.5, zIndex: -10000, height: '100%', width: '100%'} : {backgroundColor:"#f7f8f9", paddingBottom:"5%", height: '100%', width: '100%' } }>
|
||||
<Nav />
|
||||
|
||||
<Route path="/" exact render={({ match }) =>
|
||||
<Home/>
|
||||
<Home style={{width: '100%'}}/>
|
||||
}
|
||||
/>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue