cefc-view-transactiondetails/demo/component.js

CEFC-UI Component

import React from 'react';
import WS from 'cefc-websocket';
import TransactionDetails from '../src';
import './index.less';
import tickData from '../mock/tickData';

class App extends React.Component {
  constructor(...args) {
    super(...args);
    this.state = {
      ws: new WS('wss://uat4.shhxzq.com:8081', []),
      preClosePrice: 38,
      precision: 2,
      handCount: 100,
      fullId: '000127000002',
      socketData: {},
      tickData: tickData.dot,
      serverTime: { date: '20180201', hours: 13, minutes: 44}
    };

    this.state.ws.onmessage = this.handleMessage;
  }

  componentDidMount() {
    this.state.ws.send('subscribe|json|1');
  }

  handleMessage = (event) => {
    this.setState({ socketData: JSON.parse(event.data).quote[0]});
  }

  render() {
    const { socketData, precision, handCount, tickData, serverTime } = this.state;

    return (
        <div>
          <h2 className="title">TransactionDetails Demo</h2>
          <div className="wrapper">
            <div className="left">
              左部区域
            </div>
            <div className="right">
              <TransactionDetails
                  tickData={tickData}
                  serverTime={serverTime}
                  socketData={socketData}
                  precision={precision}
                  handCount={handCount}
              />
            </div>
          </div>
        </div>
    );
  }
}

export default App;