UNPKG

4.83 kBJavaScriptView Raw
1import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
2import _createClass from "@babel/runtime/helpers/createClass";
3import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
4import _inherits from "@babel/runtime/helpers/inherits";
5import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
6import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
7
8function _createSuper(Derived) {
9 function isNativeReflectConstruct() {
10 if (typeof Reflect === "undefined" || !Reflect.construct) return false;
11 if (Reflect.construct.sham) return false;
12 if (typeof Proxy === "function") return true;
13
14 try {
15 Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
16 return true;
17 } catch (e) {
18 return false;
19 }
20 }
21
22 return function () {
23 var Super = _getPrototypeOf(Derived),
24 result;
25
26 if (isNativeReflectConstruct()) {
27 var NewTarget = _getPrototypeOf(this).constructor;
28
29 result = Reflect.construct(Super, arguments, NewTarget);
30 } else {
31 result = Super.apply(this, arguments);
32 }
33
34 return _possibleConstructorReturn(this, result);
35 };
36}
37
38import React, { Component } from 'react';
39import Button from '../button/Button';
40import SelectTrigger from '../rc-components/select/SelectTrigger';
41import { Item as MenuItem } from '../rc-components/menu';
42import { UNSELECTABLE_ATTRIBUTE, UNSELECTABLE_STYLE } from '../rc-components/select/util';
43import { getColumnKey } from './util';
44import { Size } from '../_util/enum';
45import { getPrefixCls } from '../configure';
46
47var ColumnFilter =
48/*#__PURE__*/
49function (_Component) {
50 _inherits(ColumnFilter, _Component);
51
52 var _super = _createSuper(ColumnFilter);
53
54 function ColumnFilter() {
55 var _this;
56
57 _classCallCheck(this, ColumnFilter);
58
59 _this = _super.apply(this, arguments);
60 _this.state = {
61 open: false
62 };
63
64 _this.onMenuSelect = function (item) {
65 item.item.props.value.hidden = false;
66
67 _this.fireChange(item);
68 };
69
70 _this.onMenuDeselect = function (item) {
71 item.item.props.value.hidden = true;
72
73 _this.fireChange(item);
74 };
75
76 _this.onDropdownVisibleChange = function (open) {
77 var _assertThisInitialize = _assertThisInitialized(_this),
78 state = _assertThisInitialize.state;
79
80 if (state.open !== open) {
81 _this.setState({
82 open: open
83 });
84 }
85 };
86
87 return _this;
88 }
89
90 _createClass(ColumnFilter, [{
91 key: "render",
92 value: function render() {
93 var _this$props = this.props,
94 prefixCls = _this$props.prefixCls,
95 getPopupContainer = _this$props.getPopupContainer;
96 var open = this.state.open;
97 return React.createElement("div", {
98 className: "".concat(prefixCls, "-columns-chooser")
99 }, React.createElement(SelectTrigger, {
100 prefixCls: getPrefixCls('select'),
101 showAction: ['click'],
102 options: this.getOptions(),
103 value: this.getVisibleColumns(),
104 getPopupContainer: getPopupContainer,
105 multiple: true,
106 onDropdownVisibleChange: this.onDropdownVisibleChange,
107 onMenuSelect: this.onMenuSelect,
108 onMenuDeselect: this.onMenuDeselect,
109 visible: open,
110 popupPlacement: "bottomRight",
111 dropdownMatchSelectWidth: false,
112 dropdownStyle: {
113 minWidth: 187
114 }
115 }, React.createElement(Button, {
116 shape: "circle",
117 icon: "view_column",
118 size: Size.small
119 })));
120 }
121 }, {
122 key: "fireChange",
123 value: function fireChange(item) {
124 var onColumnFilterChange = this.props.onColumnFilterChange;
125
126 if (onColumnFilterChange) {
127 onColumnFilterChange(item);
128 }
129 }
130 }, {
131 key: "getOptions",
132 value: function getOptions() {
133 var columns = this.props.columns;
134 var options = [];
135 (columns || []).forEach(function (column, i) {
136 var title = column.title,
137 notDisplay = column.notDisplay,
138 disableClick = column.disableClick;
139
140 if (title && !notDisplay) {
141 options.push(React.createElement(MenuItem, {
142 disabled: disableClick,
143 style: UNSELECTABLE_STYLE,
144 attribute: UNSELECTABLE_ATTRIBUTE,
145 value: column,
146 key: getColumnKey(column, i)
147 }, title));
148 }
149 });
150 return options;
151 }
152 }, {
153 key: "getVisibleColumns",
154 value: function getVisibleColumns() {
155 var columns = this.props.columns;
156 return (columns || []).filter(function (column) {
157 return !column.hidden;
158 });
159 }
160 }]);
161
162 return ColumnFilter;
163}(Component);
164
165export { ColumnFilter as default };
166ColumnFilter.displayName = 'ColumnFilter';
167//# sourceMappingURL=ColumnFilter.js.map