Merge remote-tracking branch 'baidu/master'

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)

examples/components/Page/Form.jsx

@@ -4,8 +4,6 @@ export default {
   body: {
     type: 'form',
     mode: 'horizontal',
-    title: '',
-    debug: true,
     api: '/api/mock2/form/saveForm',
     controls: [
       {

scss/components/_table.scss

@@ -795,6 +795,9 @@
   > .#{$ns}Button,
   > .#{$ns}Button--disabled-wrap > .#{$ns}Button {
     margin: px2rem(3px);
+  }
+
+  > .#{$ns}Button--disabled-wrap > .#{$ns}Button {
     padding: 0;
   }
 

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>

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);
@@ -231,7 +244,8 @@ export default class FormTable extends React.Component<TableProps, TableState> {
     const scaffold = this.props.scaffold;
     this.setState({
       editIndex: index,
-      editting: editting || (value && value[index]) || scaffold || {},
+      editting: this.editting =
+        editting || (value && value[index]) || scaffold || {},
       isCreateMode: isCreate,
       columns:
         this.state.isCreateMode === isCreate