Commit f0d40a92 authored by quocle's avatar quocle

account history

parent 67d7f2b4
......@@ -10,28 +10,28 @@ class Dashboard extends Component {
super(props);
this.state = {
account: '',
amount: '',
pinCode: ''
account: '',
amount: '',
pinCode: ''
};
}
}
handleChange = event => {
this.setState({
[event.target.id]: event.target.value
});
handleChange = event => {
this.setState({
[event.target.id]: event.target.value
});
}
}
componentDidMount= async() =>{
await currentSession()
}
componentDidMount = async () => {
await currentSession()
}
handleSubmit = async (event) => {
event.preventDefault();
console.log("account", this.state.account);
console.log("amount", this.state.amount);
console.log("pinCode", this.state.pinCode);
handleSubmit = async (event) => {
event.preventDefault();
console.log("account", this.state.account);
console.log("amount", this.state.amount);
console.log("pinCode", this.state.pinCode);
this.setState({ isLoading: false });
const transferFrom = `mutation TransferToken($inputToAccount: String!, $inputAmount: String!, $inputUserCredential : String!){
......@@ -41,7 +41,7 @@ handleSubmit = async (event) => {
error
}
}`;
const newRecording = {
inputToAccount: this.state.account,
inputAmount: this.state.amount,
......@@ -50,9 +50,9 @@ handleSubmit = async (event) => {
try {
const rsp = await API.graphql(graphqlOperation(transferFrom, newRecording));
if(isEmpty(rsp.data.transferToken.error)){
if (isEmpty(rsp.data.transferToken.error)) {
alert("Your transfer was confirm");
}else{
} else {
alert(rsp.data.transferToken.error);
}
console.log(rsp);
......@@ -69,64 +69,87 @@ handleSubmit = async (event) => {
<div className="content">
<Table striped>
<tbody>
<tr>
<Table striped>
<tbody>
<tr>
<th scope="row">Account</th>
<th scope="row">Balance</th>
<th scope="row">RAM - used/available</th>
<th scope="row">CPU - used/available</th>
<th scope="row">NET - used/available</th>
</tr>
<tr>
<th scope="row">Balance</th>
<th scope="row">RAM - used/available</th>
<th scope="row">CPU - used/available</th>
<th scope="row">NET - used/available</th>
</tr>
<tr>
<th scope="row">{this.props.accountInfo.accountName}</th>
<th scope="row">{this.props.accountInfo.token.amount[0] ? this.props.accountInfo.token.amount[0] : "0.0000 CAT"}</th>
<th scope="row">{this.props.accountInfo.ram.used + "/" + this.props.accountInfo.ram.quota + " seconds"} </th>
<th scope="row">{this.props.accountInfo.cpu.used + "/" + this.props.accountInfo.cpu.available + " bytes"}</th>
<th scope="row">{this.props.accountInfo.net.used + "/" + this.props.accountInfo.net.available + " bytes"}</th>
<th scope="row">{this.props.accountInfo.token.amount[0] ? this.props.accountInfo.token.amount[0] : "0.0000 CAT"}</th>
<th scope="row">{this.props.accountInfo.ram.used + "/" + this.props.accountInfo.ram.quota + " seconds"} </th>
<th scope="row">{this.props.accountInfo.cpu.used + "/" + this.props.accountInfo.cpu.available + " bytes"}</th>
<th scope="row">{this.props.accountInfo.net.used + "/" + this.props.accountInfo.net.available + " bytes"}</th>
</tr>
</tbody>
</Table>
<div className="Login">
<form onSubmit={this.handleSubmit}>
<FormGroup controlId="account" bsSize="large">
<ControlLabel>To Account Name</ControlLabel>
<FormControl
autoFocus
type="text"
value={this.state.account}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup controlId="amount" bsSize="large">
<ControlLabel>Amount</ControlLabel>
<FormControl
type="text"
value={this.state.amount}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup controlId="pinCode" bsSize="large">
<ControlLabel>Pic Code</ControlLabel>
<FormControl
type="password"
value={this.state.pinCode}
onChange={this.handleChange}
/>
</FormGroup>
<LoaderButton
block
bsSize="large"
// disabled={!this.validateForm()}
type="submit"
// isLoading={this.state.isLoading}
text="Transfer"
loadingText="Transfering …"
/>
</form>
</div>
<Table striped>
<tbody>
<tr>
<th scope="row">Date</th>
<th scope="row">Type</th>
<th scope="row">From / To</th>
<th scope="row">Amount</th>
<th scope="row">Transaction Id</th>
</tr>
{console.log("lvquoc",this.props.accountHistory)}
{this.props.accountHistory && this.props.accountHistory.map((item) => (
<tr>
<th scope="row">{item.timeTransfer}</th>
<th scope="row">{item.direction} </th>
<th scope="row">{item.fromAccount ? item.fromAccount : item.toAccount}</th>
<th scope="row">{item.amount}</th>
<th scope="row">{item.trxId}</th>
</tr>
</tbody>
</Table>
<div className="Login">
<form onSubmit={this.handleSubmit}>
<FormGroup controlId="account" bsSize="large">
<ControlLabel>To Account Name</ControlLabel>
<FormControl
autoFocus
type="text"
value={this.state.account}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup controlId="amount" bsSize="large">
<ControlLabel>Amount</ControlLabel>
<FormControl
type="text"
value={this.state.amount}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup controlId="pinCode" bsSize="large">
<ControlLabel>Pic Code</ControlLabel>
<FormControl
type="password"
value={this.state.pinCode}
onChange={this.handleChange}
/>
</FormGroup>
<LoaderButton
block
bsSize="large"
// disabled={!this.validateForm()}
type="submit"
// isLoading={this.state.isLoading}
text="Transfer"
loadingText="Transfering …"
/>
</form>
</div>
))}
</tbody>
</Table>
</div>
);
}
......
......@@ -6,17 +6,18 @@ import { get, isEmpty } from 'lodash';
import { currentSession } from '../config';
import Dashboard from "./Dashboard.jsx";
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {
modalShow: false,
accountInfo:null,
};
}
constructor(props) {
super(props);
this.state = {
modalShow: false,
accountInfo: null,
accountHistory: null,
};
}
userInfo = async () => {
const myAccountInfo = `query {
userInfo = async () => {
const myAccountInfo = `query {
getAccountInfo{
accountName,
token {
......@@ -38,35 +39,79 @@ export default class Home extends Component {
}
}`;
try {
const myAccount = await Amplify.API.graphql(graphqlOperation(myAccountInfo));
console.log(myAccount);
if(isEmpty(get(myAccount, "data.getAccountInfo.error"))){
this.setState({
accountInfo : get(myAccount, "data.getAccountInfo")
});
}else{
this.setState({
modalShow : true
});
}
} catch (err) {
console.log(err);
}
};
try {
const myAccount = await Amplify.API.graphql(graphqlOperation(myAccountInfo));
console.log(myAccount);
if (isEmpty(get(myAccount, "data.getAccountInfo.error"))) {
async componentDidMount() {
await currentSession()
await this.userInfo()
}
render() {
let modalClose = () => this.setState({ modalShow: false });
return (
<div className="Home">
<UserPinCode show={this.state.modalShow} onHide={modalClose} size="sm"/>
{this.state.accountInfo !== null ? <Dashboard accountInfo={this.state.accountInfo}></Dashboard>:''}
</div>
);
this.setState({
accountInfo: get(myAccount, "data.getAccountInfo")
});
} else {
this.setState({
modalShow: true
});
}
} catch (err) {
console.log(err);
}
};
userHistory = async () => {
const transferFrom = `mutation TransferToken($inputToAccount: String!, $inputAmount: String!, $inputUserCredential : String!){
transferToken(toAccount: $inputToAccount, amount: $inputAmount, userCredential : $inputUserCredential ){
trxId,
accountName,
error
}
}`;
const myAccountHistory = `query GetHistoryOfTransferTransaction($accountName: String! ){
getHistoryOfTransferTransaction(accountName: $accountName ){
trxId,
fromAccount,
toAccount,
amount,
memo,
timeTransfer,
isConfirm,
direction
}
}`;
const newRecording = {
accountName: "can",
}
try {
const accountHistory = await Amplify.API.graphql(graphqlOperation(myAccountHistory, newRecording));
console.log(accountHistory);
if (isEmpty(get(accountHistory, "data.getHistoryOfTransferTransaction.error"))) {
this.setState({
accountHistory: get(accountHistory, "data.getHistoryOfTransferTransaction")
});
} else {
this.setState({
modalShow: true
});
}
} catch (err) {
console.log(err);
}
};
async componentDidMount() {
await currentSession()
await this.userInfo()
await this.userHistory()
}
render() {
let modalClose = () => this.setState({ modalShow: false });
return (
<div className="Home">
<UserPinCode show={this.state.modalShow} onHide={modalClose} size="sm" />
{this.state.accountInfo !== null ? <Dashboard accountInfo={this.state.accountInfo} accountHistory={this.state.accountHistory}></Dashboard> : ''}
</div>
);
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment