mirror of
https://github.com/apache/superset.git
synced 2024-09-19 20:19:37 -04:00
fix(fix issues in superset): fix issues in superset
This commit is contained in:
parent
6f6de6df18
commit
db4863d14b
@ -32,6 +32,8 @@ const defaultProps = {
|
||||
onRemoveFilter: NOOP,
|
||||
};
|
||||
|
||||
const SEARCH_BAR_HEIGHT = 40;
|
||||
|
||||
export type TableProps = Props & Readonly<typeof defaultProps>;
|
||||
|
||||
type InternalTableProps = TableProps & WithStylesProps;
|
||||
@ -174,8 +176,10 @@ class TableVis extends React.PureComponent<InternalTableProps, TableState> {
|
||||
}
|
||||
});
|
||||
|
||||
const tableHeight = includeSearch ? height - SEARCH_BAR_HEIGHT : height;
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className={cx(styles.container)}>
|
||||
{includeSearch && (
|
||||
<div className={cx(styles.searchBar)}>
|
||||
<div className={cx(styles.searchBox)}>
|
||||
@ -200,14 +204,17 @@ class TableVis extends React.PureComponent<InternalTableProps, TableState> {
|
||||
zebra
|
||||
rowHeight={heightType}
|
||||
renderers={renderers}
|
||||
height={height}
|
||||
height={tableHeight}
|
||||
/>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default withStyles(({ unit }) => ({
|
||||
container: {
|
||||
display: 'grid',
|
||||
},
|
||||
searchBar: {
|
||||
alignItems: 'baseline',
|
||||
display: 'flex',
|
||||
|
@ -24,6 +24,8 @@ import buildQuery from './buildQuery';
|
||||
import TableFormData from './TableFormData';
|
||||
|
||||
Core.initialize({ name: 'superset-datatable' });
|
||||
const { aesthetic } = Core;
|
||||
aesthetic.globals = {};
|
||||
|
||||
export default class TableChartPlugin extends ChartPlugin<TableFormData> {
|
||||
constructor() {
|
||||
|
@ -22,6 +22,8 @@ import transformProps from './transformProps';
|
||||
import createMetadata from '../createMetadata';
|
||||
|
||||
Core.initialize({ name: 'superset-datatable' });
|
||||
const { aesthetic } = Core;
|
||||
aesthetic.globals = {};
|
||||
|
||||
export default class TableChartPlugin extends ChartPlugin {
|
||||
constructor() {
|
||||
|
@ -51,6 +51,28 @@ export const getRenderer = ({
|
||||
const isMetric = column.type === 'metric';
|
||||
let Parent;
|
||||
|
||||
const boxStyle: CSSProperties = {
|
||||
backgroundColor:
|
||||
enableFilter && isSelected({ key: keyName, value }) ? SELECTION_COLOR : undefined,
|
||||
cursor: isMetric ? 'default' : 'pointer',
|
||||
margin: '0px -16px',
|
||||
};
|
||||
|
||||
const boxContainerStyle: CSSProperties = {
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
height: HEIGHT_TO_PX[heightType],
|
||||
margin: '0px 16px',
|
||||
position: 'relative',
|
||||
textAlign: isMetric ? 'right' : 'left',
|
||||
};
|
||||
|
||||
const FullCellBackgroundWrapper = ({ children }: { children: React.ReactNode }) => (
|
||||
<div style={boxStyle}>
|
||||
<div style={boxContainerStyle}>{children}</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
if (isMetric) {
|
||||
let left = 0;
|
||||
let width = 0;
|
||||
@ -66,21 +88,8 @@ export const getRenderer = ({
|
||||
width = Math.round((Math.abs(value) / tot) * 100);
|
||||
}
|
||||
const color = colorPositiveNegative && value < 0 ? NEGATIVE_COLOR : POSITIVE_COLOR;
|
||||
Parent = ({ children }: { children: React.ReactNode }) => {
|
||||
const boxStyle: CSSProperties = {
|
||||
backgroundColor:
|
||||
enableFilter && isSelected({ key: keyName, value }) ? SELECTION_COLOR : undefined,
|
||||
margin: '0px -16px',
|
||||
};
|
||||
const boxContainerStyle: CSSProperties = {
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
height: HEIGHT_TO_PX[heightType],
|
||||
margin: '0px 16px',
|
||||
position: 'relative',
|
||||
textAlign: isMetric ? 'right' : 'left',
|
||||
};
|
||||
|
||||
Parent = ({ children }: { children: React.ReactNode }) => {
|
||||
const barStyle: CSSProperties = {
|
||||
background: color,
|
||||
borderRadius: 3,
|
||||
@ -91,24 +100,28 @@ export const getRenderer = ({
|
||||
};
|
||||
|
||||
return (
|
||||
<div style={boxStyle}>
|
||||
<div style={boxContainerStyle}>
|
||||
<div style={barStyle} />
|
||||
<div style={numberStyle}>{children}</div>
|
||||
</div>
|
||||
</div>
|
||||
<FullCellBackgroundWrapper>
|
||||
<div style={barStyle} />
|
||||
<div style={numberStyle}>{children}</div>
|
||||
</FullCellBackgroundWrapper>
|
||||
);
|
||||
};
|
||||
} else {
|
||||
Parent = ({ children }: { children: React.ReactNode }) => <>{children}</>;
|
||||
Parent = ({ children }: { children: React.ReactNode }) => (
|
||||
<FullCellBackgroundWrapper>{children}</FullCellBackgroundWrapper>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
onClick={handleCellSelected({
|
||||
key: keyName,
|
||||
value,
|
||||
})}
|
||||
onClick={
|
||||
isMetric
|
||||
? null
|
||||
: handleCellSelected({
|
||||
key: keyName,
|
||||
value,
|
||||
})
|
||||
}
|
||||
>
|
||||
<Parent>{column.format ? column.format(value) : value}</Parent>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user