amis-editor 4.2.0-beta.0 → 5.2.0-beta.0

package/src/plugin/Form/Formula.tsx

@@ -1,79 +0,0 @@
-import {defaultValue} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {BasePlugin} from '../../plugin';
-
-export class FormulaControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'formula';
-  $schema = '/schemas/FormulaControlSchema.json';
-
-  // 组件名称
-  name = '公式';
-  isBaseComponent = true;
-  icon = 'fa fa-calculator';
-  description = `通过公式计算指定的变量值，并将其结果作用到指定的变量中`;
-  docLink = '/amis/zh-CN/components/form/formula';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'formula',
-    name: 'formula'
-  };
-  previewSchema: any = {
-    type: 'tpl',
-    tpl: '计算公式'
-  };
-
-  panelTitle = '公式';
-  panelBody = [
-    {
-      label: '字段名',
-      name: 'name',
-      type: 'input-text',
-      description: '公式计算结果会作用到此字段名对应的变量中。'
-    },
-    {
-      type: 'input-text',
-      name: 'value',
-      label: '默认值'
-    },
-    {
-      type: 'input-text',
-      name: 'formula',
-      label: '公式',
-      description:
-        '支持 JS 表达式，如： <code>data.var_a + 2</code>，即当表单项 <code>var_a</code> 变化的时候，会自动给当前表单项设置为 <code>var_a + 2</code> 的值。若设置为字符串，则需要加引号'
-    },
-    {
-      type: 'input-text',
-      name: 'condition',
-      label: '作用条件',
-      description:
-        '支持如：<code>\\${xxx}</code>或者<code>data.xxx == "a"</code> 表达式来配置作用条件，当满足该作用条件时，会将计算结果设置到目标变量上。'
-    },
-    {
-      name: 'initSet',
-      type: 'switch',
-      label: '是否初始应用',
-      pipeIn: defaultValue(true),
-      description: '是否初始化的时候运行公式结果，并设置到目标变量上。',
-      mode: 'inline',
-      className: 'block'
-    },
-    {
-      name: 'autoSet',
-      type: 'switch',
-      label: '是否自动应用',
-      pipeIn: defaultValue(true),
-      mode: 'inline',
-      className: 'block',
-      description:
-        '是否自动计算公式结果，有变化时自动设置到目标变量上。<br />关闭后，通过按钮也能触发运算。'
-    }
-  ];
-
-  renderRenderer(props: any) {
-    return this.renderPlaceholder('功能组件（公式）', props.key);
-  }
-}
-
-registerEditorPlugin(FormulaControlPlugin);

package/src/plugin/Form/Group.tsx

@@ -1,295 +0,0 @@
-import {Button} from 'amis';
-import React from 'react';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  ContextMenuEventContext,
-  ContextMenuItem,
-  RegionConfig
-} from '../../plugin';
-import {defaultValue, getSchemaTpl} from '../../component/schemaTpl';
-import {JSONPipeIn, JSONUpdate, makeHorizontalDeeper} from '../../util';
-
-export class GroupControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'group';
-  $schema = '/schemas/GroupControlSchema.json';
-  disabledRendererPlugin = true; // 组件面板不显示
-
-  // 组件名称
-  name = '表单组';
-  isBaseComponent = true;
-  icon = 'fa fa-id-card-o';
-  description = '水平展示多个表单项';
-  docLink = '/amis/zh-CN/components/form/group';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'group',
-    body: [
-      {
-        type: 'input-text',
-        label: '文本',
-        name: 'var1'
-      },
-
-      {
-        type: 'input-text',
-        label: '文本',
-        name: 'var2'
-      }
-    ],
-    label: false
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    wrapWithPanel: false,
-    mode: 'horizontal',
-    body: [
-      {
-        ...this.scaffold,
-        mode: 'normal'
-      }
-    ]
-  };
-
-  // 容器配置
-  regions: Array<RegionConfig> = [
-    {
-      key: 'body',
-      label: '子表单',
-      renderMethod: 'renderInput',
-      preferTag: '表单项',
-      wrapperResolve: (dom: HTMLElement) => dom
-    }
-  ];
-
-  panelTitle = '表单组';
-  panelBody = [
-    getSchemaTpl('tabs', [
-      {
-        title: '常规',
-        body: [
-          getSchemaTpl('label'),
-
-          getSchemaTpl('description', {
-            visible: 'this.label'
-          }),
-
-          {
-            children: (
-              <Button
-                className="m-b"
-                onClick={() => {
-                  // this.manager.showInsertPanel('body')
-                  this.manager.showRendererPanel(
-                    '表单项',
-                    '请从左侧组件面板中点击添加表单项'
-                  );
-                }}
-                level="danger"
-                tooltip="插入一个新的元素"
-                size="sm"
-                block
-              >
-                新增元素
-              </Button>
-            )
-          },
-
-          getSchemaTpl('remark'),
-          getSchemaTpl('labelRemark')
-        ]
-      },
-
-      {
-        title: '外观',
-        body: [
-          getSchemaTpl('formItemMode'),
-          getSchemaTpl('horizontalMode'),
-          getSchemaTpl('horizontal', {
-            visibleOn:
-              '(data.$$formMode == "horizontal" || data.mode == "horizontal") && data.label !== false && data.horizontal',
-            pipeIn: (value: any, data: any) => {
-              value =
-                value ||
-                (data.formHorizontal &&
-                  makeHorizontalDeeper(data.formHorizontal, data.body.length));
-
-              return {
-                leftRate:
-                  value && typeof value.left === 'number'
-                    ? value.left
-                    : value &&
-                      /\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(value.left)
-                    ? parseInt(RegExp.$1, 10)
-                    : 2,
-                leftFixed: (value && value.leftFixed) || ''
-              };
-            }
-          }),
-
-          getSchemaTpl('subFormItemMode'),
-          getSchemaTpl('subFormHorizontalMode'),
-          getSchemaTpl('subFormHorizontal'),
-
-          {
-            name: 'body',
-            type: 'combo',
-            label: '列宽度配置',
-            multiple: true,
-            removable: false,
-            addable: false,
-            multiLine: true,
-            visibleOn: 'data.$$formMode != "inline"',
-            items: [
-              {
-                type: 'button-group-select',
-                name: 'columnRatio',
-                label: '宽度设置',
-                tiled: true,
-                pipeIn: (value: any, data: any) => {
-                  if (typeof value === 'number') {
-                    return 'custom';
-                  } else if (
-                    data.columnClassName &&
-                    /\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(
-                      data.columnClassName as string
-                    )
-                  ) {
-                    return 'custom';
-                  }
-                  return value || '';
-                },
-                pipeOut: (value: any) => (value === 'custom' ? 2 : value),
-                options: [
-                  {
-                    value: '',
-                    label: '适配宽度'
-                  },
-
-                  {
-                    value: 'auto',
-                    label: '适配内容'
-                  },
-
-                  {
-                    value: 'custom',
-                    label: '自定义'
-                  }
-                ]
-              },
-              {
-                label: '宽度占比',
-                type: 'input-range',
-                name: 'columnRatio',
-                visibleOn:
-                  'typeof this.columnRatio === "number" || this.columnClassName && /\\bcol\\-(?:xs|sm|md|lg)\\-(\\d+)\\b/.test(this.columnClassName)',
-                pipeIn: (value: any, data: any) => {
-                  if (typeof value === 'number') {
-                    return value;
-                  }
-
-                  if (
-                    !data.columnClassName ||
-                    !/\bcol\-(?:xs|sm|md|lg)\-(\d+)\b/.test(
-                      data.columnClassName as string
-                    )
-                  ) {
-                    return 2;
-                  }
-
-                  return parseInt(RegExp.$1, 10) || 2;
-                },
-                min: 1,
-                max: 12,
-                step: 1
-              }
-            ]
-          },
-
-          {
-            type: 'button-group-select',
-            name: 'gap',
-            label: '间隔大小',
-            pipeIn: defaultValue(''),
-            size: 'sm',
-            tiled: true,
-            clearable: true,
-            options: [
-              {
-                value: 'xs',
-                label: '极小'
-              },
-
-              {
-                value: 'sm',
-                label: '小'
-              },
-
-              {
-                value: 'md',
-                label: '中'
-              },
-
-              {
-                value: 'lg',
-                label: '大'
-              }
-            ]
-          },
-
-          getSchemaTpl('className'),
-
-          {
-            name: 'body',
-            type: 'combo',
-            label: '列 CSS 类名配置',
-            multiple: true,
-            removable: false,
-            addable: false,
-            items: [
-              {
-                type: 'input-text',
-                name: 'columnClassName'
-              }
-            ]
-          }
-        ]
-      },
-
-      {
-        title: '显隐',
-        body: [getSchemaTpl('ref'), getSchemaTpl('visible')]
-      }
-    ])
-  ];
-
-  buildEditorContextMenu(
-    {id, schema, region, selections, info}: ContextMenuEventContext,
-    menus: Array<ContextMenuItem>
-  ) {
-    if (
-      selections.length ||
-      info.plugin !== this ||
-      !Array.isArray(schema.body) ||
-      schema.body.length < 2
-    ) {
-      return;
-    }
-
-    menus.push({
-      label: '变成多行',
-      onSelect: () => {
-        const store = this.manager.store;
-        let rootSchema = store.schema;
-
-        rootSchema = JSONUpdate(rootSchema, id, JSONPipeIn(schema.body), true);
-
-        store.traceableSetSchema(rootSchema);
-      }
-    });
-  }
-}
-
-registerEditorPlugin(GroupControlPlugin);

package/src/plugin/Form/Hidden.tsx

@@ -1,44 +0,0 @@
-import React from 'react';
-import {registerEditorPlugin} from '../../manager';
-import {BasePlugin} from '../../plugin';
-
-export class HiddenControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'hidden';
-  $schema = '/schemas/HiddenControlSchema.json';
-
-  // 组件名称
-  name = '隐藏域';
-  isBaseComponent = true;
-  icon = 'fa fa-eye-slash';
-  description = `隐藏表单项`;
-  docLink = '/amis/zh-CN/components/form/hidden';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'hidden',
-    name: 'var1'
-  };
-  previewSchema: any = {
-    type: 'tpl',
-    tpl: '隐藏域'
-  };
-
-  panelTitle = '隐藏域';
-  panelBody = [
-    {
-      type: 'input-text',
-      name: 'value',
-      label: '默认值'
-    }
-  ];
-
-  renderRenderer(props: any) {
-    return (
-      <div key={props.key} className="wrapper-sm b-a b-light m-b-sm">
-        <span className="text-muted">功能组件（隐藏字段）</span>
-      </div>
-    );
-  }
-}
-
-registerEditorPlugin(HiddenControlPlugin);

package/src/plugin/Form/InputArray.tsx

@@ -1,228 +0,0 @@
-import {Button} from 'amis';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BaseEventContext,
-  BasePlugin,
-  BasicSubRenderInfo,
-  BasicToolbarItem,
-  ContextMenuEventContext,
-  ContextMenuItem,
-  RendererEventContext,
-  SubRendererInfo
-} from '../../plugin';
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import React from 'react';
-import {diff, JSONPipeOut} from '../../util';
-
-export class ArrayControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'input-array';
-  $schema = '/schemas/ArrayControlSchema.json';
-  disabledRendererPlugin = true;
-
-  // 组件名称
-  name = '数组输入框';
-  isBaseComponent = true;
-  icon = 'fa fa-bars';
-  description =
-    'Array 数组输入框，可自定义成员输入形式。其实是 Combo 的 flat 值打平的一种用法，可直接用 combo 代替。';
-  docLink = '/amis/zh-CN/components/form/input-array';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'input-array',
-    label: '数组输入框',
-    name: 'array',
-    items: {
-      type: 'input-text',
-      placeholder: '请输入'
-    }
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    wrapWithPanel: false,
-    mode: 'horizontal',
-    body: [
-      {
-        ...this.scaffold,
-        value: ['row1', ''],
-        draggable: true
-      }
-    ]
-  };
-
-  panelTitle = '数组框';
-  panelBodyCreator = (context: BaseEventContext) => {
-    return [
-      getSchemaTpl('switchDefaultValue'),
-
-      {
-        type: 'textarea',
-        name: 'value',
-        label: '默认值',
-        visibleOn: 'typeof this.value !== "undefined"',
-        pipeOut: valuePipeOut
-      },
-
-      {
-        children: (
-          <Button
-            size="sm"
-            level="danger"
-            className="m-b"
-            block
-            onClick={this.editDetail.bind(this, context.id)}
-          >
-            配置子表单项
-          </Button>
-        )
-      },
-
-      {
-        label: '是否可新增',
-        type: 'switch',
-        name: 'addable',
-        mode: 'inline',
-        className: 'w-full',
-        pipeIn: defaultValue(true)
-      },
-
-      {
-        label: '新增按钮文字',
-        name: 'addButtonText',
-        type: 'input-text',
-        visibleOn: 'data.addable',
-        pipeIn: defaultValue('新增')
-      },
-
-      {
-        type: 'textarea',
-        name: 'scaffold',
-        label: '新增初始值',
-        visibleOn: 'this.addable !== false',
-        pipeOut: valuePipeOut,
-        pipeIn: defaultValue('')
-      },
-
-      {
-        label: '是否可删除',
-        type: 'switch',
-        name: 'removable',
-        mode: 'inline',
-        className: 'w-full',
-        pipeIn: defaultValue(true)
-      },
-
-      getSchemaTpl('api', {
-        name: 'deleteApi',
-        label: '删除前的请求',
-        visibleOn: 'data.removable'
-      }),
-
-      {
-        label: '删除确认提示',
-        name: 'deleteConfirmText',
-        type: 'input-text',
-        visibleOn: 'data.deleteApi',
-        pipeIn: defaultValue('确认要删除')
-      },
-
-      {
-        name: 'draggable',
-        label: '启用拖拽排序',
-        type: 'switch',
-        mode: 'inline',
-        className: 'w-full'
-      },
-
-      {
-        name: 'draggableTip',
-        visibleOn: 'data.draggable',
-        type: 'input-text',
-        label: '可拖拽排序提示文字',
-        pipeIn: defaultValue('可通过拖动每行中的【交换】按钮进行顺序调整')
-      },
-
-      {
-        name: 'addButtonText',
-        type: 'input-text',
-        label: '新增按钮文字',
-        pipeIn: defaultValue('新增')
-      },
-
-      getSchemaTpl('minLength'),
-      getSchemaTpl('maxLength')
-    ];
-  };
-
-  filterProps(props: any) {
-    props = JSONPipeOut(props);
-
-    // 至少显示一个成员，否则啥都不显示。
-    if (!props.value) {
-      props.value = [''];
-    }
-
-    return props;
-  }
-
-  buildEditorToolbar(
-    {id, info}: BaseEventContext,
-    toolbars: Array<BasicToolbarItem>
-  ) {
-    if (info.renderer.name === 'input-array') {
-      toolbars.push({
-        icon: 'fa fa-expand',
-        order: 100,
-        tooltip: '配置子表单项',
-        onClick: this.editDetail.bind(this, id)
-      });
-    }
-  }
-
-  buildEditorContextMenu(
-    {id, schema, region, info}: ContextMenuEventContext,
-    menus: Array<ContextMenuItem>
-  ) {
-    if (info.renderer.name === 'input-array') {
-      menus.push('|', {
-        label: '配置成员渲染器',
-        onSelect: this.editDetail.bind(this, id)
-      });
-    }
-  }
-
-  editDetail(id: string) {
-    const manager = this.manager;
-    const store = manager.store;
-    const node = store.getNodeById(id);
-    const value = store.getValueOf(id);
-
-    node &&
-      value &&
-      this.manager.openSubEditor({
-        title: '配置子表单项',
-        value: value.items,
-        slot: {
-          type: 'form',
-          mode: 'normal',
-          body: '$$',
-          wrapWithPanel: false,
-          className: 'wrapper'
-        },
-        onChange: newValue => {
-          newValue = {
-            ...value,
-            items: newValue
-          };
-          manager.panelChangeValue(newValue, diff(value, newValue));
-        }
-      });
-  }
-}
-
-registerEditorPlugin(ArrayControlPlugin);