1 | import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
2 | import _createClass from "@babel/runtime/helpers/createClass";
|
3 | import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
4 | import _inherits from "@babel/runtime/helpers/inherits";
|
5 | import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
6 | import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
7 |
|
8 | function _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 |
|
38 | import React, { Component } from 'react';
|
39 | import Button from '../button/Button';
|
40 | import SelectTrigger from '../rc-components/select/SelectTrigger';
|
41 | import { Item as MenuItem } from '../rc-components/menu';
|
42 | import { UNSELECTABLE_ATTRIBUTE, UNSELECTABLE_STYLE } from '../rc-components/select/util';
|
43 | import { getColumnKey } from './util';
|
44 | import { Size } from '../_util/enum';
|
45 | import { getPrefixCls } from '../configure';
|
46 |
|
47 | var ColumnFilter =
|
48 |
|
49 | function (_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 |
|
165 | export { ColumnFilter as default };
|
166 | ColumnFilter.displayName = 'ColumnFilter';
|
167 |
|