UNPKG

9.6 kBJavaScriptView Raw
1'use strict';
2
3exports.__esModule = true;
4
5var _extends2 = require('babel-runtime/helpers/extends');
6
7var _extends3 = _interopRequireDefault(_extends2);
8
9var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
10
11var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
12
13var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
14
15var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
16
17var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
18
19var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
20
21var _inherits2 = require('babel-runtime/helpers/inherits');
22
23var _inherits3 = _interopRequireDefault(_inherits2);
24
25exports.default = tree;
26
27var _react = require('react');
28
29var _react2 = _interopRequireDefault(_react);
30
31var _propTypes = require('prop-types');
32
33var _propTypes2 = _interopRequireDefault(_propTypes);
34
35var _reactLifecyclesCompat = require('react-lifecycles-compat');
36
37var _row = require('./tree/row');
38
39var _row2 = _interopRequireDefault(_row);
40
41var _cell = require('./tree/cell');
42
43var _cell2 = _interopRequireDefault(_cell);
44
45var _util = require('./util');
46
47function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
48
49var noop = function noop() {};
50
51function tree(BaseComponent) {
52 var _class, _temp;
53
54 var TreeTable = (_temp = _class = function (_React$Component) {
55 (0, _inherits3.default)(TreeTable, _React$Component);
56
57 function TreeTable(props, context) {
58 (0, _classCallCheck3.default)(this, TreeTable);
59
60 var _this = (0, _possibleConstructorReturn3.default)(this, _React$Component.call(this, props, context));
61
62 _this.onTreeNodeClick = function (record) {
63 var primaryKey = _this.props.primaryKey,
64 id = record[primaryKey],
65 dataSource = _this.ds,
66 openRowKeys = [].concat(_this.state.openRowKeys),
67 index = openRowKeys.indexOf(id),
68 getChildrenKeyById = function getChildrenKeyById(id) {
69 var ret = [id];
70 var loop = function loop(data) {
71 data.forEach(function (item) {
72 ret.push(item[primaryKey]);
73 if (item.children) {
74 loop(item.children);
75 }
76 });
77 };
78 dataSource.forEach(function (item) {
79 if (item[primaryKey] === id) {
80 if (item.children) {
81 loop(item.children);
82 }
83 }
84 });
85 return ret;
86 };
87
88
89 if (index > -1) {
90 // 不仅要删除当前的openRowKey,还需要删除关联子节点的openRowKey
91 var ids = getChildrenKeyById(id);
92 ids.forEach(function (id) {
93 var i = openRowKeys.indexOf(id);
94 if (i > -1) {
95 openRowKeys.splice(i, 1);
96 }
97 });
98 } else {
99 openRowKeys.push(id);
100 }
101
102 if (!('openRowKeys' in _this.props)) {
103 _this.setState({
104 openRowKeys: openRowKeys
105 });
106 }
107 _this.props.onRowOpen(openRowKeys, id, index === -1, record);
108 };
109
110 _this.state = {
111 openRowKeys: props.openRowKeys || props.defaultOpenRowKeys || []
112 };
113 return _this;
114 }
115
116 TreeTable.prototype.getChildContext = function getChildContext() {
117 return {
118 openTreeRowKeys: this.state.openRowKeys,
119 indent: this.props.indent,
120 treeStatus: this.getTreeNodeStatus(this.ds),
121 onTreeNodeClick: this.onTreeNodeClick,
122 isTree: this.props.isTree
123 };
124 };
125
126 TreeTable.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
127 if ('openRowKeys' in nextProps) {
128 return {
129 openRowKeys: nextProps.openRowKeys || []
130 };
131 }
132
133 return null;
134 };
135
136 TreeTable.prototype.normalizeDataSource = function normalizeDataSource(dataSource) {
137 var openRowKeys = this.state.openRowKeys;
138 var primaryKey = this.props.primaryKey;
139
140 var ret = [],
141 loop = function loop(dataSource, level) {
142 var parentId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
143
144 dataSource.forEach(function (item) {
145 item.__level = level;
146
147 if (level === 0 || openRowKeys.indexOf(parentId) > -1) {
148 item.__hidden = false;
149 } else {
150 item.__hidden = true;
151 }
152 ret.push(item);
153
154 if (item.children) {
155 loop(item.children, level + 1, item[primaryKey]);
156 }
157 });
158 };
159 loop(dataSource, 0);
160 this.ds = ret;
161 return ret;
162 };
163
164 TreeTable.prototype.getTreeNodeStatus = function getTreeNodeStatus() {
165 var dataSource = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
166 var openRowKeys = this.state.openRowKeys,
167 primaryKey = this.props.primaryKey,
168 ret = [];
169
170
171 openRowKeys.forEach(function (openKey) {
172 dataSource.forEach(function (item) {
173 if (item[primaryKey] === openKey) {
174 if (item.children) {
175 item.children.forEach(function (child) {
176 ret.push(child[primaryKey]);
177 });
178 }
179 }
180 });
181 });
182 return ret;
183 };
184
185 TreeTable.prototype.render = function render() {
186 /* eslint-disable no-unused-vars, prefer-const */
187 var _props = this.props,
188 components = _props.components,
189 isTree = _props.isTree,
190 dataSource = _props.dataSource,
191 indent = _props.indent,
192 others = (0, _objectWithoutProperties3.default)(_props, ['components', 'isTree', 'dataSource', 'indent']);
193
194
195 if (isTree) {
196 components = (0, _extends3.default)({}, components);
197 if (!components.Row) {
198 components.Row = _row2.default;
199 }
200 if (!components.Cell) {
201 components.Cell = _cell2.default;
202 }
203
204 dataSource = this.normalizeDataSource(dataSource);
205 }
206 return _react2.default.createElement(BaseComponent, (0, _extends3.default)({}, others, { dataSource: dataSource, components: components }));
207 };
208
209 return TreeTable;
210 }(_react2.default.Component), _class.TreeRow = _row2.default, _class.TreeCell = _cell2.default, _class.propTypes = (0, _extends3.default)({
211 /**
212 * 默认情况下展开的树形表格,传入了此属性代表tree的展开为受控操作
213 */
214 openRowKeys: _propTypes2.default.array,
215 /**
216 * 默认情况下展开的 Expand行 或者 Tree行,非受控模式
217 * @version 1.23.22
218 */
219 defaultOpenRowKeys: _propTypes2.default.array,
220 /**
221 * 点击tree展开或者关闭的时候触发的事件
222 * @param {Array} openRowKeys tree模式下展开的key
223 * @param {String} currentRowKey 当前点击行的key
224 * @param {Boolean} opened 当前点击是展开还是收起
225 * @param {Object} currentRecord 当前点击行的记录
226 */
227 onRowOpen: _propTypes2.default.func,
228 /**
229 * dataSource当中数据的主键,如果给定的数据源中的属性不包含该主键,会造成选择状态全部选中
230 */
231 primaryKey: _propTypes2.default.oneOfType([_propTypes2.default.symbol, _propTypes2.default.string]),
232 /**
233 * 在tree模式下的缩进尺寸, 仅在isTree为true时候有效
234 */
235 indent: _propTypes2.default.number,
236 /**
237 * 开启Table的tree模式, 接收的数据格式中包含children则渲染成tree table
238 */
239 isTree: _propTypes2.default.bool,
240 locale: _propTypes2.default.object
241 }, BaseComponent.propTypes), _class.defaultProps = (0, _extends3.default)({}, BaseComponent.defaultProps, {
242 primaryKey: 'id',
243 onRowOpen: noop,
244 components: {},
245 indent: 12
246 }), _class.childContextTypes = {
247 openTreeRowKeys: _propTypes2.default.array,
248 indent: _propTypes2.default.number,
249 treeStatus: _propTypes2.default.array,
250 onTreeNodeClick: _propTypes2.default.func,
251 isTree: _propTypes2.default.bool
252 }, _temp);
253 TreeTable.displayName = 'TreeTable';
254
255 (0, _util.statics)(TreeTable, BaseComponent);
256 return (0, _reactLifecyclesCompat.polyfill)(TreeTable);
257}
258module.exports = exports['default'];
\No newline at end of file