import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import DocumentTitle from 'react-document-title';
import { Layout, Menu, Icon ,Row, Col,Input,Button} from 'antd';
import Cell from './cell';
import './index.less';
//管理系统列表
const SYS_LIST = [
  {
    icon:"rocket",
    name:"快速上手",
    intro:"致力于极简易网站开发体验",
    link:'./startTemplate.html'
  },
  {
    icon:"layout",
    name:"布局示例",
    intro:"后台管理网站布局方案",
    link:'./layoutdemo.html'
  },
  {
    icon:"credit-card",
    name:"表格示例",
    intro:"表格使用说明及演示",
    link:'./tableDemo.html'
  },
  {
    icon:"key",
    name:"管理系统4",
    intro:"系统简要描述",
    link:'./startTemplate.html'
  },
  {
    icon:"safety",
    name:"管理系统5",
    intro:"系统简要描述",
    link:'./startTemplate.html'
  },
  {
    icon:"pie-chart",
    name:"管理系统6",
    intro:"系统简要描述",
    link:'./startTemplate.html'
  }
];

class App extends Component {
  constructor() {
    super();
  }
  componentWillMount(){
  }
  render() {
    let cellNode = [];
    SYS_LIST.map((item,index) => {
      cellNode.push(
        <Col span={6} key={index}>
          <Cell icon={item['icon']} name={item['name']} intro={item['intro']} link={item['link']}/>
        </Col>
      )
    })
    return (
      <DocumentTitle title="page">
        <div className="cell-container">
          <Row type="flex" justify="space-around">
            {cellNode}
          </Row>
        </div>
      </DocumentTitle>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('app'));