1import React, { Component } from 'react';
  2
  3import mem from '../../mem/mem';
  4
  5// import {card, tx} from '../../kit/lib'
  6import { Card, Button, Timeline, Row, Col, List, Icon,
  7          Form, Input, InputNumber, Checkbox, message,
  8        Progress } from 'antd';
  9import 'antd/dist/antd.css';
 10const FormItem = Form.Item;
 11
 12
 13
 14class newtx extends Component {
 15  constructor(props) {
 16    super(props);
 17    this.state = {
 18      receiver: '',
 19      value: 0,
 20      percent: 0
 21    };
 22    this.handleReceiverInputChange = this.handleReceiverInputChange.bind(this);
 23    this.handleValueInputChange = this.handleValueInputChange.bind(this);
 24    this.sendTx = this.sendTx.bind(this);
 25    console.log("addr", mem.account.address);
 26  }
 27  handleReceiverInputChange(event) {
 28    this.setState({receiver: event.target.value})
 29  }
 30  handleValueInputChange(value) {
 31    this.setState({value: value})
 32  }
 33  sendTx(event) {
 34    var receiver = this.state.receiver
 35    console.log("receiver: ", receiver)
 36    var value = this.state.value
 37    console.log("value: ", value)
 38    console.log(mem.accountsContractAddr)
 39    console.log(mem.accountsContract)
 40    console.log("options", mem.accountsContract.options)
 41    mem.accountsContract.options.from = mem.account.address
 42    mem.accountsContract.options.gas = 4000000
 43    console.log("options", mem.accountsContract.options)
 44
 45    this.setState({ percent: this.state.percent + 20})
 46
 47    mem.accountsContract.methods.updateBalance(receiver, value)
 48      .send(
 49      function(error, result) {
 50        if(!error) {
 51          console.log("result: ", result)
 52            this.setState({ percent: 100 })
 53
 54        } else {
 55          console.log("error: ", error)
 56          message.error("Error on sending credits");
 57            this.setState({ percent: 0 })
 58        }
 59      }
 60    );
 61  }
 62  updateProgress(val) {
 63    this.setState({ percent: val })
 64  }
 65  render() {
 66    const { receiver, value } = this.state;
 67    return (
 68      <div>
 69        <Row gutter={16}>
 70          <Col span={14}>
 71            <Card title="New transaction">
 72              <Input
 73                placeholder="address"
 74                prefix={<Icon type="qrcode" style={{ color: 'rgba(0,0,0,.25)' }} />}
 75                style={{ width: 400 }}
 76                onChange={this.handleReceiverInputChange}
 77              />
 78              <br/><br/>
 79              <InputNumber
 80                min={0}
 81                defaultValue={0}
 82                style={{marginRight: 10}}
 83                onChange={this.handleValueInputChange} />
 84
 85              <Button
 86                type="primary"
 87                icon="check"
 88                onClick={this.sendTx}
 89                >
 90                Send
 91              </Button>
 92              <br/><br/>
 93              <Progress percent={this.state.percent} />
 94            </Card>
 95          </Col>
 96        </Row>
 97
 98      </div>
 99    );
100  }
101}
102
103export default newtx;