From d05a03fe004c38b6d43635722b7f62631e2183b4 Mon Sep 17 00:00:00 2001
From: lixiaoyang <lixiaoyang2345@gmail.com>
Date: Mon, 13 Feb 2017 15:48:08 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20Table=E7=9A=84loading=E5=8F=AF=E4=BB=A5?=
 =?UTF-8?q?=E4=BD=BF=E7=94=A8Spin=E7=9A=84=E5=B1=9E=E6=80=A7=20(#4824)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Table的loading可以使用Spin的属性

* Test

* Fix

* test
---
 components/table/Table.tsx               | 16 +++++++++++++---
 components/table/__tests__/Table.test.js | 18 +++++++++++++++++-
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/components/table/Table.tsx b/components/table/Table.tsx
index abf7146801..579f2a61c4 100755
--- a/components/table/Table.tsx
+++ b/components/table/Table.tsx
@@ -13,6 +13,7 @@ import SelectionBox from './SelectionBox';
 import SelectionCheckboxAll from './SelectionCheckboxAll';
 import Column, { ColumnProps } from './Column';
 import ColumnGroup from './ColumnGroup';
+import { SpinProps } from '../spin';
 
 function noop() {
 }
@@ -63,7 +64,7 @@ export interface TableProps<T> {
   expandIconAsCell?: boolean;
   expandIconColumnIndex?: number;
   onChange?: (pagination: PaginationProps | boolean, filters: string[], sorter: Object) => any;
-  loading?: boolean;
+  loading?: boolean | SpinProps ;
   locale?: Object;
   indentSize?: number;
   onRowClick?: (record: T, index: number) => any;
@@ -97,7 +98,10 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
     rowSelection: React.PropTypes.object,
     className: React.PropTypes.string,
     size: React.PropTypes.string,
-    loading: React.PropTypes.bool,
+    loading: React.PropTypes.oneOfType([
+      React.PropTypes.bool,
+      React.PropTypes.object,
+    ]),
     bordered: React.PropTypes.bool,
     onChange: React.PropTypes.func,
     locale: React.PropTypes.object,
@@ -872,10 +876,16 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
     const paginationPatchClass = (this.hasPagination() && data && data.length !== 0)
             ? `${prefixCls}-with-pagination`
             : `${prefixCls}-without-pagination`;
+    let loading = this.props.loading;
+    if (typeof (loading) === 'boolean') {
+      loading = {
+        spinning: loading,
+      };
+    }
     const spinClassName = this.props.loading ? `${paginationPatchClass} ${prefixCls}-spin-holder` : '';
     return (
       <div className={`${className} clearfix`} style={style}>
-        <Spin className={spinClassName} spinning={this.props.loading}>
+        <Spin className={spinClassName} {...loading}>
         {table}
         {this.renderPagination()}
         </Spin>
diff --git a/components/table/__tests__/Table.test.js b/components/table/__tests__/Table.test.js
index 5efeeb19f1..33e5f68582 100644
--- a/components/table/__tests__/Table.test.js
+++ b/components/table/__tests__/Table.test.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { render, shallow } from 'enzyme';
+import { render, shallow, mount } from 'enzyme';
 import { renderToJson } from 'enzyme-to-json';
 import Table from '..';
 
@@ -60,4 +60,20 @@ describe('Table', () => {
 
     expect(wrapper.instance().columns).toBe(newColumns);
   });
+
+  it('loading with Spin', async () => {
+    const loading = {
+      spinning: false,
+      delay: 500,
+    };
+    const wrapper = mount(<Table loading={loading} />);
+    expect(wrapper.find('.ant-spin')).toHaveLength(0);
+
+    loading.spinning = true;
+    wrapper.setProps({ loading });
+    expect(wrapper.find('.ant-spin')).toHaveLength(0);
+
+    await new Promise(resolve => setTimeout(resolve, 500));
+    expect(wrapper.find('.ant-spin')).toHaveLength(1);
+  });
 });