58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
// @ts-ignore
|
|
// import FcDesigner from "@form-create/ant-design-vue";
|
|
import {makeRequiredRule,makeOptionsRule} from '../../utils';
|
|
const label = "图片";
|
|
const name = "a-image";
|
|
const icon = "icon-xingzhuang-tupian";
|
|
let i = 1;
|
|
const uniqueId = () => `uni${i++}`;
|
|
|
|
export default {
|
|
//拖拽组件的图标
|
|
icon,
|
|
//拖拽组件的名称
|
|
label,
|
|
//拖拽组件的 key
|
|
name,
|
|
//拖拽组件的生成规则
|
|
rule() {
|
|
//如果在 props 方法中需要修改 rule 的属性,需要提前在 rule 上定义对应的属性
|
|
return {
|
|
//生成组件的名称
|
|
type: name,
|
|
//field 自定不能重复,所以这里每次都会生成一个新的
|
|
field: uniqueId(),
|
|
title: label,
|
|
info: "",
|
|
effect: {
|
|
fetch: ""
|
|
},
|
|
//这里设置组件的默认props配置项, 在下面的 props 方法里面设置无效
|
|
props: {
|
|
src: "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png",
|
|
width: 200,
|
|
placeholder: true,
|
|
},
|
|
options: [
|
|
|
|
],
|
|
};
|
|
},
|
|
|
|
//拖拽组件配置项(props)的生成规则
|
|
props() {
|
|
return [
|
|
//生成`checkbox`组件的`options`配置规则
|
|
// makeRequiredRule(),
|
|
// makeOptionsRule("props"),
|
|
{ type: "input", field: "src", title: "图片地址(支持http/base64)" },
|
|
{ type: "input", field: "fallback", title: "加载失败容错地址" },
|
|
{ type: "input", field: "width", title: "图像宽度" },
|
|
{ type: "input", field: "height", title: "图像高度" },
|
|
{ type: "switch", field: "preview", title: "预览参数,为 false 时禁用" },
|
|
{ type: "switch", field: "placeholder", title: "加载占位, 为 true 时使用默认占位"},
|
|
{ type: "input", field: "alt", title: "图像描述"},
|
|
];
|
|
}
|
|
};
|