sourcecode/front/project/h5/routes/page/machine/page.js

import React from 'react';
import './index.less';
import { Tabs } from 'antd-mobile';
import Page from '@src/containers/Page';
import Button from '../../../components/Button';

export default class extends Page {
  renderView() {
    const { list = [] } = this.state;
    return (
      <div>
        <div className="tip">最近换库时间：2019-07-30，已换库n天。</div>
        <Tabs tabs={[{ title: '数学', key: 's' }, { title: '阅读RC', key: '1' }, { title: '逻辑CR', key: 'l' }]} />
        <div>{list.length > 0 ? this.renderList() : this.renderEmpty()}</div>
        <div className="fixed">
          <Button block disabled={list.length === 0} size="lager">
            查阅机经
          </Button>
        </div>
      </div>
    );
  }

  renderList() {
    return (
      <div className="list">
        <div className="log-title">更新日志</div>
        <div className="item">
          <div className="title">
            版本7<span className="date">2019-07-21 09:50:26</span>
          </div>
          <div className="desc">
            新增 7 道数学机经；
            <br /> 补充第 23 题条件；
            <br /> 更新第 54题解析和答案
          </div>
        </div>
      </div>
    );
  }

  renderEmpty() {
    return (
      <div className="empty">
        <div className="text">
          还未购买本月机经。 <br />
          您可至千行网站「我的-工具」查看往期机经。
        </div>
        <Button block width={120} radius>
          去购买
        </Button>
      </div>
    );
  }
}