@ywfe/materials-design/lowcode/yw-upload/meta.ts

YwDesign for lowcode

import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';
import { IPublicTypeSnippetMore } from '../_base';

const YwUploadMeta: IPublicTypeComponentMetadata = {
  componentName: 'YwUpload',
  title: 'YwUpload',
  group: '基础组件',
  docUrl: '',
  category: '表单',
  screenshot: 'https://yw-fed-static.oss-cn-hangzhou.aliyuncs.com/lowcode/upload',
  devMode: 'proCode',
  npm: {
    package: '@ywfe/materials-design',
    version: '0.0.1-beta.6',
    exportName: 'YwUpload',
    main: 'src/index.tsx',
    destructuring: true,
    subName: '',
  },
  configure: {
    props: [
      {
        title: {
          label: '上传类型',
          tip: 'uploadType | 上传类型',
        },
        name: 'uploadType',
        isRequired: false,
        supportVariable: false,
        setter: {
          componentName: 'SelectSetter',
          props: {
            options: [
              {
                label: 'uploadPicture',
                value: 'uploadPicture',
              },
              {
                label: 'thumbnail',
                value: 'thumbnail',
              },
              {
                label: 'uploadFile',
                value: 'uploadFile',
              },
            ],
          },
          initialValue: 'uploadPicture',
        },
      },
      {
        title: {
          label: '文件最大值',
          tip: 'maxSize ｜ 文件最大值',
        },
        name: 'maxSize',
        isRequired: false,
        setter: {
          componentName: 'NumberSetter',
        },
      },
      {
        title: {
          label: '默认值',
          tip: 'value ｜ 默认值',
        },
        name: 'value',
        isRequired: false,
        setter: {
          componentName: 'StringSetter',
        },
      },
      {
        title: {
          label: '数量',
          tip: 'quantity ｜ 数量',
        },
        name: 'quantity',
        isRequired: false,
        setter: {
          componentName: 'NumberSetter',
        },
      },
      {
        title: {
          label: '多图上传',
          tip: 'multiple ｜ 多图上传',
        },
        name: 'multiple',
        isRequired: false,
        setter: {
          componentName: 'BoolSetter',
          initialValue: true,
        },
      },
      {
        title: {
          label: '接受的文件类型',
          tip: 'accept ｜ 接受的文件类型',
        },
        name: 'accept',
        isRequired: false,
        setter: {
          componentName: 'StringSetter',
        },
      },
      {
        title: {
          label: '是否启用Oss',
          tip: 'isOss ｜ 是否启用Oss',
        },
        name: 'isOss',
        supportVariable: false,
        defaultValue: true,
        condition: false,
      },
      // {
      //   title: {
      //     label: '展示文件模型',
      //     tip: 'showFileModel ｜ 展示文件模型',
      //   },
      //   name: 'showFileModel',
      //   supportVariable: false,
      //   setter: {
      //     componentName: 'BoolSetter',
      //     initialValue: true,
      //   },
      // },
      // {
      //   title: {
      //     label: '过期时间',
      //     tip: 'expire ｜ 过期时间',
      //   },
      //   name: 'expire',
      //   supportVariable: false,
      //   setter: {
      //     componentName: 'NumberSetter',
      //   },
      // },
      {
        title: {
          label: '项目ID',
          tip: 'projectId ｜ 项目ID',
        },
        name: 'projectId',
        supportVariable: false,
        setter: 'StringSetter',
        isRequired: true,
        defaultValue: 'PROSUPPLIER',
      },
      {
        title: {
          label: '是否裁剪',
          tip: 'ableCrop ｜ 是否裁剪',
        },
        name: 'ableCrop',
        supportVariable: false,
        setter: {
          componentName: 'BoolSetter',
          initialValue: false,
        },
      },
      // {
      //   title: {
      //     label: '裁剪比例',
      //     tip: 'aspectRatio ｜ 裁剪比例',
      //   },
      //   name: 'aspectRatio',
      //   supportVariable: false,
      //   setter: {
      //     componentName: 'NumberSetter',
      //   },
      // },
      // {
      //   title: {
      //     label: '裁剪返回图片格式',
      //     tip: 'cropType ｜ 裁剪返回图片格式',
      //   },
      //   name: 'cropType',
      //   supportVariable: false,
      //   setter: {
      //     componentName: 'StringSetter',
      //   },
      // },
      // {
      //   name: 'cropFinish',
      //   title: '裁剪完成函数',
      //   supportVariable: false,
      //   setter: {
      //     componentName: 'MixedSetter',
      //     props: {
      //       defaultValue: () => ({
      //         type: 'JSFunction',
      //         schema: {
      //           title: 'cropFinish',
      //           type: 'JSFunction',
      //           async: false,
      //           properties: {
      //             input: {
      //               type: 'object',
      //               properties: {
      //                 data: {
      //                   type: 'object',
      //                   defaultValue: {},
      //                 },
      //               },
      //               required: ['data'],
      //             },
      //             body: {
      //               type: 'array',
      //               items: [
      //                 {
      //                   type: 'Function',
      //                   properties: {
      //                     template: 'LogicFunction',
      //                   },
      //                 },
      //               ],
      //             },
      //           },
      //           required: ['input', 'body'],
      //         },
      //       }),
      //       setters: ['SchemaFunctionSetter'],
      //     },
      //   },
      // },
      {
        title: {
          label: '是否可拖拽',
          tip: 'isDrag | 是否可拖拽',
        },
        name: 'isDrag',
        isRequired: false,
        supportVariable: false,
        setter: {
          componentName: 'BoolSetter',
          initialValue: true,
        },
      },
      {
        title: {
          label: '是否显示文案',
          tip: 'showFileName | 是否显示文案',
        },
        name: 'showFileName',
        isRequired: false,
        supportVariable: false,
        setter: {
          componentName: 'BoolSetter',
          initialValue: true,
        },
      },
      {
        title: {
          label: '提示信息',
          tip: 'errMessage ｜ 提示信息',
        },
        name: 'errMessage',
        supportVariable: false,
        setter: {
          componentName: 'StringSetter',
        },
      },
      {
        title: {
          label: 'oss加密类型',
          tip: 'securityType | oss加密类型',
        },
        name: 'securityType',
        isRequired: false,
        supportVariable: false,
        setter: {
          componentName: 'SelectSetter',
          props: {
            options: [
              {
                label: 'public',
                value: 'public',
              },
              {
                label: 'private',
                value: 'private',
              },
            ],
          },
          initialValue: 'public',
        },
      },
      // {
      //   title: {
      //     label: '功能名称',
      //     tip: 'featureName ｜ 功能名称',
      //   },
      //   name: 'featureName',
      //   isRequired: false,
      //   setter: {
      //     componentName: 'StringSetter',
      //   },
      // },
      {
        title: {
          label: 'oss全地址',
          tip: 'ossDir ｜ oss全地址',
        },
        name: 'ossDir',
        isRequired: false,
        setter: {
          componentName: 'StringSetter',
        },
      },
      {
        title: {
          label: '是否垂直显示',
          tip: 'isVertical | 是否垂直显示',
        },
        name: 'isVertical',
        isRequired: false,
        supportVariable: false,
        setter: {
          componentName: 'BoolSetter',
          initialValue: false,
        },
      },
      {
        name: 'uploadFinish',
        title: '上传完成回调',
        setter: {
          componentName: 'MixedSetter',
          props: {
            setters: [
              {
                componentName: 'SchemaFunctionSetter',
                props: {
                  title: 'uploadFinish',
                  async: false,
                  properties: {
                    input: {
                      type: 'object',
                      properties: {
                        res: {
                          type: 'object',
                          defaultValue: '[]',
                        },
                      },
                      required: ['res'],
                    },
                    body: {
                      type: 'array',
                      items: [
                        {
                          type: 'Function',
                          properties: {
                            template: 'SetStateFunction',
                            extraProps: {
                              state: 'imgList',
                              value: '{{res}}',
                            },
                          },
                        },
                      ],
                    },
                  },
                },
              },
              'FunctionSetter',
            ],
          },
        },
      },
      {
        name: 'onChange',
        title: '图片改变回调',
        setter: {
          componentName: 'MixedSetter',
          props: {
            setters: [
              {
                componentName: 'SchemaFunctionSetter',
                props: {
                  title: 'onChange',
                  async: false,
                  properties: {
                    input: {
                      type: 'object',
                      properties: {
                        res: {
                          type: 'object',
                          defaultValue: '[]',
                        },
                      },
                      required: ['res'],
                    },
                    body: {
                      type: 'array',
                      items: [
                        {
                          type: 'Function',
                          properties: {
                            template: 'SetStateFunction',
                            extraProps: {
                              state: 'imgList',
                              value: '{{res}}',
                            },
                          },
                        },
                      ],
                    },
                  },
                },
              },
              'FunctionSetter',
            ],
          },
        },
      },
      {
        name: 'fileDownload',
        title: '文件下载',
        supportVariable: false,
        setter: {
          componentName: 'MixedSetter',
          props: {
            defaultValue: () => ({
              type: 'fileDownload',
              schema: {
                title: 'cropFinish',
                type: 'JSFunction',
                async: false,
                properties: {
                  input: {
                    type: 'object',
                    properties: {
                      data: {
                        type: 'object',
                        defaultValue: {},
                      },
                    },
                    required: ['data'],
                  },
                  body: {
                    type: 'array',
                    items: [
                      {
                        type: 'Function',
                        properties: {
                          template: 'LogicFunction',
                        },
                      },
                    ],
                  },
                },
                required: ['input', 'body'],
              },
            }),
            setters: ['SchemaFunctionSetter'],
          },
        },
      },
      {
        title: {
          label: '导入结果',
          tip: 'uploadResult ｜ 导入结果',
        },
        name: 'uploadResult',
        isRequired: false,
      },
    ],
    supports: {
      className: true,
      style: true,
    },
    component: {},
  },
};
const snippets: IPublicTypeSnippetMore[] = [
  {
    title: '上传文件',
    svgId: 'toolbox-page-uploader',
    screenshot: 'https://yw-fed-static.oss-cn-hangzhou.aliyuncs.com/lowcode/upload',
    schema: {
      componentName: 'YwUpload',
      props: {},
    },
  },
];

export default {
  ...YwUploadMeta,
  snippets,
};