syber-lowcode-business-materials
Version:
syber-lowcode-business-materials
262 lines (261 loc) • 7.23 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _snippets = _interopRequireDefault(require("./snippets"));
var _default = exports["default"] = {
snippets: _snippets["default"],
priority: 11,
componentName: 'CustomUpload',
title: '上传',
category: '表单',
props: [{
title: '数据源',
display: 'block',
type: 'group',
items: [{
name: 'fileListControlled',
title: {
label: '当前上传文件',
tip: 'fileList | 当前上传的文件列表（受控）'
},
propType: {
type: 'arrayOf',
value: 'object'
},
supportVariable: true,
setter: {
componentName: 'ArraySetter',
props: {
itemSetter: {
componentName: 'ObjectSetter',
props: {
config: {
items: [{
name: 'name',
title: '文件名',
setter: 'StringSetter'
}, {
name: 'status',
title: '状态',
setter: {
componentName: 'SelectSetter',
props: {
options: ['error', 'success', 'done', 'uploading', 'removed'].map(function (v) {
return {
label: v,
value: v
};
})
}
}
}, {
name: 'url',
title: '文件地址',
setter: 'StringSetter'
}, {
name: 'response',
title: '错误信息',
setter: 'StringSetter'
}]
}
}
}
}
}
}]
}, {
title: '基本',
display: 'block',
type: 'group',
items: [{
name: 'uniq',
title: {
label: '去重上传',
tip: 'uniq | 开启后，上传同样的文件会直接成功并拿到文件地址'
},
propType: 'bool',
defaultValue: true,
setter: 'BoolSetter'
}, {
name: 'multiple',
title: {
label: '支持多选文件',
tip: 'multiple | 是否支持多选文件，`ie10+` 支持。开启后按住 ctrl 可选择多个文件'
},
propType: 'bool',
defaultValue: false,
setter: 'BoolSetter'
}, {
name: 'size',
title: {
label: '上传数量限制'
},
propType: 'number',
setter: 'NumberSetter'
}, {
name: 'accept',
title: {
label: '上传文件类型',
tip: 'accept | 接受上传的文件类型, 例如 image/*,video/*'
},
propType: 'string',
defaultValue: 'image/*',
setter: 'StringSetter'
}, {
name: 'directory',
title: {
label: '文件夹上传',
tip: 'directory | 支持上传文件夹'
},
propType: 'bool',
defaultValue: false,
setter: 'BoolSetter'
}, {
name: 'disabled',
title: {
label: '是否禁用',
tip: 'disabled | 是否为禁用状态'
},
propType: 'bool',
defaultValue: false,
setter: 'BoolSetter'
}]
}, {
title: '高级',
display: 'block',
type: 'group',
items: [{
name: 'openFileDialogOnClick',
title: {
label: '打开文件对话框',
tip: 'openFileDialogOnClick | 点击打开文件对话框'
},
propType: 'bool',
defaultValue: true,
setter: 'BoolSetter'
}, {
name: 'showUploadList',
title: {
label: '显示上传列表',
tip: 'showUploadList | 是否显示上传的文件列表,'
},
propType: 'bool',
defaultValue: true,
setter: 'BoolSetter'
}, {
name: 'listType',
title: {
label: '上传列表样式',
tip: 'listType | 上传列表的内建样式，支持三种基本样式 `text`, `picture` 和 `picture-card`'
},
propType: {
type: 'oneOf',
value: ['text', 'picture', 'picture-card']
},
defaultValue: 'text',
setter: [{
componentName: 'RadioGroupSetter',
props: {
options: [{
title: '文本',
value: 'text'
}, {
title: '图片',
value: 'picture'
}, {
title: '图片卡片',
value: 'picture-card'
}]
}
}, 'VariableSetter']
}, {
name: 'iconRender',
title: {
label: '自定义图标',
tip: 'iconRender | 自定义显示 icon'
},
propType: 'func',
setter: {
componentName: 'SlotSetter',
title: '自定义图标插槽',
initialValue: {
type: 'JSSlot',
params: ['file', 'listType'],
value: []
}
}
}, {
name: 'itemRender',
title: {
label: '自定义列表项',
tip: 'itemRender | 自定义上传列表项'
},
propType: 'func',
setter: {
componentName: 'SlotSetter',
title: '自定义列表项插槽',
initialValue: {
type: 'JSSlot',
params: ['originNode', 'file', 'fileList', 'actions'],
value: []
}
}
}, {
name: 'progress',
title: {
label: '自定义进度条',
tip: 'progress | 自定义进度条样式'
},
propType: 'object',
setter: 'JsonSetter'
}]
}, {
title: '扩展函数',
display: 'block',
type: 'group',
items: [{
name: 'isImageUrl',
title: {
label: '是否为图片',
tip: 'isImageUrl | 自定义缩略图是否使用 <img /> 标签进行显示'
},
propType: 'func',
setter: {
componentName: 'FunctionSetter',
props: {
template: 'isImageUrl(file,${extParams}){\n// 判断是否为图片\nreturn true;\n}'
}
}
}, {
name: 'previewFile',
title: {
label: '自定义文件预览',
tip: 'previewFile | 自定义文件预览逻辑'
},
propType: 'func',
setter: 'FunctionSetter'
}]
}],
configure: {
component: {
isContainer: true
},
supports: {
style: true,
events: [{
name: 'onFileListChange',
template: "\nonFileListChange(fileList,${extParams}){\n// 任何改动都会触发的回调\nconsole.log('onFileListChange',fileList);}"
}, {
name: 'onFileUploadSuccess',
template: "\nonFileUploadSuccess(file,${extParams}){\n// 文件上传成功时的回调\nconsole.log('onFileUploadSuccess',file);}"
}, {
name: 'onFileUploadError',
template: "\nonFileUploadError(message,${extParams}){\n// 文件上传失败时的回调\nconsole.log('onFileUploadError',message);}"
}, {
name: 'onFileUploadProgress',
template: "\nonFileUploadProgress(total,${extParams}){\n// 文件上传中的回调\nconsole.log('onFileUploadProgress',total);}"
}]
}
}
};