diff --git a/js/component/common.js b/js/component/common.js
index ca83c3dd6..24915c71f 100644
--- a/js/component/common.js
+++ b/js/component/common.js
@@ -11,19 +11,73 @@ var Icon = React.createClass({
}
});
-var Link = React.createClass({
+var toolTipStyle = {
+ position: 'absolute',
+ top: '100%',
+ left: '-120px',
+ width: '260px',
+ padding: '15px',
+ border: '1px solid #aaa',
+ fontSize: '14px',
+};
+var ToolTip = React.createClass({
+ propTypes: {
+ open: React.PropTypes.bool.isRequired,
+ onMouseOut: React.PropTypes.func
+ },
+ render: function() {
+ return (
+
+ {this.props.children}
+
+ );
+ }
+});
+
+var linkContainerStyle = {
+ position: 'relative',
+};
+var Link = React.createClass({
+ getInitialState: function() {
+ return {
+ showTooltip: false,
+ };
+ },
+ handleClick: function() {
+ if (this.props.tooltip) {
+ this.setState({
+ showTooltip: !this.state.showTooltip,
+ });
+ }
+ if (this.props.onClick) {
+ this.props.onClick();
+ }
+ },
+ handleTooltipMouseOut: function() {
+ this.setState({
+ showTooltip: false,
+ });
+ },
render: function() {
- console.log(this.props);
var href = this.props.href ? this.props.href : 'javascript:;',
icon = this.props.icon ? : '',
className = (this.props.button ? 'button-block button-' + this.props.button : 'button-text') +
(this.props.hidden ? ' hidden' : '') + (this.props.disabled ? ' disabled' : '');
+
+
return (
-
- {this.props.icon ? icon : '' }
- {this.props.label}
-
+
+
+ {this.props.icon ? icon : '' }
+ {this.props.label}
+
+ {(!this.props.tooltip ? null :
+
+ {this.props.tooltip}
+
+ )}
+
);
}
});