mirror of https://github.com/apache/superset.git
fix(explore): long metric name display (#12387)
* fix(explore): long metric name display * add tooltip to control
This commit is contained in:
parent
9acf48fd1e
commit
c327cb911e
|
@ -58,6 +58,12 @@ const ResizeIcon = styled.i`
|
|||
margin-left: ${({ theme }) => theme.gridUnit * 2}px;
|
||||
`;
|
||||
|
||||
const ColumnOptionStyle = styled.span`
|
||||
.option-label {
|
||||
display: inline;
|
||||
}
|
||||
`;
|
||||
|
||||
const SAVED_TAB_KEY = 'SAVED';
|
||||
|
||||
const startingWidth = 320;
|
||||
|
@ -220,7 +226,11 @@ export default class AdhocMetricEditPopover extends React.Component {
|
|||
if (column.metric_name && !column.verbose_name) {
|
||||
column.verbose_name = column.metric_name;
|
||||
}
|
||||
return <ColumnOption column={column} showType />;
|
||||
return (
|
||||
<ColumnOptionStyle>
|
||||
<ColumnOption column={column} showType />
|
||||
</ColumnOptionStyle>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
|
|
@ -18,6 +18,7 @@
|
|||
*/
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { Tooltip } from 'src/common/components/Tooltip';
|
||||
import AdhocMetric from '../AdhocMetric';
|
||||
import columnType from '../propTypes/columnType';
|
||||
import savedMetricType from '../propTypes/savedMetricType';
|
||||
|
@ -70,17 +71,22 @@ class AdhocMetricOption extends React.PureComponent {
|
|||
savedMetric={savedMetric}
|
||||
datasourceType={datasourceType}
|
||||
>
|
||||
<DraggableOptionControlLabel
|
||||
savedMetric={savedMetric}
|
||||
label={adhocMetric.label}
|
||||
onRemove={this.onRemoveMetric}
|
||||
onMoveLabel={onMoveLabel}
|
||||
onDropLabel={onDropLabel}
|
||||
index={index}
|
||||
type={OPTION_TYPES.metric}
|
||||
isAdhoc
|
||||
isFunction
|
||||
/>
|
||||
<Tooltip
|
||||
placement="top"
|
||||
title={savedMetric.expression || adhocMetric.label}
|
||||
>
|
||||
<DraggableOptionControlLabel
|
||||
savedMetric={savedMetric}
|
||||
label={adhocMetric.label}
|
||||
onRemove={this.onRemoveMetric}
|
||||
onMoveLabel={onMoveLabel}
|
||||
onDropLabel={onDropLabel}
|
||||
index={index}
|
||||
type={OPTION_TYPES.metric}
|
||||
isAdhoc
|
||||
isFunction
|
||||
/>
|
||||
</Tooltip>
|
||||
</AdhocMetricPopoverTrigger>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -60,6 +60,9 @@ const Label = styled.div`
|
|||
svg {
|
||||
margin-right: ${({ theme }) => theme.gridUnit}px;
|
||||
}
|
||||
.option-label {
|
||||
display: inline;
|
||||
}
|
||||
`;
|
||||
|
||||
const CaretContainer = styled.div`
|
||||
|
|
Loading…
Reference in New Issue