1 | import { isVNode as _isVNode, createVNode as _createVNode } from "vue";
|
2 |
|
3 | function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
|
4 |
|
5 | function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
6 |
|
7 | function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
8 |
|
9 | function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
10 |
|
11 | function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
12 |
|
13 | function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
|
14 |
|
15 | function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
16 |
|
17 | function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
18 |
|
19 | function _extends() { _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; }; return _extends.apply(this, arguments); }
|
20 |
|
21 | function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
22 |
|
23 | function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
24 |
|
25 | var __rest = this && this.__rest || function (s, e) {
|
26 | var t = {};
|
27 |
|
28 | for (var p in s) {
|
29 | if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
30 | }
|
31 |
|
32 | if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
33 | if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
34 | }
|
35 | return t;
|
36 | };
|
37 |
|
38 | import { provide, inject, defineComponent } from 'vue';
|
39 | import omit from 'omit.js';
|
40 | import PropTypes, { withUndefined } from '../_util/vue-types';
|
41 | import classNames from '../_util/classNames';
|
42 | import { defaultConfigProvider } from '../config-provider';
|
43 | import Spin from '../spin';
|
44 | import Pagination, { PaginationConfig } from '../pagination';
|
45 | import { Row } from '../grid';
|
46 | import Item from './Item';
|
47 | import { getComponent, getSlot } from '../_util/props-util';
|
48 | import initDefaultProps from '../_util/props-util/initDefaultProps';
|
49 | import { cloneElement } from '../_util/vnode';
|
50 | import { tuple } from '../_util/type';
|
51 |
|
52 | function _isSlot(s) {
|
53 | return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s);
|
54 | }
|
55 |
|
56 | export { ListItemProps, ListItemMetaProps, ListItemMeta } from './Item';
|
57 | export var ColumnCount = ['', 1, 2, 3, 4, 6, 8, 12, 24];
|
58 | export var ColumnType = ['gutter', 'column', 'xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
|
59 | export var ListGridType = {
|
60 | gutter: PropTypes.number,
|
61 | column: PropTypes.oneOf(ColumnCount),
|
62 | xs: PropTypes.oneOf(ColumnCount),
|
63 | sm: PropTypes.oneOf(ColumnCount),
|
64 | md: PropTypes.oneOf(ColumnCount),
|
65 | lg: PropTypes.oneOf(ColumnCount),
|
66 | xl: PropTypes.oneOf(ColumnCount),
|
67 | xxl: PropTypes.oneOf(ColumnCount)
|
68 | };
|
69 | export var ListSize = tuple('small', 'default', 'large');
|
70 | var paginationProps = PaginationConfig();
|
71 | export var ListProps = function ListProps() {
|
72 | return {
|
73 | bordered: PropTypes.looseBool,
|
74 | dataSource: PropTypes.array,
|
75 | extra: PropTypes.any,
|
76 | grid: PropTypes.shape(ListGridType).loose,
|
77 | itemLayout: PropTypes.string,
|
78 | loading: withUndefined(PropTypes.oneOfType([PropTypes.looseBool, PropTypes.object])),
|
79 | loadMore: PropTypes.any,
|
80 | pagination: withUndefined(PropTypes.oneOfType([PropTypes.shape(paginationProps).loose, PropTypes.looseBool])),
|
81 | prefixCls: PropTypes.string,
|
82 | rowKey: PropTypes.any,
|
83 | renderItem: PropTypes.any,
|
84 | size: PropTypes.oneOf(ListSize),
|
85 | split: PropTypes.looseBool,
|
86 | header: PropTypes.any,
|
87 | footer: PropTypes.any,
|
88 | locale: PropTypes.object
|
89 | };
|
90 | };
|
91 | var List = defineComponent({
|
92 | name: 'AList',
|
93 | inheritAttrs: false,
|
94 | Item: Item,
|
95 | props: initDefaultProps(ListProps(), {
|
96 | dataSource: [],
|
97 | bordered: false,
|
98 | split: true,
|
99 | loading: false,
|
100 | pagination: false
|
101 | }),
|
102 | setup: function setup() {
|
103 | return {
|
104 | keys: [],
|
105 | defaultPaginationProps: {},
|
106 | onPaginationChange: null,
|
107 | onPaginationShowSizeChange: null,
|
108 | configProvider: inject('configProvider', defaultConfigProvider)
|
109 | };
|
110 | },
|
111 | data: function data() {
|
112 | var pagination = this.$props.pagination;
|
113 | var paginationObj = pagination && _typeof(pagination) === 'object' ? pagination : {};
|
114 | return {
|
115 | paginationCurrent: paginationObj.defaultCurrent || 1,
|
116 | paginationSize: paginationObj.defaultPageSize || 10
|
117 | };
|
118 | },
|
119 | created: function created() {
|
120 | var _this = this;
|
121 |
|
122 | provide('listContext', this);
|
123 | this.defaultPaginationProps = {
|
124 | current: 1,
|
125 | pageSize: 10,
|
126 | onChange: function onChange(page, pageSize) {
|
127 | var pagination = _this.pagination;
|
128 | _this.paginationCurrent = page;
|
129 |
|
130 | if (pagination && pagination.onChange) {
|
131 | pagination.onChange(page, pageSize);
|
132 | }
|
133 | },
|
134 | total: 0
|
135 | };
|
136 | this.onPaginationChange = this.triggerPaginationEvent('onChange');
|
137 | this.onPaginationShowSizeChange = this.triggerPaginationEvent('onShowSizeChange');
|
138 | },
|
139 | methods: {
|
140 | triggerPaginationEvent: function triggerPaginationEvent(eventName) {
|
141 | var _this2 = this;
|
142 |
|
143 | return function (page, pageSize) {
|
144 | var pagination = _this2.$props.pagination;
|
145 | _this2.paginationCurrent = page;
|
146 | _this2.paginationSize = pageSize;
|
147 |
|
148 | if (pagination && pagination[eventName]) {
|
149 | pagination[eventName](page, pageSize);
|
150 | }
|
151 | };
|
152 | },
|
153 | innerRenderItem: function innerRenderItem(item, index) {
|
154 | var renderItem = this.$slots.renderItem,
|
155 | rowKey = this.rowKey;
|
156 | var renderer = this.renderItem || renderItem;
|
157 | if (!renderer) return null;
|
158 | var key;
|
159 |
|
160 | if (typeof rowKey === 'function') {
|
161 | key = rowKey(item);
|
162 | } else if (typeof rowKey === 'string') {
|
163 | key = item[rowKey];
|
164 | } else {
|
165 | key = item.key;
|
166 | }
|
167 |
|
168 | if (!key) {
|
169 | key = "list-item-".concat(index);
|
170 | }
|
171 |
|
172 | this.keys[index] = key;
|
173 | return renderer({
|
174 | item: item,
|
175 | index: index
|
176 | });
|
177 | },
|
178 | isSomethingAfterLastItem: function isSomethingAfterLastItem() {
|
179 | var pagination = this.pagination;
|
180 | var loadMore = getComponent(this, 'loadMore');
|
181 | var footer = getComponent(this, 'footer');
|
182 | return !!(loadMore || pagination || footer);
|
183 | },
|
184 | renderEmpty: function renderEmpty(prefixCls, _renderEmpty) {
|
185 | var locale = this.locale;
|
186 | return _createVNode("div", {
|
187 | "class": "".concat(prefixCls, "-empty-text")
|
188 | }, [locale && locale.emptyText || _renderEmpty('List')]);
|
189 | }
|
190 | },
|
191 | render: function render() {
|
192 | var _classNames,
|
193 | _this3 = this;
|
194 |
|
195 | var customizePrefixCls = this.prefixCls,
|
196 | bordered = this.bordered,
|
197 | split = this.split,
|
198 | itemLayout = this.itemLayout,
|
199 | pagination = this.pagination,
|
200 | grid = this.grid,
|
201 | _this$dataSource = this.dataSource,
|
202 | dataSource = _this$dataSource === void 0 ? [] : _this$dataSource,
|
203 | size = this.size,
|
204 | loading = this.loading,
|
205 | paginationCurrent = this.paginationCurrent,
|
206 | paginationSize = this.paginationSize,
|
207 | $attrs = this.$attrs;
|
208 | var getPrefixCls = this.configProvider.getPrefixCls;
|
209 | var prefixCls = getPrefixCls('list', customizePrefixCls);
|
210 |
|
211 | var className = $attrs.class,
|
212 | restAttrs = __rest($attrs, ["class"]);
|
213 |
|
214 | var loadMore = getComponent(this, 'loadMore');
|
215 | var footer = getComponent(this, 'footer');
|
216 | var header = getComponent(this, 'header');
|
217 | var children = getSlot(this);
|
218 | var loadingProp = loading;
|
219 |
|
220 | if (typeof loadingProp === 'boolean') {
|
221 | loadingProp = {
|
222 | spinning: loadingProp
|
223 | };
|
224 | }
|
225 |
|
226 | var isLoading = loadingProp && loadingProp.spinning;
|
227 |
|
228 |
|
229 | var sizeCls = '';
|
230 |
|
231 | switch (size) {
|
232 | case 'large':
|
233 | sizeCls = 'lg';
|
234 | break;
|
235 |
|
236 | case 'small':
|
237 | sizeCls = 'sm';
|
238 | break;
|
239 |
|
240 | default:
|
241 | break;
|
242 | }
|
243 |
|
244 | var classString = classNames(prefixCls, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-vertical"), itemLayout === 'vertical'), _defineProperty(_classNames, "".concat(prefixCls, "-").concat(sizeCls), sizeCls), _defineProperty(_classNames, "".concat(prefixCls, "-split"), split), _defineProperty(_classNames, "".concat(prefixCls, "-bordered"), bordered), _defineProperty(_classNames, "".concat(prefixCls, "-loading"), isLoading), _defineProperty(_classNames, "".concat(prefixCls, "-grid"), grid), _defineProperty(_classNames, "".concat(prefixCls, "-something-after-last-item"), this.isSomethingAfterLastItem()), _classNames), className);
|
245 |
|
246 | var paginationProps = _extends(_extends(_extends({}, this.defaultPaginationProps), {
|
247 | total: dataSource.length,
|
248 | current: paginationCurrent,
|
249 | pageSize: paginationSize
|
250 | }), pagination || {});
|
251 |
|
252 | classString;
|
253 | var largestPage = Math.ceil(paginationProps.total / paginationProps.pageSize);
|
254 |
|
255 | if (paginationProps.current > largestPage) {
|
256 | paginationProps.current = largestPage;
|
257 | }
|
258 |
|
259 | var cls = paginationProps.class,
|
260 | style = paginationProps.style,
|
261 | restProps = __rest(paginationProps, ["class", "style"]);
|
262 |
|
263 | var paginationContent = pagination ? _createVNode("div", {
|
264 | "class": "".concat(prefixCls, "-pagination")
|
265 | }, [_createVNode(Pagination, _extends(_extends({}, omit(restProps, ['onChange'])), {
|
266 | class: cls,
|
267 | style: style,
|
268 | onChange: this.onPaginationChange,
|
269 | onShowSizeChange: this.onPaginationShowSizeChange
|
270 | }), null)]) : null;
|
271 |
|
272 | var splitDataSource = _toConsumableArray(dataSource);
|
273 |
|
274 | if (pagination) {
|
275 | if (dataSource.length > (paginationProps.current - 1) * paginationProps.pageSize) {
|
276 | splitDataSource = _toConsumableArray(dataSource).splice((paginationProps.current - 1) * paginationProps.pageSize, paginationProps.pageSize);
|
277 | }
|
278 | }
|
279 |
|
280 | var childrenContent;
|
281 | childrenContent = isLoading && _createVNode("div", {
|
282 | "style": {
|
283 | minHeight: 53
|
284 | }
|
285 | }, null);
|
286 |
|
287 | if (splitDataSource.length > 0) {
|
288 | var items = splitDataSource.map(function (item, index) {
|
289 | return _this3.innerRenderItem(item, index);
|
290 | });
|
291 | var childrenList = items.map(function (child, index) {
|
292 | return cloneElement(child, {
|
293 | key: _this3.keys[index]
|
294 | });
|
295 | });
|
296 | childrenContent = grid ? _createVNode(Row, {
|
297 | "gutter": grid.gutter
|
298 | }, _isSlot(childrenList) ? childrenList : {
|
299 | default: function _default() {
|
300 | return [childrenList];
|
301 | }
|
302 | }) : _createVNode("ul", {
|
303 | "class": "".concat(prefixCls, "-items")
|
304 | }, _isSlot(childrenList) ? childrenList : {
|
305 | default: function _default() {
|
306 | return [childrenList];
|
307 | }
|
308 | });
|
309 | } else if (!children.length && !isLoading) {
|
310 | var renderEmpty = this.configProvider.renderEmpty;
|
311 | childrenContent = this.renderEmpty(prefixCls, renderEmpty);
|
312 | }
|
313 |
|
314 | var paginationPosition = paginationProps.position || 'bottom';
|
315 | return _createVNode("div", _objectSpread({
|
316 | "class": classString
|
317 | }, restAttrs), [(paginationPosition === 'top' || paginationPosition === 'both') && paginationContent, header && _createVNode("div", {
|
318 | "class": "".concat(prefixCls, "-header")
|
319 | }, _isSlot(header) ? header : {
|
320 | default: function _default() {
|
321 | return [header];
|
322 | }
|
323 | }), _createVNode(Spin, loadingProp, {
|
324 | default: function _default() {
|
325 | return [childrenContent, children];
|
326 | }
|
327 | }), footer && _createVNode("div", {
|
328 | "class": "".concat(prefixCls, "-footer")
|
329 | }, _isSlot(footer) ? footer : {
|
330 | default: function _default() {
|
331 | return [footer];
|
332 | }
|
333 | }), loadMore || (paginationPosition === 'bottom' || paginationPosition === 'both') && paginationContent]);
|
334 | }
|
335 | });
|
336 |
|
337 |
|
338 | List.install = function (app) {
|
339 | app.component(List.name, List);
|
340 | app.component(List.Item.name, List.Item);
|
341 | app.component(List.Item.Meta.displayName, List.Item.Meta);
|
342 | return app;
|
343 | };
|
344 |
|
345 | export default List; |
\ | No newline at end of file |