react-admin-lte/lib/PanelList.js

简单封装的 AdminLTE react 类库，并包含一个编译配置。

import React from 'react';
import Pager from './Pager';


export default class PanelList extends React.Component {

  constructor(props, context) {
    super(props, context);
    this.create   = this.create.bind(this);
    this.onChange = this.onChange.bind(this);
  }

  create() {
    if (this.props.onCreate) {
      this.props.onCreate();
    }
  }

  onChange(pg) {
    if (this.props.onPagerChange) {
      this.props.onPagerChange(pg);
    }
  }

  render() {
    return (
      <div className="box box-primary">
        <div className="box-header with-border">
          {
            this.props.noCreate ? null :
              <button className="btn btn-primary btn-social btn-flat" onClick={this.create}>
                <i className={this.props.createIconClass || "fa fa-plus-square-o"}/>
                { this.props.createLabel || '新建'}
              </button>
          }
          {
            this.props.noSearch ? null :
              <div className="pull-right">
                {this.props.searchPanel}
              </div>
          }
        </div>
        <div className="box-body">
          {this.props.children}

          {this.props.noPager ? null :
            <Pager limit={this.props.limit} skip={this.props.skip} total={this.props.total}
                   onChange={this.onChange}/>
          }
        </div>
      </div>
    )
  }
}