1
0
Fork 0
mirror of https://git.rwth-aachen.de/acs/public/villas/web/ synced 2025-03-09 00:00:01 +01:00

Fix for edit files: table now has a fixed layout/ doesn't protrude out from dialog and close/cancel button closes dialog #219

This commit is contained in:
Laura Fuentes Grau 2020-06-21 16:43:21 +02:00
parent 622a5d3f22
commit d8fdf33dbc
3 changed files with 34 additions and 10 deletions

View file

@ -273,7 +273,7 @@ class Dashboard extends Component {
}
closeEditFiles(){
this.setState({ filesEditModal: false });
// TODO do we need this if the dispatches happen in the dialog?
}

View file

@ -38,7 +38,7 @@ class EditFilesDialog extends React.Component {
onClose(canceled) {
if (canceled === false) {
if (this.validChanges()) {
if (true) {
this.props.onClose();
}
} else {
@ -64,6 +64,7 @@ class EditFilesDialog extends React.Component {
scenarioID: this.props.scenarioID,
});
this.setState({ uploadFile: null });
// TODO make sure that dialog remains open after clicking "Upload" button
};
@ -118,21 +119,23 @@ class EditFilesDialog extends React.Component {
};
return (
<Dialog show={this.props.show} title="Edit Files of scenario" buttonTitle="Close" valid={true}>
<Dialog show={this.props.show} title="Edit Files of scenario" buttonTitle="Close" onClose={(c) => this.onClose(c)} valid={true}>
<div>
<Table data={this.props.files}>
<TableColumn title='ID' dataKey='id' />
<TableColumn title='Name' dataKey='name' />
<TableColumn title='Size (bytes)' dataKey='size' />
<TableColumn title='Type' dataKey='type' />
<div className="edit-table">
<Table data={this.props.files} width = {467}>
<TableColumn title='ID' dataKey='id' width={42} />
<TableColumn title='Name' dataKey='name' width={107}/>
<TableColumn title='Size (bytes)' dataKey='size' width={83.3}/>
<TableColumn title='Type' dataKey='type' width={159.7}/>
<TableColumn
title='Delete'
width='50'
width='75'
deleteButton
onDelete={(index) => this.deleteFile(index)}
/>
</Table>
</div>
<FormGroup as={Col} >
<FormControl

View file

@ -272,6 +272,27 @@ body {
supported by Chrome and Opera */
}
.edit-table table {
background-color: #fff;
table-layout: fixed;
word-wrap: break-word;
width: 467px;
}
.edit-table th {
position: sticky;
top: 0;
text-align: left;
}
.edit-table td{
text-align: left;
}
.edit-table td {
padding: 2px 8px !important;
}
/**
* Toolbox
*/