haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-13 13:50:07 +00:00
Code Issues Releases Wiki Activity

style (#3043)

Browse Source
This commit is contained in:
Michael An
2019-03-05 11:49:24 +08:00
committed by Daniel Pan
parent 3323ce1753
commit 6d922f80d4
2 changed files with 43 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
frontend/src/components/dialog/list-related-file-dialog.js
View File

@@ -5,6 +5,7 @@ import Dirent from '../../models/dirent';
import { gettext, siteRoot } from '../../utils/constants'; import { gettext, siteRoot } from '../../utils/constants';
import { Utils } from '../../utils/utils'; import { Utils } from '../../utils/utils';
import { seafileAPI } from '../../utils/seafile-api'; import { seafileAPI } from '../../utils/seafile-api';
import '../../css/list-related-file-dialog.css';
const propTypes = { const propTypes = {
relatedFiles: PropTypes.array.isRequired, relatedFiles: PropTypes.array.isRequired,
@@ -71,40 +72,35 @@ class ListRelatedFileDialog extends React.Component {
render() { render() {
return ( return (
<Modal isOpen={true} toggle={this.toggle} size={this.state.direntList.length > 0 ? 'lg' : 'sm'}> <Modal isOpen={true} toggle={this.toggle} size='lg'>
<ModalHeader toggle={this.toggle}>{gettext('Related Files')}</ModalHeader> <ModalHeader toggle={this.toggle}>{gettext('Related Files')}</ModalHeader>
<ModalBody className={this.state.direntList.length > 0 ? 'list-related-file-body' : ''}> <ModalBody className={this.state.direntList.length > 0 ? 'list-related-file-body' : ''}>
{ <Table hover size="sm" className="list-related-file-table">
this.state.direntList.length > 0 ? <thead>
<Table hover size="sm" className="list-related-file-table"> <tr>
<thead> <th width='50%'>{gettext('Name')}</th>
<tr> <th width='15%'>{gettext('Library Name')}</th>
<th width='50%'>{gettext('Name')}</th> <th width='15%'>{gettext('Size')}</th>
<th width='15%'>{gettext('Library Name')}</th> <th width='15%'>{gettext('Last Update')}</th>
<th width='15%'>{gettext('Size')}</th> <th width='5%'></th>
<th width='15%'>{gettext('Last Update')}</th> </tr>
<th width='5%'></th> </thead>
</tr> <tbody>
</thead> {
<tbody> this.state.direntList.map((relatedFile, index) => {
{ return (
this.state.direntList.map((relatedFile, index) => { <React.Fragment key={index}>
return ( <RelatedFile relatedFile={relatedFile} onDeleteRelatedFile={this.onDeleteRelatedFile}/>
<React.Fragment key={index}> </React.Fragment>
<RelatedFile relatedFile={relatedFile} onDeleteRelatedFile={this.onDeleteRelatedFile}/> );
</React.Fragment> })
); }
}) </tbody>
} </Table>
</tbody> <a href="#" className="add-related-file-link" onClick={this.props.addRelatedFileToggle}>{gettext('Add File')}</a>
</Table>
:
<div className="no-related-file">{gettext('No related file yet.')}</div>
}
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Button color="secondary" onClick={this.toggle}>{gettext('Close')}</Button> <Button color="secondary" onClick={this.toggle}>{gettext('Close')}</Button>
<Button color="primary" onClick={this.props.addRelatedFileToggle}>{gettext('Add File')}</Button>
</ModalFooter> </ModalFooter>
</Modal> </Modal>
); );

18
frontend/src/css/list-related-file-dialog.css Normal file
View File

@@ -0,0 +1,18 @@
.add-related-file-link {
display: block;
color: #666;
padding: 10px;
text-decoration: underline;
}
.add-related-file-link:hover {
color: #444;
}
.list-related-file-table {
margin-bottom: 0;
}
.list-related-file-table td, .list-related-file-table th {
padding: 10px;
}