amis 1.9.0-beta.12 → 1.9.0-beta.15

package/src/renderers/Form/InputTree.tsx

@@ -122,7 +122,7 @@ export default class TreeControl extends React.Component<TreeProps> {
       onChange && onChange(resetValue ?? '');
     }
     if (action.actionType === 'expand') {
-      this.treeRef.syncUnFolded(this.props, action.openLevel);
+      this.treeRef.syncUnFolded(this.props, action.args.openLevel);
     }
     if (action.actionType === 'collapse') {
       this.treeRef.syncUnFolded(this.props, 0);

package/src/renderers/Form/JSONSchemaEditor.tsx

@@ -0,0 +1,67 @@
+import React from 'react';
+import {FormItem, FormControlProps, FormBaseControl} from './Item';
+import JSONSchemaEditor from '../../components/schema-editor/index';
+
+/**
+ * JSON Schema Editor
+ * 文档：https://baidu.gitee.io/amis/docs/components/form/json-schema-editor
+ */
+export interface JSONSchemaEditorControlSchema extends FormBaseControl {
+  /**
+   * 指定为 JSON Schema Editor
+   */
+  type: 'json-schema-editor';
+
+  /**
+   * 可以理解为类型模板，方便快速定义复杂类型
+   */
+  definitions?: {
+    [propName: string]: {
+      title: string;
+      type:
+        | 'string'
+        | 'number'
+        | 'interger'
+        | 'object'
+        | 'array'
+        | 'boolean'
+        | 'null';
+      [propName: string]: any;
+    };
+  };
+
+  /**
+   * 顶层是否允许修改类型
+   */
+  rootTypeMutable?: boolean;
+
+  /**
+   * 顶层类型信息是否隐藏
+   */
+  showRootInfo?: boolean;
+
+  /**
+   * 禁用类型，默认禁用了 null 类型
+   */
+  disabledTypes?: Array<string>;
+}
+
+export interface JSONSchemaEditorProps
+  extends FormControlProps,
+    Omit<
+      JSONSchemaEditorControlSchema,
+      'type' | 'className' | 'descriptionClassName' | 'inputClassName'
+    > {}
+
+export default class JSONSchemaEditorControl extends React.PureComponent<JSONSchemaEditorProps> {
+  render() {
+    const {...rest} = this.props;
+
+    return <JSONSchemaEditor {...rest} />;
+  }
+}
+
+@FormItem({
+  type: 'json-schema-editor'
+})
+export class JSONSchemaEditorRenderer extends JSONSchemaEditorControl {}

package/src/renderers/Form/ListSelect.tsx

@@ -5,7 +5,7 @@ import {
   Option,
   FormOptionsControl
 } from './Options';
-import {Schema} from '../../types';
+import {Action, Schema} from '../../types';
 import {createObject, isEmpty} from '../../utils/helper';
 import {dataMapping} from '../../utils/tpl-builtin';
 import {SchemaClassName, SchemaCollection} from '../../Schema';
@@ -58,6 +58,14 @@ export default class ListControl extends React.Component<ListProps, any> {
     submitOnDBClick: false
   };
 
+  doAction(action: Action, data: object, throwErrors: boolean) {
+    const {resetValue, onChange} = this.props;
+    const actionType = action?.actionType as string;
+    if (!!~['clear', 'reset'].indexOf(actionType)) {
+      onChange(resetValue ?? '');
+    }
+  }
+
   handleDBClick(option: Option, e: React.MouseEvent<HTMLElement>) {
     this.props.onToggle(option, false, true);
     this.props.onAction(null, {

package/src/renderers/Form/Options.tsx

@@ -471,7 +471,7 @@ export function registerOptionsControl(config: OptionsConfig) {
     doAction(action: Action, data: object, throwErrors: boolean) {
       const {resetValue, onChange} = this.props;
       const actionType = action?.actionType as string;
-
+      debugger;
       if (!!~['clear', 'reset'].indexOf(actionType)) {
         onChange(resetValue ?? '');
       }

package/src/renderers/Form/Select.tsx

@@ -438,6 +438,12 @@ export interface TransferDropDownProps
 }
 
 class TransferDropdownRenderer extends BaseTransferRenderer<TransferDropDownProps> {
+  @autobind
+  renderItem(item: Option): any {
+    const {labelField} = this.props;
+    return `${item.scopeLabel || ''}${item[labelField || 'label']}`;
+  }
+
   render() {
     const {
       className,
@@ -488,6 +494,7 @@ class TransferDropdownRenderer extends BaseTransferRenderer<TransferDropDownProp
           options={options}
           onChange={this.handleChange}
           option2value={this.option2value}
+          itemRender={this.renderItem}
           sortable={sortable}
           searchResultMode={searchResultMode}
           onSearch={searchable ? this.handleSearch : undefined}

package/src/renderers/Form/TabsTransfer.tsx

@@ -249,9 +249,9 @@ export class TabsTransferRenderer extends BaseTabsTransferRenderer<TabsTransferP
   }
 
   // 动作
-  doAction(action: Action) {
+  doAction(action: Action, args: any) {
     const {resetValue, onChange} = this.props;
-    const activeKey = action?.activeKey as number;
+    const activeKey = args?.activeKey as number;
     switch (action.actionType) {
       case 'clear':
         onChange('');

package/src/renderers/Form/TreeSelect.tsx

@@ -94,6 +94,11 @@ export interface TreeSelectControlSchema extends FormOptionsControl {
    * 开启节点路径模式后，节点路径的分隔符
    */
   pathSeparator?: string;
+
+  /**
+   * 是否显示展开线
+   */
+  showOutline?: boolean;
 }
 
 export interface TreeSelectProps extends OptionsControlProps {
@@ -536,7 +541,8 @@ export default class TreeSelectControl extends React.Component<
       translate: __,
       deferLoad,
       expandTreeOptions,
-      selfDisabledAffectChildren
+      selfDisabledAffectChildren,
+      showOutline
     } = this.props;
 
     let filtedOptions =
@@ -568,6 +574,7 @@ export default class TreeSelectControl extends React.Component<
         rootValue={rootValue}
         showIcon={showIcon}
         showRadio={showRadio}
+        showOutline={showOutline}
         cascade={cascade}
         foldedField="collapsed"
         hideRoot

package/src/renderers/Form/wrapControl.tsx

@@ -133,7 +133,8 @@ export function wrapControl<
                 validateApi,
                 minLength,
                 maxLength,
-                validateOnChange
+                validateOnChange,
+                label
               }
             } = this.props;
 
@@ -179,7 +180,8 @@ export function wrapControl<
               validateApi,
               minLength,
               maxLength,
-              validateOnChange
+              validateOnChange,
+              label
             });
 
             // issue 这个逻辑应该在 combo 里面自己实现。
@@ -267,7 +269,10 @@ export function wrapControl<
                   'selectFirst',
                   'autoFill',
                   'clearValueOnHidden',
-                  'validateApi'
+                  'validateApi',
+                  'minLength',
+                  'maxLength',
+                  'label'
                 ],
                 prevProps.$schema,
                 props.$schema
@@ -290,8 +295,9 @@ export function wrapControl<
                 autoFill: props.$schema.autoFill,
                 clearValueOnHidden: props.$schema.clearValueOnHidden,
                 validateApi: props.$schema.validateApi,
-                minLength: props.minLength,
-                maxLength: props.maxLength
+                minLength: props.$schema.minLength,
+                maxLength: props.$schema.maxLength,
+                label: props.$schema.label
               });
             }
 

package/src/renderers/Pagination.tsx

@@ -1,23 +1,20 @@
 import React from 'react';
 import {Renderer, RendererProps} from '../factory';
-import {autobind} from '../utils/helper';
-import {Icon} from '../components/icons';
-import {BaseSchema, SchemaClassName} from '../Schema';
+import {BaseSchema} from '../Schema';
+import {
+  MODE_TYPE,
+  PaginationState as BasicPaginationState,
+  Pagination as BasicPagination
+} from '../components/Pagination';
 
 export interface PaginationSchema extends BaseSchema {
   type: 'pagination';
 
-  className?: SchemaClassName;
-
   /**
-   * 是否显示快速跳转输入框
+   * 通过控制layout属性的顺序，调整分页结构 total,perPage,pager,go
+   * @default 'pager'
    */
-  showPageInput?: boolean;
-
-  /**
-   * 模式，默认显示多个分页数字，如果只想简单显示可以配置成 `simple`。
-   */
-  mode?: 'simple' | 'normal';
+  layout?: string | Array<string>;
 
   /**
    * 最多显示多少个分页按钮。
@@ -25,268 +22,83 @@ export interface PaginationSchema extends BaseSchema {
    * @default 5
    */
   maxButtons?: number;
-}
-
-export interface PaginationProps
-  extends RendererProps,
-    Omit<PaginationSchema, 'type' | 'className'> {
-  activePage: number;
-  lastPage: number;
-  hasNext: boolean;
-  maxButtons: number;
-  onPageChange: (page: number, perPage?: number) => void;
-}
-
-export interface PaginationState {
-  pageNum: string;
-}
-
-export default class Pagination extends React.Component<
-  PaginationProps,
-  PaginationState
-> {
-  static defaultProps = {
-    activePage: 1,
-    lastPage: 1,
-    maxButtons: 5,
-    mode: 'normal',
-    hasNext: false,
-    showPageInput: false
-  };
 
-  state = {
-    pageNum: String(this.props.activePage) || ''
-  };
-
-  componentDidUpdate(prevProps: PaginationProps) {
-    const props = prevProps;
-    if (prevProps.activePage !== props.activePage) {
-      this.setState({
-        pageNum: String(props.activePage) || ''
-      });
-    }
-  }
-
-  renderSimple() {
-    const {activePage, hasNext, onPageChange, classnames: cx} = this.props;
-
-    return (
-      <ul className={cx('Pagination', 'Pagination--sm')}>
-        <li
-          className={cx({
-            'is-disabled': activePage < 2
-          })}
-          onClick={
-            activePage < 2
-              ? e => e.preventDefault()
-              : () => onPageChange(activePage - 1)
-          }
-        >
-          <a>
-            <Icon icon="left-arrow" className="icon" />
-          </a>
-        </li>
-        <li
-          className={cx({
-            'is-disabled': !hasNext
-          })}
-          onClick={
-            !hasNext
-              ? e => e.preventDefault()
-              : () => onPageChange(activePage + 1)
-          }
-        >
-          <a>
-            <Icon icon="right-arrow" className="icon" />
-          </a>
-        </li>
-      </ul>
-    );
-  }
-
-  @autobind
-  handlePageChange(e: React.ChangeEvent<any>) {
-    const {lastPage} = this.props;
-    let value = e.currentTarget.value;
-
-    if (/^\d+$/.test(value) && parseInt(value, 10) > lastPage) {
-      value = String(lastPage);
-    }
+  /**
+   * 模式，默认normal，如果只想简单显示可以配置成 `simple`。
+   * @default 'normal'
+   */
+  mode?: MODE_TYPE;
 
-    this.setState({pageNum: value});
-  }
+  /**
+   * 当前页数
+   */
+  activePage: number;
 
-  renderNormal() {
-    let {
-      activePage,
-      lastPage,
-      maxButtons,
-      onPageChange,
-      classnames: cx,
-      showPageInput,
-      className,
-      translate: __
-    } = this.props;
-    const pageNum = this.state.pageNum;
+  /**
+   * 总条数
+   */
+  total?: number;
 
-    let pageButtons: any = [];
-    let startPage: number;
-    let endPage: number;
+  /**
+   * 最后一页，总页数（如果传入了total，会重新计算lastPage）
+   */
+  lastPage?: number;
 
-    if (activePage < (maxButtons - 1) / 2 + 2) {
-      maxButtons = activePage + (maxButtons - 1) / 2;
-    }
+  /**
+   * 每页显示条数
+   * @default 10
+   */
+  perPage?: number;
 
-    if (lastPage - activePage < (maxButtons - 1) / 2 + 2) {
-      maxButtons = lastPage - activePage + (maxButtons - 1) / 2 + 1;
-    }
+  /**
+   * 是否展示分页切换，也同时受layout控制
+   * @default false
+   */
+  showPerPage?: boolean;
 
-    if (maxButtons && maxButtons < lastPage) {
-      startPage = Math.max(
-        Math.min(
-          activePage - Math.floor(maxButtons / 2),
-          lastPage - maxButtons + 1
-        ),
-        1
-      );
-      endPage = startPage + maxButtons - 1;
-    } else {
-      startPage = 1;
-      endPage = lastPage;
-    }
+  /**
+   * 指定每页可以显示多少条
+   * @default [10, 20, 50, 100]
+   */
+  perPageAvailable?: Array<number>;
 
-    for (let page = startPage; page <= endPage; ++page) {
-      pageButtons.push(
-        <li
-          onClick={() => onPageChange(page)}
-          key={page}
-          className={cx({
-            'is-active': page === activePage
-          })}
-        >
-          <a role="button">{page}</a>
-        </li>
-      );
-    }
+  /**
+   * 是否显示快速跳转输入框
+   * @default false
+   */
+  showPageInput?: boolean;
 
-    if (startPage > 1) {
-      if (startPage > 2) {
-        pageButtons.unshift(
-          <li onClick={() => onPageChange(startPage - 1)} key="prev-ellipsis">
-            <a role="button">...</a>
-          </li>
-        );
-      }
+  /**
+   * 是否禁用
+   * @default false
+   */
+  disabled?: boolean;
 
-      pageButtons.unshift(
-        <li
-          onClick={() => onPageChange(1)}
-          key={1}
-          className={cx({
-            'is-active': 1 === activePage
-          })}
-        >
-          <a role="button">{1}</a>
-        </li>
-      );
-    }
 
-    if (endPage < lastPage) {
-      if (lastPage - endPage > 1) {
-        pageButtons.push(
-          <li
-            className={cx('Pagination-ellipsis')}
-            onClick={() => onPageChange(endPage + 1)}
-            key="next-ellipsis"
-          >
-            <a role="button">
-              <span>...</span>
-            </a>
-          </li>
-        );
-      }
+  hasNext?: boolean;
+}
 
-      pageButtons.push(
-        <li
-          onClick={() => onPageChange(lastPage)}
-          key={lastPage}
-          className={cx({
-            'is-active': lastPage === activePage
-          })}
-        >
-          <a role="button">{lastPage}</a>
-        </li>
-      );
-    }
+export interface PaginationProps
+  extends RendererProps,
+    Omit<PaginationSchema, 'type' | 'className'> {
+}
 
-    pageButtons.unshift(
-      <li
-        className={cx('Pagination-prev', {
-          'is-disabled': activePage === 1
-        })}
-        onClick={
-          activePage === 1
-            ? (e: any) => e.preventDefault()
-            : () => onPageChange(activePage - 1)
-        }
-        key="prev"
-      >
-        <span>
-          <Icon icon="left-arrow" className="icon" />
-        </span>
-      </li>
-    );
+export interface PaginationState extends BasicPaginationState{}
 
-    pageButtons.push(
-      <li
-        className={cx('Pagination-next', {
-          'is-disabled': activePage === lastPage
-        })}
-        onClick={
-          activePage === lastPage
-            ? (e: any) => e.preventDefault()
-            : () => onPageChange(activePage + 1)
-        }
-        key="next"
-      >
-        <span>
-          <Icon icon="right-arrow" className="icon" />
-        </span>
-      </li>
-    );
+export default class Pagination extends React.Component<
+  PaginationProps,
+  PaginationState
+> {
 
+  render() {
     return (
-      <div className={cx('Pagination-wrap', className)}>
-        <ul className={cx('Pagination', 'Pagination--sm')}>{pageButtons}</ul>
-
-        {showPageInput === true || lastPage > 9 ? (
-          <div className={cx('Pagination-inputGroup')} key="toPage">
-            {__('CRUD.paginationGoText')}
-            <input
-              type="text"
-              onChange={this.handlePageChange}
-              onKeyUp={(e: any) =>
-                e.keyCode == 13 &&
-                onPageChange(parseInt(e.currentTarget.value, 10))
-              }
-              value={pageNum}
-            />
-            {__('CRUD.paginationPageText')}
-          </div>
-        ) : null}
-      </div>
+      <BasicPagination {...this.props} />
     );
   }
-
-  render() {
-    const {mode} = this.props;
-
-    return mode === 'simple' ? this.renderSimple() : this.renderNormal();
-  }
 }
 
 @Renderer({
   test: /(^|\/)(?:pagination|pager)$/,
   name: 'pagination'
 })
-export class PaginationRenderer extends Pagination {}
+export class PaginationRenderer extends Pagination { }

package/src/renderers/Table/HeadCellSearchDropdown.tsx

@@ -37,7 +37,6 @@ export class HeadCellSearchDropDown extends React.Component<
 
     this.open = this.open.bind(this);
     this.close = this.close.bind(this);
-    this.close = this.close.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
     this.handleAction = this.handleAction.bind(this);
   }