| 1
-2
-3
-4
-5
-6
-7
-8
-9
-10
-11
-12
-13
-14
-15
-16
-17
-18
-19
-20
-21
-22
-23
-24
-25
-26
-27
-28
-29
-30
-31
-32
-33
-34
-35
-36
-37
-38
-39
-40
-41
-42
-43
-44
-45
-46
-47
-48
-49
-50
-51
-52
-53
-54
-55
-56
-57
-58
-59
-60
-61
-62
-63
-64
-65
-66
-67
-68
-69
-70
-71
-72
-73
-74
-75
-76
-77
-78
-79
-80
-81
-82
-83
-84
-85
-86
-87
-88
-89
-90
-91
-92
-93
-94
-95
-96
-97
-98
-99
-100
-101
-102
-103
-104
-105
-106
-107
-108
-109
-110
-111
-112
-113
-114
-115
-116
-117
-118
-119
-120
-121
-122
-123
-124
-125
-126
-127
-128
-129
-130
-131
-132
-133
-134
-135
-136
-137
-138
-139
-140
-141
-142
-143
-144
-145
-146
-147
-148
-149
-150
-151
-152
-153
-154
-155
-156
-157
-158
-159
-160
-161
-162
-163
-164
-165
-166
-167
-168
-169
-170
-171
-172
-173
-174
-175
-176
-177
-178
-179
-180
-181
-182
-183
-184
-185
-186
-187
-188
-189
-190
-191
-192
-193
-194
-195
-196
-197
-198
-199
-200
-201
-202
-203
-204
-205
-206
-207
-208
-209
-210
-211
-212
-213
-214
-215
-216
-217
-218
-219
-220
-221
-222
-223
-224
-225
-226
-227
-228
-229
-230
-231
-232
-233
-234
-235
-236
-237
-238
-239
-240
-241
-242
-243
-244
-245
-246
-247
-248
-249
-250
-251
-252
-253
-254
-255
-256
-257
-258
-259
-260
-261
-262
-263
-264
-265
-266
-267
-268
-269
-270
-271
-272
-273
-274
-275
-276
-277
-278
-279
-280
-281
-282
-283
-284
-285
-286
-287
-288
-289
-290
-291
-292
-293
-294
-295
-296
-297
-298
-299
-300
-301
-302
-303
-304
-305
-306
-307
-308
-309
-310
-311
-312
-313
-314
-315
-316
-317
-318
-319
-320
-321
-322
-323
-324
-325
-326
-327
-328
-329
-330
-331
-332
-333
-334
-335
-336
-337
-338
-339
-340
-341
-342
-343
-344
-345
-346
-347
-348
-349
-350
-351
-352
-353
-354
-355
-356
-357
-358 |
-
-1×
-
-
-
-142×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-1×
-
-7×
-
-5×
-
-150×
-
-9×
-
-18×
-
-1×
-
-
-
-
-
-
-
-1×
-1×
-
-1×
-9×
-
-9×
-
-9×
-27×
-
-
-9×
-
-
-
-5×
-
-
-5×
-5×
-1×
-
-4×
-4×
-
-5×
-
-2×
-
-
-2×
-2×
-
-
-2×
-6×
-5×
-
-
-
-2×
-
-2×
-
-
-2×
-2×
-
-
-2×
-6×
-1×
-
-
-2×
-
-
-
-
-
-30×
-
-
-30×
-30×
-56×
-4×
-
-2×
-
-
-
-
-
-
-
-
-
-
-2×
-
-
-
-
-52×
-
-
-30×
-28×
-
-14×
-
-
-
-
-14×
-
-14×
-14×
-
-
-
-2×
-1×
-1×
-
-30×
-
-60×
-
-3×
-
-
-3×
-1×
-
-2×
-
-
-
-
-
-1×
-9×
-
-9×
-
-9×
-9×
-9×
-9×
-9×
-13×
-11×
-11×
-11×
-1×
-1×
-
-
-
-9×
-9×
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-1×
-6×
-6×
-
-
-
-
-
-
-1×
-15×
-
-15×
-
-
-15×
-
-
-
-
-
-
-
-
-
-
-
-
-28×
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-15×
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-1×
-
-
-1×
-1×
-1×
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-1×
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-1×
-1×
- | 'use strict';
-
-Object.defineProperty(exports, "__esModule", {
- value: true
-});
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { Eif (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _uxcoreDropdown = require('uxcore-dropdown');
-
-var _uxcoreDropdown2 = _interopRequireDefault(_uxcoreDropdown);
-
-var _uxcoreCheckboxGroup = require('uxcore-checkbox-group');
-
-var _uxcoreCheckboxGroup2 = _interopRequireDefault(_uxcoreCheckboxGroup);
-
-var _uxcoreButton = require('uxcore-button');
-
-var _uxcoreButton2 = _interopRequireDefault(_uxcoreButton);
-
-var _classnames5 = require('classnames');
-
-var _classnames6 = _interopRequireDefault(_classnames5);
-
-var _i18n = require('./i18n');
-
-var _i18n2 = _interopRequireDefault(_i18n);
-
-var _Checkbox = require('./Checkbox');
-
-var _Checkbox2 = _interopRequireDefault(_Checkbox);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
-
-function _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); Iif (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
-
-function _defineProperty(obj, key, value) { Iif (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _classCallCheck(instance, Constructor) { Iif (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { Iif (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { Iif (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 } }); Eif (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); } /**
- * MultiSelect Component for uxcore
- * @author peijie.dpj
- *
- * Copyright 2014-2015, Uxcore Team, Alinw.
- * All rights reserved.
- */
-
-var MultiSelect = function (_Component) {
- _inherits(MultiSelect, _Component);
-
- function MultiSelect() {
- var _temp, _this, _ret;
-
- _classCallCheck(this, MultiSelect);
-
- for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
- args[_key] = arguments[_key];
- }
-
- return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
- visible: false,
- lastValues: _this.props.value
- }, _this.handleChange = function (values) {
- var _this2 = _this,
- props = _this2.props;
-
- var newValues = [];
- if (props.maxSelect && values.length > props.maxSelect) {
- newValues = _this.state.lastValues;
- } else {
- newValues = values;
- _this.setState({ lastValues: values });
- }
- props.onChange(newValues);
- }, _this.handleSelectAll = function () {
- var _this3 = _this,
- props = _this3.props;
-
- var valueList = [];
- Iif (props.disabled) {
- return;
- }
- _react2['default'].Children.forEach(props.children, function (item) {
- if (!item.props.disabled || _this.hasSelected(item.props.value)) {
- valueList.push(item.props.value);
- }
- });
-
- props.onChange(valueList);
- }, _this.handleClear = function () {
- var _this4 = _this,
- props = _this4.props;
-
- var valueList = [];
- Iif (props.disabled) {
- return;
- }
- _react2['default'].Children.forEach(props.children, function (item) {
- if (item.props.disabled && _this.hasSelected(item.props.value)) {
- valueList.push(item.props.value);
- }
- });
- props.onChange(valueList);
- }, _this.handleOk = function () {
- _this.setState({
- visible: false
- });
- }, _this.processLabel = function (type) {
- var _this5 = _this,
- props = _this5.props;
-
- var res = [];
- res = _react2['default'].Children.map(props.children, function (item) {
- if (_this.hasSelected(item.props.value)) {
- switch (type) {
- case 'content':
- return _react2['default'].createElement(
- 'span',
- { className: props.prefixCls + '-selection__choice__content' },
- item.props[props.optionLabelProp],
- _react2['default'].createElement(
- 'span',
- { className: props.prefixCls + '-selection__choice__break' },
- props.titleBreakStr
- )
- );
- case 'title':
- return item.props[props.optionLabelProp] + props.titleBreakStr;
- default:
- return '';
- }
- }
- return null;
- }) || [];
-
- if (res.length === 0) {
- switch (type) {
- case 'content':
- res = _react2['default'].createElement(
- 'span',
- { className: props.prefixCls + '-selection__placeholder' },
- props.placeholder
- );
- break;
- case 'title':
- res = [props.placeholder];
- break;
- default:
- res = '';
- }
- } else if (type === 'title') {
- var len = res.length;
- res[len - 1] = res[len - 1].slice(0, res[len - 1].length - 1);
- }
- return type === 'title' ? res.join('') : res;
- }, _this.hasSelected = function (value) {
- return _this.props.value.indexOf(value) !== -1;
- }, _this.handleVisibleChange = function (visible) {
- var _this6 = _this,
- props = _this6.props;
-
- if (props.disabled) {
- return;
- }
- _this.setState({
- visible: visible
- });
- }, _temp), _possibleConstructorReturn(_this, _ret);
- }
-
- MultiSelect.prototype.renderSelectAll = function renderSelectAll() {
- var _this7 = this;
-
- var props = this.props;
- // 检查是否可以点击 全选
- var isAllDisabled = true;
- var isHalfChecked = false;
- var checkedColumn = 0;
- var enabledColumn = 0;
- _react2['default'].Children.forEach(props.children, function (item) {
- if (!item.props.disabled) {
- isAllDisabled = false;
- enabledColumn += 1;
- if (props.value.indexOf(item.props.value) !== -1) {
- isHalfChecked = true;
- checkedColumn += 1;
- }
- }
- });
- var isAllChecked = enabledColumn ? checkedColumn === enabledColumn : false;
- return _react2['default'].createElement(
- 'div',
- {
- className: props.prefixCls + '-select-all'
- },
- _react2['default'].createElement(
- _Checkbox2['default'],
- {
- disabled: isAllDisabled,
- checked: isAllChecked,
- halfChecked: isAllChecked ? false : isHalfChecked,
- className: props.prefixCls + '-select-all-checkbox',
- onChange: function onChange(e) {
- if (e.target.checked) {
- _this7.handleSelectAll();
- } else {
- _this7.handleClear();
- }
- }
- },
- _i18n2['default'][props.locale].selectAll
- )
- );
- };
-
- MultiSelect.prototype.renderMaxSelect = function renderMaxSelect() {
- var props = this.props;
- return _react2['default'].createElement(
- 'p',
- null,
- _i18n2['default'][props.locale].maxSelect[0] + props.maxSelect + _i18n2['default'][props.locale].maxSelect[1]
- );
- };
-
- MultiSelect.prototype.render = function render() {
- var _classnames2, _classnames3, _classnames4;
-
- var props = this.props;
-
-
- var menu = _react2['default'].createElement(
- 'div',
- { className: props.prefixCls + '-dropdown-border' },
- _react2['default'].createElement(
- 'div',
- { className: props.prefixCls + '-content' },
- _react2['default'].createElement(
- _uxcoreCheckboxGroup2['default'],
- {
- onChange: this.handleChange,
- value: props.value
- },
- _react2['default'].Children.map(props.children, function (item, index) {
- return _react2['default'].createElement(_uxcoreCheckboxGroup2['default'].Item, _extends({}, item.props, { key: index, jsxdisabled: props.disabled }));
- })
- )
- ),
- _react2['default'].createElement(
- 'div',
- {
- className: (0, _classnames6['default'])(props.prefixCls + '-footer', _defineProperty({}, props.prefixCls + '-footer-hidden', !props.maxSelect && !props.showClear && !props.showSelectAll))
- },
- props.maxSelect ? this.renderMaxSelect() : this.renderSelectAll(),
- _react2['default'].createElement(
- 'div',
- { className: props.prefixCls + '-button-group' },
- _react2['default'].createElement(
- _uxcoreButton2['default'],
- {
- className: (0, _classnames6['default'])((_classnames2 = {}, _defineProperty(_classnames2, props.prefixCls + '-button', true), _defineProperty(_classnames2, props.prefixCls + '-button-clear', true), _defineProperty(_classnames2, props.prefixCls + '-button-hidden', !props.showClear), _classnames2)),
- size: 'small',
- type: 'secondary',
- onClick: this.handleClear
- },
- _i18n2['default'][props.locale].clear
- ),
- _react2['default'].createElement(
- _uxcoreButton2['default'],
- {
- size: 'small',
- onClick: this.handleOk
- },
- _i18n2['default'][props.locale].ok
- )
- )
- )
- );
-
- return _react2['default'].createElement(
- 'div',
- null,
- _react2['default'].createElement(
- _uxcoreDropdown2['default'],
- {
- overlay: menu,
- minOverlayWidthMatchTrigger: false,
- visible: this.state.visible,
- onVisibleChange: this.handleVisibleChange,
- trigger: ['click'],
- overlayClassName: (0, _classnames6['default'])((_classnames3 = {}, _defineProperty(_classnames3, props.prefixCls + '-dropdown', true), _defineProperty(_classnames3, props.dropdownClassName, !!props.dropdownClassName), _classnames3))
- },
- _react2['default'].createElement(
- 'span',
- {
- className: (0, _classnames6['default'])((_classnames4 = {}, _defineProperty(_classnames4, props.prefixCls, true), _defineProperty(_classnames4, props.className, !!props.className), _defineProperty(_classnames4, props.prefixCls + '-open', this.state.visible), _defineProperty(_classnames4, props.prefixCls + '-disabled', props.disabled), _classnames4))
- },
- _react2['default'].createElement(
- 'span',
- { className: props.prefixCls + '-selection ' + props.prefixCls + '-selection--multiple' },
- _react2['default'].createElement(
- 'span',
- { className: props.prefixCls + '-selection--multiple--content', title: this.processLabel('title') },
- this.processLabel('content')
- ),
- _react2['default'].createElement('span', { className: props.prefixCls + '-arrow' })
- )
- )
- )
- );
- };
-
- return MultiSelect;
-}(_react.Component);
-
-MultiSelect.displayName = 'MultiSelect';
-MultiSelect.Item = _uxcoreCheckboxGroup2['default'].Item;
-MultiSelect.propTypes = {
- prefixCls: _react.PropTypes.string,
- className: _react.PropTypes.string,
- dropdownClassName: _react.PropTypes.string,
- value: _react.PropTypes.array,
- disabled: _react.PropTypes.bool,
- maxSelect: _react.PropTypes.number,
- placeholder: _react.PropTypes.string,
- titleBreakStr: _react.PropTypes.string,
- optionLabelProp: _react.PropTypes.string,
- showSelectAll: _react.PropTypes.bool,
- showClear: _react.PropTypes.bool,
- onChange: _react.PropTypes.func,
- onSubmit: _react.PropTypes.func,
- locale: _react.PropTypes.string
-};
-MultiSelect.defaultProps = {
- prefixCls: 'kuma-multi-select',
- className: '',
- dropdownClassName: '',
- value: [],
- disabled: false,
- placeholder: '请选择',
- titleBreakStr: ', ',
- optionLabelProp: 'text',
- showSelectAll: true,
- showClear: true,
- onChange: function onChange() {},
- onSubmit: function onSubmit() {},
-
- locale: 'zh-cn'
-};
-exports['default'] = MultiSelect;
-module.exports = exports['default'];
- |
-