var COM_COMPONENT_CONFIG = {
}
var COM_COMPONENT = [
{
key:'com',
label:'基础',
children: [
{
type: 'my-grid-layout',
label: '布局layout'
},
{
type: 'my-grid-item',
label: '布局item'
},
{
type: 'vue-draggable-resizable',
label: '拖拽布局'
},
{
type: 'div',
label: 'div块'
}
]
},
{
key: 'dv-border-box',
label:'边框',
children: [
{
type: 'dv-border-box-1',
label: '边框1'
}
]
},
{
key: 'dv-decoration',
label:'装饰',
children: [
]
},
{
key: 'dv-charts',
label: '图表',
children: [
{
type:'dv-charts',
subType: 'dashboard',
label: '仪表盘'
},
{
type:'dv-charts',
subType: 'line',
label: '折线图'
},
{
type:'dv-active-ring-chart',
label: '动态环图'
},
{
type: 'dv-water-level-pond',
label: '水位图'
}
]
}
]
for(var i=1;i<=13;i++) {
COM_COMPONENT_CONFIG['dv-border-box-'+i] = {
mkey:'style',
value:'_props',
label:'边框',
items: [
{
type:'el-color-picker',
mkey:'color',
label:'线条颜色',
num: 2
},
{
type:'el-color-picker',
mkey:'backgroundColor',
label:'背景颜色',
prop: {
'show-alpha': true
}
}
]
}
}
for(var i=1;i<=12;i++) {
COM_COMPONENT_CONFIG['dv-decoration-'+i] = {
mkey:'style',
value:'_props',
label:'边框',
items: [
{
type:'el-color-picker',
mkey:'color',
label:'线条颜色',
num: 2
}
]
}
}
COM_COMPONENT_CONFIG['dv-border-box-8'].items.push({
type:'el-switch',
mkey:'reverse',
label:'反向'
})
COM_COMPONENT_CONFIG['dv-border-box-11'].items.push({
type:'el-input',
mkey:'title',
label:'标题'
})
COM_COMPONENT_CONFIG['dv-border-box-11'].items.push({
type:'el-input-number',
mkey:'titleWidth',
label:'标题宽度'
})
COM_COMPONENT_CONFIG['dv-decoration-8'].items.push({
type:'el-switch',
mkey:'reverse',
label:'反向'
})
COM_COMPONENT_CONFIG['my-grid-item'] = {
mkey:'style',
value: '_props',
label:'布局',
items: [
{
type: 'el-switch',
mkey: 'static',
label:'静态',
value: false
},
{
type: 'el-switch',
mkey: 'isDraggable',
label: '拖拽',
value: true
},
{
type: 'el-switch',
mkey: 'isResizable',
label: '调整大小',
value: true
},
]
}
COM_COMPONENT_CONFIG['my-grid-layout'] = {
mkey: 'style',
value: '_props',
label: '布局',
items:[
{
type:'el-input-number',
mkey: 'col-num',
label:'col大小',
value: 12
},
{
type:'el-input-number',
mkey: 'row-height',
label:'row高度',
value: 30
},
{
type: 'el-switch',
mkey: 'is-draggable',
label: '拖拽',
},
{
type: 'el-switch',
mkey: 'is-mirrored',
label: '镜像',
},
{
type: 'el-switch',
mkey: 'is-resizable',
label: '调整大小',
},
{
type: 'el-switch',
mkey: 'vertical-compact',
label: '垂直压缩',
}
]
}
var index=1,lastKey = ''
for (var k in COM_COMPONENT_CONFIG) {
var arr = k.split('-')
if (arr.length > 1) {
arr.pop()
key = arr.join('-')
if (lastKey != key) {
index = 1
}
lastKey = key
var item = COM_COMPONENT.find(v=>{
return v.key == key
})
if (item) {
if (item.children) {
item.children.push({
type: k,
label: item.label+index
})
index++
}
}
}
}
COM_COMPONENT_CONFIG['div'] = [
{
mkey: 'style',
value: 'base',
items: [
{
type: 'el-input',
mkey: 'content',
label: '内容',
prop:{
type: "textarea",
rows:"6"
}
}
]
},
{
mkey:'style',
value: 'style',
items: [
{
type: 'el-input-prefix',
mkey: 'font-size',
label: '字体大小'
},
{
type: 'el-color-picker',
mkey: 'color',
label: '颜色'
}
]
},
{
mkey:'style',
value:'_props',
label:'自定义',
items: [
{
type:'el-input',
mkey: 'class',
label: '类名',
prop:{
type: "textarea",
rows:"6"
}
}
]
}
]
COM_COMPONENT_CONFIG['my-bg'] = [
{
mkey:'style',
value:'_props',
label:'画布',
items: [
{
type:'el-input',
mkey: 'width',
label:'画布宽度',
},
{
type:'el-input',
mkey: 'height',
label:'画布高度',
}
]
}
]
COM_COMPONENT_CONFIG['vue-draggable-resizable'] = [
{
mkey:'style',
value:'_props',
label:'组件',
items: [
{
type:'el-switch',
mkey: 'parent',
label:'父组件内拖动',
},
{
type:'el-input',
mkey: 'grid',
label:'网格',
num: 2
},
]
}
]
COM_COMPONENT_CONFIG['dv-charts-dashboard'] = [
{
mkey:'style',
value:'option',
label:'组件',
items: [
{
type:'el-input',
mkey: 'title.text',
label:'标题',
},
{
type:'el-color-picker',
mkey: 'title.style.fill',
label: '标题颜色',
},
{
type:'el-input',
mkey: 'series.center',
label: '对齐',
num: 2
},
{
type:'el-color-picker',
mkey: 'series.axisLabel.style.fill',
label:'表盘颜色',
},
{
type:'el-color-picker',
mkey: 'series.axisTick.style.stroke',
label:'指针颜色',
},
]
}
]
COM_COMPONENT_CONFIG['dv-charts-line'] = [
{
mkey:'style',
value:'option',
label:'组件',
items: [
{
type: 'el-input',
mkey: 'title.text',
label: '标题'
},
{
type: 'el-input',
mkey: 'xAxis.name',
label: 'X轴标题'
},
{
type: 'el-input',
mkey: 'yAxis.name',
label: 'Y轴标题'
},
{
type: 'el-switch',
mkey: 'series.smooth',
label: '平滑曲线'
}
]
}
]
COM_COMPONENT_CONFIG['dv-active-ring-chart'] = [
{
mkey:'style',
value:'config',
label:'组件',
items: [
{
type:'el-input-number',
mkey: 'lineWidth',
label:'线条宽度'
},
{
type:'el-input',
mkey: 'radius',
label:'radius'
},
{
type:'el-input',
mkey: 'activeRadius',
label:'activeRadius'
},
{
type:'el-switch',
mkey: 'showOriginValue',
label:'显示初始值'
},
{
type: 'el-input',
prop:{
type: "textarea",
rows:"6"
},
mkey: 'data',
label: '数据'
}
]
}
]
COM_COMPONENT_CONFIG['dv-water-level-pond'] = [
{
mkey:'style',
value:'config',
label:'组件',
items: [
{
type: 'el-input',
mkey: 'shape',
label: '形状'
},
{
type: 'el-input',
mkey: 'data',
label: '数据'
}
]
}
]
// console.log(COM_COMPONENT)
console