优化

src/components/mdp-ui/js/treeTool.js

@@ -85,6 +85,12 @@ export default {
    * @returns
    */
   translateDataToTree: function(data2,pidName,idName,rowCallBack) {
+    if(!pidName){
+      pidName='pid'
+    }
+    if(!idName){
+      idName='id'
+    } 
     var data=JSON.parse(JSON.stringify(data2));
     let parents = data.filter(value =>{
       //如果我的上级为空，则我是最上级

src/views/mdp/form/formDef/Form.vue

@@ -181,14 +181,14 @@ export default {
                 this.$notify({position:'bottom-left',showClose:true,message: '表单名称不能为空', type: 'error' });
                 return;
             } 
-            var formFields=this.$refs.formFields.selectedFields;
+            var formFields=this.$refs.formFields.getFieldList();
             if(formFields.length==0  ){
                 this.$notify({position:'bottom-left',showClose:true,message: '最少需要定义一个字段', type: 'error' });
                 return;
             }
-            
-            if(formFields.length>15){
-                this.$notify({position:'bottom-left',showClose:true,message: '最多支持15个字段', type: 'error' });
+            var max=this.$refs.formFields.getMaxFields();
+            if(formFields.length>max){
+                this.$notify({position:'bottom-left',showClose:true,message: '最多支持'+max+'个字段', type: 'error' });
                 return;
             }
             this.$confirm('确认提交吗？', '提示', {}).then(() => { 

src/views/mdp/form/formField/Field.vue

@@ -3,12 +3,12 @@
 		<el-row v-if="field.extFieldType=='row'" slot="reference" :gutter="gutter">     
 			<template v-if="sample==true">
 				<el-col @click.ctrl.native.stop="doChildDelete(child,idx,field.children)" v-for="child,idx in field.children" :key="idx" :span="calcSpan(child,field)">
-					<mdp-field  :parent-field="field" :gutter="gutter" :span="span" v-if="child" :value="child" @change="(v)=>onChildChange(child,v)" @delete="onChildDelete" :sample="sample"></mdp-field>
+					<mdp-field  :has-child="hasChild" :parent-field="field" :gutter="gutter" :span="span" v-if="child" :value="child" @change="(v)=>onChildChange(child,v)" @delete="onChildDelete" :sample="sample"></mdp-field>
 				</el-col> 
 			</template>
-			<draggable  v-else-if="field.children && field.children.length>0" v-model="field.children" :options="{group:{ name:'g1', pull:'clone'}, animation:150}"> 
+			<draggable  v-else-if="field.children && field.children.length>0" @add="onAdd" v-model="field.children" :options="{group:{ name:'g1', pull:'clone'}, animation:150}"> 
 				<el-col @click.ctrl.native.stop="doChildDelete(child,idx,field.children)" v-for="child,idx in field.children" :key="idx" :span="calcSpan(child,field)">
-						<mdp-field  :parent-field="field" :gutter="gutter" :span="span" v-if="child" :value="child" @change="(v)=>onChildChange(child,v)" @delete="onChildDelete"></mdp-field>
+						<mdp-field  :has-child="hasChild" :parent-field="field" :gutter="gutter" :span="span" v-if="child" :value="child" @change="(v)=>onChildChange(child,v)" @delete="onChildDelete"></mdp-field>
 				</el-col> 
 			</draggable>   
 		</el-row>  
@@ -152,6 +152,20 @@
 			sample:{
 				type:Boolean,
 				default:false
+			},
+			hasChild:{
+				type:Function,
+				default:function(){
+					return null;
+				}
+			},
+			findNotInChild:{
+				type:Function,
+				default:function(){
+					return (excludeId)=>{
+						return null;
+					};
+				}
 			}
 		},
 		watch: { 
@@ -231,7 +245,28 @@
 				}else{ 
 					return this.span
 				}
+			},
+			
+			onAdd(evt){  
+				debugger;
+				let item=this.field.children[evt.newIndex];  
+				item.isNewAdd=true
+				var item2=JSON.parse(JSON.stringify(item)) 
+				var noSelectFieldId=this.findNotInChild()
+				debugger;
+				if(!noSelectFieldId){
+					this.field.children.splice(evt.newIndex,1)
+					this.$notify.error('当前组件已经超过最大数量，不能再添加');
+					return;
 				}
+				item2.id=noSelectFieldId.id
+				item2.fieldId=noSelectFieldId.fieldId
+				item2.fieldIdCamel=noSelectFieldId.fieldIdCamel  
+				delete item.isNewAdd
+				this.selectedFields[evt.newIndex]=item2;
+				this.addForm=item2; 
+										
+			},
 			
 		},//end method
 		components: {  

src/views/mdp/form/formField/FieldCfg.vue

@@ -25,19 +25,14 @@
 				  	<el-form-item label="必需" prop="isRequired" > 
 				  		<el-checkbox v-model="field.isRequired" :disabled="field.isBizKey=='1'" true-label="1" false-label="0">是否必输</el-checkbox>  
 				  	</el-form-item>
-				  	<el-form-item label="编码" prop="fieldId">
+				  	<el-form-item label="编号" prop="id">
 				  		<el-col :span="20">
-				  			<el-input  :disabled="formDef.isCreateTable!='1'" v-model="field.fieldId" :label="field.fieldId" auto-complete="off"  placeholder="请输入内容"   > </el-input>
+				  			<el-input  :disabled="formDef.isCreateTable!='1'" v-model="field.id" :label="field.id" auto-complete="off"  placeholder="请输入内容"   > </el-input>
 				  		</el-col>
 				  	</el-form-item> 
-				  	<el-form-item label="编码驼峰命名" prop="fieldIdCamel" v-if="formDef.isCreateTable=='1'">
-				  		<el-col :span="20">
-				  			<el-input  :disabled="formDef.isCreateTable!='1'" v-model="field.fieldIdCamel" :label="field.fieldIdCamel" auto-complete="off"  placeholder="请输入内容"   > </el-input>
-				  		</el-col>
-				  	</el-form-item>
-				  	<el-form-item label="变量映射" prop="flowFieldId">
+				  	<el-form-item label="编码" prop="fieldId">
 				  		<el-col :span="20">
-				  		<el-input  v-model="field.flowFieldId" label="变量" auto-complete="off"  placeholder="变量编码"   > </el-input> 
+				  			<el-input  :disabled="formDef.isCreateTable!='1'" v-model="field.fieldId" :label="field.fieldId" auto-complete="off"  placeholder="请输入内容"   > </el-input>
 				  		</el-col>
 				  	</el-form-item> 
 				  	<el-form-item label="长度" prop="fieldLength">

src/views/mdp/form/formField/Index.vue

@@ -29,10 +29,10 @@
 				    </div>
 				  </el-form-item>
 				  <el-row>
-					<draggable id="sf"  class="dragArea min-height" v-model="selectedFields" :options="{group:{ name:'g1'}, animation:150}" @add="add"  :no-transition-on-drag="true" @start="drag=true" @end="drag=false">
+					<draggable id="sf"  class="dragArea min-height" v-model="selectedFields" :options="{group:{ name:'g1'}, animation:150}" @add="onAdd"  :no-transition-on-drag="true" @start="drag=true" @end="drag=false">
 	
 							<el-col v-for="(item,index) in selectedFields" @click.ctrl.native="doChildDelete(item,index,selectedFields)" :key="index" :span="calcSpan(item)">
- 								<mdp-field  :gutter="0" :span="24" :value="item" @change="(v)=>Object.assign(item,v)"></mdp-field> 
+ 								<mdp-field :find-not-in-child="findNotInChild" :has-child="hasChild"  :gutter="0" :span="24" :value="item" @change="(v)=>Object.assign(item,v)"></mdp-field> 
 							</el-col> 
 					</draggable>
 					</el-row>
@@ -142,6 +142,7 @@ import draggable from 'vuedraggable'
 import { mapGetters } from 'vuex'
 import MdpField from './Field.vue'
 import {listTableColumn} from '@/api/mdp/form/FormField.js'
+import treeTool from '@/components/mdp-ui/js/treeTool.js'
 export default { 
 	computed: {
 		...mapGetters([
@@ -340,28 +341,22 @@ export default {
 			});
 		},
 		onTplStart(evt){ 
-			var item=evt.item 
-			var item2=JSON.parse(JSON.stringify(item)) 
-			var noSelectFieldId=this.fieldIds.find(i=>{
-				return !this.selectedFields.some(k=>k.id==i.id && k.isNewAdd!='1');
-			}) 
-			item2.id=noSelectFieldId.id
-			item2.fieldId=noSelectFieldId.fieldId
-			item2.fieldIdCamel=noSelectFieldId.fieldIdCamel 
-			item=item2
 		},
-		add(evt){ 
+		onAdd(evt){  
 			debugger;
 			let item=this.selectedFields[evt.newIndex];  
-			item.isNewAdd='1'  
 			var item2=JSON.parse(JSON.stringify(item)) 
 			var noSelectFieldId=this.fieldIds.find(i=>{
-				return !this.selectedFields.some(k=>k.id==i.id && k.isNewAdd!='1');
+				return !this.hasChild(i.id);
 			}) 
+			if(!noSelectFieldId){
+				this.selectedFields.splice(evt.newIndex,1)
+				this.$notify.error('当前组件已经超过最大数量，不能再添加');
+				return;
+			}
 			item2.id=noSelectFieldId.id
 			item2.fieldId=noSelectFieldId.fieldId
 			item2.fieldIdCamel=noSelectFieldId.fieldIdCamel  
-			item2.isNewAdd='0'
 			this.selectedFields[evt.newIndex]=item2;
 			this.addForm=item2; 
 									
@@ -553,12 +548,61 @@ export default {
 		return axiosObj
 	},
 	doChildDelete(child,idx,children){ 
-		debugger;
 		children.splice(idx,1)
 		this.$emit('delete',child,idx,children)
 	},
-		/**end 在上面加自定义方法**/
+	hasChild(id){
+		return this.hasMyChild(id,this.selectedFields)
+	},
+	hasMyChild(id,children){
+		debugger;
+		if(!children||children.length==0){
+			return false;
+		}else{
+			 if(children.some(c=>c.id==id && c.isNewAdd!=true)){
+				return true
+			 }else{
+				for(var i=0;i<children.length;i++){
+					var childs=children[i].children
+					var has= this.hasMyChild(id,childs)
+					if(has){
+						return true;
+					}else{
+						continue;
+					}
+				}
+				return false;
+			 }
+		}
+	},
+	findNotInChild(){
+		return this.fieldIds.find(i=>{
+			return !this.hasChild(i.id);
+		})  
+	},
+	getMyFieldList(list,children){
+		if(children && children.length>0){
+			children.forEach(k=>{
+				if(k.children && k.children.length>0){
+					var childs=k.children
+					delete k.children
+					list.push(k)
+					this.getMyFieldList(list,childs)
+				}else{
+					list.push(k)
+				}
+			})
+		}
 		
+	},
+	getFieldList(){
+		var list=[]
+		this.getMyFieldList(list,this.selectedFields)
+		return list;
+	},
+	getMaxFields(){
+		return this.fieldIds.length
+	}
 	},//end method
 	components: {  
 		//在下面添加其它组件 'form-field-edit':FormFieldEdit
@@ -568,7 +612,7 @@ export default {
 		
 		this.myFormDef=this.formDef
 		if(this.formFields){
-			this.selectedFields=JSON.parse(JSON.stringify(this.formFields))
+			this.selectedFields=treeTool.translateDataToTree(this.formFields,'groupId','id')
 		}else{
 			this.selectedFields=[]
 		}