amis 1.9.1-beta.12 → 1.9.1-beta.13

package/src/components/formula/Picker.tsx

@@ -237,13 +237,11 @@ export class FormulaPicker extends React.Component<
     const {translate: __} = this.props;
 
     try {
-      const ast = parse(value, {
+      parse(value, {
         evalMode: this.props.evalMode,
         allowFilter: false
       });
 
-      new Evaluator({}).evalute(ast);
-
       return true;
     } catch (e) {
       if (/\s(\d+:\d+)$/.test(e.message)) {

package/src/components/table/HeadCellFilter.tsx

@@ -180,7 +180,10 @@ export class HeadCellFilter extends React.Component<Props, State> {
     const payload = {[column.key]: selectedKeys};
 
     if (onFilter) {
-      const prevented = await onFilter(payload);
+      const prevented = await onFilter({
+        filterName: column.key,
+        filterValue: selectedKeys?.join(',')
+      });
       if (prevented) {
         return;
       }

package/src/components/table/HeadCellSort.tsx

@@ -51,7 +51,7 @@ export class HeadCellSort extends React.Component<Props, State> {
           }
 
           if (onSort) {
-            const prevented = onSort({
+            const prevented = await onSort({
               orderBy: this.state.orderBy,
               order: this.state.order
             });

package/src/components/table/index.tsx

@@ -10,7 +10,6 @@ import find from 'lodash/find';
 import isEqual from 'lodash/isEqual';
 import filter from 'lodash/filter';
 import intersection from 'lodash/intersection';
-import cloneDeep from 'lodash/cloneDeep';
 import Sortable from 'sortablejs';
 
 import {themeable, ClassNamesFn, ThemeProps} from '../../theme';
@@ -325,12 +324,15 @@ export class Table extends React.PureComponent<TableProps, TableState> {
   constructor(props: TableProps) {
     super(props);
 
-    this.selectedRows = props.rowSelection
-      ? this.getSelectedRows(
-          props.dataSource,
-          props.rowSelection?.selectedRowKeys
-        )
-      : [];
+    if (props.rowSelection) {
+      const selectedResult = this.getSelectedRows(
+        props.dataSource,
+        props.rowSelection?.selectedRowKeys
+      );
+
+      this.selectedRows = selectedResult.selectedRows;
+      this.unSelectedRows = selectedResult.unSelectedRows;
+    }
 
     this.state = {
       selectedRowKeys: props.rowSelection
@@ -361,6 +363,8 @@ export class Table extends React.PureComponent<TableProps, TableState> {
   tdColumns: Array<TdProps>;
   // 表格当前选中行
   selectedRows: Array<any>;
+  // 表格当前未选中行
+  unSelectedRows: Array<any>;
   // 拖拽排序
   sortable: Sortable;
   // 记录点击起始横坐标
@@ -393,6 +397,7 @@ export class Table extends React.PureComponent<TableProps, TableState> {
     selectedRowKeys: Array<string | number>
   ) {
     const selectedRows: Array<any> = [];
+    const unSelectedRows: Array<any> = [];
     dataSource.forEach(data => {
       if (
         find(
@@ -401,10 +406,12 @@ export class Table extends React.PureComponent<TableProps, TableState> {
         )
       ) {
         selectedRows.push(data);
+      } else {
+        unSelectedRows.push(data);
       }
     });
 
-    return selectedRows;
+    return {selectedRows, unSelectedRows};
   }
 
   updateTableBodyFixed() {
@@ -498,10 +505,12 @@ export class Table extends React.PureComponent<TableProps, TableState> {
     // 选择项发生了变化触发
     if (!isEqual(prevState.selectedRowKeys, this.state.selectedRowKeys)) {
       // 更新保存的已选择行数据
-      this.selectedRows = this.getSelectedRows(
+      const selectedResult = this.getSelectedRows(
         this.state.dataSource,
         this.state.selectedRowKeys
       );
+      this.selectedRows = selectedResult.selectedRows;
+      this.unSelectedRows = selectedResult.unSelectedRows;
 
       const {rowSelection} = this.props;
       rowSelection &&
@@ -526,10 +535,12 @@ export class Table extends React.PureComponent<TableProps, TableState> {
         this.setState({
           selectedRowKeys: this.props.rowSelection.selectedRowKeys
         });
-        this.selectedRows = this.getSelectedRows(
+        const selectedResult = this.getSelectedRows(
           this.state.dataSource,
           this.state.selectedRowKeys
         );
+        this.selectedRows = selectedResult.selectedRows;
+        this.unSelectedRows = selectedResult.unSelectedRows;
       }
     }
 
@@ -599,37 +610,6 @@ export class Table extends React.PureComponent<TableProps, TableState> {
     this.destroyDragging();
   }
 
-  exchange(fromIndex: number, toIndex: number, item: any) {
-    const {scroll, headSummary} = this.props;
-    // 如果有头部总结行 fromIndex就会+1
-    if ((!scroll || (scroll && !scroll.y)) && headSummary) {
-      fromIndex = fromIndex - 1;
-    }
-
-    const index = toIndex - fromIndex;
-
-    const levels = item.getAttribute('row-levels');
-    const rowIndex = +item.getAttribute('row-index');
-
-    const dataSource = cloneDeep(this.state.dataSource);
-    const levelsArray = levels ? levels.split(',') : [];
-    const childrenColumnName = this.getChildrenColumnName();
-    let data: Array<any> = dataSource;
-    let i = 0;
-    while (i < levelsArray.length) {
-      data = data[levelsArray[i]][childrenColumnName];
-      i++;
-    }
-
-    if (data && data.length > 0) {
-      const row = cloneDeep(data[rowIndex]);
-      data.splice(rowIndex, 1);
-      data.splice(rowIndex + index, 0, row);
-    }
-
-    return data;
-  }
-
   initDragging() {
     const {classnames: cx, onDrag} = this.props;
 
@@ -666,14 +646,9 @@ export class Table extends React.PureComponent<TableProps, TableState> {
           return;
         }
 
-        const {onDrag} = this.props;
-        if (onDrag) {
-          const data = this.exchange(e.oldIndex, e.newIndex, e.item);
-          const prevented = await onDrag(data);
-          if (prevented) {
-            return;
-          }
-        }
+        const rowLevels = e.item.getAttribute('row-levels');
+
+        onDrag && onDrag(e.oldIndex, e.newIndex, rowLevels ? rowLevels.split(',') : []);
       }
     });
   }
@@ -1037,9 +1012,8 @@ export class Table extends React.PureComponent<TableProps, TableState> {
                             const selectedRowKeys = value ? allRowKeys : [];
                             if (onSelectAll) {
                               const prevented = await onSelectAll(
-                                value,
-                                selectedRowKeys,
                                 selectedRows,
+                                value ? [] : selectedRows,
                                 changeRows
                               );
                               if (prevented) {
@@ -1152,9 +1126,16 @@ export class Table extends React.PureComponent<TableProps, TableState> {
     );
   }
 
-  onRowClick(event: React.ChangeEvent<any>, record?: any, rowIndex?: number) {
+  async onRowClick(event: React.ChangeEvent<any>, record?: any, rowIndex?: number) {
     const {rowSelection, onRow} = this.props;
 
+    if (onRow && onRow.onRowClick) {
+      const prevented = await onRow.onRowClick(event, record, rowIndex);
+      if (prevented) {
+        return;
+      }
+    }
+
     if (rowSelection && rowSelection.type && rowSelection.rowClick) {
       const defaultKey = this.getRowSelectionKeyField();
 
@@ -1165,10 +1146,6 @@ export class Table extends React.PureComponent<TableProps, TableState> {
 
       this.selectedSingleRow(!isSelected, record);
     }
-
-    if (record && onRow) {
-      onRow.onRowClick && onRow.onRowClick(event, record, rowIndex);
-    }
   }
 
   onRowMouseEnter(
@@ -1350,42 +1327,41 @@ export class Table extends React.PureComponent<TableProps, TableState> {
     const defaultKey = this.getRowSelectionKeyField();
     const isRadio = rowSelection && rowSelection.type === 'radio';
 
-    if (onSelect) {
-      const prevented = await onSelect(
-        data,
-        value,
-        this.selectedRows,
-        this.state.selectedRowKeys
-      );
-      if (prevented) {
-        return;
-      }
-    }
-
+    let selectedRowKeys = [];
     if (value) {
       if (isRadio) {
-        this.setState({selectedRowKeys: [data[defaultKey]]});
+        selectedRowKeys = [data[defaultKey]];
       } else {
-        this.setState(prevState => ({
-          selectedRowKeys: [
-            ...prevState.selectedRowKeys,
-            data[defaultKey],
-            ...this.getDataChildrenKeys(data)
-          ].filter((key, i, a) => a.indexOf(key) === i)
-        }));
+        selectedRowKeys = [
+          ...this.state.selectedRowKeys,
+          data[defaultKey],
+          ...this.getDataChildrenKeys(data)
+        ].filter((key, i, a) => a.indexOf(key) === i)
       }
     } else {
       if (!isRadio) {
-        this.setState({
-          selectedRowKeys: this.state.selectedRowKeys.filter(
-            key =>
-              ![data[defaultKey], ...this.getDataChildrenKeys(data)].includes(
-                key
-              )
-          )
-        });
+        selectedRowKeys = this.state.selectedRowKeys.filter(
+          key =>
+            ![data[defaultKey], ...this.getDataChildrenKeys(data)].includes(
+              key
+            )
+        )
+      }
+    }
+
+    if (onSelect) {
+      const selectedResult = this.getSelectedRows(this.state.dataSource, selectedRowKeys);
+      const prevented = await onSelect(
+        selectedResult.selectedRows,
+        selectedRowKeys,
+        selectedResult.unSelectedRows
+      );
+      if (prevented) {
+        return;
       }
     }
+
+    this.setState({selectedRowKeys});
   }
 
   renderRow(data: any, rowIndex: number, levels: Array<number>) {
@@ -1396,6 +1372,7 @@ export class Table extends React.PureComponent<TableProps, TableState> {
       draggable,
       indentSize,
       rowClassName,
+      keyField,
       lineHeight // 是否设置了固定行高
     } = this.props;
 
@@ -1515,10 +1492,11 @@ export class Table extends React.PureComponent<TableProps, TableState> {
       key => key === data[defaultKey]
     );
     const hasChildrenChecked = this.hasCheckedChildrenRows(data);
+    const isRadio = rowSelection && rowSelection.type === 'radio';
 
     return [
       <tr
-        key={rowIndex}
+        key={`${data[keyField || 'key'] || rowIndex}`} // 可能会拖拽排序，就不能用rowIndex作为key了，否则显示会有问题
         row-index={rowIndex}
         row-levels={levels.join(',')}
         className={cx(
@@ -1546,8 +1524,8 @@ export class Table extends React.PureComponent<TableProps, TableState> {
             <CheckBox
               name={'Table-checkbox'}
               type={rowSelection.type || 'checkbox'}
-              partial={hasChildrenChecked && !isChecked}
-              checked={hasChildrenChecked || isChecked}
+              partial={!isRadio && hasChildrenChecked && !isChecked}
+              checked={isRadio ? isChecked : (hasChildrenChecked || isChecked)}
               onChange={(value, shift) => {
                 if (!(rowSelection && rowSelection.rowClick)) {
                   this.selectedSingleRow(value, data);
@@ -1603,9 +1581,7 @@ export class Table extends React.PureComponent<TableProps, TableState> {
             </Cell>
           </tr>
         ) : (
-          this.state.dataSource.map((data, index) => {
-            return this.renderRow(data, index, []);
-          })
+          this.state.dataSource.map((data, index) => this.renderRow(data, index, []))
         )}
       </tbody>
     );

package/src/renderers/Action.tsx

@@ -1,10 +1,15 @@
 import React from 'react';
 import hotkeys from 'hotkeys-js';
+import omit from 'lodash/omit';
+import pick from 'lodash/pick';
 import {Renderer, RendererProps} from '../factory';
 import {filter} from '../utils/tpl';
 import Button from '../components/Button';
-import pick from 'lodash/pick';
-import omit from 'lodash/omit';
+import {ScopedContext} from '../Scoped';
+import {isObject} from '../utils/helper';
+
+import type {IScopedContext} from '../Scoped';
+import type {Action as ICmptAction} from '../types';
 
 export interface ButtonSchema extends BaseSchema {
   /**
@@ -431,7 +436,6 @@ import {generateIcon} from '../utils/icon';
 import {BadgeSchema, withBadge} from '../components/Badge';
 import {normalizeApi, str2AsyncFunction} from '../utils/api';
 import {TooltipWrapper} from '../components/TooltipWrapper';
-import handleAction from '../utils/handleAction';
 
 // 构造一个假的 React 事件避免可能的报错，主要用于快捷键功能
 // 来自 https://stackoverflow.com/questions/27062455/reactjs-can-i-create-my-own-syntheticevent
@@ -851,28 +855,68 @@ export class Action extends React.Component<ActionProps, ActionState> {
 
 export default themeable(Action);
 
+export type ActionRendererProps = RendererProps &
+  Omit<ActionProps, 'onAction' | 'isCurrentUrl' | 'tooltipContainer'> & {
+    onAction: (
+      e: React.MouseEvent<any> | string | void | null,
+      action: object,
+      data: any
+    ) => void;
+    btnDisabled?: boolean;
+  };
+
 @Renderer({
   type: 'action'
 })
 // @ts-ignore 类型没搞定
 @withBadge
-export class ActionRenderer extends React.Component<
-  RendererProps &
-    Omit<ActionProps, 'onAction' | 'isCurrentUrl' | 'tooltipContainer'> & {
-      onAction: (
-        e: React.MouseEvent<any> | void | null,
-        action: object,
-        data: any
-      ) => void;
-      btnDisabled?: boolean;
+export class ActionRenderer extends React.Component<ActionRendererProps> {
+  static contextType = ScopedContext;
+
+  constructor(props: ActionRendererProps, scoped: IScopedContext) {
+    super(props);
+
+    scoped.registerComponent(this);
+  }
+
+  componentWillUnmount() {
+    const scoped = this.context as IScopedContext;
+    scoped.unRegisterComponent(this);
+  }
+
+  /**
+   * 动作处理
+   */
+  doAction(
+    action: ICmptAction,
+    args: {
+      value?: string | {[key: string]: string};
+    }
+  ) {
+    const actionType = action?.actionType;
+
+    if (actionType === 'click') {
+      this.handleAction(actionType, action);
     }
-> {
+  }
+
   @autobind
-  async handleAction(e: React.MouseEvent<any> | void | null, action: any) {
+  async handleAction(
+    e: React.MouseEvent<any> | string | void | null,
+    action: any
+  ) {
     const {env, onAction, data, ignoreConfirm, dispatchEvent} = this.props;
+    let mergedData = data;
+
+    if (action?.actionType === 'click' && isObject(action?.args)) {
+      mergedData = createObject(data, action.args);
+    }
 
     // 触发渲染器事件
-    const rendererEvent = await dispatchEvent(e as React.MouseEvent<any>, data);
+    const rendererEvent = await dispatchEvent(
+      e as React.MouseEvent<any> | string,
+      mergedData
+    );
 
     // 阻止原有动作执行
     if (rendererEvent?.prevented) {
@@ -880,14 +924,14 @@ export class ActionRenderer extends React.Component<
     }
 
     if (!ignoreConfirm && action.confirmText && env.confirm) {
-      let confirmed = await env.confirm(filter(action.confirmText, data));
+      let confirmed = await env.confirm(filter(action.confirmText, mergedData));
       if (confirmed) {
-        await onAction(e, action, data);
+        await onAction(e, action, mergedData);
       } else if (action.countDown) {
         throw new Error('cancel');
       }
     } else {
-      await onAction(e, action, data);
+      await onAction(e, action, mergedData);
     }
   }
 

package/src/renderers/Breadcrumb.tsx

@@ -56,7 +56,7 @@ export type ItemPlace = 'start' | 'middle' | 'end';
  * 文档：https://baidu.gitee.io/amis/docs/components/breadcrumb
  */
 
- export interface BreadcrumbSchema extends BaseSchema {
+export interface BreadcrumbSchema extends BaseSchema {
   /**
    *  指定为面包屑显示控件
    */
@@ -103,18 +103,13 @@ export type ItemPlace = 'start' | 'middle' | 'end';
   tooltipPosition?: TooltipPositionType;
 }
 
-export interface BreadcrumbProps extends RendererProps,
-  Omit<BreadcrumbSchema, 'type' | 'className'> {}
+export interface BreadcrumbProps
+  extends RendererProps,
+    Omit<BreadcrumbSchema, 'type' | 'className'> {}
 
 export class BreadcrumbField extends React.Component<BreadcrumbProps, object> {
   render() {
-    const {
-      items,
-      source,
-      data,
-      env,
-      ...restProps
-    } = this.props;
+    const {items, source, data, env, ...restProps} = this.props;
 
     let crumbItems = items
       ? items
@@ -128,7 +123,7 @@ export class BreadcrumbField extends React.Component<BreadcrumbProps, object> {
         item.label = filter(item.label, data);
       }
       if (item.href) {
-        item.href = filter(item.href, data);
+        item.href = resolveVariableAndFilter(item.href, data, '| raw');
       }
       if (item.dropdown) {
         item.dropdown = item.dropdown.map(dropdownItem => {
@@ -136,7 +131,11 @@ export class BreadcrumbField extends React.Component<BreadcrumbProps, object> {
             dropdownItem.label = filter(dropdownItem.label, data);
           }
           if (dropdownItem.href) {
-            dropdownItem.href = filter(dropdownItem.href, data);
+            dropdownItem.href = resolveVariableAndFilter(
+              dropdownItem.href,
+              data,
+              '| raw'
+            );
           }
           return dropdownItem;
         });

package/src/renderers/Form/Picker.tsx

@@ -247,7 +247,7 @@ export default class PickerControl extends React.PureComponent<
   }
 
   @autobind
-  handleChange(items: Array<any>) {
+  async handleChange(items: Array<any>) {
     const {
       joinValues,
       valueField,
@@ -255,6 +255,8 @@ export default class PickerControl extends React.PureComponent<
       extractValue,
       multiple,
       options,
+      data,
+      dispatchEvent,
       setOptions,
       onChange
     } = this.props;
@@ -286,6 +288,14 @@ export default class PickerControl extends React.PureComponent<
     });
 
     additionalOptions.length && setOptions(options.concat(additionalOptions));
+    const rendererEvent = await dispatchEvent(
+      'change',
+      createObject(data, {value, option: items[0]})
+    );
+    if (rendererEvent?.prevented) {
+      return;
+    }
+
     onChange(value);
   }
 

package/src/renderers/Form/wrapControl.tsx

@@ -327,7 +327,7 @@ export function wrapControl<
             // 此处需要同时考虑 defaultValue 和 value
             if (model && typeof props.value !== 'undefined') {
               // 渲染器中的 value 优先
-              if (props.value !== prevProps.value && props.value !== model.tmpValue) {
+              if (!isEqual(props.value, prevProps.value) && !isEqual(props.value, model.tmpValue)) {
                 // 外部直接传入的 value 无需执行运算器
                 model.changeTmpValue(props.value);
               }
@@ -338,7 +338,7 @@ export function wrapControl<
             ) {
               // 渲染器中的 defaultValue 优先（备注: SchemaRenderer中会将 value 改成 defaultValue）
               if (
-                props.defaultValue !== prevProps.defaultValue ||
+                !isEqual(props.defaultValue, prevProps.defaultValue) ||
                 (!isEqual(props.data, prevProps.data) &&
                   isNeedFormula(props.defaultValue, props.data, prevProps.data))
               ) {
@@ -350,7 +350,7 @@ export function wrapControl<
                   prevProps.defaultValue,
                   prevProps.data
                 );
-                if (curResult !== prevResult && curResult !== model.tmpValue) {
+                if (!isEqual(curResult, prevResult) && !isEqual(curResult, model.tmpValue)) {
                   // 识别上下文变动、自身数值变动、公式运算结果变动
                   model.changeTmpValue(curResult);
                   if (props.onChange) {
@@ -363,29 +363,29 @@ export function wrapControl<
 
               if (
                 valueByName !== undefined &&
-                props.defaultValue === prevProps.defaultValue
+                isEqual(props.defaultValue, prevProps.defaultValue)
               ) {
                 // value 非公式表达式时，name 值优先，若 defaultValue 主动变动时，则使用 defaultValue
                 if (
                   // 然后才是查看关联的 name 属性值是否变化
-                  props.data !== prevProps.data &&
-                  (!model.emitedValue || model.emitedValue === model.tmpValue)
+                  !isEqual(props.data, prevProps.data) &&
+                  (!model.emitedValue || isEqual(model.emitedValue, model.tmpValue))
                 ) {
                   model.changeEmitedValue(undefined);
                   const prevValueByName = getVariable(props.data, model.name);
                   if (
-                    (valueByName !== prevValueByName ||
+                    (!isEqual(valueByName, prevValueByName) ||
                       getVariable(props.data, model.name, false) !==
                         getVariable(prevProps.data, model.name, false)) &&
-                    valueByName !== model.tmpValue
+                     !isEqual(valueByName, model.tmpValue)
                   ) {
                     model.changeTmpValue(valueByName);
                   }
                 }
               } else if (
                 typeof props.defaultValue !== 'undefined' &&
-                props.defaultValue !== prevProps.defaultValue &&
-                props.defaultValue !== model.tmpValue
+                !isEqual(props.defaultValue, prevProps.defaultValue) &&
+                !isEqual(props.defaultValue, model.tmpValue)
               ) {
                 // 组件默认值非公式
                 const curValue = replaceExpression(props.defaultValue);

package/src/renderers/Service.tsx

@@ -653,7 +653,6 @@ export class ServiceRenderer extends Service {
   }
 
   componentWillUnmount() {
-    super.componentWillUnmount();
     const scoped = this.context as IScopedContext;
     scoped.unRegisterComponent(this as ScopedComponentType);
   }

package/src/renderers/Steps.tsx

@@ -6,7 +6,7 @@ import {
   RemoteOptionsProps,
   withRemoteConfig
 } from '../components/WithRemoteConfig';
-import {resolveVariable} from '../utils/tpl-builtin';
+import {resolveVariable, resolveVariableAndFilter} from '../utils/tpl-builtin';
 import {filter} from '../utils/tpl';
 import {getPropValue} from '../utils/helper';
 
@@ -74,12 +74,12 @@ export interface StepsSchema extends BaseSchema {
   /**
    * 标签放置位置
    */
-   labelPlacement?: 'horizontal' | 'vertical';
+  labelPlacement?: 'horizontal' | 'vertical';
 
-   /**
+  /**
    * 点状步骤条
    */
-    progressDot?: boolean;
+  progressDot?: boolean;
 }
 
 export interface StepsProps
@@ -102,7 +102,7 @@ export function StepsCmpt(props: StepsProps) {
   } = props;
 
   const stepsRow =
-    (resolveVariable(source, data) as Array<StepSchema>) ||
+    (resolveVariableAndFilter(source, data, '| raw') as Array<StepSchema>) ||
     config ||
     steps ||
     [];