Browse Source

字段和组件分组排序调整

lwx_v9
liwenxuan 2 years ago
parent
commit
665f4b093e
  1. 739
      src/components/DesignForm/assembly/index.ts

739
src/components/DesignForm/assembly/index.ts

@ -21,15 +21,14 @@ const selectOption: any = [
title: '基础字段', title: '基础字段',
children: [ children: [
{ {
type: 'input', type: 'title',
label: '单行文本', label: '标题',
icon: 'input', icon: 'title',
iconFont: 'fa-text-width', iconFont: 'fa-header',
control: { control: {
// 组件所有属性 modelValue: '标题'
modelValue: ''
}, },
config: {}, // 其他配置信息 config: {},
styles:{ styles:{
divStyle:{}, divStyle:{},
labelStyle:{}, labelStyle:{},
@ -60,6 +59,23 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
{
type: 'input',
label: '单行文本',
icon: 'input',
iconFont: 'fa-text-width',
control: {
// 组件所有属性
modelValue: ''
},
config: {}, // 其他配置信息
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{ {
type: 'textarea', type: 'textarea',
label: '多行文本', label: '多行文本',
@ -127,79 +143,6 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
{
type: 'datePicker',
label: '日期选择器',
icon: 'todo',
iconFont: 'fa-calendar',
control: {
modelValue: '',
type: 'date'
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'timePicker',
label: '时间选择器',
icon: 'time',
iconFont: 'fa-clock-o',
control: {
modelValue: ''
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'switch',
label: '开关',
icon: 'switch',
iconFont: 'fa-toggle-on',
control: {
modelValue: "",
glxxszSwitch:[
{
conditionField:'',
openValue:"",
showFields:[]
},
{
conditionField:'',
offValue:"",
showFields:[]
},
]
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'inputNumber',
label: '计数器',
icon: 'number',
iconFont: 'fa-sort-numeric-asc',
control: {
modelValue: 0
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{ {
type: 'cascader', type: 'cascader',
label: '级联选择器', label: '级联选择器',
@ -217,12 +160,13 @@ const selectOption: any = [
} }
}, },
{ {
type: 'rate', type: 'datePicker',
label: '评分', label: '日期选择器',
icon: 'rate', icon: 'todo',
iconFont: 'fa-star-o', iconFont: 'fa-calendar',
control: { control: {
modelValue: 0 modelValue: '',
type: 'date'
}, },
config: {}, config: {},
styles:{ styles:{
@ -232,12 +176,12 @@ const selectOption: any = [
} }
}, },
{ {
type: 'slider', type: 'timePicker',
label: '滑块', label: '时间选择器',
icon: 'slider', icon: 'time',
iconFont: 'fa-sliders', iconFont: 'fa-clock-o',
control: { control: {
modelValue: 0 modelValue: ''
}, },
config: {}, config: {},
styles:{ styles:{
@ -247,31 +191,26 @@ const selectOption: any = [
} }
}, },
{ {
type: 'treeSelect', type: 'txt',
label: '树形控件', label: '文字描述',
icon: 'tree2', icon: 'text',
iconFont: '', iconFont: 'fa-file-word-o',
control: { control: {
modelValue: '', modelValue: ''
data: [],
renderAfterExpand: false
},
config: {
optionsType: 0
}, },
styles:{ config: {},
styles:{
divStyle:{}, divStyle:{},
labelStyle:{}, labelStyle:{},
inputStyle:{} inputStyle:{}
} }
}, },
{ {
type: 'txt', type: 'organization',
label: '文字', label: '联系地址',
icon: 'text', icon: 'marker',
iconFont: 'fa-file-word-o', iconFont: 'fa-map-marker',
control: { control: {
modelValue: ''
}, },
config: {}, config: {},
styles:{ styles:{
@ -281,12 +220,24 @@ const selectOption: any = [
} }
}, },
{ {
type: 'title', type: 'switch',
label: '标题', label: '开关',
icon: 'title', icon: 'switch',
iconFont: 'fa-header', iconFont: 'fa-toggle-on',
control: { control: {
modelValue: '标题' modelValue: "",
glxxszSwitch:[
{
conditionField:'',
openValue:"",
showFields:[]
},
{
conditionField:'',
offValue:"",
showFields:[]
},
]
}, },
config: {}, config: {},
styles:{ styles:{
@ -311,27 +262,12 @@ const selectOption: any = [
} }
}, },
{ {
type: 'serialNumber', type: 'inputNumber',
label: '编码', label: '计数器',
icon: 'number', icon: 'number',
iconFont: 'fa-list-ol', iconFont: 'fa-sort-numeric-asc',
control: {
},
config: {
automatic:false
},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'urllink',
label: '链接',
icon: 'link',
iconFont: 'fa-link',
control: { control: {
modelValue: 0
}, },
config: {}, config: {},
styles:{ styles:{
@ -340,26 +276,195 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
]
},
{
title: '布局字段',
children: [
{
type: 'grid',
label: '格栅布局',
icon: 'grid',
iconFont: 'fa-th-large',
columns: [
// 格栅列数据
{
attr: { span: 12 },
list: []
},
{
attr: { span: 12 },
list: []
}
],
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'card',
label: '卡片布局',
icon: 'card',
iconFont: 'fa-credit-card',
list: [],
control: {},
config: {},
item: {}, // label标题相关
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'flex',
label: '弹性布局',
icon: 'flex',
iconFont: 'fa-file-text-o',
list: [],
tableData: [], // 值集合
control: {},
config: {
addBtnText: '添加一行'
},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'div',
label: '容器',
icon: 'div',
iconFont: '',
control: {},
config: {},
list: [],
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'tabs',
label: '标签页',
icon: 'tabs',
iconFont: 'fa-folder-o',
columns: [
{
label: 'Tab1',
list: []
}
],
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'divider',
label: '分割线',
icon: 'divider',
iconFont: '',
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
]
},
{
title: '高级控件',
children: [
{ {
type: 'organization', type: 'lowcodeImage',
label: '联系地址', label: '图片',
icon: 'marker', icon: '',
iconFont: 'fa-map-marker', iconFont: 'fa-photo',
control: { control: {
modelValue: '',
uploadFlag:false,
imgId:'',
imgUrl: '',
link: '',
fit:1,
radius:false,
radiusNum:5,
boderAndShadow:false,
showMode:'自定义像素值',
pxWidth:448,
pxHeight:252,
widthPercent:90,
heightPercent:90,
mt:0,
mb:0,
ml:0,
mr:0,
pt:0,
pb:0,
pl:0,
pr:0,
floatFlag:false,
floatValue:'left',
}, },
config: {}, config: {}
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
}, },
{ {
type: 'baidumap', type: 'videoUpAndPlay',
label: '地图', label: '视频',
icon: 'map', icon: '',
iconFont: 'fa-map-o', iconFont: 'fa-play-circle',
control: { control: {
modelValue: '',
videoMsg:[{
CreatedAt: '',
UpdatedAt: '',
fileSize: "0n",
id: "0n",
key: '',
name: '',
physicspath: '',
size: '',
tag: '',
type: 0,
url: '',
videoReady: false,
videoHeight:400,
videoWidth:700,
videoAutoPlay: false,
attrId: '',
poster:'',
loop: false
}]
}, },
config: {}, config: {},
styles:{ styles:{
@ -370,12 +475,12 @@ const selectOption: any = [
}, },
{ {
type: 'colorPicker', type: 'upload',
label: '取色器', label: '文件',
icon: 'color', icon: 'image',
iconFont: '', iconFont: 'fa-file-image-o',
control: { control: {
modelValue: '' modelValue: '' // 也可以是[{name:'',url:''}]形式
}, },
config: {}, config: {},
styles:{ styles:{
@ -383,12 +488,13 @@ const selectOption: any = [
labelStyle:{}, labelStyle:{},
inputStyle:{} inputStyle:{}
} }
}, },
{ {
type: 'orgCentent', type: 'urllink',
label: '行政组织', label: '链接',
icon: 'sliders', icon: 'link',
iconFont: 'fa-sliders', iconFont: 'fa-link',
control: { control: {
}, },
config: {}, config: {},
@ -398,25 +504,6 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
{
type: 'signaturemap',
label: '签名板',
icon: 'faedit',
iconFont: 'fa-edit',
control: {
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
}
]
},
{
title: '高级字段',
children: [
{ {
type: 'table', type: 'table',
label: '子表', label: '子表',
@ -437,12 +524,11 @@ const selectOption: any = [
} }
}, },
{ {
type: 'component', type: 'baidumap',
label: '自定义组件', label: '地图',
icon: 'component', icon: 'map',
iconFont: 'fa-cubes', iconFont: 'fa-map-o',
control: { control: {
modelValue: ''
}, },
config: {}, config: {},
styles:{ styles:{
@ -450,17 +536,14 @@ const selectOption: any = [
labelStyle:{}, labelStyle:{},
inputStyle:{} inputStyle:{}
} }
/*template: '', //
component: '' // 根据template注入的组件*/
}, },
{ {
type: 'slider',
type: 'upload', label: '滑块',
label: '图片/文件', icon: 'slider',
icon: 'image', iconFont: 'fa-sliders',
iconFont: 'fa-file-image-o',
control: { control: {
modelValue: '' // 也可以是[{name:'',url:''}]形式 modelValue: 0
}, },
config: {}, config: {},
styles:{ styles:{
@ -468,15 +551,14 @@ const selectOption: any = [
labelStyle:{}, labelStyle:{},
inputStyle:{} inputStyle:{}
} }
}, },
{ {
type: 'tinymce', type: 'rate',
label: '富文本', label: '评分',
icon: 'tinymce', icon: 'rate',
iconFont: '', iconFont: 'fa-star-o',
control: { control: {
modelValue: '' modelValue: 0
}, },
config: {}, config: {},
styles:{ styles:{
@ -486,32 +568,12 @@ const selectOption: any = [
} }
}, },
{ {
type: 'videoUpAndPlay', type: 'tinymce',
label: '视频', label: '富文本',
icon: '', icon: 'tinymce',//
iconFont: 'fa-play-circle', iconFont: 'fa-list-alt',
control: { control: {
modelValue: '', modelValue: ''
videoMsg:[{
CreatedAt: '',
UpdatedAt: '',
fileSize: "0n",
id: "0n",
key: '',
name: '',
physicspath: '',
size: '',
tag: '',
type: 0,
url: '',
videoReady: false,
videoHeight:400,
videoWidth:700,
videoAutoPlay: false,
attrId: '',
poster:'',
loop: false
}]
}, },
config: {}, config: {},
styles:{ styles:{
@ -548,6 +610,21 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
{
type: 'signaturemap',
label: '签名板',
icon: 'faedit',
iconFont: 'fa-edit',
control: {
},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{ {
type: 'lowcodeTransfer', type: 'lowcodeTransfer',
label: '穿梭框', label: '穿梭框',
@ -576,135 +653,103 @@ const selectOption: any = [
} }
}, },
{ {
type: 'lowcodeImage',
label: '图片', type: 'colorPicker',
icon: '', label: '取色器',
iconFont: 'fa-photo', icon: 'color',
control: { iconFont: '',
modelValue: '', control: {
uploadFlag:false, modelValue: ''
imgId:'', },
imgUrl: '', config: {},
link: '', styles:{
fit:1, divStyle:{},
radius:false, labelStyle:{},
radiusNum:5, inputStyle:{}
boderAndShadow:false, }
showMode:'自定义像素值', },
pxWidth:448, {
pxHeight:252, type: 'treeSelect',
widthPercent:90, label: '树形控件',
heightPercent:90, icon: 'tree2',
mt:0, iconFont: '',
mb:0, control: {
ml:0, modelValue: '',
mr:0, data: [],
pt:0, renderAfterExpand: false
pb:0, },
pl:0, config: {
pr:0, optionsType: 0
floatFlag:false, },
floatValue:'left', styles:{
}, divStyle:{},
config: {} labelStyle:{},
}, inputStyle:{}
{
type: 'associatedForms',
label: '关联表单',
icon: '',
iconFont: 'fa-wpforms',
control: {
modelValue: '',
hideConditionHtml:'',
hideConditionHtmlCopy:'',
formid: '',
dataRangeConditionHtml:'',
dataRangeConditionHtmlCopy:'',
saveFlag: false,
fillRoles: [
{
leftValue:'',
rightValue:'',
id:'',
}
],
},
config: {}
} }
]
}, },
{ {
title: '布局字段', type: 'associatedForms',
children: [ label: '关联表单',
{ icon: '',
type: 'grid', iconFont: 'fa-wpforms',
label: '格栅布局', control: {
icon: 'grid', modelValue: '',
iconFont: 'fa-th-large', hideConditionHtml:'',
columns: [ hideConditionHtmlCopy:'',
// 格栅列数据 formid: '',
{ dataRangeConditionHtml:'',
attr: { span: 12 }, dataRangeConditionHtmlCopy:'',
list: [] saveFlag: false,
}, fillRoles: [
{
attr: { span: 12 },
list: []
}
],
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'tabs',
label: '标签页',
icon: 'tabs',
iconFont: 'fa-folder-o',
columns: [
{ {
label: 'Tab1', leftValue:'',
list: [] rightValue:'',
id:'',
} }
], ],
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
}, },
config: {}
},
{ {
type: 'card', type: 'component',
label: '卡片布局', label: '自定义组件',
icon: 'card', icon: 'component',
iconFont: 'fa-credit-card', iconFont: 'fa-cubes',
list: [], control: {
control: {}, modelValue: ''
},
config: {}, config: {},
item: {}, // label标题相关
styles:{ styles:{
divStyle:{}, divStyle:{},
labelStyle:{}, labelStyle:{},
inputStyle:{} inputStyle:{}
} }
/*template: '', //
component: '' // 根据template注入的组件*/
}, },
]
},
{
title: '系统控件',//扩展组件
children: [
{ {
type: 'flex', type: 'serialNumber',
label: '弹性布局', label: '编码',
icon: 'flex', icon: 'number',
iconFont: 'fa-file-text-o', iconFont: 'fa-list-ol',
list: [], control: {
tableData: [], // 值集合 },
control: {},
config: { config: {
addBtnText: '添加一行' automatic:false
}, },
styles:{ styles:{
divStyle:{}, divStyle:{},
@ -712,38 +757,6 @@ const selectOption: any = [
inputStyle:{} inputStyle:{}
} }
}, },
{
type: 'divider',
label: '分割线',
icon: 'divider',
iconFont: '',
control: {},
config: {},
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
},
{
type: 'div',
label: '容器',
icon: 'div',
iconFont: '',
control: {},
config: {},
list: [],
styles:{
divStyle:{},
labelStyle:{},
inputStyle:{}
}
}
]
},
{
title: '扩展组件',
children: [
{ {
type: 'expand-user', type: 'expand-user',
label: '选择用户', label: '选择用户',
@ -762,7 +775,7 @@ const selectOption: any = [
}, },
{ {
type: 'orgCentent', type: 'orgCentent',
label: '行政组织', label: '选择组织',
icon: 'sliders', icon: 'sliders',
iconFont: 'fa-sliders', iconFont: 'fa-sliders',
control: { control: {
@ -775,6 +788,10 @@ const selectOption: any = [
} }
} }
] ]
},
{
title: '扩展组件',//
chileren:[]
} }
] ]
Loading…
Cancel
Save