移动端关联表单组件数据填充功能

src/components/formTable/formItemGroup.vue

@@ -6,6 +6,7 @@
 <script lang='ts' setup>
 import { onBeforeRouteLeave } from 'vue-router'
 import { FormList } from "@/api/lowCode/form/type"
+import request from '@/utils/axios/index'
 import { jsonParseStringify,getGroupName } from '@/utils/lowCode/item/index'
 import { constFormBtnEvent,constFormProps } from '@/api/lowCode/utils';
 import { useDesignFormStore } from '@/utils/pinia/stores/lowCode/designForm'
@@ -46,6 +47,7 @@ const activeKey = computed(() => {
 onMounted(() => {
     // console.log("初始", state)
     // console.log("初始1", dataList.value)
+	getAsfs()
 })
 watch(()=>dataList.value,(val:any) => {
     // console.log("监听组件列表变化", val)
@@ -78,7 +80,7 @@ const getFormItemDivStyle = (ele: any) => {
 
 const getFormItemLableStyle = (ele: any) => {
     if(ele?.labelStyle){ 
-      console.log("返回栅格宽度3",AnalysisCss(ele))
+      //console.log("返回栅格宽度3",AnalysisCss(ele))
     	return AnalysisCss(ele?.labelStyle)
     }
 }
@@ -94,6 +96,373 @@ const clickBtn = (control: any) => {
 		injectBtnEvent && injectBtnEvent(control)
     }
 }
+//liwenxuan 关联表单数据填充 241219 start
+let emits = defineEmits(["asfValueChanged"]);
+const asfs: any[] = [];
+const tables: any[] = [];
+
+function getAsfs() {
+	setTimeout(() => {
+		let dataList = ref({});
+		dataList.value = props.data
+
+		if (dataList && Array.isArray(dataList.value) && dataList.value.length > 0) {
+		for (let i = 0; i < dataList.value.length; i++) {
+			//console.log(dataList.value[i])
+			if (dataList.value[i].type == "associatedForms") {
+			asfs.push(dataList.value[i]);
+			} else if (
+			dataList.value[i].type == "card" ||
+			dataList.value[i].type == "flex" ||
+			dataList.value[i].type == "div" ||
+			dataList.value[i].type == "table"
+			) {
+			if (dataList.value[i].type == "table") {
+				tables.push(dataList.value[i]);
+			}
+
+			dataList.value[i].list.forEach((element: any) => {
+				if (element.type == "associatedForms") {
+				asfs.push(element);
+				}
+			});
+			} else if (dataList.value[i].type == "grid") {
+			let columns = JSON.parse(JSON.stringify(dataList.value[i].columns));
+
+			if (columns.length > 0) {
+				for (let z = 0; z < columns.length; z++) {
+				for (let x = 0; x < columns[z].list.length; x++) {
+					let a = JSON.parse(JSON.stringify(columns[z].list[x]));
+
+					if (a.type == "associatedForms") {
+					asfs.push(a);
+					}
+				}
+				}
+			}
+			} else if (dataList.value[i].type == "tabs") {
+			//tabs标签页有可能再嵌套一层flex或者table
+			let columns = JSON.parse(JSON.stringify(dataList.value[i].columns));
+			if (columns.length > 0) {
+				for (let z = 0; z < columns.length; z++) {
+				for (let x = 0; x < columns[z].list.length; x++) {
+					let a = JSON.parse(JSON.stringify(columns[z].list[x]));
+
+					if (a.type == "associatedForms") {
+					asfs.push(a);
+					} else if (a.type == "flex" || a.type == "table") {
+					if (a.type == "table") {
+						tables.push(dataList.value[i]);
+					}
+
+					if (a.list.length > 0) {
+						for (let m = 0; m < a.list.length; m++) {
+						let q = JSON.parse(JSON.stringify(a.list[m]));
+
+						if (q.type == "associatedForms") {
+							asfs.push(q);
+						}
+						}
+					}
+					}
+				}
+				}
+			}
+			}
+		}
+		}
+	}, 500);
+}
+
+function asfValueChanged(val: any) {
+	//alert(1)
+	/* console.log("formItemGroup-asfValueChanged",val)
+		console.log(val.currentVal)
+		console.log(val.fillFieldsMaster)
+		console.log(val.fillFieldsChild) */
+
+	//[key][props.rowIndex][key1]
+	/* console.log(val.tableFlag)
+		console.log(val.key)
+		console.log(val.propsRowIndex)
+		console.log(val.key1) */
+	let fillFieldsMaster = "";
+	let masterFillRoleFieldsArray1: any[] = [];
+
+	if (val.fillFieldsMaster.length > 0) {
+		fillFieldsMaster = val.fillFieldsMaster.substring(0, val.fillFieldsMaster.length - 1);
+		let masterFillRoleFieldsArray = fillFieldsMaster.split(";");
+		//console.log(masterFillRoleFieldsArray)
+		masterFillRoleFieldsArray.forEach((item: any) => {
+		let itemArray = item.split("_");
+		itemArray.splice(0, 1);
+
+		itemArray = itemArray.map((item1: any) => item1.split(":").pop());
+		//console.log(itemArray)
+		masterFillRoleFieldsArray1.push(itemArray);
+		});
+	}
+
+	if (val.fillFieldsChild && val.fillFieldsChild.length > 0) {
+		/* console.log(val.asfFormId)
+			console.log(val.masterOnField) */
+		let fillFieldsChild = JSON.parse(val.fillFieldsChild);
+		if (fillFieldsChild && fillFieldsChild.length > 0) {
+		fillFieldsChild = fillFieldsChild.filter((element: any) => {
+			if (containsDangerousWords(element.filterCondition.gongShi.mathsFormula)) {
+			//alert("筛选条件非法")
+			console.log("筛选条件非法===>" + element.filterCondition.conditionHtml);
+			} else {
+			return element;
+			}
+		});
+		}
+		//console.log(fillFieldsChild)
+		
+		
+		getAsfTableFill(val.asfFormId, val.glbbddbd, val.currentVal, fillFieldsChild).then(
+		({ data }) => {
+			//console.log(data)
+			if (data && data.length > 0) {
+			data.forEach((dataElement: any) => {
+				tables.forEach((tableItem: any) => {
+				if (dataElement.tableName == tableItem.name) {
+					//console.log(formProps.value.model)
+					//console.log(tableItem)
+					//console.log(dataElement)
+					let tableName = dataElement.tableName;
+					//console.log(tableName)
+					if (tableItem.list.length > 0) {
+					let tableRowArray: { type: any; name: any }[] = [];
+					tableItem.list.forEach((listItem: any) => {
+						//console.log(listItem)
+						tableRowArray.push({
+						type: listItem.type,
+						name: listItem.name,
+						});
+					});
+					//console.log(tableRowArray)
+					const result = generateXResult(dataElement, tableRowArray);
+					//console.log(result);
+					formProps.value.model[tableName] = result;
+					}
+				}
+				});
+			});
+			}
+		}
+		);
+	}
+
+	//emits("asfValueChanged",val)
+	if (val.options.length > 0) {
+		//console.log(val.options)
+		if (val.options[0].fillRolesFieldsMap) {
+		val.options.forEach((item: any) => {
+			if (item.fillRolesFieldsMap.value == val.currentVal) {
+			//console.log(masterFillRoleFieldsArray1)
+			if (masterFillRoleFieldsArray1.length > 0) {
+				masterFillRoleFieldsArray1.forEach((item1: any) => {
+				//console.log(item.fillRolesFieldsMap)
+				//console.log(item1)
+				let x = convertObjectToArray(getNewObject(item.fillRolesFieldsMap, item1));
+				//console.log(x)
+				let strOrNumber = convertToStringOrNumber(x[1]);
+				let strOrNumberOrArray;
+				if (isString(strOrNumber) && strOrNumber.includes("[")) {
+					strOrNumberOrArray = convertIfValidNumberArray(strOrNumber);
+				}
+				/* console.log(strOrNumber)
+								console.log(strOrNumberOrArray) */
+
+				/* console.log(x[1])
+								console.log(strOrNumberOrArray)
+								console.log(formProps.value.model[x[0]]) */
+				if (strOrNumberOrArray) {
+					formProps.value.model[x[0]] = strOrNumberOrArray;
+				} else {
+					/* console.log(x)
+									console.log(formProps.value.model)
+									console.log(val.tableFlag)
+									console.log(val.key)
+									console.log(val.propsRowIndex)
+									console.log(val.key1) */
+
+					if (val.tableFlag) {
+					//console.log(formProps.value.model)
+					let urlArr = findPathInObject(formProps.value.model, x[0]);
+					//console.log(urlArr)
+					if (urlArr[0] == x[0]) {
+						formProps.value.model[x[0]] = strOrNumber;
+					} else {
+						formProps.value.model[val.key][val.propsRowIndex][x[0]] = strOrNumber;
+					}
+					} else {
+					formProps.value.model[x[0]] = strOrNumber;
+					}
+				}
+
+				//console.log(formProps.value.model[x[0]])
+				});
+			}
+			}
+		});
+		}
+	}
+	}
+
+function getNewObject(obj: any, arr: any) {
+	//console.log(obj)
+	//console.log(arr)
+	let key = arr[0];
+	let newKey = arr[1];
+	if (obj[key]) {
+		return { [newKey]: obj[key] };
+	}
+	return {};
+}
+
+	function findPathInObject(obj: any, target: string): string[] {
+		function search(obj: any, target: string, path: string[] = []): string[] | null {
+			if (typeof obj === "object" && obj !== null) {
+			for (let key in obj) {
+				let newPath = path.concat(key);
+				if (key === target) {
+				return newPath;
+				} else if (Array.isArray(obj[key])) {
+				for (let i = 0; i < obj[key].length; i++) {
+					let result = search(obj[key][i], target, newPath);
+					if (result) {
+					return result;
+					}
+				}
+				} else if (typeof obj[key] === "object" && obj[key] !== null) {
+				let result = search(obj[key], target, newPath);
+				if (result) {
+					return result;
+				}
+				}
+			}
+			}
+			return null;
+		}
+
+		return search(obj, target) || [];
+	}
+
+	interface DetailObject {
+	[key: string]: any;
+	}
+
+	interface TableRow {
+	type: string;
+	name: string;
+	}
+
+	function generateXResult(
+	dataElement: { tableDetail: DetailObject[] },
+	tableRowArray: TableRow[]
+	): DetailObject[] {
+	const xResult: DetailObject[] = [];
+	const propertyNames = tableRowArray.map((item) => item.name);
+	for (const detail of dataElement.tableDetail) {
+		const obj: DetailObject = {};
+		propertyNames.forEach((name) => {
+		let strOrNumber = convertToStringOrNumber(detail[name]);
+		let strOrNumberOrArray;
+		if (isString(strOrNumber) && strOrNumber.includes("[")) {
+			strOrNumberOrArray = convertIfValidNumberArray(strOrNumber);
+		}
+		if (strOrNumberOrArray) {
+			obj[name] = strOrNumberOrArray;
+		} else {
+			obj[name] = strOrNumber;
+		}
+		});
+		xResult.push(obj);
+	}
+	return xResult;
+	}
+	function getAsfTableFill(
+	asfFormId: any,
+	glbbddbd: any,
+	currentVal: any,
+	fillFieldsChild: any
+	) {
+	/* console.log(asfFormId)
+		console.log(glbbddbd)
+		console.log(fillFieldsChild) */
+	/* asfFormId = JSON.stringify(asfFormId)
+		glbbddbd = JSON.stringify(glbbddbd)
+		currentVal = JSON.stringify(currentVal) */
+	fillFieldsChild = JSON.stringify(fillFieldsChild);
+	return request({
+		url: "/javasys/lowCode/AssociatedForms/getAsfTableFill",
+		method: "post",
+		data: {
+		asfFormId: asfFormId,
+		glbbddbd: glbbddbd,
+		currentVal: currentVal,
+		fillFieldsChild: fillFieldsChild,
+		},
+	});
+	}
+	function containsDangerousWords(str: string | undefined): boolean {
+	if (str === undefined) {
+		return false;
+	}
+	const dangerousWords = new Set<string>([
+		"drop",
+		"table",
+		"where",
+		"select",
+		"insert",
+		"update",
+		"delete",
+		"and",
+		"or",
+		"union",
+		"order by",
+		"group by",
+		"having",
+		"exec",
+		"execute",
+	]);
+	const words = str.split(" ");
+	for (const word of words) {
+		if (dangerousWords.has(word.toLowerCase())) {
+		return true;
+		}
+	}
+	return false;
+	}
+	function isString(value: any): value is string {
+	return typeof value === "string";
+	}
+	function convertIfValidNumberArray(str: string): number[] | null {
+	const regex = /^\[(\d+(,\d+)*)?\]$/;
+	if (regex.test(str)) {
+		const numbersStr = str.slice(1, -1);
+		if (numbersStr.length === 0) {
+		return [];
+		}
+		return numbersStr.split(",").map((item) => Number(item));
+	} else {
+		return null;
+	}
+	}
+	function convertToStringOrNumber(str: string): number | string {
+	const isOnlyNumbers = /^\d+$/.test(str);
+	return isOnlyNumbers ? Number(str) : str;
+	}
+	function convertObjectToArray(obj: any) {
+	for (let key in obj) {
+		return [key, obj[key]];
+	}
+	return [];
+	}
+
+//liwenxuan 关联表单数据填充 241219 end
 // 根据表单设置不显示指定字段
 const linksIf = (obj: FormList) => {
 	const { type } = formProps.value;
@@ -168,7 +537,7 @@ const linksIf = (obj: FormList) => {
 				</template>
 				<template v-else-if="element.type === 'table'">
 					<el-text v-if="element.item&&element.item.name">{{element.item.name}}}</el-text>
-					<TablePage  :data="element" :type="type"  />
+					<TablePage  :data="element" :type="type" @asf-value-changed="asfValueChanged" />
 				</template>
 				<template v-else-if="element.type === 'grid'">
 					<el-row class="form-row" :style="type === 15?'padding: 0 0 20px 0;':''" :class="[element.className]">
@@ -258,7 +627,7 @@ const linksIf = (obj: FormList) => {
 						</el-button>
 					</div>
 				</template>
-				<FormItem v-else :data="element" />
+				<FormItem v-else :data="element" @asf-value-changed="asfValueChanged" />
 			</div>
         </div>
     

src/components/lowCode/formItem.vue

@@ -62,6 +62,10 @@ const emits = defineEmits<{
 	(e: 'optionsValue3Get1', val: any,fieldName: string): void
 	(e: 'asfValueChanged', val: any): void
 }>()
+function asfValueChanged(val:any){
+	//console.log("formItem-asfValueChanged",val)
+	emits("asfValueChanged",val)
+}
 const route = useRoute()
 const formProps = inject(constFormProps, {}) as any
 const imgUploadApiUrl = import.meta.env.VITE_APP_BASE_API+"/api/upordown"
@@ -782,6 +786,7 @@ const currentComponent = computed(() => {
                     :options="options"
                     :row-index = "rowIndex"
                     v-model="value"
+                    @asf-value-changed="asfValueChanged"
                 />
                 <!--穿梭框-->
                 <component

src/components/lowCode/tablePage.vue

@@ -183,7 +183,7 @@ const emits = defineEmits<{
 }>()
 
 function asfValueChanged(val:any){
-	//console.log("childTable-asfValueChanged",val)
+	console.log("tablePage-asfValueChanged",val)
 	emits("asfValueChanged",val)
 }
 </script>

src/views/formTable/page/cardPage.vue

@@ -151,7 +151,7 @@ const asfGetPageData = (asfFormId: any,asfToSelectMastersKey: any) => {
 	gainFormPageListCont(sendData)
 		.then((data)=>{
 			
-			//console.log("获取列表详细信息----------------->",data)
+			console.log("获取列表详细信息----------------->",data)
 			//liwenxuan 关联表单数据获取 start
 			
 			let dataList = data
@@ -172,6 +172,7 @@ const asfGetPageData = (asfFormId: any,asfToSelectMastersKey: any) => {
 					asfQueryParamsItem.field = asfDetails[j].field
 					
 					let asfToSelectIds = []
+                    console.log(data.data.list)
 					for(let i = 0;i<data.data.list.length;i++){
 						let asfMasterAndAsfId:any = {}
 						asfMasterAndAsfId.asfId = data.data.list[i][asfDetails[j].field]
@@ -736,7 +737,7 @@ defineExpose({
                                 </tr> 
                                 <tr v-else-if="item.attribute!='-'&&item.attribute!='checkBut'&&item.attribute!='check'&&item.attribute!='but'"   @click="openLook(itval)">
                                     <td class="cardInfoTitle leftTdWat">{{item.label}}：</td>
-                                    <td v-if="item.fieldClass==='associatedForms'" class="cardInfoTitleAsf" @click="showAsfDetailDialog(item, itval, asfQueryParams); $event.stopPropagation();">{{itval[item.field]}}</td>
+                                    <td v-if="item.fieldClass==='associatedForms'" class="cardInfoTitleAsf" ><span @click="showAsfDetailDialog(item, itval, asfQueryParams); $event.stopPropagation();">{{itval[item.field]}}</span></td>
                                     <td v-else class="cardInfoTitle">{{itval[item.field]}}</td><!-- liwenxuan {{itval[item.field]}}-->
                                 </tr> 
                                 <tr v-else-if="item.attribute=='checkBut'&&item.field=='-'">