1
0
mirror of https://github.com/ascribe/onion.git synced 2024-11-15 01:25:17 +01:00

Add dynamically injectable TableItems to Table Component

This commit is contained in:
Tim Daubenschütz 2015-05-22 14:15:12 +02:00
parent 486f058cb8
commit 47dd322cff
2 changed files with 8 additions and 4 deletions

View File

@ -1,17 +1,19 @@
import React from 'react'; import React from 'react';
import TableItem from './table_item';
import TableHeader from './table_header'; import TableHeader from './table_header';
import TableColumnModel from '../../models/table_column_model'; import TableColumnModel from '../../models/table_column_model';
let Table = React.createClass({ let Table = React.createClass({
propTypes: { propTypes: {
columnList: React.PropTypes.arrayOf(React.PropTypes.instanceOf(TableColumnModel)), columnList: React.PropTypes.arrayOf(React.PropTypes.instanceOf(TableColumnModel)),
changeOrder: React.PropTypes.func.isRequired changeOrder: React.PropTypes.func.isRequired,
tableItem: React.PropTypes.any.isRequired // Optimally, this should check if tableItem is an instance of React.Component or something like that
}, },
render() { render() {
let TableItem = this.props.tableItem;
if(this.props.itemList && this.props.itemList.length > 0) { if(this.props.itemList && this.props.itemList.length > 0) {
return ( return (

View File

@ -5,6 +5,7 @@ import PieceListStore from '../stores/piece_list_store';
import PieceListActions from '../actions/piece_list_actions'; import PieceListActions from '../actions/piece_list_actions';
import Table from './ascribe_table/table'; import Table from './ascribe_table/table';
import TableItem from './ascribe_table/table_item';
import TableItemImg from './ascribe_table/table_item_img'; import TableItemImg from './ascribe_table/table_item_img';
import TableItemText from './ascribe_table/table_item_text'; import TableItemText from './ascribe_table/table_item_text';
@ -56,7 +57,8 @@ let PieceList = React.createClass({
'pageSize': props.pageSize 'pageSize': props.pageSize
} }
}}> }}>
<Table columnList={columnList} changeOrder={this.tableChangeOrder} /> <Table columnList={columnList} changeOrder={this.tableChangeOrder} tableItem={TableItem}>
</Table>
<Pagination currentPage={this.props.query.page} goToPage={this.paginationGoToPage} /> <Pagination currentPage={this.props.query.page} goToPage={this.paginationGoToPage} />
</AltContainer> </AltContainer>
); );