haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-16 23:29:49 +00:00
Code Issues Releases Wiki Activity

Improve code for tables (#2730)

Browse Source
This commit is contained in:
杨顺强
2018-12-28 16:34:04 +08:00
committed by Daniel Pan
parent df39fc4162
commit 8c2944d124
11 changed files with 174 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/dialog/list-taggedfiles-dialog.js
View File

@@ -51,7 +51,7 @@ class ListTaggedFilesDialog extends React.Component {
</ModalHeader>
<ModalBody className="dialog-list-container">
<table>
<thead className="table-thread-hidden">
<thead className="table-thead-hidden">
<tr>
<th width='50%' className="ellipsis">{gettext('Name')}</th>
<th width='25%'>{gettext('Size')}</th>

2
frontend/src/components/dialog/share-dialog.js
View File

@@ -109,7 +109,7 @@ class ShareDialog extends React.Component {
<div>
<Modal isOpen={true} style={{maxWidth: '720px'}} className="share-dialog">
<ModalHeader toggle={this.props.toggleDialog}>{gettext('Share')} <span className="sf-font" title={itemName}>{itemName}</span></ModalHeader>
<ModalBody className="share-dialog-content">
<ModalBody className="dialog-list-container share-dialog-content">
{(itemType === 'library' || itemType === 'dir') && this.renderDirContent()}
{itemType === 'file' && this.renderFileContent()}
</ModalBody>

117
frontend/src/components/dialog/share-to-group.js
View File

@@ -1,4 +1,4 @@
import React from 'react';
import React, { Fragment } from 'react';
import PropTypes from 'prop-types';
import { Button } from 'reactstrap';
import Select from 'react-select';
@@ -246,56 +246,71 @@ class ShareToGroup extends React.Component {
render() {
return (
<table>
<thead>
<tr>
<th style={{'width': '40%'}}>{gettext('Group')}</th>
<th style={{'width': '40%'}}>{gettext('Permission')}</th>
<th></th>
</tr>
<tr>
<td>
<Select
isMulti
onChange={this.handleSelectChange}
options={this.options}
placeholder={gettext('Select a group')}
components={makeAnimated()}
inputId={'react-select-2-input'}
value={this.state.selectedOption}
/>
</td>
<td>
<PermissionEditor
isTextMode={false}
isEditIconShow={false}
currentPermission={this.state.permission}
permissions={this.permissions}
onPermissionChangedHandler={this.setPermission}
/>
</td>
<td>
<Button onClick={this.shareToGroup}>{gettext('Submit')}</Button>
</td>
</tr>
{this.state.errorMsg.length > 0 &&
this.state.errorMsg.map((item, index) => {
let errMessage = item.group_name + ': ' + item.error_msg;
return (
<tr key={index}>
<td colSpan={3}><p className="error">{errMessage}</p></td>
</tr>
);
})
}
</thead>
<GroupList
items={this.state.sharedItems}
permissions={this.permissions}
deleteShareItem={this.deleteShareItem}
onChangeUserPermission={this.onChangeUserPermission}
/>
</table>
<Fragment>
<table>
<thead>
<tr>
<th width="40%">{gettext('Group')}</th>
<th width="40%">{gettext('Permission')}</th>
<th width="20%"></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<Select
isMulti
onChange={this.handleSelectChange}
options={this.options}
placeholder={gettext('Select a group')}
components={makeAnimated()}
inputId={'react-select-2-input'}
value={this.state.selectedOption}
/>
</td>
<td>
<PermissionEditor
isTextMode={false}
isEditIconShow={false}
currentPermission={this.state.permission}
permissions={this.permissions}
onPermissionChangedHandler={this.setPermission}
/>
</td>
<td>
<Button onClick={this.shareToGroup}>{gettext('Submit')}</Button>
</td>
</tr>
{this.state.errorMsg.length > 0 &&
this.state.errorMsg.map((item, index) => {
let errMessage = item.group_name + ': ' + item.error_msg;
return (
<tr key={index}>
<td colSpan={3}><p className="error">{errMessage}</p></td>
</tr>
);
})
}
</tbody>
</table>
<div className="share-list-container">
<table className="table-thead-hidden">
<thead>
<tr>
<th width="40%">{gettext('Group')}</th>
<th width="40%">{gettext('Permission')}</th>
<th width="20%"></th>
</tr>
</thead>
<GroupList
items={this.state.sharedItems}
permissions={this.permissions}
deleteShareItem={this.deleteShareItem}
onChangeUserPermission={this.onChangeUserPermission}
/>
</table>
</div>
</Fragment>
);
}
}

131
frontend/src/components/dialog/share-to-user.js
View File

@@ -263,64 +263,79 @@ class ShareToUser extends React.Component {
render() {
let { sharedItems } = this.state;
return (
<table>
<thead>
<tr>
<th style={{'width': '40%'}}>{gettext('User')}</th>
<th style={{'width': '40%'}}>{gettext('Permission')}</th>
<th></th>
</tr>
<tr>
<td>
<AsyncSelect
inputId={'react-select-1-input'}
className='reviewer-select'
placeholder={gettext('Select users...')}
loadOptions={this.loadOptions}
onChange={this.handleSelectChange}
value={this.state.selectedOption}
isMulti
isFocused
isClearable
classNamePrefix
/>
</td>
<td>
<PermissionEditor
isTextMode={false}
isEditIconShow={false}
currentPermission={this.state.permission}
permissions={this.permissions}
onPermissionChangedHandler={this.setPermission}
/>
</td>
<td>
<Button onClick={this.shareToUser}>{gettext('Submit')}</Button>
</td>
</tr>
{this.state.errorMsg.length > 0 &&
this.state.errorMsg.map((item, index) => {
let errMessage = '';
if (item.email) {
errMessage = item.email + ': ' + item.error_msg;
} else {
errMessage = item;
}
return (
<tr key={index}>
<td colSpan={3}><p className="error">{errMessage}</p></td>
</tr>
);
})
}
</thead>
<UserList
items={sharedItems}
permissions={this.permissions}
deleteShareItem={this.deleteShareItem}
onChangeUserPermission={this.onChangeUserPermission}
/>
</table>
<Fragment>
<table>
<thead>
<tr>
<th width="40%">{gettext('User')}</th>
<th width="40%">{gettext('Permission')}</th>
<th width="20%"></th>
</tr>
</thead>
<tbody>
<tr>
<td>
<AsyncSelect
inputId={'react-select-1-input'}
className='reviewer-select'
placeholder={gettext('Select users...')}
loadOptions={this.loadOptions}
onChange={this.handleSelectChange}
value={this.state.selectedOption}
isMulti
isFocused
isClearable
classNamePrefix
/>
</td>
<td>
<PermissionEditor
isTextMode={false}
isEditIconShow={false}
currentPermission={this.state.permission}
permissions={this.permissions}
onPermissionChangedHandler={this.setPermission}
/>
</td>
<td>
<Button onClick={this.shareToUser}>{gettext('Submit')}</Button>
</td>
</tr>
{this.state.errorMsg.length > 0 &&
this.state.errorMsg.map((item, index) => {
let errMessage = '';
if (item.email) {
errMessage = item.email + ': ' + item.error_msg;
} else {
errMessage = item;
}
return (
<tr key={index}>
<td colSpan={3}><p className="error">{errMessage}</p></td>
</tr>
);
})
}
</tbody>
</table>
<div className="share-list-container">
<table className="table-thead-hidden">
<thead>
<tr>
<th width="40%">{gettext('User')}</th>
<th width="40%">{gettext('Permission')}</th>
<th width="20%"></th>
</tr>
</thead>
<UserList
items={sharedItems}
permissions={this.permissions}
deleteShareItem={this.deleteShareItem}
onChangeUserPermission={this.onChangeUserPermission}
/>
</table>
</div>
</Fragment>
);
}
}