UNPKG

16.4 kBJavaScriptView Raw
1'use strict';
2
3Object.defineProperty(exports, "__esModule", {
4 value: true
5});
6
7var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
8
9var _react = require('react');
10
11var _react2 = _interopRequireDefault(_react);
12
13var _propTypes = require('prop-types');
14
15var _propTypes2 = _interopRequireDefault(_propTypes);
16
17var _btnJSON = require('./btnJSON');
18
19var _btnJSON2 = _interopRequireDefault(_btnJSON);
20
21var _beeButton = require('bee-button');
22
23var _beeButton2 = _interopRequireDefault(_beeButton);
24
25var _beeIcon = require('bee-icon');
26
27var _beeIcon2 = _interopRequireDefault(_beeIcon);
28
29var _beeDropdown = require('bee-dropdown');
30
31var _beeDropdown2 = _interopRequireDefault(_beeDropdown);
32
33var _beeMenus = require('bee-menus');
34
35var _beeMenus2 = _interopRequireDefault(_beeMenus);
36
37var _lodash = require('lodash.isequal');
38
39var _lodash2 = _interopRequireDefault(_lodash);
40
41var _zh_CN = require('./locale/zh_CN');
42
43var _zh_CN2 = _interopRequireDefault(_zh_CN);
44
45function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
46
47function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
48
49function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
50
51function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
52
53function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
54
55function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
56
57var Item = _beeMenus2["default"].Item;
58
59var propTypes = {
60 onClick: _propTypes2["default"].func, //点击按钮回调
61 addToBtns: _propTypes2["default"].object, //所有的按钮,支持扩展
62 powerBtns: _propTypes2["default"].array, // 按钮权限 code数组
63 btns: _propTypes2["default"].object, // 按钮对象数组
64 type: _propTypes2["default"].oneOfType(['button', 'line', 'icon']),
65 maxSize: _propTypes2["default"].number,
66 forcePowerBtns: _propTypes2["default"].array, //不受权限控制的按钮code数组
67 iconTypes: _propTypes2["default"].object,
68 locale: _propTypes2["default"].object
69};
70var defaultProps = {
71 addToBtns: {},
72 btns: {},
73 type: 'button',
74 maxSize: 2,
75 forcePowerBtns: ['cancel', 'search', 'clear', 'empty'], //取消、查询、清空、置空不受权限管理控制
76 onClick: function onClick() {},
77 iconTypes: { //默认code对应的图标
78 add: 'uf-add-c-o',
79 update: 'uf-pencil',
80 "delete": 'uf-del'
81 },
82 locale: _zh_CN2["default"]
83};
84
85var Btns = function (_Component) {
86 _inherits(Btns, _Component);
87
88 function Btns(props) {
89 _classCallCheck(this, Btns);
90
91 var _this = _possibleConstructorReturn(this, _Component.call(this, props));
92
93 _this.onHandleClick = function (e, item) {
94 var func = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function () {};
95
96 _this.props.onClick(e, item);
97 func(e);
98 };
99
100 _this.renderBtns = function () {
101 var _this$props = _this.props,
102 btns = _this$props.btns,
103 type = _this$props.type,
104 maxSize = _this$props.maxSize,
105 powerBtns = _this$props.powerBtns,
106 forcePowerBtns = _this$props.forcePowerBtns,
107 locale = _this$props.locale;
108
109 var btnArray = [];
110 if (powerBtns) {
111 Object.keys(btns).map(function (item) {
112 if (forcePowerBtns.indexOf(item) != -1 || powerBtns.indexOf(item) != -1) {
113 var btn = _this.renderBtn(item);
114 if (btn) btnArray.push(btn);
115 }
116 });
117 } else {
118 Object.keys(btns).map(function (item) {
119 var btn = _this.renderBtn(item);
120 if (btn) btnArray.push(btn);
121 });
122 }
123
124 if (type == 'line' || type == 'icon') {
125 if (btnArray.length > maxSize) {
126 var menusList = _react2["default"].createElement(
127 _beeMenus2["default"],
128 null,
129 btnArray.map(function (item, index) {
130 if (index > maxSize - 1) return _react2["default"].createElement(
131 Item,
132 { key: index, onClick: item.onClick },
133 item
134 );
135 })
136 );
137 var drop = _react2["default"].createElement(
138 _beeDropdown2["default"],
139 {
140 overlayClassName: 'ac-btns-dropdown',
141 trigger: ['hover'],
142 overlay: menusList,
143 animation: 'slide-up' },
144 _react2["default"].createElement(
145 'span',
146 { className: 'ac-btns-item ac-btns-more' },
147 locale['_more']
148 )
149 );
150 btnArray.splice(maxSize, btnArray.length - maxSize + 1, drop);
151 return btnArray;
152 } else {
153 return btnArray;
154 }
155 } else {
156 return btnArray;
157 }
158 };
159
160 _this.renderBtn = function (key) {
161 if (!_this.props.btns.hasOwnProperty(key)) return;
162 var itemProps = _this.props.btns[key];
163 var _this$state$allBtns$k = _this.state.allBtns[key],
164 colors = _this$state$allBtns$k.colors,
165 className = _this$state$allBtns$k.className;
166
167 var name = _this.props.locale[key] || _btnJSON2["default"][key].name;
168 var clss = 'ac-btns-item ' + className;
169 if (itemProps) {
170 if (itemProps.className) clss += ' ' + itemProps.className;
171 if (itemProps.name) name = itemProps.name;
172 if (itemProps.onClick) {
173 var func = itemProps.onClick;
174 itemProps.onClick = function (e) {
175 _this.onHandleClick(e, {
176 code: key, name: name
177 }, func);
178 };
179 }
180 }
181 if (_this.state.allBtns[key]) {
182 if (itemProps && itemProps.node) {
183 return itemProps.node;
184 } else {
185 if (_this.props.type == 'button') {
186 switch (key) {
187 case 'search':
188 return _react2["default"].createElement(
189 _beeButton2["default"],
190 _extends({ key: key }, itemProps, { colors: colors, className: clss, title: name }),
191 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-search-light-2' })
192 );
193 case 'clear':
194 return _react2["default"].createElement(
195 _beeButton2["default"],
196 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
197 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-clean' })
198 );
199 case 'empty':
200 return _react2["default"].createElement(
201 _beeButton2["default"],
202 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
203 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-qingkong' })
204 );
205 case 'max':
206 return _react2["default"].createElement(
207 _beeButton2["default"],
208 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
209 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-maxmize' })
210 );
211 case 'min':
212 return _react2["default"].createElement(
213 _beeButton2["default"],
214 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
215 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-minimize' })
216 );
217 case 'first':
218 return _react2["default"].createElement(
219 _beeButton2["default"],
220 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
221 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-2arrow-left' })
222 );
223 case 'next':
224 return _react2["default"].createElement(
225 _beeButton2["default"],
226 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
227 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-arrow-right' })
228 );
229 case 'previous':
230 return _react2["default"].createElement(
231 _beeButton2["default"],
232 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
233 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-arrow-left' })
234 );
235 case 'last':
236 return _react2["default"].createElement(
237 _beeButton2["default"],
238 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss, title: name }),
239 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-2arrow-right' })
240 );
241 default:
242 return _react2["default"].createElement(
243 _beeButton2["default"],
244 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss }),
245 name
246 );
247 }
248 } else if (_this.props.type == 'line') {
249 switch (key) {
250 case 'search':
251 return _react2["default"].createElement(
252 'span',
253 _extends({ key: key }, itemProps, { colors: colors, className: clss }),
254 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-search-light-2' })
255 );
256 case 'clear':
257 return _react2["default"].createElement(
258 'span',
259 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss }),
260 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-clean' })
261 );
262 case 'empty':
263 return _react2["default"].createElement(
264 'span',
265 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss }),
266 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-qingkong' })
267 );
268 case 'max':
269 return _react2["default"].createElement(
270 'span',
271 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss }),
272 _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-maxmize' })
273 );
274 default:
275 return _react2["default"].createElement(
276 'span',
277 _extends({ key: key }, itemProps, { colors: colors, className: 'ac-btns-write ' + clss }),
278 name
279 );
280 }
281 } else if (_this.props.type == 'icon') {
282 var iconType = itemProps.iconType,
283 other = _objectWithoutProperties(itemProps, ['iconType']);
284
285 iconType = iconType ? iconType : _this.props.iconTypes[key];
286 return _react2["default"].createElement(
287 'span',
288 _extends({ key: key }, other, { colors: colors, className: clss + ' icon', title: name }),
289 _react2["default"].createElement(_beeIcon2["default"], { type: iconType })
290 );
291 }
292 }
293 } else {
294 return null;
295 }
296 };
297
298 _this.state = {
299 allBtns: _extends(_btnJSON2["default"], _this.props.addToBtns)
300 };
301 return _this;
302 }
303
304 Btns.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
305 if ('addToBtns' in nextProps) {
306 if ((0, _lodash2["default"])(this.state.allBtns, _extends(_btnJSON2["default"], nextProps.addToBtns))) {
307 this.setState({
308 allBtns: _extends(_btnJSON2["default"], nextProps.addToBtns)
309 });
310 }
311 }
312 };
313
314 Btns.prototype.render = function render() {
315 return _react2["default"].createElement(
316 'span',
317 { className: 'ac-btns' },
318 this.renderBtns()
319 );
320 };
321
322 return Btns;
323}(_react.Component);
324
325;
326
327Btns.propTypes = propTypes;
328Btns.defaultProps = defaultProps;
329exports["default"] = Btns;
330module.exports = exports['default'];
\No newline at end of file