cambiar a funcion get, actualizar state interno de componente filter box

PivotTableUI.js

@@ -54,7 +54,7 @@ var DraggableAttribute = exports.DraggableAttribute = function (_React$Component
 
     var _this = _possibleConstructorReturn(this, (DraggableAttribute.__proto__ || Object.getPrototypeOf(DraggableAttribute)).call(this, props));
 
-    _this.state = { open: false, filterText: '' };
+    _this.state = { open: false, filterText: '', attrValues: {} };
     return _this;
   }
 
@@ -67,6 +67,14 @@ var DraggableAttribute = exports.DraggableAttribute = function (_React$Component
         this.props.addValuesToFilter(this.props.name, [value]);
       }
     }
+  }, {
+    key: 'updateFilterOptions',
+    value: function updateFilterOptions() {
+      var showAll = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+
+      var _attrValuesReduced = this.props.getFilterOptions(showAll);
+      this.setState({ attrValues: _attrValuesReduced[this.props.name] });
+    }
   }, {
     key: 'matchesFilter',
     value: function matchesFilter(x) {
@@ -88,8 +96,8 @@ var DraggableAttribute = exports.DraggableAttribute = function (_React$Component
       // const showMenu = Object.keys(this.props.attrValues).length < this.props.menuLimit;
       // const values = Object.keys(this.props.attrValues);
       var stringAttr = JSON.stringify(this.props.attrValues);
-      var stringAttrReduced = JSON.stringify(this.props.attrValuesReduced);
+      var stringAttrReduced = JSON.stringify(this.state.attrValues);
-      var values = Object.keys(this.props.attrValuesReduced);
+      var values = Object.keys(this.state.attrValues);
       var shown = values.filter(this.matchesFilter.bind(this)).sort(this.props.sorter);
       var truncatedShown = values.filter(this.matchesFilter.bind(this)).sort(this.props.sorter);
       // .slice(0, this.props.menuLimit);
@@ -136,7 +144,7 @@ var DraggableAttribute = exports.DraggableAttribute = function (_React$Component
                 role: 'button',
                 className: 'pvtButton ' + (stringAttr === stringAttrReduced ? 'disabled' : ''),
                 onClick: function onClick() {
-                  _this2.props.updateFilterOptions(true);
+                  _this2.updateFilterOptions(true);
                 }
               },
               'Mostrar Todas las Opciones'
@@ -148,7 +156,7 @@ var DraggableAttribute = exports.DraggableAttribute = function (_React$Component
                 role: 'button',
                 className: 'pvtButton',
                 onClick: function onClick() {
-                  _this2.props.updateFilterOptions();
+                  _this2.updateFilterOptions();
                 }
               },
               'Mostrar Opciones en Tabla'
@@ -276,7 +284,6 @@ DraggableAttribute.propTypes = {
   addValuesToFilter: _propTypes2.default.func.isRequired,
   removeValuesFromFilter: _propTypes2.default.func.isRequired,
   attrValues: _propTypes2.default.objectOf(_propTypes2.default.number).isRequired,
-  attrValuesReduced: _propTypes2.default.objectOf(_propTypes2.default.number).isRequired,
   valueFilter: _propTypes2.default.objectOf(_propTypes2.default.bool),
   moveFilterBoxToTop: _propTypes2.default.func.isRequired,
   sorter: _propTypes2.default.func.isRequired,
@@ -366,7 +373,6 @@ var PivotTableUI = function (_React$PureComponent2) {
       maxZIndex: 1000,
       openDropdown: false,
       attrValues: {},
-      attrValuesReduced: {},
       materializedInput: [],
       hideConfiguration: false,
       headerClass: '',
@@ -381,16 +387,14 @@ var PivotTableUI = function (_React$PureComponent2) {
       this.materializeInput(this.props.data);
     }
   }, {
-    key: 'updateFilterOptions',
+    key: 'getFilterOptions',
-    value: function updateFilterOptions() {
+    value: function getFilterOptions() {
       var showAll = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
 
       console.log('updateFilterOptions showAll', showAll);
       if (showAll) {
-        var _newState = JSON.parse(JSON.stringify(this.state));
+        var _attrValuesReduced2 = JSON.parse(JSON.stringify(this.state.attrValues));
-        _newState.attrValuesReduced = JSON.parse(JSON.stringify(this.state.attrValues));
+        return _attrValuesReduced2;
-        this.setState(_newState);
-        return;
       }
       var _valuefilter = this.props.valueFilter;
       var keysFilter = Object.keys(_valuefilter);
@@ -412,8 +416,7 @@ var PivotTableUI = function (_React$PureComponent2) {
         return true;
       });
       console.log('updateFilterOptions filteredData', filteredData);
-      var newState = JSON.parse(JSON.stringify(this.state));
+      var _attrValuesReduced = {};
-      newState.attrValuesReduced = {};
       var recordsProcessed = 0;
       _Utilities.PivotData.forEachRecord(filteredData, this.props.derivedAttributes, function (record) {
         var _iteratorNormalCompletion = true;
@@ -424,10 +427,10 @@ var PivotTableUI = function (_React$PureComponent2) {
           for (var _iterator = Object.keys(record)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
             var attr = _step.value;
 
-            if (!(attr in newState.attrValuesReduced)) {
+            if (!(attr in _attrValuesReduced)) {
-              newState.attrValuesReduced[attr] = {};
+              _attrValuesReduced[attr] = {};
               if (recordsProcessed > 0) {
-                newState.attrValuesReduced[attr].null = recordsProcessed;
+                _attrValuesReduced[attr].null = recordsProcessed;
               }
             }
           }
@@ -446,17 +449,17 @@ var PivotTableUI = function (_React$PureComponent2) {
           }
         }
 
-        for (var _attr in newState.attrValuesReduced) {
+        for (var _attr in _attrValuesReduced) {
           var value = _attr in record ? record[_attr] : 'null';
-          if (!(value in newState.attrValuesReduced[_attr])) {
+          if (!(value in _attrValuesReduced[_attr])) {
-            newState.attrValuesReduced[_attr][value] = 0;
+            _attrValuesReduced[_attr][value] = 0;
           }
-          newState.attrValuesReduced[_attr][value]++;
+          _attrValuesReduced[_attr][value]++;
         }
         recordsProcessed++;
       });
-      console.log('updateFilterOptions newState', newState);
+      console.log('updateFilterOptions _attrValuesReduced', _attrValuesReduced);
-      this.setState(newState);
+      return _attrValuesReduced;
     }
   }, {
     key: 'componentDidUpdate',
@@ -472,7 +475,6 @@ var PivotTableUI = function (_React$PureComponent2) {
       var newState = {
         data: nextData,
         attrValues: {},
-        attrValuesReduced: {},
         materializedInput: []
       };
       var recordsProcessed = 0;
@@ -517,7 +519,6 @@ var PivotTableUI = function (_React$PureComponent2) {
         }
         recordsProcessed++;
       });
-      newState.attrValuesReduced = JSON.parse(JSON.stringify(newState.attrValues));
       this.setState(newState);
     }
   }, {
@@ -606,7 +607,6 @@ var PivotTableUI = function (_React$PureComponent2) {
             name: x,
             key: x,
             attrValues: _this7.state.attrValues[x],
-            attrValuesReduced: _this7.state.attrValuesReduced[x],
             valueFilter: _this7.props.valueFilter[x] || {},
             sorter: (0, _Utilities.getSort)(_this7.props.sorters, x),
             menuLimit: _this7.props.menuLimit,
@@ -615,7 +615,7 @@ var PivotTableUI = function (_React$PureComponent2) {
             moveFilterBoxToTop: _this7.moveFilterBoxToTop.bind(_this7),
             removeValuesFromFilter: _this7.removeValuesFromFilter.bind(_this7),
             zIndex: _this7.state.zIndices[x] || _this7.state.maxZIndex,
-            updateFilterOptions: _this7.updateFilterOptions.bind(_this7)
+            getFilterOptions: _this7.getFilterOptions.bind(_this7)
           });
         })
       );

package.json

@@ -1,6 +1,6 @@
 {
   "name": "v-react-pivottable",
-  "version": "0.11.44",
+  "version": "0.11.45",
   "description": "A React-based pivot table",
   "main": "PivotTableUI.js",
   "files": [