import { Row } from 'antd';
import React from 'react';
import {  networkUtils } from '../../../utils';
import styles from './ContractVar.less';

class ContractVar extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      dataSource: [],
    };
  }
  public componentDidMount = () => {
    this.fetchData();
  }
  public fetchData = () => {
    networkUtils.request({ method: 'get', url: '/api/contract-mgmt/contract-tmpls/var' }).then((data) => {
      if (data.success) {
        this.setState({
          dataSource: data.data,
        });
      } else {
        throw data;
      }
    });
  }
  public render() {
    const { dataSource, fetching, value } = this.state;
    const { handleInsert } = this.props;
    // console.log("ContractVar==>", dataSource);
    return (
      <ul style={{ margin: 0, padding: 5, overflow: 'hidden', width: 200 }}>
        {dataSource.map((item) =>
          <li key={item.id} className={styles.myli} onClick={handleInsert.bind(this, item.contractVarName)}>
            <Row>
              {item.contractVarName}
            </Row>
          </li>)}
      </ul>
    );
  }
}
export default ContractVar;
