Browse Source

报表搜索条件变更可能导致组件长度变化,从而引起filter栏高度变化,针对此类变化设置reset逻辑

zhuth 6 years ago
parent
commit
7fb67e2a35
1 changed files with 14 additions and 6 deletions
  1. 14 6
      src/components/dashboardDesigner/filterBar.jsx

+ 14 - 6
src/components/dashboardDesigner/filterBar.jsx

@@ -19,7 +19,7 @@ class FilterBar extends React.Component {
     }
 
     componentDidMount() {
-        this.resetFilterContentHeight();
+        this.resetFilterContentHeight(1000);
         window.addEventListener("resize", this.resetFilterContentHeight);
     }
 
@@ -61,9 +61,11 @@ class FilterBar extends React.Component {
         });
         this.filtersRef.style.overflow = 'hidden';
         document.removeEventListener('click', this.closeFiltersEventListener);
+
+        this.resetFilterContentHeight();
     }
 
-    resetFilterContentHeight = () => {
+    resetFilterContentHeight = (timeout) => {
         if(!this.filtersRef) {
             return;
         }
@@ -76,7 +78,7 @@ class FilterBar extends React.Component {
             let filterContentScrollHeight;
             let obj = {};
 
-            if(this.state.filtersOpened) {
+            if(this.state.filtersOpened || (this.filtersRef && this.filtersRef.style.overflow === 'visible')) {
                 this.filtersRef.style.height = 'auto';
                 filterContentOffsetHeight = filterContent.offsetHeight;
                 filterContentScrollHeight = filterContent.scrollHeight
@@ -84,16 +86,18 @@ class FilterBar extends React.Component {
                 if(filterContentScrollHeight === 40) {
                     obj.filterOvered = false;
                     obj.filtersOpened = false;
+                }else {
+                    obj.filterOvered = true;
                 }
                 obj.filterContentHeight = Math.min(filterContentScrollHeight, document.body.clientHeight);
             }else {
                 filterContentOffsetHeight = filterContent.offsetHeight;
-                filterContentScrollHeight = filterContent.scrollHeight
+                filterContentScrollHeight = filterContent.scrollHeight;
                 obj.filterOvered = filterContentScrollHeight > filterContentOffsetHeight;
             }
 
             this.setState(obj);
-        }, 1000);
+        }, timeout || 100);
     }
 
     setToggleVisible = (visible) => {
@@ -116,13 +120,17 @@ class FilterBar extends React.Component {
         const { dispatch, afterRefresh } = this.props;
         dispatch({ type: 'dashboardDesigner/changeFilters', filters }).then(() => {
             afterRefresh && typeof afterRefresh === 'function' && afterRefresh()
-        }).then(this.resetFilterContentHeight);
+        }).then(() => {
+            this.resetFilterContentHeight()
+        });
     }
 
     changeFilterValue = (filter) => {
         const { dispatch, afterRefresh } = this.props;
         dispatch({ type: 'dashboardDesigner/changeFilter', filter }).then(() => {
             afterRefresh && typeof afterRefresh === 'function' && afterRefresh()
+        }).then(() => {
+            this.resetFilterContentHeight(200)
         });
     }