2 changed files with 205 additions and 1 deletions
@ -0,0 +1,198 @@ |
|||||
|
<template> |
||||
|
<section> |
||||
|
<div v-text="createSource()"></div> |
||||
|
</section> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
|
||||
|
import treeTool from '@/components/mdp-ui/js/treeTool.js' |
||||
|
export default { |
||||
|
computed: { |
||||
|
...mapGetters([ |
||||
|
'userInfo' |
||||
|
]) |
||||
|
}, |
||||
|
props:{ |
||||
|
visible:{ |
||||
|
type:Boolean, |
||||
|
default:false, |
||||
|
}, |
||||
|
formDef:{ |
||||
|
type:Object, |
||||
|
default:null, |
||||
|
}, |
||||
|
formFields:{ |
||||
|
type:Array, |
||||
|
default:[] |
||||
|
}, |
||||
|
}, |
||||
|
watch: { |
||||
|
'visible':function(visible) { |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
|
||||
|
var options={ |
||||
|
list: [{name:'选项0'},{name:'选项1'},{name:'选项2'}], |
||||
|
yesOrNo: [{name:'否'},{name:'是'}], |
||||
|
} |
||||
|
return { |
||||
|
source:'', |
||||
|
dbForm:{ |
||||
|
owner:'',//数据库用户 |
||||
|
tableName:'', |
||||
|
}, |
||||
|
aiForm:{ |
||||
|
columnListStr:'',//表格配置信息黏贴 |
||||
|
}, |
||||
|
apiForm:{ |
||||
|
url:'', |
||||
|
method:'GET', |
||||
|
params:'', |
||||
|
headers:'',//{Authorization:"Bearer jwtTokenXXadkfdfdadfd"} |
||||
|
useMyLoginToken:true, |
||||
|
parseDataFunc:'', |
||||
|
}, |
||||
|
pickerOptions:this.$mdp.getPickerOptions(), |
||||
|
options:options, |
||||
|
|
||||
|
load:{list: false,}, |
||||
|
addFormRules: { |
||||
|
id: [ |
||||
|
{ required: false, message: '主键', trigger: 'blur' } |
||||
|
] |
||||
|
}, |
||||
|
addForm: {formId:'formId',showStyle:'origin',id:'one',idCamel:'one',title:'文本',typ:'text',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',dict:'',gname:'',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
myFormDef:{tableName:'',tableOwner:'',isCreateTable:'',formName:'',userid:'',deptid:'',formType:'',isTemplate:'',bizType:'',ctime:'',branchId:''}, |
||||
|
fields:[], |
||||
|
sampleFields:[ |
||||
|
{formId:'formId',showStyle:'origin',id:'one',idCamel:'one',title:'输入框',dict:'',gname:'',typ:'text',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'多行输入框',dict:'',gname:'',typ:'textarea',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four1',idCamel:'four1',title:'html',dict:'',gname:'',typ:'text',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'html',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four2',idCamel:'four2',title:'图片',dict:'',gname:'',typ:'image',len:24,span:24,dval:'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'image',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four3',idCamel:'four3',title:'文件',dict:'',gname:'',typ:'att',len:24,span:24,dval:'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'att',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four4',idCamel:'four4',title:'链接',dict:'',gname:'',typ:'link',len:24,span:24,dval:'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'link',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
{formId:'formId',showStyle:'origin',id:'two',idCamel:'two',title:'数字',dict:'',gname:'',typ:'number',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'three',idCamel:'three',title:'金额',dict:'',gname:'',typ:'amount',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
{formId:'formId',showStyle:'origin',id:'five',idCamel:'five',title:'单选下拉',dict:'',gname:'',plusOptions:options.list,typ:'select',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'six',idCamel:'six',title:'多选下拉',dict:'',gname:'',plusOptions:options.list,typ:'select',len:24,span:24,dval:'',mul:'1',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
{formId:'formId',showStyle:'origin',id:'seven',idCamel:'seven',title:'单选',dict:'',gname:'',plusOptions:options.yesOrNo,typ:'radio',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'eight',idCamel:'eight',title:'单选框',dict:'',gname:'',plusOptions:options.list,typ:'checkbox',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'nine',idCamel:'nine',title:'多选框',dict:'',gname:'',plusOptions:options.list,typ:'checkbox',len:24,span:24,dval:'',mul:'1',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
{formId:'formId',showStyle:'origin',id:'ten',idCamel:'ten',title:'时间',dict:'',gname:'',typ:'time',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'eleven',idCamel:'eleven',title:'日期',dict:'',gname:'',typ:'date',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'twelve',idCamel:'twelve',title:'日期时间',dict:'',gname:'',typ:'datetime',len:24,span:24,dval:'',mul:'0',hol:'请输入日期时间',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'thirteen',idCamel:'thirteen',title:'年',dict:'',gname:'',typ:'year',len:24,span:24,dval:'',mul:'0',hol:'请选中年份',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'fourteen',idCamel:'fourteen',title:'月',dict:'',gname:'',typ:'month',len:24,span:24,dval:'',mul:'0',hol:'请选中月份',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',id:'141',showStyle:'origin',id:'fourteen1',idCamel:'fourteen1',title:'日期区间',dict:'',gname:'',typ:'daterange',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
{formId:'formId',showStyle:'origin',id:'fifteen',idCamel:'fifteen',title:'部门',dict:'',gname:'',typ:'select',len:24,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'dept',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'seventeen',idCamel:'seventeen',title:'员工',dict:'',gname:'',typ:'select',len:24,span:24,dval:'',mul:'1',hol:'支持多选',req:'0',remark:'属性',extType:'user',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'nineteen',idCamel:'nineteen',title:'标签',dict:'',gname:'',typ:'select',len:24,span:24,dval:'',mul:'1',hol:'多选标签',req:'0',remark:'属性',extType:'tag',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'twenty_one',idCamel:'twentyOne',title:'布局-行',dict:'',gname:'',typ:'row',len:24,span:24,dval:'',mul:'1',hol:'行',req:'0',remark:'属性',extType:'row',toFlow:'0',bkey:'0',qx:'',isNewAdd:true, |
||||
|
children:[ |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'布局-列1',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'布局-列2',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'布局-列1',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'布局-列2',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
] |
||||
|
}, |
||||
|
{formId:'formId',showStyle:'origin',id:'twenty_two',idCamel:'twentyTwo',title:'卡片',dict:'',gname:'',typ:'card',len:24,span:24,dval:'',mul:'1',hol:'行',req:'0',remark:'属性',extType:'card',toFlow:'0',bkey:'0',qx:'',isNewAdd:true, |
||||
|
children:[ |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'卡片-列1',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'卡片-列2',dict:'',gname:'',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
] |
||||
|
}, |
||||
|
{formId:'formId',showStyle:'origin',id:'twenty_three',idCamel:'twentyThree',title:'tabs',dict:'',gname:'tab1,tab2',typ:'tabs',len:24,span:24,dval:'',mul:'1',hol:'行',req:'0',remark:'属性',extType:'tabs',toFlow:'0',bkey:'0',qx:'',isNewAdd:true, |
||||
|
children:[ |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'tab1-列1',dict:'',gname:'tab1',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'tab1-列2',dict:'',gname:'tab1',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'tab2-列1',dict:'',gname:'tab2',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'tab2-列2',dict:'',gname:'tab2',typ:'text',len:12,span:12,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
] |
||||
|
} |
||||
|
|
||||
|
], |
||||
|
delFields:[],//存放删除的属性 |
||||
|
drag:true, |
||||
|
showPopover:false, |
||||
|
activeName:'first', |
||||
|
metaItemSelected:{},//选择的基础数据二级分类代码 |
||||
|
itemOptionMngVisible:false,//基础数据弹出框 |
||||
|
fieldIds: [ |
||||
|
{id:'zero',idCamel:'zero'}, |
||||
|
{id:'one',idCamel:'one'}, |
||||
|
{id:'two',idCamel:'two'}, |
||||
|
{id:'three',idCamel:'three'}, |
||||
|
{id:'four',idCamel:'four'}, |
||||
|
{id:'five',idCamel:'five'}, |
||||
|
{id:'six',idCamel:'six'}, |
||||
|
{id:'seven',idCamel:'seven'}, |
||||
|
{id:'eight',idCamel:'eight'}, |
||||
|
{id:'nine',idCamel:'nine'}, |
||||
|
{id:'ten',idCamel:'ten'}, |
||||
|
{id:'eleven',idCamel:'eleven'}, |
||||
|
{id:'twelve',idCamel:'twelve'}, |
||||
|
{id:'thirteen',idCamel:'thirteen'}, |
||||
|
{id:'fourteen',idCamel:'fourteen'}, |
||||
|
{id:'fifteen',idCamel:'fifteen'} |
||||
|
], |
||||
|
//新增界面数据 表单数据表 |
||||
|
showData: { |
||||
|
id:'',two:'',three:'',four:'',five:'',six:'',seven:'',eight:'',nine:'',ten:'',lastTime:'',one:'',zero:'',remark:'',formId:'',userid:'',eleven:'',twelve:'',thirteen:'',fourteen:'',fifteen:'',sixteen:'',seventeen:'',eighteen:'',nineteen:'',twenty:'',deptid:'',branchId:'' |
||||
|
}, |
||||
|
sampleData:{ |
||||
|
id:'',two:'',three:'',four:'',five:'',six:'',seven:'',eight:'',nine:'',ten:'',lastTime:'',one:'',zero:'',remark:'',formId:'',userid:'',eleven:'',twelve:'',thirteen:'',fourteen:'',fifteen:'',sixteen:'',seventeen:'',eighteen:'',nineteen:'',twenty:'',deptid:'',branchId:'' |
||||
|
}, |
||||
|
primaryKeys:[], |
||||
|
defaultField:{formId:'formId',showStyle:'origin',id:'four',idCamel:'four',title:'布局-列1',dict:'',gname:'',typ:'text',len:12,span:24,dval:'',mul:'0',hol:'请输入',req:'0',remark:'属性',extType:'',toFlow:'0',bkey:'0',qx:'',isNewAdd:true}, |
||||
|
|
||||
|
/**end 在上面加自定义属性**/ |
||||
|
}//end return |
||||
|
},//end data |
||||
|
methods: { |
||||
|
// 取消按钮点击 父组件监听@cancel="addFormVisible=false" 监听 |
||||
|
handleCancel:function(){ |
||||
|
this.$emit('cancel'); |
||||
|
}, |
||||
|
createSource(){ |
||||
|
var sourceStr=""; |
||||
|
this.fields=treeTool.translateDataToTree(this.formFields,'pid','id') |
||||
|
this.fields.forEach(f=>{ |
||||
|
sourceStr="<start>"+this.createSubSource(f.children)+"</end>" |
||||
|
}) |
||||
|
return sourceStr; |
||||
|
}, |
||||
|
|
||||
|
createSubSource(children){ |
||||
|
var sourceStr="" |
||||
|
if(!children || children.length==0){ |
||||
|
return sourceStr; |
||||
|
}else{ |
||||
|
|
||||
|
} |
||||
|
children.forEach(f=>{ |
||||
|
sourceStr=sourceStr+"<start>"+this.createSubSource(f.children)+"</end>" |
||||
|
}) |
||||
|
return sourceStr; |
||||
|
} |
||||
|
},//end method |
||||
|
components: { |
||||
|
}, |
||||
|
mounted() { |
||||
|
|
||||
|
|
||||
|
}//end mounted |
||||
|
} |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<style rel="stylesheet/scss" lang="scss" scoped> |
||||
|
|
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue