import React, { Component } from 'react';

import Pagination from 'rc-pagination';

import { getImageUrl } from 'educoder';

import { ThemeContext } from 'educoder'

class MemoList extends Component {

  render() {
    const { match, history, currentPage, memo_count, memo_list, renderMemoList, onPaginationChange } = this.props
    let theme = this.context;

    return (
      <React.Fragment>
        <div id="forum_list" className="forum_table">
          <style>{`
            .forum_table_item .item_name:hover {
              color: ${theme.foreground_select}
            }
          `}</style>
          <div className="mh650 edu-back-white">
            {!memo_list || memo_list.length === 0 ?
              <div className="edu-tab-con-box clearfix edu-txt-center">
                <img className="edu-nodata-img mb20" src={getImageUrl("images/educoder/nodata.png")} />
                <p className="edu-nodata-p mb30">暂时还没有相关数据哦！</p>
              </div>
              : renderMemoList()
            }
          </div>

        </div>
        {!!memo_count && memo_count > 15 &&
          <div style={{ width: '100%', background: '#FAFAFA' }}>
            <Pagination className={'ec-pagination'}
              onChange={(pageNum, pageSize) => onPaginationChange(pageNum, pageSize)}
              showQuickJumper current={currentPage} total={memo_count} pageSize={15} />
          </div>}
      </React.Fragment>

    );
  }
}
MemoList.contextType = ThemeContext;

export default (MemoList);