mirror of
https://github.com/apache/superset.git
synced 2026-04-16 22:55:52 +00:00
[query-search] fix scrolling on query search and pagination styling (#2646)
* fix scrolling for query search, getHeight was returning NAN * add styling for query search pagination * remove console.log * make pagination buttons match bootstrap theme small buttons
This commit is contained in:
@@ -15,7 +15,7 @@ class App extends React.PureComponent {
|
||||
super(props);
|
||||
this.state = {
|
||||
hash: window.location.hash,
|
||||
contentHeight: this.getHeight(),
|
||||
contentHeight: '0px',
|
||||
};
|
||||
}
|
||||
componentDidMount() {
|
||||
@@ -32,11 +32,16 @@ class App extends React.PureComponent {
|
||||
this.setState({ hash: window.location.hash });
|
||||
}
|
||||
getHeight() {
|
||||
const navHeight = 90;
|
||||
const headerHeight = $('.nav-tabs').outerHeight() ?
|
||||
$('.nav-tabs').outerHeight() : $('#search-header').outerHeight();
|
||||
const warningHeight = $('#navbar-warning').outerHeight();
|
||||
const alertHeight = $('#sqllab-alerts').outerHeight();
|
||||
const warningEl = $('#navbar-warning');
|
||||
const navTabsEl = $('.nav-tabs');
|
||||
const searchHeaderEl = $('#search-header');
|
||||
const alertEl = $('#sqllab-alerts');
|
||||
const headerNavEl = $('header .navbar');
|
||||
const navHeight = headerNavEl.outerHeight() + parseInt(headerNavEl.css('marginBottom'), 10);
|
||||
const searchHeaderHeight = searchHeaderEl.outerHeight() + parseInt(searchHeaderEl.css('marginBottom'), 10);
|
||||
const headerHeight = navTabsEl.outerHeight() ? navTabsEl.outerHeight() : searchHeaderHeight;
|
||||
const warningHeight = warningEl.length > 0 ? warningEl.outerHeight() : 0;
|
||||
const alertHeight = alertEl.length > 0 ? alertEl.outerHeight() : 0;
|
||||
return `${window.innerHeight - navHeight - headerHeight - warningHeight - alertHeight}px`;
|
||||
}
|
||||
handleResize() {
|
||||
|
||||
@@ -11,7 +11,7 @@ const $ = window.$ = require('jquery');
|
||||
|
||||
const propTypes = {
|
||||
actions: React.PropTypes.object.isRequired,
|
||||
height: React.PropTypes.integer,
|
||||
height: React.PropTypes.number.isRequired,
|
||||
};
|
||||
|
||||
class QuerySearch extends React.PureComponent {
|
||||
@@ -192,11 +192,11 @@ class QuerySearch extends React.PureComponent {
|
||||
(<img className="loading" alt="Loading..." src="/static/assets/images/loading.gif" />)
|
||||
:
|
||||
(
|
||||
<div
|
||||
style={{ height: this.props.height }}
|
||||
className="scrollbar-container"
|
||||
>
|
||||
<div className="scrollbar-content">
|
||||
<div className="scrollbar-container">
|
||||
<div
|
||||
className="scrollbar-content"
|
||||
style={{ height: this.props.height }}
|
||||
>
|
||||
<QueryTable
|
||||
columns={[
|
||||
'state', 'db', 'user', 'time',
|
||||
|
||||
Reference in New Issue
Block a user