simplify table data
This commit is contained in:
parent
dfc2df4db3
commit
a3883ca0da
47
src/App.js
47
src/App.js
|
@ -25,42 +25,22 @@ class App extends React.PureComponent {
|
||||||
max_index: all_data_ordered.length,
|
max_index: all_data_ordered.length,
|
||||||
logs: [],
|
logs: [],
|
||||||
current: session_object,
|
current: session_object,
|
||||||
columns: [
|
shouldShowModal: false,
|
||||||
{ name: 'session', title: 'Session' },
|
modalTitle: "",
|
||||||
{ name: 'parent_id', title: 'Parent' },
|
modalContent: {},
|
||||||
{ name: 'id', title: 'Id' },
|
rows: data,
|
||||||
|
cols: [
|
||||||
|
{ name: 'session', title: 'Session', hidden: true },
|
||||||
|
{ name: 'parent_id', title: 'Parent', hidden: true },
|
||||||
|
{ name: 'id', title: 'Id', hidden: true },
|
||||||
{ name: 'step', title: 'Step' },
|
{ name: 'step', title: 'Step' },
|
||||||
{ name: 'name', title: 'Name' },
|
{ name: 'name', title: 'Name', width: 600 },
|
||||||
{ name: 'type', title: 'Type' },
|
{ name: 'type', title: 'Type' },
|
||||||
{ name: 'timestamp', title: 'Timestamp' },
|
{ name: 'timestamp', title: 'Timestamp' },
|
||||||
// { name: 'error', title: 'Error' },
|
// { name: 'error', title: 'Error' },
|
||||||
// { name: 'inputs', title: 'Inputs' },
|
// { name: 'inputs', title: 'Inputs' },
|
||||||
{ name: 'msg', title: 'Error' },
|
{ name: 'msg', title: 'Error', hidden: true },
|
||||||
],
|
]
|
||||||
// rows: [session_object],
|
|
||||||
rows: data,
|
|
||||||
// defaultExpandedRowIds: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27]
|
|
||||||
defaultExpandedRowIds: [],
|
|
||||||
defaultHiddenColumnNames: ['session', 'parent_id', 'id', 'error'],
|
|
||||||
// defaultHiddenColumnNames: []
|
|
||||||
defaultColumnWidths: [
|
|
||||||
// { columnName: 'step', width: 10 },
|
|
||||||
|
|
||||||
{ columnName: 'session', width: 200 },
|
|
||||||
{ columnName: 'parent_id', width: 200 },
|
|
||||||
{ columnName: 'id', width: 200 },
|
|
||||||
{ columnName: 'step', width: 150 },
|
|
||||||
{ columnName: 'name', width: 600 },
|
|
||||||
{ columnName: 'type', width: 200 },
|
|
||||||
{ columnName: 'timestamp', width: 200 },
|
|
||||||
// { name: 'error', width: 200 },
|
|
||||||
// { name: 'inputs', width: 200 },
|
|
||||||
{ columnName: 'msg', width: 200 },
|
|
||||||
],
|
|
||||||
defaultOrder: ['session', 'parent_id', 'id', 'step', 'name', 'type', 'timestamp', 'msg'],
|
|
||||||
shouldShowModal: false,
|
|
||||||
modalTitle: "",
|
|
||||||
modalContent: {}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
this.previousLog = () => {
|
this.previousLog = () => {
|
||||||
|
@ -221,13 +201,10 @@ class App extends React.PureComponent {
|
||||||
<ConsoleSection logs={this.state.logs} open={true} />
|
<ConsoleSection logs={this.state.logs} open={true} />
|
||||||
<LogsSection
|
<LogsSection
|
||||||
open={true}
|
open={true}
|
||||||
|
cols={this.state.cols}
|
||||||
rows={this.state.rows}
|
rows={this.state.rows}
|
||||||
columns={this.state.columns}
|
|
||||||
viewRow={this.viewRow}
|
viewRow={this.viewRow}
|
||||||
getChildRows={this.getChildRows}
|
getChildRows={this.getChildRows}
|
||||||
defaultColumnWidths={this.state.defaultColumnWidths}
|
|
||||||
defaultHiddenColumnNames={this.state.defaultHiddenColumnNames}
|
|
||||||
defaultOrder={this.state.defaultOrder}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -16,7 +16,12 @@ let numberFilterOperations = [
|
||||||
|
|
||||||
let tableColumnExtensions = [{ columnName: 'name', width: 300, align: 'left' }];
|
let tableColumnExtensions = [{ columnName: 'name', width: 300, align: 'left' }];
|
||||||
|
|
||||||
function LogsSection({open, rows, columns, viewRow, getChildRows, defaultColumnWidths, defaultHiddenColumnNames, defaultOrder}) {
|
function LogsSection({open, cols, rows, viewRow, getChildRows}) {
|
||||||
|
let columns = cols;
|
||||||
|
let defaultColumnWidths = cols.map((x) => { return {columnName: x.name, width: (x.width || 200)} })
|
||||||
|
let defaultHiddenColumnNames = cols.filter((x) => x.hidden).map((x) => x.name)
|
||||||
|
let defaultOrder = cols.map((x) => x.name)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Section title="Logs" defaultOpen={open}>
|
<Section title="Logs" defaultOpen={open}>
|
||||||
<Grid rows={rows} columns={columns} >
|
<Grid rows={rows} columns={columns} >
|
||||||
|
|
Loading…
Reference in New Issue