1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _extends2 = require('babel-runtime/helpers/extends');
|
6 |
|
7 | var _extends3 = _interopRequireDefault(_extends2);
|
8 |
|
9 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
10 |
|
11 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
12 |
|
13 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
14 |
|
15 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
16 |
|
17 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
18 |
|
19 | var _inherits3 = _interopRequireDefault(_inherits2);
|
20 |
|
21 | var _class, _temp, _initialiseProps;
|
22 |
|
23 | var _react = require('react');
|
24 |
|
25 | var _react2 = _interopRequireDefault(_react);
|
26 |
|
27 | var _propTypes = require('prop-types');
|
28 |
|
29 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
30 |
|
31 | var _classnames = require('classnames');
|
32 |
|
33 | var _classnames2 = _interopRequireDefault(_classnames);
|
34 |
|
35 | var _reactLifecyclesCompat = require('react-lifecycles-compat');
|
36 |
|
37 | var _zhCn = require('../locale/zh-cn.js');
|
38 |
|
39 | var _zhCn2 = _interopRequireDefault(_zhCn);
|
40 |
|
41 | var _util = require('../util');
|
42 |
|
43 | var _base = require('./base');
|
44 |
|
45 | var _base2 = _interopRequireDefault(_base);
|
46 |
|
47 | var _list = require('./list');
|
48 |
|
49 | var _list2 = _interopRequireDefault(_list);
|
50 |
|
51 | var _upload = require('./upload');
|
52 |
|
53 | var _upload2 = _interopRequireDefault(_upload);
|
54 |
|
55 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
56 |
|
57 |
|
58 |
|
59 |
|
60 |
|
61 | var Card = (_temp = _class = function (_Base) {
|
62 | (0, _inherits3.default)(Card, _Base);
|
63 |
|
64 | function Card(props) {
|
65 | (0, _classCallCheck3.default)(this, Card);
|
66 |
|
67 | var _this = (0, _possibleConstructorReturn3.default)(this, _Base.call(this, props));
|
68 |
|
69 | _initialiseProps.call(_this);
|
70 |
|
71 | var value = void 0;
|
72 |
|
73 | if ('value' in props) {
|
74 | value = props.value;
|
75 | } else {
|
76 | value = props.defaultValue;
|
77 | }
|
78 |
|
79 | _this.state = {
|
80 | value: !Array.isArray(value) ? [] : value,
|
81 | uploaderRef: _this.uploaderRef
|
82 | };
|
83 | return _this;
|
84 | }
|
85 |
|
86 | Card.prototype.componentDidMount = function componentDidMount() {
|
87 | this.updateUploaderRef(this.uploaderRef);
|
88 | };
|
89 |
|
90 | Card.prototype.componentDidUpdate = function componentDidUpdate() {
|
91 | var uploaderRef = this.state.uploaderRef;
|
92 |
|
93 | if (!uploaderRef && this.uploaderRef) {
|
94 | this.updateUploaderRef(this.uploaderRef);
|
95 | }
|
96 | };
|
97 |
|
98 | Card.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
|
99 | var isUploading = prevState.uploaderRef && prevState.uploaderRef.isUploading();
|
100 | if ('value' in nextProps && nextProps.value !== prevState.value && !isUploading) {
|
101 | return {
|
102 | value: !Array.isArray(nextProps.value) ? [] : [].concat(nextProps.value)
|
103 | };
|
104 | }
|
105 |
|
106 | return null;
|
107 | };
|
108 |
|
109 | Card.prototype.isUploading = function isUploading() {
|
110 | return this.uploaderRef.isUploading();
|
111 | };
|
112 |
|
113 | Card.prototype.saveRef = function saveRef(ref) {
|
114 | this.saveUploaderRef(ref);
|
115 | };
|
116 |
|
117 | Card.prototype.updateUploaderRef = function updateUploaderRef(uploaderRef) {
|
118 | this.setState({ uploaderRef: uploaderRef });
|
119 | };
|
120 |
|
121 | Card.prototype.render = function render() {
|
122 | var _classNames,
|
123 | _this2 = this;
|
124 |
|
125 | var _props = this.props,
|
126 | action = _props.action,
|
127 | disabled = _props.disabled,
|
128 | prefix = _props.prefix,
|
129 | locale = _props.locale,
|
130 | className = _props.className,
|
131 | style = _props.style,
|
132 | limit = _props.limit,
|
133 | onPreview = _props.onPreview,
|
134 | onRemove = _props.onRemove,
|
135 | onCancel = _props.onCancel,
|
136 | timeout = _props.timeout,
|
137 | isPreview = _props.isPreview,
|
138 | renderPreview = _props.renderPreview,
|
139 | itemRender = _props.itemRender,
|
140 | reUpload = _props.reUpload,
|
141 | showDownload = _props.showDownload;
|
142 |
|
143 |
|
144 | var isExceedLimit = this.state.value.length >= limit;
|
145 | var uploadButtonCls = (0, _classnames2.default)((_classNames = {}, _classNames[prefix + 'upload-list-item'] = true, _classNames[prefix + 'hidden'] = isExceedLimit, _classNames));
|
146 |
|
147 | var children = this.props.children || locale.card.addPhoto;
|
148 |
|
149 | var onRemoveFunc = disabled ? _util.func.prevent : onRemove;
|
150 | var othersForList = _util.obj.pickOthers(Card.propTypes, this.props);
|
151 | var othersForUpload = _util.obj.pickOthers(_list2.default.propTypes, othersForList);
|
152 |
|
153 | if (isPreview) {
|
154 | if (typeof renderPreview === 'function') {
|
155 | var _classNames2;
|
156 |
|
157 | var previewCls = (0, _classnames2.default)((_classNames2 = {}, _classNames2[prefix + 'form-preview'] = true, _classNames2[className] = !!className, _classNames2));
|
158 | return _react2.default.createElement(
|
159 | 'div',
|
160 | { style: style, className: previewCls },
|
161 | renderPreview(this.state.value, this.props)
|
162 | );
|
163 | }
|
164 | }
|
165 |
|
166 | return _react2.default.createElement(
|
167 | _list2.default,
|
168 | (0, _extends3.default)({
|
169 | className: className,
|
170 | style: style,
|
171 | listType: 'card',
|
172 | closable: true,
|
173 | locale: locale,
|
174 | value: this.state.value,
|
175 | onRemove: onRemoveFunc,
|
176 | onCancel: onCancel,
|
177 | onPreview: onPreview,
|
178 | itemRender: itemRender,
|
179 | isPreview: isPreview,
|
180 | uploader: this.uploaderRef,
|
181 | reUpload: reUpload,
|
182 | showDownload: showDownload
|
183 | }, othersForList),
|
184 | _react2.default.createElement(
|
185 | _upload2.default,
|
186 | (0, _extends3.default)({}, othersForUpload, {
|
187 | shape: 'card',
|
188 | prefix: prefix,
|
189 | disabled: disabled,
|
190 | action: action,
|
191 | timeout: timeout,
|
192 | isPreview: isPreview,
|
193 | value: this.state.value,
|
194 | onProgress: this.onProgress,
|
195 | onChange: this.onChange,
|
196 | ref: function ref(_ref) {
|
197 | return _this2.saveRef(_ref);
|
198 | },
|
199 | className: uploadButtonCls
|
200 | }),
|
201 | children
|
202 | )
|
203 | );
|
204 | };
|
205 |
|
206 | return Card;
|
207 | }(_base2.default), _class.displayName = 'Card', _class.propTypes = {
|
208 | prefix: _propTypes2.default.string,
|
209 | locale: _propTypes2.default.object,
|
210 | children: _propTypes2.default.object,
|
211 | value: _propTypes2.default.oneOfType([_propTypes2.default.array, _propTypes2.default.object]),
|
212 | defaultValue: _propTypes2.default.oneOfType([_propTypes2.default.array, _propTypes2.default.object]),
|
213 | |
214 |
|
215 |
|
216 | onPreview: _propTypes2.default.func,
|
217 | |
218 |
|
219 |
|
220 | onChange: _propTypes2.default.func,
|
221 | |
222 |
|
223 |
|
224 | onRemove: _propTypes2.default.func,
|
225 | |
226 |
|
227 |
|
228 | onCancel: _propTypes2.default.func,
|
229 | |
230 |
|
231 |
|
232 |
|
233 |
|
234 |
|
235 |
|
236 | itemRender: _propTypes2.default.func,
|
237 | |
238 |
|
239 |
|
240 |
|
241 | reUpload: _propTypes2.default.bool,
|
242 | |
243 |
|
244 |
|
245 |
|
246 | showDownload: _propTypes2.default.bool,
|
247 | |
248 |
|
249 |
|
250 | onProgress: _propTypes2.default.func,
|
251 | isPreview: _propTypes2.default.bool,
|
252 | renderPreview: _propTypes2.default.func
|
253 | }, _class.defaultProps = {
|
254 | prefix: 'next-',
|
255 | locale: _zhCn2.default.Upload,
|
256 | showDownload: true,
|
257 | onChange: _util.func.noop,
|
258 | onPreview: _util.func.noop,
|
259 | onProgress: _util.func.noop
|
260 | }, _initialiseProps = function _initialiseProps() {
|
261 | var _this3 = this;
|
262 |
|
263 | this.onProgress = function (value, targetItem) {
|
264 | _this3.setState({
|
265 | value: value
|
266 | });
|
267 |
|
268 | _this3.props.onProgress(value, targetItem);
|
269 | };
|
270 |
|
271 | this.onChange = function (value, file) {
|
272 | if (!('value' in _this3.props)) {
|
273 | _this3.setState({
|
274 | value: value
|
275 | });
|
276 | }
|
277 | _this3.props.onChange(value, file);
|
278 | };
|
279 | }, _temp);
|
280 | exports.default = (0, _reactLifecyclesCompat.polyfill)(Card);
|
281 | module.exports = exports['default']; |
\ | No newline at end of file |