Commit d4587793 authored by hh1966's avatar hh1966
Browse files

Fix copy paste and static view in research plan detail

parent a9fa245d
......@@ -23,11 +23,9 @@ const defaultParsePaste = str => (
class FixedReactDataGrid extends ReactDataGrid {
componentDidMount() {
this._mounted = true;
// store the data grid, assumes only one react datagrid component exists
this.dataGridComponent = document.getElementsByClassName('react-grid-Container')[0]
window.addEventListener('resize', this.metricsUpdated);
if (this.props.cellRangeSelection) {
this.dataGridComponent.addEventListener('mouseup', this.onWindowMouseUp);
this.grid.addEventListener('mouseup', this.onWindowMouseUp);
}
this.metricsUpdated();
}
......@@ -35,7 +33,7 @@ class FixedReactDataGrid extends ReactDataGrid {
componentWillUnmount() {
this._mounted = false;
window.removeEventListener('resize', this.metricsUpdated);
this.dataGridComponent.removeEventListener('mouseup', this.onWindowMouseUp);
this.grid.removeEventListener('mouseup', this.onWindowMouseUp);
}
}
......@@ -58,6 +56,8 @@ export default class ResearchPlanDetailsFieldTable extends Component {
document.addEventListener('copy', this.handleCopy.bind(this))
document.addEventListener('paste', this.handlePaste.bind(this))
this.ref = React.createRef()
this.handleCellSelected = this.handleCellSelected.bind(this)
this.handleCellDeSelected = this.handleCellDeSelected.bind(this)
}
......@@ -195,6 +195,7 @@ export default class ResearchPlanDetailsFieldTable extends Component {
}
handlePaste(event) {
if (this.ref.current.grid.contains(document.activeElement)) {
event.preventDefault();
const { field, onChange } = this.props
......@@ -225,8 +226,10 @@ export default class ResearchPlanDetailsFieldTable extends Component {
onChange(field.value, field.id)
}
}
handleCopy(event) {
if (this.ref.current.grid.contains(document.activeElement)) {
event.preventDefault();
const { columns } = this.props.field.value
......@@ -243,6 +246,7 @@ export default class ResearchPlanDetailsFieldTable extends Component {
event.clipboardData.setData('text/plain', text);
}
}
handleSchemaModalShow() {
ResearchPlansFetcher.fetchTableSchemas().then(json => {
......@@ -296,6 +300,7 @@ export default class ResearchPlanDetailsFieldTable extends Component {
<div>
<div className="research-plan-table-grid">
<FixedReactDataGrid
ref={this.ref}
columns={columns}
rowGetter={this.rowGetter.bind(this)}
rowsCount={rows.length}
......
......@@ -31,12 +31,45 @@ export default class ResearchPlanDetailsStatic extends Component {
break;
case 'image':
let src = '/images/research_plans/' + field.value.public_name
const src = '/images/research_plans/' + field.value.public_name
html = (
<div className="image-container">
<img src={src} alt={field.value.file_name} />
</div>
)
break;
case 'table':
const { columns, rows } = field.value
const column_html = columns.map(column => {
return <th key={column.key}>{column.name}</th>
})
const rows_html = rows.map((row, index) => {
const row_html = columns.map(column => {
return <td key={column.key}>{row[column.key]}</td>
})
return (
<tr key={index}>
{row_html}
</tr>
)
})
html = (
<table className="table table-bordered">
<thead>
<tr>
{column_html}
</tr>
</thead>
<tbody>
{rows_html}
</tbody>
</table>
)
break;
}
return (
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment