import React from 'react';
import { Link } from 'react-router-dom';
import './index.less';
import Page from '@src/containers/Page';
import Block from '@src/components/Block';
// import ActionLayout from '@src/layouts/ActionLayout';
import TableLayout from '@src/layouts/TableLayout';
import { getMap } from '@src/services/Tools';
import { System } from '../../../stores/system';
import { ContractKey } from '../../../../Constant';

const ContractKeyMap = getMap(ContractKey, 'value', 'label');

export default class extends Page {
  constructor(props) {
    super(props);

    this.columns = [{
      title: '协议名称',
      dataIndex: 'title',
    }, {
      title: '应用场景',
      dataIndex: 'key',
      render: (text) => {
        return ContractKeyMap[text] || '';
      },
    }, {
      title: '操作',
      dataIndex: 'handler',
      render: (text, record) => {
        return <div className="table-button">
          {<Link to={`/setting/contract/detail/${record.key}`}>修改</Link>}
        </div>;
      },
    }];
  }

  initData() {
    System.allContract().then(result => {
      this.setState({ list: result });
    });
  }

  renderView() {
    return <Block flex>
      <TableLayout
        columns={this.tableSort(this.columns)}
        list={this.state.list}
        pagination={false}
        loading={this.props.core.loading}
      />
    </Block>;
  }
}