2017-02-17 00:46:39 +00:00
|
|
|
import React, { PureComponent } from 'react';
|
2015-12-28 23:34:32 +00:00
|
|
|
|
2017-02-17 00:46:39 +00:00
|
|
|
export default class TabListItem extends PureComponent {
|
2016-01-05 18:29:22 +00:00
|
|
|
handleClick = () => {
|
|
|
|
const { server, target, onClick } = this.props;
|
|
|
|
onClick(server, target);
|
2016-01-06 23:28:11 +00:00
|
|
|
};
|
2016-01-05 18:29:22 +00:00
|
|
|
|
2015-12-28 23:34:32 +00:00
|
|
|
render() {
|
2017-05-22 01:49:37 +00:00
|
|
|
const { target, content, selected, connected } = this.props;
|
2015-12-28 23:34:32 +00:00
|
|
|
const classes = [];
|
2017-05-22 01:49:37 +00:00
|
|
|
const style = {};
|
2015-12-28 23:34:32 +00:00
|
|
|
|
2016-01-05 18:29:22 +00:00
|
|
|
if (!target) {
|
2015-12-28 23:34:32 +00:00
|
|
|
classes.push('tab-server');
|
|
|
|
|
2017-05-22 01:49:37 +00:00
|
|
|
if (connected) {
|
|
|
|
style.color = '#6BB758';
|
2016-01-13 17:53:54 +00:00
|
|
|
} else {
|
2017-05-22 01:49:37 +00:00
|
|
|
style.color = '#F6546A';
|
2016-01-13 17:53:54 +00:00
|
|
|
}
|
2017-05-22 01:49:37 +00:00
|
|
|
}
|
2016-01-13 17:53:54 +00:00
|
|
|
|
2017-05-22 01:49:37 +00:00
|
|
|
if (selected) {
|
|
|
|
classes.push('selected');
|
2016-01-13 17:53:54 +00:00
|
|
|
}
|
|
|
|
|
2015-12-28 23:34:32 +00:00
|
|
|
return (
|
2017-05-22 01:49:37 +00:00
|
|
|
<p className={classes.join(' ')} style={style} onClick={this.handleClick}>
|
2016-01-13 17:53:54 +00:00
|
|
|
<span className="tab-content">{content}</span>
|
|
|
|
</p>
|
2015-12-28 23:34:32 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|