1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-07-17 00:32:37 +00:00
seahub/frontend/src/components/tree-dir-view/tree-dir-list.js

97 lines
2.3 KiB
JavaScript
Raw Normal View History

2018-09-04 09:16:50 +00:00
import React, { Component } from 'react';
import { serviceUrl } from '../constants';
2018-09-29 07:47:53 +00:00
import OperationGroup from '../dirent-operation/operation-group';
2018-09-04 09:16:50 +00:00
class TreeDirList extends React.Component {
constructor(props) {
super(props);
this.state = {
2018-09-29 07:47:53 +00:00
highlight: false,
isOperationShow: false,
};
2018-09-04 09:16:50 +00:00
}
2018-09-19 01:57:17 +00:00
onMouseEnter = () => {
2018-09-29 07:47:53 +00:00
if (!this.props.isItemFreezed) {
this.setState({
highlight: true,
isOperationShow: true,
});
}
}
onMouseOver = () => {
if (!this.props.isItemFreezed) {
this.setState({
highlight: true,
isOperationShow: true,
});
}
2018-09-19 01:57:17 +00:00
}
onMouseLeave = () => {
2018-09-29 07:47:53 +00:00
if (!this.props.isItemFreezed) {
this.setState({
highlight: false,
isOperationShow: false
});
}
}
onItemMenuShow = () => {
this.props.onItemMenuShow();
}
onItemMenuHide = () => {
2018-09-19 01:57:17 +00:00
this.setState({
2018-09-29 07:47:53 +00:00
isOperationShow: false,
highlight: ''
2018-09-19 01:57:17 +00:00
});
2018-09-29 07:47:53 +00:00
this.props.onItemMenuHide();
2018-09-19 01:57:17 +00:00
}
2018-09-04 09:16:50 +00:00
onMainNodeClick = () => {
this.props.onMainNodeClick(this.props.node);
}
2018-09-29 07:47:53 +00:00
onDownload = () => {
this.props.onDownload(this.props.node);
}
onDelete = () => {
this.props.onDelete(this.props.node);
}
2018-09-04 09:16:50 +00:00
render() {
let node = this.props.node;
return (
2018-09-29 07:47:53 +00:00
<tr className={this.state.highlight ? "tr-highlight" : ''} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave} onMouseOver={this.onMouseOver}>
<td className="icon">
2018-09-12 03:50:41 +00:00
<img src={node.type === "dir" ? serviceUrl + "/media/img/folder-192.png" : serviceUrl + "/media/img/file/192/txt.png"}></img>
2018-09-04 09:16:50 +00:00
</td>
2018-09-29 07:47:53 +00:00
<td className="name a-simulate" onClick={this.onMainNodeClick}>{node.name}</td>
{
this.props.needOperationGroup &&
<td>
{
this.state.isOperationShow &&
<OperationGroup
item={node}
onItemMenuShow={this.onItemMenuShow}
onItemMenuHide={this.onItemMenuHide}
onDownload={this.onDownload}
onDelete={this.onDelete}
/>
}
</td>
}
<td>{node.size}</td>
<td title={node.last_update_time}>{node.last_update_time}</td>
2018-09-04 09:16:50 +00:00
</tr>
)
}
}
export default TreeDirList;