amis-editor 4.1.0-beta.28 → 5.2.0-beta.0

package/src/plugin/Form/InputFile.tsx

@@ -1,228 +0,0 @@
-import {relativeValueRe} from 'amis';
-import {availableLanguages} from 'amis/lib/renderers/Form/Editor';
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicSubRenderInfo,
-  RendererEventContext,
-  SubRendererInfo
-} from '../../plugin';
-
-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
-      }
-    ]
-  };
-
-  panelTitle = '文件域';
-  panelBody = [
-    getSchemaTpl('tabs', [
-      {
-        title: '常规',
-        body: [
-          {
-            type: 'input-text',
-            name: 'btnLabel',
-            label: '上传按钮名称',
-            value: '请选择文件'
-          },
-
-          getSchemaTpl('api', {
-            label: '文件接收器',
-            name: 'receiver',
-            description:
-              '默认不填写将上传到 bos，可以在系统配置中设置为自己的 bos 地址。',
-            value: '/api/upload/file',
-            __isUpload: true
-          }),
-
-          getSchemaTpl('autoFill'),
-
-          {
-            type: 'fieldSet',
-            title: '分块上传相关',
-            collapsed: true,
-            collapsable: true,
-            className: 'fieldset',
-            body: [
-              {
-                type: 'button-group-select',
-                name: 'useChunk',
-                label: '启用分块',
-                size: 'xs',
-                pipeOut: valuePipeOut,
-                value: 'auto',
-                options: [
-                  {
-                    label: '自动',
-                    value: 'auto'
-                  },
-                  {
-                    label: '启用',
-                    value: true
-                  },
-                  {
-                    label: '关闭',
-                    value: false
-                  }
-                ]
-              },
-              {
-                name: 'chunkSize',
-                type: 'input-number',
-                label: '分块大小',
-                visibleOn: 'data.useChunk != false',
-                value: 5 * 1024 * 1024
-              },
-              getSchemaTpl('api', {
-                name: 'startChunkApi',
-                label: 'startChunkApi',
-                value: '/api/upload/startChunk'
-              }),
-              getSchemaTpl('api', {
-                name: 'chunkApi',
-                label: 'chunkApi',
-                value: '/api/upload/chunk'
-              }),
-              getSchemaTpl('api', {
-                name: 'finishChunkApi',
-                label: 'finishChunkApi',
-                value: '/api/upload/finishChunk'
-              })
-            ]
-          },
-          {
-            type: 'input-text',
-            name: 'accept',
-            label: '文件类型',
-            value: '',
-            description:
-              '请填写文件的 <code>mime-types</code>，参考 <code>input[type=file]</code> 的 <code>accept</code> 说明'
-          },
-          getSchemaTpl('switchDefaultValue'),
-          {
-            type: 'input-text',
-            name: 'value',
-            label: '默认值',
-            visibleOn: 'typeof this.value !== "undefined"'
-          },
-          getSchemaTpl('multiple', {
-            pipeIn: defaultValue(false)
-          }),
-          getSchemaTpl('joinValues'),
-          getSchemaTpl('delimiter'),
-          getSchemaTpl('extractValue')
-        ]
-      },
-      {
-        title: '外观',
-        body: [
-          getSchemaTpl('className', {
-            name: 'btnClassName',
-            label: '按钮 CSS 类名',
-            pipeIn: defaultValue('btn-sm btn-info')
-          }),
-          getSchemaTpl('className', {
-            name: 'btnUploadClassName',
-            label: '上传按钮 CSS 类名',
-            pipeIn: defaultValue('btn-sm btn-success')
-          })
-        ]
-      },
-      {
-        title: '其他',
-        body: [
-          {
-            name: 'maxSize',
-            type: 'input-number',
-            label: '文件最大体积',
-            description: '超出大小不允许上传，单位字节'
-          },
-          {
-            name: 'maxLength',
-            type: 'input-number',
-            label: '文件最大数量',
-            description: '超出数量不允许上传',
-            visibleOn: 'data.multiple != false'
-          },
-          {
-            name: 'fileField',
-            type: 'input-text',
-            label: '文件域名称',
-            value: 'file'
-          },
-          {
-            name: 'asBase64',
-            type: 'switch',
-            mode: 'inline',
-            className: 'block',
-            label: '作为 Base64 提交',
-            hiddenOn: 'data.asBlob',
-            description:
-              '小文件时可以使用，默认给 Form 提交的是文件下载地址，设置后给 Form 提交文件内容的 base64 格式字符串。'
-          },
-          {
-            name: 'asBlob',
-            type: 'switch',
-            mode: 'inline',
-            className: 'block',
-            label: '作为二进制提交',
-            hiddenOn: 'data.asBase64',
-            description:
-              'File 控件不接管文件上传，直接由表单的保存接口完成。和 Base64 选项二选一。'
-          },
-          {
-            name: 'autoUpload',
-            type: 'switch',
-            mode: 'inline',
-            className: 'block',
-            label: '是否自动上传',
-            value: true
-          },
-          {
-            name: 'hideUploadButton',
-            type: 'switch',
-            mode: 'inline',
-            className: 'block',
-            label: '是否隐藏上传按钮',
-            value: false
-          },
-          getSchemaTpl('fileUrl', {
-            name: 'templateUrl',
-            label: '模板地址'
-          })
-        ]
-      }
-    ])
-  ];
-}
-
-registerEditorPlugin(FileControlPlugin);

package/src/plugin/Form/InputGroup.tsx

@@ -1,105 +0,0 @@
-import React from 'react';
-import {Button} from 'amis';
-import {availableLanguages} from 'amis/lib/renderers/Form/Editor';
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicSubRenderInfo,
-  RendererEventContext,
-  SubRendererInfo
-} 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);

package/src/plugin/Form/InputImage.tsx

@@ -1,277 +0,0 @@
-import {relativeValueRe} from 'amis';
-import {availableLanguages} from 'amis/lib/renderers/Form/Editor';
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicSubRenderInfo,
-  RendererEventContext,
-  SubRendererInfo
-} from '../../plugin';
-
-export class ImageControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'input-image';
-  $schema = '/schemas/ImageControlSchema.json';
-
-  // 组件名称
-  name = '图片上传';
-  isBaseComponent = true;
-  description = `可以对图片实现裁剪，限制图片的宽高以及大小，支持自动上传及上传多张图片`;
-  docLink = '/amis/zh-CN/components/form/input-image';
-  tags = ['表单项'];
-  icon = 'fa fa-crop';
-  scaffold = {
-    type: 'input-image',
-    label: '图片上传',
-    name: 'image',
-    imageClassName: 'r w-full'
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    mode: 'horizontal',
-    wrapWithPanel: false,
-    body: [
-      {
-        ...this.scaffold
-      }
-    ]
-  };
-
-  panelTitle = '图片上传';
-  panelBody = [
-    getSchemaTpl('switchDefaultValue'),
-
-    {
-      type: 'input-text',
-      name: 'value',
-      label: '默认值',
-      visibleOn: 'typeof this.value !== "undefined"'
-    },
-
-    getSchemaTpl('multiple', {
-      value: false,
-      visibleOn: '!data.crop',
-      description: '开启后，不能同时开启裁剪功能'
-    }),
-    getSchemaTpl('joinValues'),
-    getSchemaTpl('delimiter'),
-    getSchemaTpl('extractValue'),
-    {
-      name: 'maxSize',
-      type: 'input-number',
-      label: '图片最大体积',
-      description: '超出大小不允许上传，单位字节'
-    },
-    {
-      name: 'maxLength',
-      type: 'input-number',
-      label: '图片最大数量',
-      visibleOn: 'data.multiple',
-      description: '超出数量不允许上传'
-    },
-    getSchemaTpl('api', {
-      label: '文件接收接口',
-      name: 'receiver',
-      description: '文件接收接口，默认不填则上传到 hiphoto',
-      value: '/api/upload',
-      __isUpload: true
-    }),
-
-    getSchemaTpl('autoFill'),
-
-    {
-      type: 'input-text',
-      value: '.jpeg, .jpg, .png, .gif',
-      name: 'accept',
-      label: '图片类型',
-      description:
-        '请填入图片的后缀或 <code>MimeType</code>，多个类型用<code>,</code>隔开'
-    },
-
-    {
-      type: 'input-text',
-      name: 'defaultImage',
-      label: '占位图片地址'
-    },
-
-    {
-      type: 'switch',
-      name: 'fixedSize',
-      value: false,
-      label: '是否开启固定尺寸',
-      mode: 'inline',
-      className: 'w-full'
-    },
-
-    {
-      type: 'switch',
-      name: 'hideUploadButton',
-      value: false,
-      label: '隐藏上传按钮',
-      mode: 'inline',
-      className: 'w-full'
-    },
-
-    {
-      type: 'switch',
-      name: 'autoUpload',
-      value: false,
-      label: '自动上传',
-      mode: 'inline',
-      className: 'w-full'
-    },
-
-    {
-      name: 'compress',
-      type: 'switch',
-      label: '开启压缩',
-      value: true,
-      mode: 'inline',
-      className: 'w-full',
-      description: '由 hiphoto 实现，自定义接口将无效'
-    },
-
-    {
-      type: 'combo',
-      name: 'compressOptions',
-      multiLine: true,
-      label: '压缩配置',
-      visibleOn: 'data.compress',
-      items: [
-        {
-          type: 'input-number',
-          label: '最大宽度',
-          name: 'maxWidth'
-        },
-
-        {
-          type: 'input-number',
-          label: '最大高度',
-          name: 'maxHeight'
-        }
-      ]
-    },
-
-    {
-      name: 'showCompressOptions',
-      type: 'switch',
-      label: '是否显示压缩选项',
-      mode: 'inline',
-      className: 'w-full'
-    },
-
-    {
-      name: 'crop',
-      type: 'switch',
-      label: '是否开启裁剪',
-      mode: 'inline',
-      visibleOn: '!data.multiple',
-      className: 'w-full',
-      description: '开启后，不能同时开启多选模式',
-      pipeIn: (value: any) => !!value
-    },
-
-    {
-      name: 'crop.aspectRatio',
-      type: 'input-text',
-      label: '裁剪比率',
-      visibleOn: 'data.crop',
-      pipeOut: valuePipeOut
-    },
-
-    {
-      name: 'crop.rotatable',
-      type: 'switch',
-      label: '裁剪时是否可旋转',
-      visibleOn: 'data.crop',
-      pipeOut: valuePipeOut
-    },
-
-    {
-      name: 'crop.scalable',
-      type: 'switch',
-      label: '裁剪时否可缩放',
-      visibleOn: 'data.crop',
-      pipeOut: valuePipeOut
-    },
-
-    {
-      name: 'crop.viewMode',
-      type: 'select',
-      label: '裁剪区域限制',
-      value: 1,
-      options: [
-        {label: '无限制', value: 0},
-        {label: '绘图区域', value: 1}
-      ],
-      visibleOn: 'data.crop',
-      pipeOut: valuePipeOut
-    },
-
-    {
-      type: 'fieldSet',
-      title: '图片限制',
-      collapsed: true,
-      collapsable: true,
-      className: 'fieldset',
-      body: [
-        {
-          type: 'input-number',
-          name: 'limit.width',
-          label: '限制宽度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.height',
-          label: '限制高度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.maxWidth',
-          label: '限制最大宽度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.maxHeight',
-          label: '限制最大高度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.minWidth',
-          label: '限制最小宽度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.minHeight',
-          label: '限制最小高度'
-        },
-
-        {
-          type: 'input-number',
-          name: 'limit.aspectRatio',
-          label: '限制宽高比率'
-        },
-
-        {
-          type: 'input-text',
-          name: 'limit.限制最小高度',
-          label: '宽高比描述',
-          description: '当宽高比没有满足条件时，此描述将作为提示信息显示'
-        }
-      ]
-    }
-  ];
-}
-
-registerEditorPlugin(ImageControlPlugin);

package/src/plugin/Form/InputKV.tsx

@@ -1,72 +0,0 @@
-/**
- * @file input-kv 组件的素项目部
- */
-import {
-  defaultValue,
-  getSchemaTpl,
-  valuePipeOut
-} from '../../component/schemaTpl';
-import {registerEditorPlugin} from '../../manager';
-import {
-  BasePlugin,
-  BasicSubRenderInfo,
-  RendererEventContext,
-  SubRendererInfo
-} from '../../plugin';
-
-export class KVControlPlugin extends BasePlugin {
-  // 关联渲染器名字
-  rendererName = 'input-kv';
-  $schema = '/schemas/KVControlSchema.json';
-
-  // 组件名称
-  name = 'KV 键值对';
-  isBaseComponent = true;
-  icon = 'fa fa-eyedropper';
-  description = '用于编辑键值对类型的数据';
-  docLink = '/amis/zh-CN/components/form/input-kv';
-  tags = ['表单项'];
-  scaffold = {
-    type: 'input-kv',
-    label: 'KV',
-    name: 'kv'
-  };
-  previewSchema: any = {
-    type: 'form',
-    className: 'text-left',
-    mode: 'horizontal',
-    wrapWithPanel: false,
-    body: [
-      {
-        ...this.scaffold
-      }
-    ]
-  };
-  panelTitle = 'KV 键值对';
-  panelBody = [
-    {
-      type: 'input-text',
-      name: 'valueType',
-      label: '值类型',
-      pipeIn: defaultValue('input-text')
-    },
-    {
-      type: 'input-text',
-      name: 'keyPlaceholder',
-      label: 'key 的提示信息'
-    },
-    {
-      type: 'input-text',
-      name: 'valuePlaceholder',
-      label: 'value 的提示信息'
-    },
-    {
-      type: 'switch',
-      name: 'draggable',
-      label: '是否可排序',
-      pipeIn: defaultValue(true)
-    }
-  ];
-}
-
-registerEditorPlugin(KVControlPlugin);