From fdba902574f884762ce18c89802af233fa8509e4 Mon Sep 17 00:00:00 2001
From: rickcole <rickcole21@outlook.com>
Date: Thu, 20 Aug 2020 20:04:33 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A1=A8=E6=A0=BCactionType:add=EF=BC=8C?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81addApi=EF=BC=9B=E6=97=B6=E9=97=B4=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E9=BB=98=E8=AE=A4=E5=80=BC=E6=98=BE=E7=A4=BA=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/components/form/table.md |  2 ++
 src/components/DatePicker.tsx | 21 +++++++++++++--------
 src/renderers/Form/Table.tsx  | 23 ++++++++++++++++++-----
 3 files changed, 33 insertions(+), 13 deletions(-)

diff --git a/docs/components/form/table.md b/docs/components/form/table.md
index b437d72c..1657a315 100755
--- a/docs/components/form/table.md
+++ b/docs/components/form/table.md
@@ -133,6 +133,8 @@ order: 54
 }
 ```
 
+当表格上配置了`addApi`时，会请求该 `api`，并将返回数据添加到目标表格。
+
 ### 编辑行配置
 
 还可以在列上配置`quickEdit`实现编辑配置，更多配置参考 [快速编辑](../crud#%E5%BF%AB%E9%80%9F%E7%BC%96%E8%BE%91)
diff --git a/src/components/DatePicker.tsx b/src/components/DatePicker.tsx
index 80fea7c2..69747dfe 100644
--- a/src/components/DatePicker.tsx
+++ b/src/components/DatePicker.tsx
@@ -261,6 +261,14 @@ export interface DatePickerState {
   value: moment.Moment | undefined;
 }
 
+function normalizeValue(value: any, format?: string) {
+  if (!value || value === '0') {
+    return undefined;
+  }
+  const v = moment(value, format, true);
+  return v.isValid() ? v : undefined;
+}
+
 export class DatePicker extends React.Component<DateProps, DatePickerState> {
   static defaultProps = {
     viewMode: 'days' as 'years' | 'months' | 'days' | 'time',
@@ -271,9 +279,7 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
   state: DatePickerState = {
     isOpened: false,
     isFocused: false,
-    value: this.props.value
-      ? moment(this.props.value, this.props.format)
-      : undefined
+    value: normalizeValue(this.props.value, this.props.format)
   };
   constructor(props: DateProps) {
     super(props);
@@ -299,9 +305,7 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
   componentWillReceiveProps(nextProps: DateProps) {
     if (this.props.value !== nextProps.value) {
       this.setState({
-        value: nextProps.value
-          ? moment(nextProps.value, nextProps.format)
-          : undefined
+        value: normalizeValue(nextProps.value, nextProps.format)
       });
     }
   }
@@ -505,7 +509,8 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
       shortcuts,
       utc,
       overlayPlacement,
-      locale
+      locale,
+      format
     } = this.props;
 
     const __ = this.props.translate;
@@ -539,7 +544,7 @@ export class DatePicker extends React.Component<DateProps, DatePickerState> {
           </span>
         )}
 
-        {clearable && !disabled && value ? (
+        {clearable && !disabled && normalizeValue(value, format) ? (
           <a className={`${ns}DatePicker-clear`} onClick={this.clearValue}>
             <Icon icon="close" className="icon" />
           </a>
diff --git a/src/renderers/Form/Table.tsx b/src/renderers/Form/Table.tsx
index 87c21f96..29efae25 100644
--- a/src/renderers/Form/Table.tsx
+++ b/src/renderers/Form/Table.tsx
@@ -137,7 +137,7 @@ export default class FormTable extends React.Component<TableProps, TableState> {
     }
   }
 
-  doAction(action: Action, ctx: RendererData, ...rest: Array<any>) {
+  async doAction(action: Action, ctx: RendererData, ...rest: Array<any>) {
     const {
       onAction,
       value,
@@ -145,14 +145,27 @@ export default class FormTable extends React.Component<TableProps, TableState> {
       env,
       onChange,
       editable,
+      addApi,
       translate: __
     } = this.props;
 
     if (action.actionType === 'add') {
       const rows = Array.isArray(value) ? value.concat() : [];
 
-      if (action.payload) {
-        let toAdd = dataMapping(action.payload, ctx);
+      if (addApi || action.payload) {
+        let toAdd = null;
+
+        if (isEffectiveApi(addApi, ctx)) {
+          const payload = await env.fetcher(addApi, ctx);
+          if (payload && !payload.ok) {
+            env.notify('error', payload.msg || __('请求失败'));
+            return;
+          } else if (payload && payload.ok) {
+            toAdd = payload.data;
+          }
+        } else {
+          toAdd = dataMapping(action.payload, ctx);
+        }
 
         toAdd = Array.isArray(toAdd) ? toAdd : [toAdd];
 
@@ -161,7 +174,8 @@ export default class FormTable extends React.Component<TableProps, TableState> {
             rows,
             item => item[valueField as string] == toAdd[valueField as string]
           );
-          if (~idx) {
+          // 应该只有配置了 valueField 的时候，才去删重复项
+          if (~idx && valueField) {
             rows.splice(idx, 1);
           }
           rows.push(toAdd);
@@ -173,7 +187,6 @@ export default class FormTable extends React.Component<TableProps, TableState> {
           this.startEdit(rows.length - 1, rows[rows.length - 1], true);
         }
 
-        // todo 如果配置新增 Api 怎么办？
         return;
       } else {
         return this.addItem(rows.length - 1);