QT/superset2
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2026-04-16 22:55:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

[sql-lab] make query history scrollable (#2499)

Browse Source 
* make query history scrollable

* not around results
This commit is contained in:
Alanna Scott
2017-04-04 15:46:11 -07:00
committed by GitHub
parent 02c5cac26f
commit d93b1fc686
2 changed files with 54 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
superset/assets/javascripts/SqlLab/components/ResultSet.jsx
View File

@@ -6,6 +6,8 @@ import shortid from 'shortid';
import VisualizeModal from './VisualizeModal';
import HighlightedSql from './HighlightedSql';
const RESULTS_CONTROLS_HEIGHT = 36;
const propTypes = {
actions: React.PropTypes.object,
csv: React.PropTypes.bool,
@@ -52,36 +54,6 @@ class ResultSet extends React.PureComponent {
this.fetchResults(nextProps.query);
}
}
componentWillMount() {
// hack to get height of result set table so it can be fixed and scroll in place
if (this.state.resultSetHeight === '0') {
// calculate result set table height
// document.getElementById('brace-editor').getBoundingClientRect().height;
const sqlEditorHeight = 192;
// document.getElementById('js-sql-toolbar').getBoundingClientRect().height;
const sqlToolbar = 30;
// document.getElementsByClassName('nav-tabs')[0].getBoundingClientRect().height * 2;
const tabsHeight = 88;
// document.getElementsByTagName('header')[0].getBoundingClientRect().height;
const headerHeight = 59;
// this needs to be hardcoded since this element is in this component and has not mounted yet
const resultsControlsHeight = 30;
const sum =
sqlEditorHeight +
sqlToolbar +
tabsHeight +
resultsControlsHeight +
headerHeight;
this.setState({ resultSetHeight: window.innerHeight - sum - 95 });
}
}
getControls() {
if (this.props.search || this.props.visualize || this.props.csv) {
let csvButton;
@@ -223,7 +195,10 @@ class ResultSet extends React.PureComponent {
/>
{this.getControls.bind(this)()}
{sql}
<div className="ResultSet" style={{ height: `${this.state.resultSetHeight}px` }}>
<div
className="ResultSet"
style={{ height: `${this.props.resultSetHeight - RESULTS_CONTROLS_HEIGHT}px` }}
>
<Table
data={data.map(function (row) {
const newRow = {};