import React from 'react';
import './index.less';
import { Link } from 'react-router-dom';
import Page from '@src/containers/Page';
import Tabs from '../../../components/Tabs';
import Module from '../../../components/Module';
import Input from '../../../components/Input';
import Button from '../../../components/Button';

export default class extends Page {
  renderView() {
    return (
      <div>
        <div className="content">
          <Module className="m-t-2">
            <Tabs
              type="card"
              active="main"
              tabs={[
                { key: 'main', name: '首页', path: '/' },
                { key: 'ready', name: 'GetReady', path: '/' },
                { key: 'exercise', name: '练习', path: '/' },
                { key: 'cat', name: 'CAT模考', path: '/' },
                { key: 'item', name: '题库', path: '/' },
                { key: 'machine', name: '换库&机经', path: '/' },
              ]}
            />
          </Module>
          <Module className="code-module">
            <div className="title">输入《千行GMAT长难句》专属 Code，解锁在线练习功能。</div>
            <div className="input-block">
              <Input size="lager" placeholder="请输入CODE" />
              <Button size="lager">解锁</Button>
            </div>
            <div className="tip">
              <Link to="/" className="left link">
                什么是CODE？
              </Link>
              <span>没有 CODE？</span>
              <Link to="/" className="link">
                去获取 >>
              </Link>
              <Link to="/" className="right link">
                试用 >>
              </Link>
            </div>
          </Module>
        </div>
      </div>
    );
  }
}