parent
3bedd88768
commit
d4deed140d
@ -0,0 +1,106 @@ |
|||||||
|
import { Module } from '../engineer' |
||||||
|
import { createUniqueId } from '../engineer/utils' |
||||||
|
|
||||||
|
const module:Module = { |
||||||
|
title: '导航条', |
||||||
|
vid: createUniqueId(), |
||||||
|
mid: createUniqueId(), |
||||||
|
maxReferenceCount: -1, |
||||||
|
referenceCount: 0, |
||||||
|
image: undefined, |
||||||
|
configs: [ |
||||||
|
{ |
||||||
|
help: '帮助', |
||||||
|
addable: true, |
||||||
|
type: 'list', |
||||||
|
field: 'items', |
||||||
|
label: '导航条', |
||||||
|
configs: [ |
||||||
|
{ |
||||||
|
type: 'image', |
||||||
|
label: '分类图片', |
||||||
|
field: 'itemImage', |
||||||
|
// 表示内联数据
|
||||||
|
inlines: [{ |
||||||
|
type: 'text', |
||||||
|
field: 'link', |
||||||
|
label: '链接', |
||||||
|
help: '请输入链接', // 自动生成："请输入${label}"
|
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'text', |
||||||
|
label: '自定义标题', |
||||||
|
field: 'title', |
||||||
|
}, |
||||||
|
] |
||||||
|
}, |
||||||
|
] |
||||||
|
}, |
||||||
|
], |
||||||
|
init: { |
||||||
|
theme: { |
||||||
|
color: '#fff', |
||||||
|
}, |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
title: '标题', |
||||||
|
link: 'link' |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
theme: { |
||||||
|
padding: 12, |
||||||
|
color: '@@theme.color', |
||||||
|
}, |
||||||
|
children: { |
||||||
|
theme: { |
||||||
|
width: '100%', |
||||||
|
clip: 'autoX', |
||||||
|
whiteSpace: 'nowrap', |
||||||
|
flexible: true, |
||||||
|
crossAlign:'start' |
||||||
|
}, |
||||||
|
children: { |
||||||
|
type: 'each', |
||||||
|
key: 'items', |
||||||
|
handle: { |
||||||
|
theme: { |
||||||
|
width: 60, |
||||||
|
height: 80, |
||||||
|
display: 'inline-block', |
||||||
|
|
||||||
|
margin: { |
||||||
|
right: 10 |
||||||
|
}, |
||||||
|
}, |
||||||
|
children:[ |
||||||
|
{ |
||||||
|
theme:{ |
||||||
|
width:60, |
||||||
|
height:60, |
||||||
|
radius: 30, |
||||||
|
color: 'pink', |
||||||
|
clip: 'hidden' |
||||||
|
}, |
||||||
|
children:'图片' |
||||||
|
}, |
||||||
|
{ |
||||||
|
theme:{ |
||||||
|
width:60, |
||||||
|
height:20, |
||||||
|
textAlign:'center', |
||||||
|
fontSize: 12, |
||||||
|
whiteSpace: 'nowrap', |
||||||
|
clip: 'hidden' |
||||||
|
}, |
||||||
|
children:{ |
||||||
|
type: 'text', |
||||||
|
key:'.title' |
||||||
|
} |
||||||
|
} |
||||||
|
], |
||||||
|
} |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
export default module |
||||||
@ -0,0 +1,87 @@ |
|||||||
|
import type { Module } from '../engineer' |
||||||
|
import { createUniqueId } from '../engineer/utils' |
||||||
|
|
||||||
|
const module:Module = { |
||||||
|
title: '搜索框', |
||||||
|
vid: createUniqueId(), |
||||||
|
mid: createUniqueId(), |
||||||
|
maxReferenceCount: -1, |
||||||
|
referenceCount: 0, |
||||||
|
image: undefined, |
||||||
|
configs: [ |
||||||
|
{ |
||||||
|
type: 'object', |
||||||
|
field: 'search', |
||||||
|
label: '搜索框', |
||||||
|
configs: [ |
||||||
|
{ |
||||||
|
required: true, |
||||||
|
type: 'text', |
||||||
|
label: '搜索框内容', |
||||||
|
field: 'innerText' |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'boolean', |
||||||
|
field: 'showLogo', |
||||||
|
label: '是否展示左侧logo', |
||||||
|
}, { |
||||||
|
type: 'image', |
||||||
|
field: 'logoImg', |
||||||
|
label: '左侧logo', |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
], |
||||||
|
init: { |
||||||
|
search:{ |
||||||
|
innerText:'猜你喜欢' |
||||||
|
} |
||||||
|
}, |
||||||
|
templates: { |
||||||
|
'true': { |
||||||
|
theme: {}, |
||||||
|
children: 'logo' |
||||||
|
}, |
||||||
|
'false': { |
||||||
|
theme: {}, |
||||||
|
children: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
theme: { |
||||||
|
display: 'flex', |
||||||
|
crossAlign: 'center', |
||||||
|
padding: { |
||||||
|
horizontal: 15, |
||||||
|
vertical: 8, |
||||||
|
}, |
||||||
|
color: 'cyan' |
||||||
|
}, |
||||||
|
children: [ |
||||||
|
{ |
||||||
|
children: { |
||||||
|
type: 'template', |
||||||
|
key: 'search.showLogo' |
||||||
|
}, |
||||||
|
}, |
||||||
|
{ |
||||||
|
theme: { width: 10 }, |
||||||
|
}, |
||||||
|
{ |
||||||
|
theme: { |
||||||
|
width: '60%', |
||||||
|
color: 'white', |
||||||
|
radius: 30.0, |
||||||
|
padding: { |
||||||
|
horizontal: 10, |
||||||
|
vertical: 5, |
||||||
|
}, |
||||||
|
fontSize: 14, |
||||||
|
}, |
||||||
|
children: { |
||||||
|
type: 'text', |
||||||
|
key: 'search.innerText' |
||||||
|
} |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
export default module |
||||||
@ -0,0 +1,194 @@ |
|||||||
|
import type { Module } from '../engineer' |
||||||
|
import { createUniqueId } from '../engineer/utils' |
||||||
|
|
||||||
|
const module:Module = { |
||||||
|
vid: createUniqueId(), |
||||||
|
mid: createUniqueId(), |
||||||
|
title: '轮播图', |
||||||
|
maxReferenceCount: -1, |
||||||
|
referenceCount: 0, |
||||||
|
image: undefined, |
||||||
|
configs: [ |
||||||
|
{ |
||||||
|
type: 'list', |
||||||
|
field: 'items', |
||||||
|
label: '轮播图设置', |
||||||
|
help: '最多可添加10张图片，建议宽度750px；鼠标拖拽左侧圆点可调整图片顺序', |
||||||
|
addable: true, |
||||||
|
configs: [{ |
||||||
|
type: 'image', |
||||||
|
field: 'image', |
||||||
|
label: '图片', |
||||||
|
required: true, |
||||||
|
// 表示内联数据
|
||||||
|
inlines: [{ |
||||||
|
type: 'text', |
||||||
|
field: 'title', |
||||||
|
label: '标题', |
||||||
|
help: '选填，不超过 4 个字', |
||||||
|
}, { |
||||||
|
type: 'text', |
||||||
|
field: 'link', |
||||||
|
label: '链接', |
||||||
|
help: '请输入链接', // 自动生成："请输入${label}"
|
||||||
|
}], |
||||||
|
}], |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'object', |
||||||
|
field: 'indicator', |
||||||
|
label: '指示器', |
||||||
|
configs: [{ |
||||||
|
type: 'mark', |
||||||
|
field: 'style', |
||||||
|
label: '指示器样式', |
||||||
|
values: [ |
||||||
|
{ label: '圆形', value: '#circle' }, |
||||||
|
{ label: '直线', value: '#line' }, |
||||||
|
{ label: '数字', value: '#number' }, |
||||||
|
], |
||||||
|
}, { |
||||||
|
type: 'mark', |
||||||
|
field: 'position', |
||||||
|
label: '指示器位置', |
||||||
|
values: [ |
||||||
|
{ label: '居左', value: 'start' }, |
||||||
|
{ label: '居中', value: 'center' }, |
||||||
|
{ label: '居右', value: 'end' }, |
||||||
|
], |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'color', |
||||||
|
field: 'color', |
||||||
|
label: '指示器颜色', |
||||||
|
}], |
||||||
|
}, |
||||||
|
{ |
||||||
|
type: 'object', |
||||||
|
field: 'background', |
||||||
|
label: '背景', |
||||||
|
configs: [{ |
||||||
|
type: 'boolean', |
||||||
|
field: 'enabled', |
||||||
|
label: '是否显示背景色', |
||||||
|
}, { |
||||||
|
type: 'background', |
||||||
|
field: 'value', |
||||||
|
// 背景的不同实现方式，可以在里面添加 image 选项来支持图片
|
||||||
|
// 这里只能支持颜色和渐变，
|
||||||
|
features: ['color', 'gradient'], |
||||||
|
label: '背景', |
||||||
|
}], |
||||||
|
} |
||||||
|
], |
||||||
|
init: { |
||||||
|
items: [ |
||||||
|
{ |
||||||
|
image: '', |
||||||
|
title: '123', |
||||||
|
link: '123', |
||||||
|
} |
||||||
|
], |
||||||
|
indicator: { |
||||||
|
style: '#circle', |
||||||
|
color: 'green', |
||||||
|
position: 'start', |
||||||
|
}, |
||||||
|
background: { |
||||||
|
enabled: true, |
||||||
|
value: "#ffffff", |
||||||
|
}, |
||||||
|
theme: { |
||||||
|
color: 'white', |
||||||
|
radius: 24 |
||||||
|
} |
||||||
|
}, |
||||||
|
templates: { |
||||||
|
'#circle': { |
||||||
|
theme: { |
||||||
|
gap: 1, |
||||||
|
}, |
||||||
|
children: { |
||||||
|
type: 'each', |
||||||
|
key: 'items', |
||||||
|
handle: { |
||||||
|
theme: { |
||||||
|
width: 5, |
||||||
|
height: 5, |
||||||
|
radius: 2.5, |
||||||
|
color: '@@indicator.color', |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
'#line': { |
||||||
|
theme: { |
||||||
|
gap: 1, |
||||||
|
}, |
||||||
|
children: { |
||||||
|
type: 'each', |
||||||
|
key: 'items', |
||||||
|
handle: { |
||||||
|
theme: { |
||||||
|
width: 5, |
||||||
|
height: 2, |
||||||
|
color: '@@indicator.color', |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
"#number": { |
||||||
|
theme: { |
||||||
|
color: 'rgba(0,0,0,0.4)', |
||||||
|
textColor: '#fff', |
||||||
|
radius:10, |
||||||
|
padding:{ |
||||||
|
left:10, |
||||||
|
right:10 |
||||||
|
}, |
||||||
|
flexible:true, |
||||||
|
mainAlign:'center', |
||||||
|
crossAlign: 'center' |
||||||
|
}, |
||||||
|
children: '1/0' |
||||||
|
} |
||||||
|
}, |
||||||
|
theme: { |
||||||
|
position: 'relative', |
||||||
|
height: 200, |
||||||
|
padding: { |
||||||
|
horizontal: 12.0, |
||||||
|
vertical: 12, |
||||||
|
}, |
||||||
|
color: 'cyan', |
||||||
|
}, |
||||||
|
children: [ |
||||||
|
{ |
||||||
|
vid: createUniqueId(), |
||||||
|
theme: { |
||||||
|
width: '100%', |
||||||
|
height: '100%', |
||||||
|
color: '@@theme.color', |
||||||
|
radius: "@@theme.radius", |
||||||
|
textAlign: 'center', |
||||||
|
}, |
||||||
|
children: '设置轮播图', |
||||||
|
}, |
||||||
|
{ |
||||||
|
theme: { |
||||||
|
position: 'absolute', |
||||||
|
flexible: true, |
||||||
|
mainAlign: '@@indicator.position', |
||||||
|
bottom: 20, |
||||||
|
left: 30, |
||||||
|
right: 30, |
||||||
|
height: 20, |
||||||
|
}, |
||||||
|
children: { |
||||||
|
type: 'template', |
||||||
|
key: 'indicator.style' |
||||||
|
} |
||||||
|
}], |
||||||
|
} |
||||||
|
|
||||||
|
export default module |
||||||
Loading…
Reference in new issue