Commit 344681e8 authored by michael's avatar michael Committed by 陈帅

Ellipsis组件tooltip属性支持TooltipProps, 修复Exception的linkElement的类型错误 (#2713)

* feat:(https://github.com/ant-design/ant-design-pro/issues/2649)

* fix:(https://github.com/ant-design/ant-design-pro/issues/2674)
parent b042b097
import * as React from 'react'; import * as React from 'react';
import { TooltipProps } from 'antd/lib/tooltip';
export interface IEllipsisTooltipProps extends TooltipProps {
title?: undefined;
overlayStyle?: undefined;
}
export interface IEllipsisProps { export interface IEllipsisProps {
tooltip?: boolean; tooltip?: boolean | IEllipsisTooltipProps;
length?: number; length?: number;
lines?: number; lines?: number;
style?: React.CSSProperties; style?: React.CSSProperties;
......
...@@ -38,6 +38,18 @@ export const cutStrByFullLength = (str = '', maxLength) => { ...@@ -38,6 +38,18 @@ export const cutStrByFullLength = (str = '', maxLength) => {
}, ''); }, '');
}; };
const getTooltip = ({ tooltip, overlayStyle, title, children }) => {
if(tooltip) {
const props = tooltip === true ? { overlayStyle, title } : { ...tooltip, overlayStyle, title };
return (
<Tooltip {...props}>
{children}
</Tooltip>
)
}
return children;
}
const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) => { const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) => {
if (typeof text !== 'string') { if (typeof text !== 'string') {
throw new Error('Ellipsis children must be string.'); throw new Error('Ellipsis children must be string.');
...@@ -54,23 +66,19 @@ const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) ...@@ -54,23 +66,19 @@ const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other })
displayText = fullWidthRecognition ? cutStrByFullLength(text, length) : text.slice(0, length); displayText = fullWidthRecognition ? cutStrByFullLength(text, length) : text.slice(0, length);
} }
if (tooltip) { const spanAttrs = tooltip ? {} : { ...other };
return ( return getTooltip(
<Tooltip overlayStyle={TooltipOverlayStyle} title={text}> {
<span> tooltip,
overlayStyle:TooltipOverlayStyle,
title: text,
children: (
<span {...spanAttrs}>
{displayText} {displayText}
{tail} {tail}
</span> </span>
</Tooltip> )
); });
}
return (
<span {...other}>
{displayText}
{tail}
</span>
);
}; };
export default class Ellipsis extends Component { export default class Ellipsis extends Component {
...@@ -230,13 +238,7 @@ export default class Ellipsis extends Component { ...@@ -230,13 +238,7 @@ export default class Ellipsis extends Component {
</div> </div>
); );
return tooltip ? ( return getTooltip({ tooltip, overlayStyle:TooltipOverlayStyle, title: children, children: node });
<Tooltip overlayStyle={TooltipOverlayStyle} title={children}>
{node}
</Tooltip>
) : (
node
);
} }
const childNode = ( const childNode = (
...@@ -246,16 +248,13 @@ export default class Ellipsis extends Component { ...@@ -246,16 +248,13 @@ export default class Ellipsis extends Component {
</span> </span>
); );
return ( return (
<div {...restProps} ref={this.handleRoot} className={cls}> <div {...restProps} ref={this.handleRoot} className={cls}>
<div ref={this.handleContent}> <div ref={this.handleContent}>
{tooltip ? ( {
<Tooltip overlayStyle={TooltipOverlayStyle} title={text}> getTooltip({ tooltip, overlayStyle:TooltipOverlayStyle, title: text, children: childNode })
{childNode} }
</Tooltip>
) : (
childNode
)}
<div className={styles.shadow} ref={this.handleShadowChildren}> <div className={styles.shadow} ref={this.handleShadowChildren}>
{children} {children}
</div> </div>
......
...@@ -5,7 +5,7 @@ export interface IExceptionProps { ...@@ -5,7 +5,7 @@ export interface IExceptionProps {
desc?: React.ReactNode; desc?: React.ReactNode;
img?: string; img?: string;
actions?: React.ReactNode; actions?: React.ReactNode;
linkElement?: React.ReactNode; linkElement?: string | React.ComponentType;
style?: React.CSSProperties; style?: React.CSSProperties;
className?: string; className?: string;
backText?: React.ReactNode; backText?: React.ReactNode;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment