56 lines
1.5 KiB
JavaScript
56 lines
1.5 KiB
JavaScript
import { Meteor } from 'meteor/meteor';
|
|
import React, { useState } from 'react';
|
|
import { useTracker } from 'meteor/react-meteor-data';
|
|
import _ from 'lodash';
|
|
|
|
export default class GridTable2 extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
rows: [{_id: 1234, name: "Fred"}, {_id: 1235, }],
|
|
columns: [{id: "first", value: row => {return row._id}}, {id: "second", value: row => {return row.name}}]
|
|
}
|
|
}
|
|
render() {
|
|
console.log("Rendering GridTable2")
|
|
return <table><tbody>
|
|
<tr><td>Test</td><td>Test2</td></tr>
|
|
{/*<tr>*/}
|
|
{/*<GridTableCell row={this.state.row} column={this.state.column}></GridTableCell>*/}
|
|
{/*</tr>*/}
|
|
{/*{this.state.rows.map((row) => <GridTableRow key={row._id} row={row} columns={this.state.columns}></GridTableRow>)}*/}
|
|
</tbody></table>
|
|
}
|
|
}
|
|
|
|
class GridTableRow extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
columns: props.columns,
|
|
row: props.row,
|
|
}
|
|
}
|
|
render() {
|
|
console.log("Rendering GridTableRow")
|
|
return <tr>
|
|
{this.state.columns.map((column)=><GridTableCell key={this.state.row._id + "-" + column.id} row={this.state.row} column={column}/>)}
|
|
</tr>
|
|
}
|
|
}
|
|
|
|
class GridTableCell extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
console.log(props);
|
|
this.state = {
|
|
row: props.row,
|
|
column: props.column,
|
|
value: props.column.value(props.row)
|
|
}
|
|
}
|
|
render() {
|
|
console.log("Rendering GridTableCell")
|
|
return <td>{this.state.value}</td>
|
|
}
|
|
} |