jim chen 8 лет назад
Родитель
Сommit
b4fd0e05c2
1 измененных файлов с 13 добавлено и 6 удалено
  1. 13 6
      src/routes/Forms/TableForm.js

+ 13 - 6
src/routes/Forms/TableForm.js

@@ -1,6 +1,4 @@
 import React, { PureComponent } from 'react';
-import Debounce from 'lodash-decorators/debounce';
-import Bind from 'lodash-decorators/bind';
 import { Table, Button, Input, message, Popconfirm, Divider } from 'antd';
 import styles from './style.less';
 
@@ -10,6 +8,7 @@ export default class TableForm extends PureComponent {
 
     this.state = {
       data: props.value,
+      loading: false,
     };
   }
   componentWillReceiveProps(nextProps) {
@@ -35,9 +34,7 @@ export default class TableForm extends PureComponent {
       }
     });
   }
-  @Bind()
-  @Debounce(400)
-  toggleEditable(e, key) {
+  toggleEditable=(e, key) => {
     e.preventDefault();
     const newData = this.state.data.map(item => ({ ...item }));
     const target = this.getRowByKey(key, newData);
@@ -83,6 +80,9 @@ export default class TableForm extends PureComponent {
   }
   saveRow(e, key) {
     e.persist();
+    this.setState({
+      loading: true,
+    });
     // save field when blur input
     setTimeout(() => {
       if (document.activeElement.tagName === 'INPUT' &&
@@ -102,7 +102,10 @@ export default class TableForm extends PureComponent {
       delete target.isNew;
       this.toggleEditable(e, key);
       this.props.onChange(this.state.data);
-    }, 10);
+      this.setState({
+        loading: false,
+      });
+    }, 500);
   }
   cancel(e, key) {
     this.clickedCancel = true;
@@ -179,6 +182,9 @@ export default class TableForm extends PureComponent {
       title: '操作',
       key: 'action',
       render: (text, record) => {
+        if (!!record.editable && this.state.loading) {
+          return null;
+        }
         if (record.editable) {
           if (record.isNew) {
             return (
@@ -214,6 +220,7 @@ export default class TableForm extends PureComponent {
     return (
       <div>
         <Table
+          loading={this.state.loading}
           columns={columns}
           dataSource={this.state.data}
           pagination={false}