amis 1.5.2 → 1.5.6-beta.0

package/src/renderers/Dialog.tsx

@@ -97,7 +97,7 @@ export type DialogSchemaBase = Omit<DialogSchema, 'type'>;
 export interface DialogProps
   extends RendererProps,
     Omit<DialogSchema, 'className'> {
-  onClose: () => void;
+  onClose: (confirmed?: boolean) => void;
   onConfirm: (
     values: Array<object>,
     action: Action,
@@ -214,12 +214,12 @@ export default class Dialog extends React.Component<DialogProps> {
     return ret;
   }
 
-  handleSelfClose() {
+  handleSelfClose(e?: any, confirmed?: boolean) {
     const {onClose, store} = this.props;
 
     // clear error
     store.updateMessage();
-    onClose();
+    onClose(confirmed);
   }
 
   handleAction(e: React.UIEvent<any>, action: Action, data: object) {
@@ -251,7 +251,7 @@ export default class Dialog extends React.Component<DialogProps> {
       return;
     }
 
-    store.closeDialog();
+    store.closeDialog(true);
   }
 
   handleDialogClose(...args: Array<any>) {
@@ -264,7 +264,7 @@ export default class Dialog extends React.Component<DialogProps> {
       return;
     }
 
-    store.closeDialog();
+    store.closeDialog(args[1]);
   }
 
   handleDrawerConfirm(values: object[], action: Action, ...args: Array<any>) {
@@ -743,7 +743,7 @@ export class DialogRenderer extends Dialog {
         },
         data,
         action
-      ) || this.handleSelfClose();
+      ) || this.handleSelfClose(undefined, true);
     } else if (action.actionType === 'next' || action.actionType === 'prev') {
       store.setCurrentAction(action);
       if (action.type === 'submit') {
@@ -755,7 +755,7 @@ export class DialogRenderer extends Dialog {
           },
           data,
           action
-        ) || this.handleSelfClose();
+        ) || this.handleSelfClose(undefined, true);
       } else {
         onConfirm([data], action, data, []);
       }
@@ -769,7 +769,7 @@ export class DialogRenderer extends Dialog {
       store.setCurrentAction(action);
       action.target && scoped.reload(action.target, data);
       if (action.close || action.type === 'submit') {
-        this.handleSelfClose();
+        this.handleSelfClose(undefined, action.type === 'submit');
         this.closeTarget(action.close);
       }
     } else if (this.tryChildrenToHandle(action, data)) {

package/src/renderers/Drawer.tsx

@@ -304,7 +304,7 @@ export default class Drawer extends React.Component<DrawerProps> {
       return;
     }
 
-    store.closeDialog();
+    store.closeDialog(true);
   }
 
   handleDialogClose(...args: Array<any>) {
@@ -317,7 +317,7 @@ export default class Drawer extends React.Component<DrawerProps> {
       return;
     }
 
-    store.closeDialog();
+    store.closeDialog(args[1]);
   }
 
   handleChildFinished(value: any, action: Action) {

package/src/renderers/Form/Formula.tsx

@@ -65,10 +65,7 @@ export default class FormulaControl extends React.Component<
   componentDidMount() {
     const {formInited, initSet, addHook} = this.props;
 
-    this.unHook =
-      initSet !== false && addHook
-        ? addHook(this.handleFormInit, 'init')
-        : undefined;
+    this.unHook = addHook ? addHook(this.handleFormInit, 'init') : undefined;
 
     // 如果在表单中，还是等初始化数据过来才算
     if (formInited === false) {
@@ -97,7 +94,12 @@ export default class FormulaControl extends React.Component<
   @autobind
   handleFormInit(data: any) {
     this.inited = true;
-    const {name} = this.props;
+    const {name, initSet} = this.props;
+
+    if (initSet === false) {
+      return;
+    }
+
     const result = this.initSet();
 
     if (typeof name === 'string' && typeof result !== 'undefined') {

package/src/renderers/Form/InputDate.tsx

@@ -1,10 +1,12 @@
 import React from 'react';
 import {FormItem, FormControlProps, FormBaseControl} from './Item';
 import cx from 'classnames';
-import {filterDate} from '../../utils/tpl-builtin';
+import {filterDate, isPureVariable, resolveVariableAndFilter} from '../../utils/tpl-builtin';
 import moment from 'moment';
 import 'moment/locale/zh-cn';
 import DatePicker from '../../components/DatePicker';
+import {SchemaObject} from '../../Schema';
+import {createObject, anyChanged} from '../../utils/helper';
 
 export interface InputDateBaseControlSchema extends FormBaseControl {
   /**
@@ -85,6 +87,24 @@ export interface DateControlSchema extends InputDateBaseControlSchema {
    * 限制最大日期
    */
   maxDate?: string;
+
+  /**
+   * 日程
+   */
+  schedules?: Array<{
+    startTime: Date,
+    endTime: Date,
+    content: any,
+    className?: string
+  }> | string;
+  /**
+   * 日程显示颜色自定义
+   */
+  scheduleClassNames?: Array<string>;
+  /**
+   * 日程点击展示
+   */
+  scheduleAction?: SchemaObject;
 }
 
 /**
@@ -267,6 +287,12 @@ export interface DateProps extends FormControlProps {
 interface DateControlState {
   minDate?: moment.Moment;
   maxDate?: moment.Moment;
+  schedules?: Array<{
+    startTime: Date,
+    endTime: Date,
+    content: any,
+    className?: string
+  }>;
 }
 
 export default class DateControl extends React.PureComponent<
@@ -304,9 +330,18 @@ export default class DateControl extends React.PureComponent<
       setPrinstineValue((utc ? moment.utc(date) : date).format(format));
     }
 
+    let schedulesData = props.schedules;
+    if (typeof schedulesData === 'string') {
+      const resolved = resolveVariableAndFilter(schedulesData, data, '| raw');
+      if (Array.isArray(resolved)) {
+        schedulesData = resolved;
+      }
+    }
+
     this.state = {
       minDate: minDate ? filterDate(minDate, data, format) : undefined,
-      maxDate: maxDate ? filterDate(maxDate, data, format) : undefined
+      maxDate: maxDate ? filterDate(maxDate, data, format) : undefined,
+      schedules: schedulesData
     };
   }
 
@@ -334,6 +369,47 @@ export default class DateControl extends React.PureComponent<
           : undefined
       });
     }
+
+    if (anyChanged(['schedules', 'data'], prevProps, props)
+      && (typeof props.schedules === 'string' && isPureVariable(props.schedules))
+    ) {
+      const schedulesData = resolveVariableAndFilter(props.schedules, props.data, '| raw');
+      const preSchedulesData = resolveVariableAndFilter(prevProps.schedules, prevProps.data, '| raw');
+      if (Array.isArray(schedulesData) && preSchedulesData !== schedulesData) {
+        this.setState({
+          schedules: schedulesData
+        })
+      }
+    }
+  }
+
+  // 日程点击事件
+  onScheduleClick(scheduleData: any) {
+    const {scheduleAction, onAction, data, translate: __} = this.props;
+    const defaultscheduleAction = {
+      actionType: 'dialog',
+      dialog: {
+        title: __('Schedule'),
+        actions: [],
+        body: {
+          type: 'table',
+          columns: [
+            {
+              name: 'time',
+              label: __('Time')
+            },
+            {
+              name: 'content',
+              label: __('Content')
+            }
+          ],
+          data: '${scheduleData}'
+        }
+      }
+    };
+
+    onAction && onAction(null, scheduleAction || defaultscheduleAction, createObject(data, scheduleData));
+
   }
 
   render() {
@@ -348,6 +424,8 @@ export default class DateControl extends React.PureComponent<
       format,
       timeFormat,
       valueFormat,
+      largeMode,
+      render,
       ...rest
     } = this.props;
 
@@ -363,6 +441,9 @@ export default class DateControl extends React.PureComponent<
           format={valueFormat || format}
           {...this.state}
           classnames={cx}
+          schedules={this.state.schedules}
+          largeMode={largeMode}
+          onScheduleClick={this.onScheduleClick.bind(this)}
         />
       </div>
     );

package/src/renderers/Form/InputFile.tsx

@@ -790,7 +790,7 @@ export default class FileControl extends React.Component<FileProps, FileState> {
       onProgress
     )
       .then(ret => {
-        if (ret.status || !ret.data) {
+        if ((ret.status && (ret as any).status !== '0') || !ret.data) {
           throw new Error(ret.msg || __('File.errorRetry'));
         }
 
@@ -1185,6 +1185,7 @@ export default class FileControl extends React.Component<FileProps, FileState> {
       multiple,
       autoUpload,
       description,
+      descriptionClassName,
       hideUploadButton,
       className,
       btnClassName,
@@ -1224,7 +1225,7 @@ export default class FileControl extends React.Component<FileProps, FileState> {
             <Icon icon="download" className="icon" />
             <span>{__('File.downloadTpl')}</span>
           </a>
-          ) : null}
+        ) : null}
 
         <DropZone
           disabled={disabled}
@@ -1277,7 +1278,10 @@ export default class FileControl extends React.Component<FileProps, FileState> {
 
                   {description
                     ? render('desc', description!, {
-                        className: cx('FileControl-description')
+                        className: cx(
+                          'FileControl-description',
+                          descriptionClassName
+                        )
                       })
                     : null}
 

package/src/renderers/Form/InputImage.tsx

@@ -1035,7 +1035,7 @@ export default class ImageControl extends React.Component<
     const __ = this.props.translate;
     this._send(file, this.props.receiver as string, {}, onProgress)
       .then((ret: Payload) => {
-        if (ret.status) {
+        if (ret.status && (ret as any).status !== '0') {
           throw new Error(ret.msg || __('File.errorRetry'));
         }
 

package/src/renderers/Form/Item.tsx

@@ -436,12 +436,12 @@ export class FormItemWrap extends React.Component<FormItemProps> {
   }
 
   @autobind
-  handleDialogClose() {
+  handleDialogClose(confirmed = false) {
     const {formItem: model} = this.props;
     if (!model) {
       return;
     }
-    model.closeDialog();
+    model.closeDialog(confirmed);
   }
 
   renderControl(): JSX.Element | null {

package/src/renderers/Form/index.tsx

@@ -866,6 +866,18 @@ export default class Form extends React.Component<FormProps, object> {
 
     store.updateData(values);
 
+    store.items.forEach(formItem => {
+      const updatedValue = getVariable(values, formItem.name, false);
+
+      if (updatedValue !== undefined) {
+        // 更新验证状态但保留错误信息
+        formItem.reset(true);
+        // 这里需要更新value，否则提交时不会使用新的字段值校验
+        formItem.changeTmpValue(updatedValue);
+        formItem.validateOnChange && formItem.validate(values);
+      }
+    });
+
     (formLazyChange === false ? this.emitChange : this.lazyEmitChange)(submit);
   }
 
@@ -1155,9 +1167,9 @@ export default class Form extends React.Component<FormProps, object> {
     store.closeDialog(true);
   }
 
-  handleDialogClose() {
+  handleDialogClose(confirmed = false) {
     const {store} = this.props;
-    store.closeDialog(false);
+    store.closeDialog(confirmed);
   }
 
   handleDrawerConfirm(

package/src/renderers/Form/wrapControl.tsx

@@ -129,7 +129,8 @@ export function wrapControl<
                 clearValueOnHidden,
                 validateApi,
                 minLength,
-                maxLength
+                maxLength,
+                validateOnChange
               }
             } = this.props;
 
@@ -174,7 +175,8 @@ export function wrapControl<
               clearValueOnHidden,
               validateApi,
               minLength,
-              maxLength
+              maxLength,
+              validateOnChange
             });
 
             // issue 这个逻辑应该在 combo 里面自己实现。
@@ -465,6 +467,7 @@ export function wrapControl<
             }
 
             this.model.changeTmpValue(value);
+
             if (changeImmediately || conrolChangeImmediately || !formInited) {
               this.emitChange(submitOnChange);
             } else {

package/src/renderers/Page.tsx

@@ -95,7 +95,7 @@ export interface PageSchema extends BaseSchema {
    */
   asideMinWidth?: number;
 
-   /**
+  /**
    * 边栏最小宽度
    */
   asideMaxWidth?: number;
@@ -471,12 +471,12 @@ export default class Page extends React.Component<PageProps> {
       return;
     }
 
-    store.closeDialog();
+    store.closeDialog(true);
   }
 
-  handleDialogClose() {
+  handleDialogClose(confirmed = false) {
     const {store} = this.props;
-    store.closeDialog();
+    store.closeDialog(confirmed);
   }
 
   handleDrawerConfirm(values: object[], action: Action, ...args: Array<any>) {
@@ -734,11 +734,13 @@ export default class Page extends React.Component<PageProps> {
         style={styleVar}
       >
         {hasAside ? (
-          <div className={cx(
-            `Page-aside`,
-            asideResizor ? 'relative' : 'Page-aside--withWidth',
-            asideClassName
-          )}>
+          <div
+            className={cx(
+              `Page-aside`,
+              asideResizor ? 'relative' : 'Page-aside--withWidth',
+              asideClassName
+            )}
+          >
             {render('aside', aside || '', {
               ...subProps,
               ...(typeof aside === 'string'
@@ -754,7 +756,6 @@ export default class Page extends React.Component<PageProps> {
                 className={cx(`Page-asideResizor`)}
               ></div>
             ) : null}
-            
           </div>
         ) : null}
 

package/src/renderers/Status.tsx

@@ -92,7 +92,9 @@ export class StatusField extends React.Component<StatusProps, object> {
     } = this.props;
     let value = getPropValue(this.props);
     let viewValue: React.ReactNode = (
-      <span className="text-muted">{placeholder}</span>
+      <span className="text-muted" key="status-value">
+        {placeholder}
+      </span>
     );
     let wrapClassName: string = '';
 

package/src/renderers/Wizard.tsx

@@ -9,7 +9,8 @@ import {
   until,
   isVisible,
   getScrollParent,
-  autobind
+  autobind,
+  SkipOperation
 } from '../utils/helper';
 import {isApiOutdated, isEffectiveApi} from '../utils/api';
 import {IFormStore} from '../store/form';
@@ -546,8 +547,16 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
         .then(async () => {
           this.form && this.form.isValidated() && this.form.validate(true);
 
-          if (action.feedback && isVisible(action.feedback, store.data)) {
-            await this.openFeedback(action.feedback, store.data);
+          const feedback = action.feedback;
+          if (feedback && isVisible(feedback, store.data)) {
+            const confirmed = await this.openFeedback(feedback, store.data);
+
+            // 如果 feedback 配置了，取消就跳过原有逻辑。
+            if (feedback.skipRestOnCancel && !confirmed) {
+              throw new SkipOperation();
+            } else if (feedback.skipRestOnConfirm && confirmed) {
+              throw new SkipOperation();
+            }
           }
 
           const reidrect =
@@ -556,7 +565,11 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
 
           action.reload && this.reloadTarget(action.reload, store.data);
         })
-        .catch(() => {});
+        .catch(reason => {
+          if (reason instanceof SkipOperation) {
+            return;
+          }
+        });
     } else if (action.actionType === 'reload') {
       action.target && this.reloadTarget(action.target, data);
     } else if (onAction) {
@@ -667,14 +680,29 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
               }
             }
           })
-          .then((value: any) =>
+          .then(async (value: any) => {
+            const feedback = action.feedback;
+            if (feedback && isVisible(feedback, value)) {
+              const confirmed = await this.openFeedback(feedback, value);
+
+              // 如果 feedback 配置了，取消就跳过原有逻辑。
+              if (feedback.skipRestOnCancel && !confirmed) {
+                throw new SkipOperation();
+              } else if (feedback.skipRestOnConfirm && confirmed) {
+                throw new SkipOperation();
+              }
+            }
+
             this.gotoStep(
               value && typeof value.step === 'number'
                 ? value.step
                 : this.state.currentStep + 1
-            )
-          )
-          .catch(() => {
+            );
+          })
+          .catch(reason => {
+            if (reason instanceof SkipOperation) {
+              return;
+            }
             // do nothing
           });
       } else {
@@ -715,7 +743,19 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
               );
             }
           })
-          .then(value => {
+          .then(async value => {
+            const feedback = action.feedback;
+            if (feedback && isVisible(feedback, value)) {
+              const confirmed = await this.openFeedback(feedback, value);
+
+              // 如果 feedback 配置了，取消就跳过原有逻辑。
+              if (feedback.skipRestOnCancel && !confirmed) {
+                throw new SkipOperation();
+              } else if (feedback.skipRestOnConfirm && confirmed) {
+                throw new SkipOperation();
+              }
+            }
+
             this.setState({completeStep: steps.length});
             store.updateData({
               ...store.data,
@@ -771,13 +811,13 @@ export default class Wizard extends React.Component<WizardProps, WizardState> {
       store.updateData(values[0]);
     }
 
-    store.closeDialog();
+    store.closeDialog(true);
   }
 
   @autobind
-  handleDialogClose() {
+  handleDialogClose(confirmed = false) {
     const {store} = this.props;
-    store.closeDialog();
+    store.closeDialog(confirmed);
   }
 
   renderSteps() {

package/src/store/formItem.ts

@@ -14,6 +14,7 @@ import {str2rules, validate as doValidate} from '../utils/validations';
 import {Api, Payload, fetchOptions} from '../types';
 import {ComboStore, IComboStore, IUniqueGroup} from './combo';
 import {evalExpression} from '../utils/tpl';
+import {isEffectiveApi} from '../utils/api';
 import findIndex from 'lodash/findIndex';
 import {
   isArrayChildrenModified,
@@ -88,7 +89,8 @@ export const FormItemStore = StoreNode.named('FormItemStore')
     dialogSchema: types.frozen(),
     dialogOpen: false,
     dialogData: types.frozen(),
-    resetValue: types.optional(types.frozen(), '')
+    resetValue: types.optional(types.frozen(), ''),
+    validateOnChange: false
   })
   .views(self => {
     function getForm(): any {
@@ -233,7 +235,8 @@ export const FormItemStore = StoreNode.named('FormItemStore')
       clearValueOnHidden,
       validateApi,
       maxLength,
-      minLength
+      minLength,
+      validateOnChange
     }: {
       required?: boolean;
       unique?: boolean;
@@ -254,6 +257,7 @@ export const FormItemStore = StoreNode.named('FormItemStore')
       validateApi?: boolean;
       minLength?: number;
       maxLength?: number;
+      validateOnChange?: boolean;
     }) {
       if (typeof rules === 'string') {
         rules = str2rules(rules);
@@ -279,6 +283,8 @@ export const FormItemStore = StoreNode.named('FormItemStore')
       typeof clearValueOnHidden !== 'undefined' &&
         (self.clearValueOnHidden = !!clearValueOnHidden);
       typeof validateApi !== 'undefined' && (self.validateApi = validateApi);
+      typeof validateOnChange !== 'undefined' &&
+        (self.validateOnChange = !!validateOnChange);
 
       rules = {
         ...rules,
@@ -315,7 +321,7 @@ export const FormItemStore = StoreNode.named('FormItemStore')
     let validateCancel: Function | null = null;
     const validate: (data: Object, hook?: any) => Promise<boolean> = flow(
       function* validate(data: Object, hook?: any) {
-        if (self.validating && !self.validateApi) {
+        if (self.validating && !isEffectiveApi(self.validateApi, data)) {
           return self.valid;
         }
 
@@ -329,7 +335,7 @@ export const FormItemStore = StoreNode.named('FormItemStore')
           doValidate(self.tmpValue, data, self.rules, self.messages, self.__)
         );
 
-        if (!self.errors.length && self.validateApi) {
+        if (!self.errors.length && isEffectiveApi(self.validateApi, data)) {
           if (validateCancel) {
             validateCancel();
             validateCancel = null;
@@ -1029,7 +1035,7 @@ export const FormItemStore = StoreNode.named('FormItemStore')
       subStore = store;
     }
 
-    function reset() {
+    function reset(keepErrors: boolean = false) {
       self.validated = false;
 
       if (subStore && subStore.storeType === 'ComboStore') {
@@ -1037,7 +1043,7 @@ export const FormItemStore = StoreNode.named('FormItemStore')
         combo.forms.forEach(form => form.reset());
       }
 
-      clearError();
+      !keepErrors && clearError();
     }
 
     function openDialog(

package/src/utils/helper.ts

@@ -1592,3 +1592,37 @@ export function JSONTraverse(
     }
   });
 }
+
+
+export function convertDateArrayToDate(
+  value: number[],
+  types: string[],
+  date: moment.Moment
+): moment.Moment | null {
+  if (value.length === 0) return date
+  for (let i = 0; i < types.length; i++) {
+    const type = types[i];
+    // @ts-ignore
+    date[type](value[i]);
+  }
+  return date;
+}
+
+export function convertDateToObject(value: moment.Moment) {
+  if (value) {
+    return {
+      year: value.year(),
+      month: parseInt(value.format('MM'), 10),
+      day: parseInt(value.format('DD'), 10)
+    };
+  }
+  return null;
+}
+
+export function getRange(min: number, max: number, step: number = 1) {
+  const arr = [];
+  for (let i = min; i <= max; i += step) {
+      arr.push(i);
+  }
+  return arr;
+};