68 lines
1.6 KiB
TypeScript
68 lines
1.6 KiB
TypeScript
|
import type { MetaContainerItem } from 'open-data-v/base'
|
||
|
|
import { ComponentGroup, CustomComponent, FormType } from 'open-data-v/base'
|
||
|
|
|
||
|
|
export const componentName = 'BorderImage'
|
||
|
|
class BorderImageComponent extends CustomComponent {
|
||
|
|
constructor(id?: string, name?: string) {
|
||
|
|
super({
|
||
|
|
component: componentName,
|
||
|
|
group: ComponentGroup.BORDER,
|
||
|
|
name: name ? name : '图片边框',
|
||
|
|
id,
|
||
|
|
width: 300,
|
||
|
|
height: 200
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
_prop: MetaContainerItem[] = [
|
||
|
|
{
|
||
|
|
label: '基础配置',
|
||
|
|
prop: 'base',
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
prop: 'borderSource',
|
||
|
|
label: '边框图片路径',
|
||
|
|
type: FormType.TEXT,
|
||
|
|
props: {
|
||
|
|
defaultValue: '/images/border-image.png'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: 'borderImageSlice',
|
||
|
|
label: '边框图片切片',
|
||
|
|
type: FormType.ARRAY,
|
||
|
|
props: {
|
||
|
|
componentType: FormType.NUMBER,
|
||
|
|
type: 'dynamic',
|
||
|
|
minItem: 1,
|
||
|
|
maxItem: 4,
|
||
|
|
defaultValue: ['51', '38', '20', '132']
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: 'borderWidth',
|
||
|
|
label: '边框宽度',
|
||
|
|
type: FormType.ARRAY,
|
||
|
|
props: {
|
||
|
|
type: 'dynamic',
|
||
|
|
minItem: 1,
|
||
|
|
maxItem: 4,
|
||
|
|
defaultValue: ['40.8px', '30.4px', '16px', '105.6px']
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
prop: 'backgroundColor',
|
||
|
|
label: '底色',
|
||
|
|
type: FormType.COLOR,
|
||
|
|
props: {
|
||
|
|
defaultValue: 'transparent'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
]
|
||
|
|
_style: MetaContainerItem[] = []
|
||
|
|
}
|
||
|
|
|
||
|
|
export default BorderImageComponent
|