amis-editor 5.2.0 → 5.2.1-beta.19

package/src/plugin/Form/InputFile.tsx

@@ -1,395 +0,0 @@
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {BasePlugin, BaseEventContext} from '../../plugin';
-import {formItemControl, tipedLabel} from '../../component/control/BaseControl';
-import {ValidatorTag} from '../../component/validator';
-import {getEventControlConfig} from '../../util';
-import {RendererAction, RendererEvent} from '../../event-action';
-
-export class FileControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'input-file';
-  $schema = '/schemas/FileControlSchema.json';
-
-  // 组件名称
-  name = '文件上传';
-  isBaseComponent = true;
-  icon = 'fa fa-upload';
-  description = `可上传多个文件，可配置是否自动上传以及大文件分片上传`;
-  docLink = '/amis/zh-CN/components/form/input-file';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'input-file',
-    label: '文件上传',
-    name: 'file'
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    wrapWithPanel: false,
-    mode: 'horizontal',
-    body: [
-      {
-        ...this.scaffold
-      }
-    ]
-  };
-
-  notRenderFormZone = true;
-
-  // 事件定义
-  events: RendererEvent[] = [
-    {
-      eventName: 'change',
-      eventLabel: '值变化',
-      description: '上传文件值变化时触发（上传失败同样会触发）',
-      dataSchema: [
-        {
-          type: 'object',
-          properties: {
-            'event.data.value': {
-              type: 'object',
-              title: '上传的文件'
-            }
-          }
-        }
-      ]
-    },
-    {
-      eventName: 'remove',
-      eventLabel: '移除文件',
-      description: '移除文件时触发',
-      dataSchema: [
-        {
-          type: 'object',
-          properties: {
-            'event.data.value': {
-              type: 'object',
-              title: '被移除的文件'
-            }
-          }
-        }
-      ]
-    },
-    {
-      eventName: 'success',
-      eventLabel: '上传成功',
-      description: '上传文件成功时触发',
-      dataSchema: [
-        {
-          type: 'object',
-          properties: {
-            'event.data.value': {
-              type: 'object',
-              title: '远程上传请求成功后返回的结果数据'
-            }
-          }
-        }
-      ]
-    },
-    {
-      eventName: 'fail',
-      eventLabel: '上传失败',
-      description: '上传文件失败时触发',
-      dataSchema: [
-        {
-          type: 'object',
-          properties: {
-            'event.data.file': {
-              type: 'object',
-              title: '上传的文件'
-            },
-            'event.data.error': {
-              type: 'object',
-              title: '远程上传请求失败后返回的错误信息'
-            }
-          }
-        }
-      ]
-    }
-  ];
-
-  // 动作定义
-  actions: RendererAction[] = [
-    {
-      actionType: 'clear',
-      actionLabel: '清空数据',
-      description: '清除选择的文件'
-    }
-  ];
-
-  panelJustify = true;
-  panelBodyCreator = (context: BaseEventContext) => {
-    return getSchemaTpl('tabs', [
-      {
-        title: '属性',
-        body: getSchemaTpl('collapseGroup', [
-          {
-            title: '基本',
-            body: [
-              getSchemaTpl('formItemName', {
-                required: true
-              }),
-              getSchemaTpl('label'),
-              {
-                type: 'input-text',
-                name: 'btnLabel',
-                label: '按钮名称',
-                value: '文件上传'
-              },
-              getSchemaTpl('multiple', {
-                replace: true,
-                body: [
-                  {
-                    name: 'maxLength',
-                    label: '最大数量',
-                    type: 'input-number'
-                  }
-                ]
-              }),
-              {
-                type: 'input-group',
-                name: 'maxSize',
-                label: '最大体积',
-                body: [
-                  {
-                    type: 'input-number',
-                    name: 'maxSize'
-                  },
-                  {
-                    type: 'tpl',
-                    addOnclassName: 'border-0 bg-none',
-                    tpl: 'B'
-                  }
-                ]
-              },
-              {
-                label: '提交方式',
-                name: 'submitType',
-                type: 'select',
-                tiled: true,
-                value: 'asUpload',
-                options: [
-                  {
-                    label: '随表单提交',
-                    value: 'asForm'
-                  },
-
-                  {
-                    label: '独立上传',
-                    value: 'asUpload'
-                  }
-                ],
-                pipeIn: (value: any, form: any) => value || 'asUpload',
-                pipeOut: (value: any, form: any) => value || 'asUpload',
-                onChange: (
-                  value: any,
-                  oldValue: boolean,
-                  model: any,
-                  form: any
-                ) => {
-                  if (value === 'asUpload') {
-                    form.setValueByName('asBase64', false);
-                    form.setValueByName('asBlob', false);
-                  } else if (value === 'asForm') {
-                    // 作为表单数据，自动上传开启
-                    form.setValueByName('autoUpload', true);
-                    const formType =
-                      form.getValueByName('formType') || 'asBlob';
-                    form.setValueByName(formType, true);
-                  }
-                }
-              },
-              getSchemaTpl('uploadType', {
-                visibleOn: 'data.submitType === "asUpload" || !data.submitType',
-                pipeIn: (value: any, form: any) => value || 'fileReceptor',
-                pipeOut: (value: any, form: any) => value || 'fileReceptor'
-              }),
-
-              {
-                name: 'formType',
-                type: 'select',
-                tiled: true,
-                visibleOn: 'data.submitType === "asForm"',
-                value: 'asBlob',
-                label: tipedLabel(
-                  '数据格式',
-                  '${formType ? asBase64 ? "小文件时可以使用，默认给 Form 提交的是文件下载地址，设置后给 Form 提交文件内容的 base64 格式字符串。" : "File 控件不接管文件上传，直接由表单的保存接口完成。和 Base64 选项二选一。" : ""}'
-                ),
-                options: [
-                  {
-                    label: 'Base64',
-                    value: 'asBase64'
-                  },
-
-                  {
-                    label: '二进制',
-                    value: 'asBlob'
-                  }
-                ],
-                onChange: (
-                  value: any,
-                  oldValue: boolean,
-                  model: any,
-                  form: any
-                ) => {
-                  form.setValueByName('asBase64', 'asBase64' === value);
-                  form.setValueByName('asBlob', 'asBlob' === value);
-                }
-              },
-
-              getSchemaTpl('bos', {
-                visibleOn:
-                  '(data.submitType === "asUpload" || !data.submitType) && data.uploadType === "bos"'
-              }),
-
-              getSchemaTpl('proxy', {
-                value: false,
-                visibleOn: 'data.submitType === "asUpload" || !data.submitType'
-              }),
-
-              getSchemaTpl('switch', {
-                name: 'autoUpload',
-                label: '自动上传',
-                value: true,
-                visibleOn: 'data.submitType === "asUpload"'
-              }),
-
-              getSchemaTpl('switch', {
-                name: 'useChunk',
-                label: '开启分块',
-                value: false,
-                pipeIn: (value: any, form: any) => !!value, // 兼容auto
-                visibleOn: 'data.submitType == "asUpload"'
-              }),
-
-              {
-                type: 'container',
-                className: 'ae-ExtendMore mb-3',
-                visibleOn:
-                  'data.submitType === "asUpload" && data.useChunk != false',
-                body: [
-                  {
-                    type: 'input-group',
-                    name: 'chunkSize',
-                    label: '分块大小',
-                    body: [
-                      {
-                        type: 'input-number',
-                        name: 'chunkSize'
-                      },
-                      {
-                        type: 'tpl',
-                        addOnclassName: 'border-0 bg-none',
-                        tpl: 'B'
-                      }
-                    ]
-                  },
-                  {
-                    type: 'Container',
-                    visibleOn:
-                      'data.submitType === "asUpload" && data.uploadType == "fileReceptor" && data.useChunk != false',
-                    body: [
-                      getSchemaTpl('apiControl', {
-                        name: 'startChunkApi',
-                        label: tipedLabel(
-                          '分块准备接口',
-                          '用来做分块前的准备工作，一个文件只会调用一次。如果出错了，后续的分块上传就会中断。'
-                        ),
-                        value: '/api/upload/startChunk'
-                      }),
-                      getSchemaTpl('apiControl', {
-                        name: 'chunkApi',
-                        label: tipedLabel(
-                          '分块上传接口',
-                          '用来接收每个分块上传，大文件会根据 chunkSize 分割成多块，然后每块上传都会调用这个接口。'
-                        ),
-                        value: '/api/upload/chunk'
-                      }),
-                      getSchemaTpl('apiControl', {
-                        name: 'finishChunkApi',
-                        label: tipedLabel(
-                          '上传完成接口',
-                          '等所有分块上传完后，将上传文件收集到的 `eTag` 信息合并一起，再次请求后端完成文件上传。'
-                        ),
-                        value: '/api/upload/finishChunk'
-                      })
-                    ]
-                  }
-                ]
-              },
-
-              getSchemaTpl('apiControl', {
-                name: 'receiver',
-                label: tipedLabel(
-                  '文件接收器',
-                  '默认不填写将上传到 bos，可以在系统配置中设置为自己的 bos 地址。'
-                ),
-                value: '/api/upload/file',
-                __isUpload: true,
-                visibleOn:
-                  'data.submitType === "asUpload" && data.uploadType === "fileReceptor" && !data.useChunk'
-              }),
-              getSchemaTpl('fileUrl', {
-                name: 'templateUrl',
-                label: tipedLabel(
-                  '模板链接',
-                  '适用于excel上传等有上传格式要求的场景，为用户提供一个模板下载入口'
-                )
-              }),
-              getSchemaTpl('switch', {
-                name: 'drag',
-                label: '拖拽上传',
-                value: false
-              }),
-              getSchemaTpl('remark'),
-              getSchemaTpl('labelRemark'),
-              getSchemaTpl('description')
-              // getSchemaTpl('autoFill')
-            ]
-          },
-          getSchemaTpl('status', {isFormItem: true}),
-          getSchemaTpl('validation', {tag: ValidatorTag.File})
-        ])
-      },
-      {
-        title: '外观',
-        body: getSchemaTpl('collapseGroup', [
-          getSchemaTpl('style:formItem', {renderer: context.info.renderer}),
-          getSchemaTpl('style:classNames', {
-            schema: [
-              getSchemaTpl('className', {
-                name: 'descriptionClassName',
-                label: '描述'
-              }),
-              getSchemaTpl('className', {
-                name: 'btnClassName',
-                label: '选择按钮'
-              }),
-              getSchemaTpl('className', {
-                name: 'btnUploadClassName',
-                label: '上传按钮'
-              })
-            ]
-          })
-        ])
-      },
-      {
-        title: '事件',
-        className: 'p-none',
-        body: [
-          getSchemaTpl('eventControl', {
-            name: 'onEvent',
-            ...getEventControlConfig(this.manager, context)
-          })
-        ]
-      }
-    ]);
-  };
-}
-
-registerEditorPlugin(FileControlPlugin);

package/src/plugin/Form/InputGroup.tsx

@@ -1,96 +0,0 @@
-import React from 'react';
-import {Button} from 'amis';
-import {getSchemaTpl} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {BasePlugin} from '../../plugin';
-
-export class InputGroupControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'input-group';
-  $schema = '/schemas/InputGroupControlSchema.json';
-
-  // 组件名称
-  name = '输入组合';
-  isBaseComponent = true;
-  icon = 'fa fa-object-group';
-  description = `输入组合，支持多种类型的控件组合`;
-  docLink = '/amis/zh-CN/components/form/input-group';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'input-group',
-    name: 'input-group',
-    label: 'input 组合',
-    body: [
-      {
-        type: 'input-text',
-        inputClassName: 'b-r-none p-r-none',
-        name: 'input-group'
-      },
-      {
-        type: 'submit',
-        label: '提交',
-        level: 'primary'
-      }
-    ]
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    mode: 'horizontal',
-    wrapWithPanel: false,
-    body: [
-      {
-        ...this.scaffold
-      }
-    ]
-  };
-
-  panelTitle = 'Input 组合';
-  panelBody = [
-    [
-      {
-        name: 'body',
-        type: 'combo',
-        // label: '子按钮',
-        multiple: true,
-        addable: false,
-        draggable: true,
-        draggableTip: '可排序、可移除、如要编辑请在预览区选中编辑',
-        editable: false,
-        visibleOn: 'this.body && this.body.length',
-        items: [
-          {
-            type: 'tpl',
-            inline: false,
-            className: 'p-t-xs',
-            tpl:
-              '<%= data.label %><% if (data.icon) { %><i class="<%= data.icon %>"/><% }%>'
-          }
-        ]
-      },
-      {
-        children: (
-          <Button
-            className="m-b"
-            // TODO：需要限制一下 body 的类型，之前是这些 'text', 'url', 'email', 'password', 'select', 'date', 'time', 'date-time', 'date-range', 'formula', 'color', 'city', 'icon', 'plain', 'tpl', 'button', 'submit', 'reset'
-            onClick={() => {
-              // this.manager.showInsertPanel('body')
-              this.manager.showRendererPanel('表单项'); // '请从左侧组件面板中点击添加表单项'
-            }}
-            level="danger"
-            tooltip="插入一个新的元素"
-            size="sm"
-            block
-          >
-            新增元素
-          </Button>
-        )
-      },
-      getSchemaTpl('formItemName', {
-        required: true
-      })
-    ]
-  ];
-}
-
-registerEditorPlugin(InputGroupControlPlugin);