diff --git a/src/api/DesignForm/requestapi.ts b/src/api/DesignForm/requestapi.ts
index 75983c970..2316bcd84 100644
--- a/src/api/DesignForm/requestapi.ts
+++ b/src/api/DesignForm/requestapi.ts
@@ -424,3 +424,35 @@ export function createAppForm(data: any) {
 		data: data
 	});
 }
+//获取app页面综合信息
+export function gainAppPageInfo(data: any) {
+	return request({
+		url: '/systemapi/app/gainAppPageInfo',
+		method: 'post',
+		data: data
+	});
+}
+//编辑App表单数据
+export function editAppPageInfo(data: any) {
+	return request({
+		url: '/systemapi/app/editAppPageInfo',
+		method: 'post',
+		data: data
+	});
+}
+//保存新版本
+export function saveOtherVersion(data: any) {
+	return request({
+		url: '/systemapi/app/saveOtherVersion',
+		method: 'post',
+		data: data
+	});
+}
+//预览App多版本表单页面
+export function previewAppFormVersion(data: any) {
+	return request({
+		url: '/systemapi/app/previewAppFormVersion',
+		method: 'post',
+		data: data
+	});
+}
diff --git a/src/api/date/type.ts b/src/api/date/type.ts
index 12c679d6b..3fa1ded1b 100644
--- a/src/api/date/type.ts
+++ b/src/api/date/type.ts
@@ -193,3 +193,97 @@ export let threeShiyanData = [
 		]
 	}
 ];
+
+//初始化App表单数据查看
+export interface appPageDataInit {
+	appFlow:boolean;	
+	appForm?:appFormInfo;	
+	page:boolean;	
+	pageList:boolean;	
+	workFlow?:appWorkFlow;	
+}
+//App表单结构
+export interface appFormInfo{
+	authorizationRoles: string;
+	authorizedOrg: string;
+	authorizedPersonnel: string;
+	authorizedPosition: string;
+	cfid: number;
+	classify: number;
+	creater: number;
+	dict: string;
+	editTime: number;
+	flowIsOpen: number;
+	flowkey: number;
+	groupid: number;
+	icon: string;
+	id: number;
+	listPage: string;
+	listjson: string;
+	mastesform: string;
+	mastesformjson: string;
+	name: string;
+	permit: string;
+	permitstr: string;
+	postpermit: string;
+	powerstr: string;
+	signCode: number;
+	status: number;
+	table_structure: string;
+	tablekey: string;
+	time: number;
+	userpermit: string;
+	version: number;
+	visibility: number;
+}
+//app工作流结构
+export interface appWorkFlow{
+	directorMaxLevel: number;
+	flowPermission: appFlowPermission[];
+	nodeConfig: appNodeConfig;
+	tableId: string;
+}
+//节点操作人结构
+export interface appFlowPermission{
+	icon: string;
+	iconToBase64: string;
+	name: string;
+	targetId: string;
+	type: number;
+}
+//app流程节点结构
+export interface appNodeConfig{
+	attribute: number;
+	ccSelfSelectFlag: number;
+	childNode: appNodeConfig;
+	conditionList: string;
+	conditionNodes: string;
+	customNode: string;
+	directorLevel: number;
+	error: false
+	examineEndDirectorLevel: number;
+	examineMode: number;
+	executionaddress: string;
+	fromNode: string;
+	gotoNode: string[];
+	matrix: appMatrix;
+	noHanderAction: number;
+	nodeName: string;
+	nodeNumber: string;
+	nodeUserList: string;
+	priorityLevel: number;
+	selectMode: number;
+	selectRange: number;
+	sendBackNode: string;
+	settype: number;
+	type: number;
+}
+//app工作流附件
+export interface appMatrix{
+	factorName: string;
+	factorid: number;
+	matrixName: string;
+	matrixid: number;
+	outcomeName: string;
+	outcomeid: number;
+}
diff --git a/src/components/DesignForm/dragControlApp.vue b/src/components/DesignForm/dragControlApp.vue
index c68f84d61..5414cd498 100644
--- a/src/components/DesignForm/dragControlApp.vue
+++ b/src/components/DesignForm/dragControlApp.vue
@@ -21,6 +21,9 @@ const props = withDefaults(
     {}
 )
 const designType = inject('formDesignType') as string	//注入一个由祖先组件或整个应用 (通过 app.provide()) 提供的值。
+const isSearch = computed(() => {
+    return designType === 'search'
+})
 // 默认搜索允许显示的字段
 const searchField = [
     'input',
@@ -62,6 +65,7 @@ const tableVersion = ref()	//版本显示器
 
 const emits = defineEmits<{
 	(e: 'versionUpdateForm', value: string): void
+	(e: 'versionPreviewPage', value: string): void
 }>()
 /**
 @ 作者: 秦东
@@ -74,6 +78,14 @@ const enableOrDisable = (val?:any) =>{
 }
 /**
 @ 作者: 秦东
+@ 时间: 2024-05-21 09:05:20
+@ 功能: 预览版本
+*/
+const previewPage = (val?:any) =>{
+	emits('versionPreviewPage', val)
+}
+/**
+@ 作者: 秦东
 @ 时间: 2024-05-09 11:40:15
 @ 功能: 打开版本选择页面
 */
@@ -106,10 +118,11 @@ const clone = (origin: any) => {
 </script>
 <template>
 	<div class="components-list">
-		<div v-for="(list, index) in controlList" :key="index">
+		<div  v-for="(list, index) in controlList" :key="index">
 			<div class="title">
 				{{ list.title }}
 				<div
+					v-if="index === 0 && !isSearch"
 					class="template"
 					@click="useVersionClick"
 				>
@@ -136,7 +149,7 @@ const clone = (origin: any) => {
 			</draggable>
 		</div>
 	</div>
-	<FormVersion ref="tableVersion" :table-key="props.tableKey" :sign-code="props.signCode" @enableOrDisable="enableOrDisable" />
+	<FormVersion ref="tableVersion" :table-key="props.tableKey" :sign-code="props.signCode" @enableOrDisable="enableOrDisable" @previewPage="previewPage" />
 </template>
 <style  lang='scss' scoped>
 .tab_pane_body{
diff --git a/src/components/DesignForm/dragControlNew.vue b/src/components/DesignForm/dragControlNew.vue
index e35e34ef4..726cf46c4 100644
--- a/src/components/DesignForm/dragControlNew.vue
+++ b/src/components/DesignForm/dragControlNew.vue
@@ -21,6 +21,9 @@ const props = withDefaults(
     {}
 )
 const designType = inject('formDesignType') as string	//注入一个由祖先组件或整个应用 (通过 app.provide()) 提供的值。
+const isSearch = computed(() => {
+    return designType === 'search'
+})
 // 默认搜索允许显示的字段
 const searchField = [
     'input',
@@ -113,6 +116,7 @@ const clone = (origin: any) => {
 			<div class="title">
 				{{ list.title }}
 				<div
+					v-if="index === 0 && !isSearch"
 					class="template"
 					@click="useVersionClick"
 				>
diff --git a/src/components/DesignForm/formControlProperties.vue b/src/components/DesignForm/formControlProperties.vue
index 6a06faabf..7e01b6cf3 100644
--- a/src/components/DesignForm/formControlProperties.vue
+++ b/src/components/DesignForm/formControlProperties.vue
@@ -31,7 +31,9 @@ const props = withDefaults(
         formConfig: any
         formOtherData: any
         customerformid: number | string,
-		formInfo: any
+		formInfo: any,
+		isEdit: boolean,
+		formField: any[],
     }>(),
     {
         formConfig: () => {
@@ -40,7 +42,13 @@ const props = withDefaults(
         formOtherData: () => {
             // 其他不需要保存在formData里的数据
             return {}
-        }
+        },
+		isEdit: () =>{
+			return false;
+		},
+		formField: () =>{
+			return [];
+		}
     }
 )
 //注册自定义事件
@@ -222,6 +230,13 @@ const isNotWrite = (val:any) =>{
     }
     return false
 }
+const isNotWriteWord = (val:any) =>{
+
+	if(val.eventName === "filedNameKey" && props.customerformid != "" && props.formField.includes(val.value)){
+        return true
+    }
+    return false
+}
 /**
 @ 作者: 秦东
 @ 时间: 2024-03-18 11:42:52
@@ -1093,7 +1108,12 @@ const controlChange = (obj: any, val: any) => {
             break
         case 'labelNameVal':
             if(val != ""){
-                chineseToPinyin({title:val,types:8,connector:"",formJson:JSON.stringify(props.formInfo)})
+				// console.log("props.customerformid",props.customerformid)
+				// console.log("props.formField",props.formField)
+				// console.log("props.formField.includes(obj.value)",props.formField.includes(controlData.value.name))
+				// console.log("obj.value",controlData.value.name)
+				if(!props.formField.includes(controlData.value.name)){
+					chineseToPinyin({title:val,types:8,connector:"",formJson:JSON.stringify(props.formInfo)})
                     .then((data:any)=>{
                         if(data.code == 0){
                             if(data.data != ""){
@@ -1127,6 +1147,8 @@ const controlChange = (obj: any, val: any) => {
                             
                         }
                     })
+				}
+                
             }
                 
                 // console.log("字段编辑--fileSignAry--》",fileSignAry)
@@ -1601,6 +1623,7 @@ const controlDataStyls = computed(() => {
                                     :type="item.inputStyle"
                                     v-model="item.value"
                                     :placeholder="item.placeholder"
+									:disabled="isNotWriteWord(item)"
                                     @input="controlChange(item, $event)"
                                 />
 							</el-form-item>
diff --git a/src/components/DesignForm/formVersion.vue b/src/components/DesignForm/formVersion.vue
index 40f6e57a3..01aa421d2 100644
--- a/src/components/DesignForm/formVersion.vue
+++ b/src/components/DesignForm/formVersion.vue
@@ -17,6 +17,7 @@ const props = withDefaults(
 const emits = defineEmits<{
     (e: 'click', value: string): void
 	(e: 'enableOrDisable', value: string): void
+	(e: 'previewPage', value: string): void
 }>()
 const isOpen = ref(false)
 const versionList = ref<customerFormVersionCont[]>([])			//版本内容列表
@@ -34,7 +35,14 @@ const setupStatus = (val:any) =>{
 			emits('enableOrDisable', val.id.toString())
 		});
 }
-
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 09:09:27
+@ 功能: 预览版本
+*/
+const lookAppPage = (val:string) => {
+	emits('previewPage', val.toString())
+}
 /**
 @ 作者: 秦东
 @ 时间: 2024-05-08 14:55:50
@@ -98,20 +106,26 @@ const setColor = (val:number) => {
 				<el-timeline style="max-width: 600px">
 					<el-timeline-item   v-for="item in versionList" :key="item.id"  placement="top" :color="setColor(item.status)">
 						<el-card v-if="item.status==1" >
-							<el-row>
+							<el-row @click="lookAppPage(item.id)">
 								<el-col>版本：V{{ item.version }}</el-col>
 								<el-col>创建人：{{ item.createrName }}</el-col>
 								<el-col>创建时间：{{ item.dayTime }}</el-col>
-								<el-col style="text-align:right"><el-button text type="success" size="small" disabled>使用中</el-button></el-col>
 							</el-row>
+							<div style="text-align:right">
+								<el-button text type="success" size="small" disabled>使用中</el-button>
+								<el-button text type="warning" size="small"  @click="lookAppPage(item.id)">预览</el-button>
+							</div>
 						</el-card>
 						<el-card v-else >
-							<el-row>
+							<el-row @click="lookAppPage(item.id)">
 								<el-col>版本：V{{ item.version }}</el-col>
 								<el-col>创建人：{{ item.createrName }}</el-col>
 								<el-col>创建时间：{{ item.dayTime }}</el-col>
-								<el-col style="text-align:right"><el-button  type="primary" size="small" @click="setupStatus(item)">启用</el-button></el-col>
 							</el-row>
+							<div style="text-align:right">
+								<el-button  type="primary" size="small" @click="setupStatus(item)">启用</el-button>
+								<el-button  type="warning" size="small" @click="lookAppPage(item.id)">预览</el-button>
+							</div>
 						</el-card>
 					</el-timeline-item>
 					
diff --git a/src/components/DesignForm/tableListPage/index.vue b/src/components/DesignForm/tableListPage/index.vue
index cd1cacdeb..0dd95530d 100644
--- a/src/components/DesignForm/tableListPage/index.vue
+++ b/src/components/DesignForm/tableListPage/index.vue
@@ -297,6 +297,9 @@ const getPageData = () => {
 			state.total = data.data.total
 			state.loading = false;
 		})
+		.finally(()=>{
+			state.loading = false;
+		})
 }
 onMounted(()=>{
 	getPageData()
diff --git a/src/components/workflow/addNode.vue b/src/components/workflow/addNode.vue
index fbe6e33a5..e40f45ff8 100644
--- a/src/components/workflow/addNode.vue
+++ b/src/components/workflow/addNode.vue
@@ -195,7 +195,7 @@ const addType = (type:any)=> {
                 </div>
 				<template #reference>
                     <button class="btn" type="button">
-                        <span class="iconfont"></span>
+                        <span class="iconfont"><i class="fa fa-plus"></i></span>
                     </button>
                 </template>
 			</el-popover>
diff --git a/src/views/sysworkflow/lowcodepage/appFormList.vue b/src/views/sysworkflow/lowcodepage/appFormList.vue
index 002717e0f..10f990cdb 100644
--- a/src/views/sysworkflow/lowcodepage/appFormList.vue
+++ b/src/views/sysworkflow/lowcodepage/appFormList.vue
@@ -217,7 +217,8 @@ const state = reactive({
     dict: {},
     refreshTable: true
 })
-
+const appFormNameVal = ref("")
+provide('appFormNAme', appFormNameVal)
 const appPageShow = ref(false)
 const appKey = ref<string>("")
 /**
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue b/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
index 5171083c2..d3568d17c 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
@@ -45,7 +45,7 @@ const props = defineProps({
 	}
 });
 const svgIsShow = ref(false)
-const emits = defineEmits(["update:menusTree"]);
+const emits = defineEmits(["update:menusTree","openAppPageForm"]);
 const appOenMenu = ref<appMenuTreeInfo>({})
 /**
 @ 作者: 秦东
@@ -73,10 +73,10 @@ const handleDrop = (
 	dropType: NodeDropType,
 	ev: DragEvents
 ) => {
-	console.log('树移动完毕后执行的操作====1========>',draggingNode)
-	console.log('树移动完毕后执行的操作=====2=======>',dropNode)
-	console.log('树移动完毕后执行的操作=====3=======>',dropType)
-	console.log('树移动完毕后执行的操作=====4=======>',ev)
+	// console.log('树移动完毕后执行的操作====1========>',draggingNode)
+	// console.log('树移动完毕后执行的操作=====2=======>',dropNode)
+	// console.log('树移动完毕后执行的操作=====3=======>',dropType)
+	// console.log('树移动完毕后执行的操作=====4=======>',ev)
 	return false;
 	let sendCont = {
 		id:props.appCont.uuid,
@@ -84,7 +84,7 @@ const handleDrop = (
 	}
 	editAppMenuCont(sendCont)
 		.then((data)=>{
-			console.log('树移动完毕后执行的操作============>',data)
+			// console.log('树移动完毕后执行的操作============>',data)
 		})
 	
 }
@@ -172,6 +172,7 @@ const gainSunAppContent = () =>{
 		.then((data) =>{
 			console.log('更新:',data);
 			appMenuTree.value = data.data
+			// openAppPage(appOenMenu)
 		})
 }
 /**
@@ -243,6 +244,27 @@ const allowDrop = (draggingNode: Node, dropNode: Node, type: AllowDropType) => {
 		return true
 	}
 }
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-17 16:45:40
+@ 功能: 打开app表单
+*/
+const openAppPage = (val:any) =>{
+	// console.log("打开app表单------>",val)
+	if(val.isLock == 1){
+		ElMessage({
+			showClose: true,
+			message: '该页面为系统内置页面！请到应用层面访问查看!',
+			type: 'warning',
+		})
+	}else{
+		if(val.type !== 1){
+			console.log("打开app表单--1---->",val)
+			emits('openAppPageForm', val)
+		}
+	}
+	
+}
 </script>
 <template>
 	
@@ -253,7 +275,7 @@ const allowDrop = (draggingNode: Node, dropNode: Node, type: AllowDropType) => {
 		default-expand-all
 		node-key="id"
 		:allow-drop="allowDrop"
-		:expand-on-click-node="false"
+		:expand-on-click-node="true"
 		@node-drag-start="startDrop"
 	>
 		<template #default="{ node, data }">
@@ -261,7 +283,9 @@ const allowDrop = (draggingNode: Node, dropNode: Node, type: AllowDropType) => {
 		<div class="appMenuTitle">
 			<el-space wrap>
 				<svg-icon  prefix="icon" :icon-class="data.svg" @click="setAppMenusSvg(data)" />
-				<el-text class="w-120px mb-2" truncated>{{node.label}}</el-text>
+				<el-tooltip :content="node.label" placement="top" effect="dark">
+					<el-text class="w-120px mb-2" truncated @click="openAppPage(data)">{{node.label}}</el-text>
+				</el-tooltip>
 			</el-space>
 			<el-dropdown>
 				<svg-icon class="svgBox"  prefix="icon" icon-class="set" />
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/appFlow/appFlowSee.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/appFlow/appFlowSee.vue
new file mode 100644
index 000000000..6a81bb279
--- /dev/null
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/appFlow/appFlowSee.vue
@@ -0,0 +1,59 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-20 11:32:08
+@ 备注: app流程预览
+-->
+<script lang='ts' setup>
+const props = defineProps({
+	appFlowInfo:{
+		type:Object,
+		default(){
+			return {}
+		}
+	}
+});
+
+
+let nowVal = ref(100);	//缩放比例
+
+//缩放画布
+const zoomSize = (type:number) => {
+	if (type == 1) {
+		if (nowVal.value == 50) {
+		return;
+		}
+		nowVal.value -= 10;
+	} else {
+		if (nowVal.value == 300) {
+		return;
+		}
+		nowVal.value += 10;
+	}
+};
+</script>
+<template>
+	<div class="design_flow_work">{{props.appFlowInfo}}
+		<section class="dingflow-design" style="top:95px">		
+					<div class="zoom">
+						<div class="zoom-out" :class="nowVal == 50 && 'disabled'" @click="zoomSize(1)"></div>
+								<span>{{ nowVal }}%</span>
+						<div class="zoom-in" :class="nowVal == 300 && 'disabled'" @click="zoomSize(2)"></div>
+					</div>
+					<div class="box-scale" :style="`transform: scale(${ nowVal / 100});`">
+						<nodeWrap v-model:nodeConfig="props.appFlowInfo.nodeConfig" v-model:flowPermission="props.appFlowInfo.flowPermission" />
+						<div class="end-node">
+							<div class="end-node-circle"></div>
+							<div class="end-node-text">流程结束</div>
+						</div>
+					</div>
+		</section>
+	</div>
+</template>
+<style  lang='scss' scoped>
+.design_flow_work{
+	height: calc(100vh - 140px);
+    width: inherit;
+	overflow: hidden;
+	overflow-y: auto;
+}
+</style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue
new file mode 100644
index 000000000..8ef247a31
--- /dev/null
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue
@@ -0,0 +1,360 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-18 09:08:21
+@ 备注: 展开应用表单
+-->
+<script lang='ts' setup>
+import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form'
+import { gainAppPageInfo } from '@/api/DesignForm/requestapi'
+import {  Edit,Picture as IconPicture  } from '@element-plus/icons-vue'
+import { appPageDataInit,appWorkFlow } from "@/api/date/type"
+
+//引入页面
+import AppFlowSee  from '@/views/sysworkflow/lowcodepage/appPage/appPageForm/appFlow/appFlowSee.vue'
+
+const props = defineProps({
+	appCont:{
+		type:Object,
+		default(){
+			return {}
+		}
+	},
+	formKey:{
+		type:String,
+		default:""
+	},
+	menusInfo:{
+		type:Object,
+		default(){
+			return {}
+		}
+	},
+	drawerWith:{
+		type:Number,
+		default:0
+	},
+	groupKey:{
+		type:String,
+		default:""
+	}
+});
+
+
+const appInitData = ref<appPageDataInit>("")
+//app表单
+const stateForm = reactive<any>({
+	type: 1, // 1新增；2修改；3查看（表单模式） ；4查看； 5设计
+    formData: {
+      list: [],
+      form: {},
+      config: {},
+	  powerstr:{}
+    },
+    dict: {},
+    formId: "1",
+    id: 0,
+	formId: 0,
+	versionId: 0,
+    loading: true
+})
+//表单列表
+const stateList = reactive({
+    tableData: {
+      // tableProps: {}, //表格所有参数
+      columns: [],
+      config: {},
+	  controlBtn:[],
+	  operateBtn:[]
+    },
+    searchData: [],
+    loading: false,
+    attrObj: {},
+    config: {
+		pageSize:10,
+		searchIsShow:true,
+		searchFormIsShow:true,
+		openPageMode:"drawer"
+	},
+    tagList: {},
+    formId: props.formKey || '',
+    formList: [], // 所有可选表单数据源
+    name: '',
+    treeData: {}, // 左侧树相关
+    previewVisible: false,
+    tabsName: 'second',
+    formFieldList: [], // 表单数据源所有可选字段
+	formApi:{
+		type:"1",
+		addApiUrl:"",
+		editApiUrl:"",
+		delApiUrl:"",
+		lookApiUrl:""
+	},
+    dict: {},
+    refreshTable: true
+})
+
+const versionTitle = ref<string>("")	//表单名称
+const versionId = ref<string>("")	//表单版本号
+const appFlowInfo = ref<appWorkFlow>("")	//流程
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-18 09:32:23
+@ 功能: 监听菜单传递数据变化
+*/
+watch(()=>props.menusInfo,(val:appMenuTreeInfo)=>{
+	console.log("监听菜单传递数据变化",val)
+	if(val){
+		gainAppFormPageInit()
+	}
+	
+},{
+	deep:true
+})
+const emits = defineEmits(["editAppInfo"]);
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-18 14:04:20
+@ 功能: 获取App页面预览信息
+*/
+const editAppPage = (signCode:string) => {
+	emits("editAppInfo",signCode)
+}
+
+
+
+
+const activePage = ref(0)	//默认选择的页面
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-18 10:13:15
+@ 功能: 
+*/
+const handleAppPageClick = () =>{
+
+}
+
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-20 16:15:54
+@ 功能: 获取表单初始化信息
+*/
+const gainAppFormPageInit = () =>{
+	gainAppPageInfo({id:props.menusInfo.id})
+		.then((data)=>{
+			console.log("获取初始化表单数据",data)
+			appInitData.value = data.data
+			if (data.data.page && data.data.pageList  && data.data.appFlow){
+				activePage.value = 1
+			}else if (data.data.page && !data.data.pageList  && data.data.appFlow){
+				activePage.value = 2
+			}else if (!data.data.page && !data.data.pageList  && data.data.appFlow){
+				activePage.value = 3
+			}else if (!data.data.page && data.data.pageList  && data.data.appFlow){
+				activePage.value = 1
+			}else if (data.data.page && !data.data.pageList  && !data.data.appFlow){
+				activePage.value = 2
+			}else{
+				activePage.value = 1
+			}
+			versionId.value = data.data.appForm.id.toString()
+			versionTitle.value = data.data.appForm.name
+			if(data.data.pageList){
+				let stateData = string2json(data.data.appForm.listjson)
+				stateList.tableData = stateData.tableData
+				stateList.searchData = stateData.searchData
+				stateList.loading = stateData.loading
+				stateList.attrObj = stateData.attrObj
+				stateList.config = stateData.config
+				stateList.tagList = stateData.tagList
+				stateList.formList = stateData.formList
+				stateList.name = stateData.name
+				stateList.treeData = stateData.treeData
+				stateList.previewVisible = stateData.previewVisible
+				stateList.formFieldList = stateData.formFieldList
+				stateList.formApi = stateData.formApi
+				stateList.dict = stateData.dict
+				stateList.refreshTable = stateData.refreshTable
+			}
+			if(data.data.page){
+				console.log("data.data.mastesform", data.data)
+				stateForm.id=data.data.appForm.version.toString()
+				stateForm.formId =data.data.appForm.cfid.toString()
+				stateForm.versionId =data.data.appForm.id.toString()
+				stateForm.formData = stringToObj(data.data.appForm.mastesform)
+				stateForm.dict = string2json(data.data.appForm.dict)
+				stateForm.formData.powerstr = string2json(data.data.appForm.powerstr)
+			}
+			if(data.data.appFlow){
+				appFlowInfo.value = data.data.workFlow
+			}
+			
+
+
+		})
+}
+
+defineExpose({
+	gainAppFormPageInit
+})
+</script>
+<template>
+	<div>
+		<el-row v-if="props.menusInfo">
+			<el-col :span="24" class="pageBox pageHeader">
+				<el-text class="wordFont">{{ props.menusInfo.label }}</el-text>
+				<el-button type="primary" :icon="Edit" @click="editAppPage(stateForm.formId)">编辑App页面</el-button>
+			</el-col>
+			<el-col :span="24" class="pageBox baiDiSe">
+				<el-tabs v-model="activePage" class="demo-tabs" @tab-click="handleAppPageClick">
+					<el-tab-pane v-if="appInitData.pageList" label="列表预览" :name="1" />
+					<el-tab-pane v-if="appInitData.page" label="表单预览" :name="2" />
+					<el-tab-pane v-if="appInitData.appFlow" label="流程图" :name="3" />
+				</el-tabs>
+			</el-col>
+			<el-col  v-if="activePage!=3" :span="24" class="pageBoxInfo">
+				<el-card class="tispMsg"  shadow="always">
+					<el-scrollbar class="suojing">
+					
+						<ak-page-list
+							v-if="activePage==1"
+							:data="stateList.tableData"
+							:search-data="stateList.searchData"
+							:config="stateList.config"
+							:form-id="stateForm.formId"
+							:versionid="versionId" 
+							:versiontitle="versionTitle"
+							v-model:look-page-is-show="lookPageIsShow"
+						/>
+						<ak-form
+							v-if="activePage==2"
+							ref="formEl"
+							:numrun="formType"
+							:form-data="stateForm.formData"
+							:type="formType"
+							:dict="stateForm.dict"
+							request-url="getFormContent"
+							add-url="saveFormContent"
+							edit-url="editFormContent"
+							:before-submit="beforeSubmit"
+							:after-submit="afterSubmit"
+							:close-app-submit="closeAppSubmit"
+							:change-key-val="changeKeyVal"
+							:save-draft-page="saveDraftPage"
+						/>
+						
+					</el-scrollbar>
+				</el-card>
+				
+			</el-col>
+			<el-col v-else :span="24">
+				<AppFlowSee
+					:app-flow-info="appFlowInfo"
+				/>
+			</el-col>
+		</el-row>
+		<el-row v-else>
+			<el-col :span="24" class="pageBox">
+				<el-card class="tispMsg"  shadow="always">
+					
+					欢迎使用 {{ props.appCont.appName }}<br>
+					<div class="demo-image__error">
+						<el-image :src="props.appCont.appSvg" fit="fit">
+							<template #error>
+								<div class="image-slot">
+									<el-icon><icon-picture /></el-icon>
+								</div>
+							</template>
+						</el-image>
+					</div>
+				</el-card>
+			</el-col>
+		</el-row>
+	</div>
+</template>
+<style  lang='scss' scoped>
+.pageBox{
+	padding: 0 15px;
+	.wordFont{
+		font-size: 20px;
+	}
+	.tispMsg{
+		width: 100%;
+		margin: 20px 0 0 0;
+		height: calc(100vh - 80px);
+		display: flex;
+		align-items: center;
+		text-align: center;
+		justify-content: center;
+		font-size: 20px;
+	}
+}
+.pageBoxInfo{
+	padding: 0 15px;
+	.tispMsg{
+		width: 100%;
+		margin: 20px 0 0 0;
+		height: calc(100vh - 175px);
+	}
+	:deep .el-card__body{
+		padding: 10px 0;
+	}
+}
+.pageHeader{
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	background-color: #FFFFFF;
+	padding:15px 15px 5px 15px;
+	
+}
+.baiDiSe{
+	background-color: #FFFFFF;
+	border-bottom : 3px solid #dedfe0;
+	:deep .el-tabs__header{
+		margin:0px 0 -2px 0;
+	}
+}
+.suojing{
+	height: calc(100vh - 135px);
+}
+.demo-image__error{
+	margin-top: 15px;
+}
+.demo-image__error .block {
+  padding: 30px 0;
+  text-align: center;
+  border-right: solid 1px var(--el-border-color);
+  display: inline-block;
+  width: 49%;
+  box-sizing: border-box;
+  vertical-align: top;
+}
+.demo-image__error .demonstration {
+  display: block;
+  color: var(--el-text-color-secondary);
+  font-size: 14px;
+  margin-bottom: 20px;
+}
+.demo-image__error .el-image {
+  padding: 0 5px;
+  max-width: 300px;
+  max-height: 200px;
+  width: 100%;
+  height: 200px;
+}
+
+.demo-image__error .image-slot {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  background: var(--el-fill-color-light);
+  color: var(--el-text-color-secondary);
+  font-size: 30px;
+}
+.demo-image__error .image-slot .el-icon {
+  font-size: 30px;
+}
+</style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageFlow.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageFlow.vue
index fcd177aaf..cf66bc961 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageFlow.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageFlow.vue
@@ -4,14 +4,655 @@
 @ 备注: 表单流程
 -->
 <script lang='ts' setup>
+import { useStore } from '@/store/workflow/index' 
+import { flowversion } from '@/api/workflowapi/types'
+import { initializeWorkFlow,setWorkFlowData,gainFlowVersionList,saveFlowCont,gainFlowInfo,editFlowCont,saveNewFlow,switchFlowVersion,judgeFormFlowIsOpen,openFormFlow } from '@/api/workflowapi/index'
+import FlowImgSrc from '@/assets/images/3.png'
+const props = defineProps({
+	appCont:{
+		type:Object,
+		default(){
+			return {}
+		}
+	},
+	formKey:{
+		type:String,
+		default:""
+	},
+	groupKey:{
+		type:String,
+		default:""
+	},
+	menuId:{
+		type:String,
+		default:""
+	},
+	appPageKey:{
+		type:String,
+		default:""
+	},
+	formVersion:{
+		type:String,
+		default:""
+	},
+	state:{
+		type:Object,
+		default(){
+			return {}
+		}
+	}
+});
+const emits = defineEmits<{
+    (e: 'update:state', val: formStruct): void
+	(e: 'update:formKey', val: string): void
+	(e: 'update:appPageKey', val: string): void
+	// (e: 'judgeFlowIsEdit', val: boolean): void
+	// (e: 'runNextWindows', val: number): void
+	// (e: 'closeFormPage'): void
+}>()
+const state =  computed({
+	get() {
+		return props.state
+	},
+	set(val: formStruct) {
+		emits('update:state', val)
+	}
+});
+const appPageKey =  computed({
+	get() {
+		return props.appPageKey
+	},
+	set(val: formStruct) {
+		emits('update:appPageKey', val)
+	}
+});
+let { setTableId, setIsTried } = useStore()
+const openOfClise = ref(false)  //当前版本状态
+const flowIsTrue = ref(false) 			//判断流程是否使用
+const isRead = ref(false)      //判断操作功能按钮
+const activeTabs = ref<string>("");			//当前工作流版本
+const versionList = reactive<flowversion[]>([]); //工作流版本列表
+const nowVal = ref(100);	//缩放比例
+let nodeConfig = ref<any>({}); 	//节点配置
+let flowPermission = ref([]); //工作流权限
+const enableVersion = ref<string>("1");    //流程版本
+const enableFlow = ref<any>();
+let tipList = ref<any>([]);		//信息提示
+let processConfig = ref<any>({});	//工作流信息
+let directorMaxLeveling = ref<number>(0);	//主管深度（层级）
+let workFlowDef = ref({});			//流程名称
+let tipVisible = ref(false);
+const closeOrOpenVersion = ref(false);  //判断是否显示版本启用与关闭
+let oneIsTrue = true;
+//缩放画布
+const zoomSize = (type:number) => {
+	if (type == 1) {
+		if (nowVal.value == 50) {
+		return;
+		}
+		nowVal.value -= 10;
+	} else {
+		if (nowVal.value == 300) {
+		return;
+		}
+		nowVal.value += 10;
+	}
+};
+/**
+@ 作者: 秦东
+@ 时间: 2024-03-11 16:33:49
+@ 功能: 开启流程
+*/
+const createFormFlow = () =>{
+	if(appPageKey.value == ""){
+		flowIsTrue.value = false;
+		ElMessageBox.alert('您还未设置表单！请先设置完表单后，在创建流程！','温馨提示！',{
+			confirmButtonText: '确定',
+			callback: (action: Action) => {
+				// emits("runNextWindows",1);
+			},
+		})
+	}else{
+		openOrCloseFormFlow(1)
+		flowIsTrue.value = true
+		getFlowVerList()
+	}
+
+	// flowIsTrue.value = true
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 11:29:46
+@ 功能: 获取工作流版本列表
+*/
+const getFlowVerList = ()=>{
+	gainFlowVersionList({id:appPageKey.value.toString()})
+		.then(({data})=>{
+			console.log("获取工作流版本列表-->",data)
+			// versionList = data;
+			versionList.splice(0,versionList.length)
+			if(data){
+				if(data.length>0){
+
+					data.forEach((item:any)=>{
 
+						if(item.state == 1){
+							activeTabs.value = item.id
+							enableFlow.value = item
+							enableVersion.value = item.id
+						}
+						versionList.push({
+							id:item.id,
+							key:item.key,
+							state:item.state,
+							version:item.version
+						})
+					})
+					if(versionList.length > 1){
+						closeOrOpenVersion.value = true
+					}else{
+						closeOrOpenVersion.value = false
+					}
+					
+					// console.log("获取工作流版本列表--1-1-->",enableFlow.value);
+					if(enableFlow.value == "" || enableFlow.value == undefined){
+						enableFlow.value = versionList[0]
+						// activeTabs.value = versionList[0].id
+						enableVersion.value = versionList[0].id
+					}
+					isRead.value = true
+				}else{
+					isRead.value = false
+
+				}
+			}
+			// console.log("获取工作流版本列表---1-->",activeTabs.value);
+			// console.log("获取工作流版本列表---2-->",enableFlow.value);
+			// console.log("获取工作流版本列表---3-->",enableVersion.value);
+			// console.log("获取工作流版本列表---3-1->",versionList[0],versionList);
+		})
+		.finally(()=>{
+			
+			if(isRead.value == true){
+				gainFlowCont();
+			}else{
+				clearCanvas(1);
+			}
+			clickOpenOrClose();
+			
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 11:40:34
+@ 功能: 判断当前工作流版本是否启用
+*/
+const clickOpenOrClose = () => {
+	// console.log("判断当前工作流版本是否启用",enableFlow,activeTabs.value)
+	if(enableFlow.value.id==activeTabs.value){
+		openOfClise.value = true
+	}else{
+		openOfClise.value = false
+	}
+	// console.log("openOfClise",openOfClise.value)
+	// console.log("enableFlow.version=1=activeTabs",enableFlow.value,activeTabs.value)
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 11:37:19
+@ 功能: 清空画布
+*/
+const clearCanvas = (isOk?:any) =>{
+	if(isOk==1){
+		initWorkFlowData()
+		setIsTried(false);
+		tipList.value = []
+	}else{
+		ElMessageBox.confirm('确定要清空画布?')
+		.then(() => {
+			initWorkFlowData()
+			setIsTried(false);
+			tipList.value = []
+		})
+	}
+	
+	enableFlow.value = ""
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 11:37:46
+@ 功能: 初始化工作流数据
+*/
+const initWorkFlowData = async() => {
+	let { data } = await initializeWorkFlow({name:state.value.formData.form.formName})
+	// console.log("data-=------>",data)
+	processConfig.value = data;
+	let {
+		nodeConfig:nodes,
+		flowPermission:flowPermissiones,
+		directorMaxLevel:levels,
+		workFlowDef:workName,
+		tableId,
+	} = data;
+	processConfig.value.workFlowDef.formKey = appPageKey.value
+	nodeConfig.value = nodes;
+	flowPermission.value = flowPermissiones;
+	directorMaxLeveling = levels;
+	workFlowDef.value = workName;
+
+	setTableId(tableId);
+	// console.log("max--1->",data)
+	// console.log("max--6->",tableId)
+	// console.log("max--2->",flowPermission)
+	// console.log("max--3->",nodeConfig)
+	// console.log("max--4->",directorMaxLevel)
+	// console.log("max--5->",processConfig)
+}
+//缩放画布
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 11:26:41
+@ 功能: 编辑表单流程状态
+*/
+const openOrCloseFormFlow = (val:number) => {
+	openFormFlow({id:appPageKey.value.toString(),status:val})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 10:10:46
+@ 功能: 组件加载完毕执行数据初始化
+*/
+onMounted(()=>{
+	console.log("判断是否已经存在工作流以及是否开启",appPageKey.value)
+	if(appPageKey.value == ""){
+		flowIsTrue.value = false;
+	}else{
+		judgeFormFlowIsOpen({id:appPageKey.value.toString()})
+			.then((data)=>{
+				// console.log("判断是否已经存在工作流以及是否开启",data)
+				if(data.data.isOpen == 1){
+					flowIsTrue.value = true;
+					// emits('judgeFlowIsEdit', false)
+					getFlowVerList()
+				}else{
+					flowIsTrue.value = false;
+					// emits('judgeFlowIsEdit', false)
+				}
+			})
+	}
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 13:57:13
+@ 功能: 流程版本启用禁用
+*/
+const setupState = (val:number) =>{
+	let sendCont = {
+		id:enableVersion.value.toString(),
+		status:val
+	}
+	if(val == 1){
+		activeTabs.value = enableVersion.value
+	}
+	console.log("流程版本启用禁用",sendCont)
+	switchFlowVersion(sendCont)
+		.then((data:any)=>{
+			ElMessage.success(data.msg);
+			// activeTabs.value = enableVersion.value
+			// enableFlow.value.id = enableVersion.value
+			if(versionList.length > 0){
+				versionList.forEach(item=>{
+					if(item.id == enableVersion.value){
+						enableFlow.value = item
+					}
+				})
+			}
+			
+		})
+		.finally(()=>{
+			clickOpenOrClose();
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 13:59:44
+@ 功能: 发布新流程
+*/
+const saveSet = async () => {
+	setIsTried(true);
+	tipList.value = [];
+	reErr(nodeConfig.value);
+	if (tipList.value.length != 0) {
+		tipVisible.value = true;
+		return;
+	}
+	processConfig.value.flowPermission = flowPermission.value;
+	// eslint-disable-next-line no-console
+	// console.log("processConfig",processConfig.value);
+	// console.log("flowPermission",flowPermission.value);
+	// console.log("nodeConfig",nodeConfig.value);
+	saveFlowCont(processConfig.value)
+		.then((data:any) => {
+			if(data.code == 0){
+				ElMessage.success("设置成功");
+				// emits('judgeFlowIsEdit', false)
+				// emits("runNextWindows",3);
+				// clearCanvas(1);
+			}
+		})
+		.finally(()=>{
+			// emits("chanerequest");
+			getFlowVerList()
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:01:22
+@ 功能: 错误提示
+*/
+const reErr = ({ childNode }:any) => {
+	if (childNode) {
+		let { type, error, nodeName, conditionNodes } = childNode;
+		if (type == 1 || type == 2 || type == 3) {
+			if (error) {
+				tipList.value.push({
+					name: nodeName,
+					type: ["", "审核人", "抄送人", "执行人"][type],
+				});
+			}
+			reErr(childNode);
+		} else if (type == 4) {
+			reErr(childNode);
+		} else if (type == 5) {
+			reErr(childNode);
+			for (var i = 0; i < conditionNodes.length; i++) {
+				if (conditionNodes[i].error) {
+					tipList.value.push({ name: conditionNodes[i].nodeName, type: "条件" });
+				}
+				reErr(conditionNodes[i]);
+			}
+		}
+	} else {
+		childNode = null;
+	}
+};
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:11:28
+@ 功能: 获取流程内容
+*/
+const gainFlowCont = () =>{
+	gainFlowInfo({id:enableVersion.value.toString()})
+		.then((data:any)=>{
+						// console.log("获取工作流版本列表-1->",data,enableFlow.value)
+			if(data.code == 0){
+				processConfig.value = data.data;
+				processConfig.value.workFlowDef.formKey = appPageKey.value
+				nodeConfig.value = data.data.nodeConfig;
+				flowPermission.value = data.data.flowPermission;
+				directorMaxLeveling = data.data.directorMaxLevel;
+				workFlowDef.value = data.data.workFlowDef;
+				setTableId(data.data.tableId);
+				flowIsTrue.value = true;
+				// console.log("max--1->",data)
+				// console.log("max--6->",data.data.tableId)
+				// console.log("max--2->",data.data.flowPermission)
+				// console.log("max--3->",nodeConfig)
+				// console.log("max--4->",data.data.directorMaxLevel)
+				// console.log("max--5->",processConfig.value)
+			}else{
+				clearCanvas(1);
+			}
+			// initWorkFlowData();
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:12:43
+@ 功能: 选择工作流版本
+*/
+const clickFormTable = (val:any) =>{
+	console.log("切换表单",val,activeTabs.value)
+	enableVersion.value = val
+	gainFlowCont();
+	clickOpenOrClose();
+	// getTableFieldList(versionIndex.value,val)
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:21:06
+@ 功能: 编辑当前版本流程
+*/
+const saveEdit =()=>{
+	setIsTried(true);
+	tipList.value = [];
+	
+	reErr(nodeConfig.value);
+	if (tipList.value.length != 0) {
+		tipVisible.value = true;
+		return;
+	}
+	processConfig.value.flowPermission = flowPermission.value;
+	// eslint-disable-next-line no-console
+	// console.log("processConfig",flowPermission);
+	// console.log("flowPermission",flowPermission.value);
+	// console.log("activeTabs",enableFlow.value);
+	let sendCont = {
+		id:enableVersion.value.toString(),
+		flowinfo:processConfig.value
+	}
+	editFlowCont(sendCont)
+		.then((data:any) => {
+			if(data.code == 0){
+				ElMessage.success("设置成功");
+				// emits("update:openDrawer", false);
+				// clearCanvas(1);
+				// emits('judgeFlowIsEdit', false)
+				// emits("runNextWindows",3);
+			}
+		})
+		.finally(()=>{
+			// emits("chanerequest");
+			getFlowVerList()
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:34:45
+@ 功能: 另存为新版
+*/
+const saveNew = () => {
+	setIsTried(true);
+	tipList.value = [];
+	
+	reErr(nodeConfig.value);
+	if (tipList.value.length != 0) {
+		tipVisible.value = true;
+		return;
+	}
+	processConfig.value.flowPermission = flowPermission.value;
+	// eslint-disable-next-line no-console
+	// console.log("processConfig",flowPermission);
+	// console.log("flowPermission",flowPermission.value);
+	// console.log("activeTabs",enableFlow.value);
+	let sendCont = {
+		id:enableVersion.value.toString(),
+		flowinfo:processConfig.value
+	}
+	saveNewFlow(sendCont)
+		.then((data:any) => {
+			if(data.code == 0){
+				ElMessage.success("设置成功");
+				// emits('judgeFlowIsEdit', false)
+				// emits("runNextWindows",3);
+			}
+		})
+		.finally(()=>{
+			getFlowVerList()
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:35:06
+@ 功能: 监听流程节点变动
+*/
+watch(()=>nodeConfig,()=>{
+	// console.log("变动流程")
+	if(oneIsTrue){
+		oneIsTrue = false;
+		// emits('judgeFlowIsEdit', false)
+	}else{
+		// emits('judgeFlowIsEdit', true)
+	}
+	
+},
+{
+    deep: true
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:37:22
+@ 功能: 关闭表单流程
+*/
+const closwFormFlow = () => {
+	flowIsTrue.value = false;
+	// emits('judgeFlowIsEdit', false)
+	openOrCloseFormFlow(2)
+}
 </script>
 <template>
-	<el-main class="mainBox">Main</el-main>
+	<el-main class="mainBox">
+		<div v-if="flowIsTrue" style="height: 100%;">
+		
+			<div  class="flowVersionBox">
+				<div class="tabs_box">
+					<el-tabs v-if="isRead" v-model="activeTabs"  @tab-change="clickFormTable">
+						<el-tab-pane  v-for="item in versionList" :key="item.id" :name="item.id">
+							<template #label>
+								<el-icon><Share /></el-icon>
+								<span class="my-label">V{{item.version}}</span>
+							</template>
+						</el-tab-pane>
+					</el-tabs>
+				</div>
+				<div class="flowButBox">
+					<el-button v-if="isRead && !openOfClise && closeOrOpenVersion" type="success"  size="small" plain  @click="setupState(1)">
+						<el-icon class="el-icon--left"><Delete /></el-icon>
+						启用
+					</el-button>
+					<el-button v-if="isRead && openOfClise && closeOrOpenVersion"  type="warning"  size="small" plain @click="setupState(2)">
+						<el-icon class="el-icon--left"><Delete /></el-icon>
+						禁用
+					</el-button>
+					<el-button   size="small" plain  @click="clearCanvas">
+						<el-icon class="el-icon--left"><Delete /></el-icon>
+						清空
+					</el-button>
+					<el-button v-if="!isRead"   size="small" plain  @click="saveSet">
+						<el-icon class="el-icon--left"><Promotion /></el-icon>
+						发布
+					</el-button>
+					<el-button v-if="isRead"  size="small" plain @click="saveEdit">
+						<el-icon class="fa fa-save" style="margin-right:5px"></el-icon>
+						保存
+					</el-button>
+					<el-button v-if="isRead" type="warning"  size="small"  @click="saveNew">
+						<el-icon class="el-icon--left"><Share /></el-icon>
+						另存为新版
+					</el-button>
+					<el-button type="danger"  size="small" @click="closwFormFlow">
+						<el-icon class="el-icon--left"><CircleCloseFilled /></el-icon>
+						关闭流程
+					</el-button>
+				</div>
+			</div>
+			<div >
+				
+				<section class="dingflow-design" style="top:80px">		
+					<div class="zoom">
+						<div class="zoom-out" :class="nowVal == 50 && 'disabled'" @click="zoomSize(1)"></div>
+								<span>{{ nowVal }}%</span>
+						<div class="zoom-in" :class="nowVal == 300 && 'disabled'" @click="zoomSize(2)"></div>
+					</div>
+					<div class="box-scale" :style="`transform: scale(${ nowVal / 100});`">
+						<nodeWrap v-model:nodeConfig="nodeConfig" v-model:flowPermission="flowPermission" />
+						<div class="end-node">
+							<div class="end-node-circle"></div>
+							<div class="end-node-text">流程结束</div>
+						</div>
+					</div>
+				</section>
+
+				<errorDialog v-model:visible="tipVisible" :list="tipList" />
+				<promoterDrawer v-model:form-data="state.formData" :form-key="appPageKey" :form-version="formVersion" />
+				<approverDrawer :directormaxlevel="directorMaxLeveling" :node-config="nodeConfig"  :is-form-flow="isFormFlow"  :customer-form-key="appPageKey"  v-model:form-data="state.formData"  :form-version="formVersion" />
+				<copyerDrawer />
+				<conditionDrawer  :is-form-flow="isFormFlow"  :customer-form-key="appPageKey" />
+			</div>
+		</div>
+		<div v-else class="flow_work_begin">
+			<el-result title="" sub-title="">
+				<template #icon>
+					流程可实现需要多人流转的业务场景。<br>绘制流程图，设定数据流转方式，即可搭建线上工作流。<br><br>
+					<el-image
+						class="imgBox"
+						:src="FlowImgSrc"
+					/>
+				</template>
+				<template #extra>
+					<el-button type="primary" @click="createFormFlow">开启流程</el-button>
+				</template>
+			</el-result>
+		</div>
+	
+	</el-main>
 </template>
 <style  lang='scss' scoped>
 .mainBox{
 	padding: 0;
 	overflow-y : auto;
+	height: calc(100vh - 40px);
+	background-color: #f5f5f7;
+}
+.flow_work_begin{
+	height: calc(100vh - 40px);
+	display: flex;
+	align-items: center;
+  	justify-content: center;
+	background-color: #FFFFFF;
+	.imgBox{
+		height: calc(100vh - 400px);
+		// height: 10%;
+	}
+}
+.flowVersionBox{
+	width: 100%;
+	display: flex;
+	align-items: center;
+  	justify-content: space-between;
+	background-color: #FFFFFF;
+	.flowVerLeft{
+		max-width: 50%;
+		padding-left: 10px;
+		display: flex;
+		align-items: center;
+	}
+}
+.tabs_box{
+	max-width: 50%;
+	min-width:30%;
+	::v-deep .el-tabs__nav-wrap::after {
+		position: static !important;
+		/* background-color: #fff; */
+	}
+	::v-deep .el-tabs__item{
+		padding:0 10px;
+	}
+	::v-deep .el-tabs__header{
+		margin:0;
+	}
+}
+.flowButBox{
+	padding: 7px 0;
 }
 </style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
index af09f0e04..7aa2fc2ab 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
@@ -9,7 +9,7 @@ import { useRoute, useRouter } from 'vue-router'
 import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form'
 import { customerFormVersionCont } from '@/api/DesignForm/type'
 import { FormData,formStruct,DrawerStruct, VideoMsg } from '@/api/DesignForm/types'
-import { saveProductionForm,getOneProductionForm,haveCustomerFormVersion,editCustomerFormInfo,saveAsNewVersion,enableVersion,judgeSubmitCancel,createAppForm } from '@/api/DesignForm/requestapi'
+import { saveProductionForm,getOneProductionForm,haveCustomerFormVersion,editCustomerFormInfo,saveAsNewVersion,enableVersion,judgeSubmitCancel,createAppForm,editAppPageInfo,saveOtherVersion,previewAppFormVersion } from '@/api/DesignForm/requestapi'
 
 
 //引入页面
@@ -62,6 +62,7 @@ const props = defineProps({
 const emits = defineEmits<{
     (e: 'update:state', val: formStruct): void
 	(e: 'update:formKey', val: string): void
+	(e: 'update:appPageKey', val: string): void
 	(e: 'update:formVersion', val: string): void
 	(e: 'judgeFormIsEdit', val: boolean): void
 	(e: 'runNextWindows', val: number): void
@@ -86,6 +87,19 @@ const appFormKeyVal =  computed({
 		emits('update:formKey', val)
 	}
 });
+
+
+const appPageKeyStr =  computed({
+	get() {
+		return props.appPageKey
+	},
+	set(val: string) {
+		emits('update:appPageKey', val)
+	}
+});
+
+
+const isEdit = ref(false)
 const route: any = useRoute().query || {}
 const versionCont = ref<customerFormVersionCont[]>([])			//版本内容列表
 const tableKey = ref("")
@@ -99,6 +113,7 @@ const drawer = reactive<DrawerStruct>({
     direction: undefined, //弹出方向rtl / ltr
     callback: ''
 })
+const formFieldAry = ref<string[]>([])
 // 搜索设计时左侧快速添加字段
 const searchCheckField = (data: FormData) => {
     state.value.formData.list.push(data)
@@ -221,12 +236,13 @@ const buttonCallbackEvent = (type: string) => {
 			break
 		case 'save':	//保存
 			if(props.appPageKey && props.appPageKey != ""){	//存在，进行编辑操作
-
+				editAppFormTable()
 			}else{ //不存在，进行新增操作
 				saveAppFormData();
 			}
 			break
 		case 'branch':	//另存为新版
+			saveOtherVersionIng();
 			break
 	}
 }
@@ -238,12 +254,14 @@ const buttonCallbackEvent = (type: string) => {
 */
 const gainTableForm = () => {
 	if(props.appPageKey){
+		isEdit.value = true;
 		state.value.loading = true
 		getOneProductionForm({id: props.appPageKey.toString()})
 			.then((res:any) => {
 				if(res.code == 0){
 					const result = res.data
 					console.log("初始设计搜索时--1--->",result)
+					formFieldAry.value = result.formField
 					// 初始设计搜索时res.data=''
 					if (result.mastesform) {
 						state.value.formData = stringToObj(result.mastesform)
@@ -274,7 +292,7 @@ const gainTableForm = () => {
 					}else{
 						emits('judgeFormIsEdit', false,true)
 					}
-					
+					emits('update:formVersion', result.id.toString())
 				}else{
 					ElMessage.error(res.msg || '加载异常')
 				}
@@ -314,10 +332,10 @@ onMounted(() => {
 @ 功能: 根据启用版本进行加载页面
 */
 const versionUpdateForm = (val:string) => {
-	console.log("加载异常-------111------->",val)
+	// console.log("加载异常-------111------->",val)
 	versionId.value = val
-	
-	getInitData()
+	gainTableForm()
+	// getInitData()
 }
 /**
 @ 作者: 秦东
@@ -346,10 +364,19 @@ const saveAppFormData = () => {
 		menuId:props.menuId,
 		appSignCode:props.formconfigcont.signCode
 	}
+	state.value.loading = true
 	console.log("写入自建应用App表单",sendData)
 	createAppForm(sendData)
 		.then((data:any) => {
+			state.value.loading = false
 			console.log("写入自建应用App表单--->",data)
+			appPageKeyStr.value = data.data.customerFormCont.id.toString()
+			emits('update:formVersion', data.data.formVersion.id.toString())
+			// emits('update:appPageKey', data.data.customerFormCont.id.toString())
+			gainTableForm()
+		})
+		.finally(() => {
+			state.value.loading=false;
 		})
 }
 /**
@@ -363,14 +390,112 @@ const editAppFormTable = () => {
 		data: objToStringify(state.value.formData),
 		source: state.value.formOtherData.source, // 数据源允许在表单属性设置里修改的
 		name: state.value.formOtherData.formName, // 表单名称，用于在显示所有已创建的表单列表里显示
-		type: 1, // 1表单 2列表
+		type: 4, // 1表单 2列表
 		dict: json2string(state.value.formDict),
-		appKey:appFormKeyVal,
+		appKey:appFormKeyVal.value,
 		groupKey:props.groupKey,
 		id:props.appPageKey.toString(),
 		version:versionId.value.toString(),
+		menuId:props.menuId,
 	}
+	state.value.loading = true
 	console.log("编辑App自定义表单",sendData)
+	editAppPageInfo(sendData)
+		.then((data:any) => {
+			state.value.loading = false
+			console.log("编辑App自定义表单--->",data)
+			emits('update:formVersion', versionId.value.toString())
+			gainTableForm()
+		})
+		.finally(() => {
+			state.value.loading=false;
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-20 16:24:23
+@ 功能: 保存为其他版本
+*/
+const saveOtherVersionIng = () =>{
+	let sendData: any = {
+		jsondata:JSON.stringify(state.value.formData),
+		data: objToStringify(state.value.formData),
+		source: state.value.formOtherData.source, // 数据源允许在表单属性设置里修改的
+		name: state.value.formOtherData.formName, // 表单名称，用于在显示所有已创建的表单列表里显示
+		type: 4, // 1表单 2列表 3:app 4：app表单
+		dict: json2string(state.value.formDict),
+		appKey:appFormKeyVal.value,
+		groupKey:props.groupKey,
+		menuId:props.menuId,
+		appSignCode:props.formconfigcont.signCode
+	}
+	state.value.loading = true
+	saveOtherVersion(sendData)
+		.then((data:any) => {
+			state.value.loading = false
+			console.log("保存为其他版本--->",data)
+			emits('update:formVersion', data.data.version.toString())
+			gainTableForm()
+		})
+		.finally(() => {
+			state.value.loading=false;
+		})
+}
+defineExpose({
+	gainTableForm
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 09:01:30
+@ 功能: 预览版本
+*/
+const versionPreviewPage = (val:string) => {
+	if(val){
+		versionId.value = val
+		previewAppFormVersion({id:val})
+		.then((res:any) => {
+				if(res.code == 0){
+					const result = res.data
+					// console.log("初始设计搜索时--1--->",result)
+					formFieldAry.value = result.formField
+					// 初始设计搜索时res.data=''
+					if (result.mastesform) {
+						state.value.formData = stringToObj(result.mastesform)
+					}
+					// console.log("初始设计搜索时",state.value.formData)
+					if(result.mastesformjson){
+						let kjdkjksd = string2json(result.mastesformjson)
+						// console.log("初始设计搜索时-begin-->",state.value.formData.purview)
+						state.value.formData.purview=kjdkjksd.purview
+						// console.log("初始设计搜索时--->",kjdkjksd)
+					}
+					state.value.formData.config.groupKey = result.groupKey
+					// console.log("初始设计搜索时--end->",state.value.formData)
+					state.value.formDict = string2json(result.dict)
+					// 恢复表单名称
+					state.value.formOtherData.source = result.source
+					state.value.formOtherData.formName = result.name
+
+					state.value.formOtherData.formName = result.name
+					state.value.formData.form.name = result.tablekey
+					state.value.formData.form.formName = result.name
+					if (result.source && state.value.designType !== 'search') {
+						// 加载属性侧边栏的字段标识，搜索时不需要请求
+						formControlAttrEl.value.getFormFieldBySource(result.source)
+					}
+					if(result.flowIsOpen != 1){
+						emits('judgeFormIsEdit', false,false)
+					}else{
+						emits('judgeFormIsEdit', false,true)
+					}
+					
+				}else{
+					ElMessage.error(res.msg || '加载异常')
+				}
+				state.value.loading = false
+			})
+	}
+	
 }
 </script>
 <template>
@@ -378,21 +503,23 @@ const editAppFormTable = () => {
 		<DragControlApp
 			:table-key="state.formData.form.name"
 			@versionUpdateForm="versionUpdateForm"
+			@versionPreviewPage="versionPreviewPage"
 		/>
 	</el-aside>
 	<el-main class="mainBox rightBox">
-		<HeadToolsApp  v-loading="state.loading"  :customerformid="propsappPageKey" @click="buttonCallbackEvent" />
+	{{appPageKeyStr}}-->{{props.formVersion}}
+		<HeadToolsApp  v-loading="state.loading"  :customerformid="props.appPageKey" @click="buttonCallbackEvent" />
 		<div v-loading="state.loading" class="main_form">
 				<div v-if="state.formData.list.length === 0" class="empty-tips">
 					从左侧拖拽来添加组件<br>
-					appCont：{{ props.appCont }} <br>
+					<!-- appCont：{{ props.appCont }} <br>
 					formKey：{{ props.formKey }} <br>
 					appPageKey：{{ props.appPageKey }} <br>
 					groupKey：{{ props.groupKey }} <br>
 					formVersion：{{ props.formVersion }} <br>
 					formconfigcont：{{ props.formconfigcont }} <br>
 					state：{{ props.state }} <br>
-					menuId：{{ props.menuId }} <br>
+					menuId：{{ props.menuId }} <br> -->
 				</div>
 				<FormDesign 
 					:type="5"
@@ -407,9 +534,11 @@ const editAppFormTable = () => {
 			v-model:formOtherData="state.formOtherData"
 			:form-data="state.formData.form"
 			:form-config="state.formData.config"
-			:customerformid="tableKey"
+			:customerformid="props.appPageKey"
 			:form-list="state.formData.list"
 			:form-info="state.formData"
+			:is-edit="isEdit"
+			:form-field="formFieldAry"
 			@open-dialog="openAceEditDrawer"
 		/>
 	</el-aside>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageList.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageList.vue
index 474174aee..2e3713c18 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageList.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageList.vue
@@ -4,22 +4,925 @@
 @ 备注: 表单列表
 -->
 <script lang='ts' setup>
+import { ElTable } from 'element-plus'
+import { Hide, View } from '@element-plus/icons-vue'
+import { attrButton,tableButton,tableButtonList,tableLogButtonList,tableAttrLogButtonList,diaOrDrawer } from '@/api/DesignForm/tableButton'
 
+import { json2string,objToStringify,string2json,stringToObj } from '@/utils/DesignForm/form'
+import { analysisForm,setFlowFormKeyPower } from '@/api/workflowapi/index'
+import { gainFormTableField,editCustomerFormList,gainFormListCont } from '@/api/DesignForm/requestapi'
+import { formTableField,formTabelStruct } from "@/api/DesignForm/type";
+
+import tempOtherUnit from '@/components/DesignForm/pageList/types'
+import { ElMessage } from 'element-plus'
+
+import Sortable from 'sortablejs'
+//引入子组件
+import PageListHeadTools from '@/views/sysworkflow/lowcodepage/pageListHeadToolsApp.vue'
+import ControlSetup  from '@/views/sysworkflow/lowcodepage/pageSetUpDialog/controlSetup.vue'
+import FieldSetUp  from '@/views/sysworkflow/lowcodepage/pageSetUpDialog/fieldSetUp.vue'
+import SearchField  from '@/views/sysworkflow/lowcodepage/pageSetUpDialog/searchField.vue'
+import PreviewPage  from '@/views/sysworkflow/lowcodepage/pageSetUpDialog/previewPage.vue'
+import CodePage  from '@/views/sysworkflow/lowcodepage/pageSetUpDialog/codePage.vue'
+
+const props = defineProps({
+	appCont:{
+		type:Object,
+		default(){
+			return {}
+		}
+	},
+	formKey:{
+		type:String,
+		default:""
+	},
+	groupKey:{
+		type:String,
+		default:""
+	},
+	menuId:{
+		type:String,
+		default:""
+	},
+	appPageKey:{
+		type:String,
+		default:""
+	},
+	formVersion:{
+		type:String,
+		default:""
+	},
+	state:{
+		type:Object,
+		default(){
+			return {}
+		}
+	}
+});
+
+const formTableActive = ref(1)		//字段属性
+const zhuDaunIsTrue = ref(false);
+const listButtonIsShow = ref(false)
+const formTableField = reactive<formTableField>({})
+const container = ref()
+const drawer = reactive({
+    visible: false,
+    title: '',
+    direction: 'ltr',
+    content: '',
+    codeType: ''
+})
+const setUpFieldIsOpen= ref(false)
+const setUpFieldInfo = ref<tableButton>()
+const codeIsShow = ref(false)	//生成代码
+const tableFieldList = ref<InstanceType<typeof ElTable>>()
+const tableFieldAttrBut = ref<InstanceType<typeof ElTable>>()
+const tableAttrBut = ref<InstanceType<typeof ElTable>>()
+const emits = defineEmits<{
+    (e: 'update:state', val: formStruct): void
+	(e: 'update:formKey', val: string): void
+	(e: 'update:formVersion', val: string): void
+	(e: 'judgeFlowIsEdit', val: boolean): void
+	(e: 'runNextWindows', val: number): void
+	(e: 'closeFormPage'): void
+}>()
+const statePro =  computed({
+	get() {
+		return props.state
+	},
+	set(val: formStruct) {
+		emits('update:state', val)
+	}
+});
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:00:37
+@ 功能: 自定义列表结构
+*/
+const state = reactive({
+    tableData: {
+      // tableProps: {}, //表格所有参数
+      columns: [],
+      config: {},
+	  controlBtn:[],
+	  operateBtn:[]
+    },
+    searchData: [],
+    loading: false,
+    attrObj: {},
+    config: {
+		pageSize:10,
+		searchIsShow:true,
+		searchFormIsShow:true,
+		openPageMode:"drawer"
+	},
+    tagList: {},
+    formId: props.appPageKey.toString() || '',
+    formList: [], // 所有可选表单数据源
+    name: '',
+    treeData: {}, // 左侧树相关
+    previewVisible: false,
+    tabsName: 'second',
+    formFieldList: [], // 表单数据源所有可选字段
+	formApi:{
+		type:"1",
+		addApiUrl:"",
+		editApiUrl:"",
+		delApiUrl:"",
+		lookApiUrl:""
+	},
+    dict: {},
+    refreshTable: true
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:50:34
+@ 功能: 选项卡事件
+*/
+const handleClick = () => {
+
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 14:59:19
+@ 功能: 功能按钮
+*/
+const tableAttrButClick = (val:tableButton[]) => {
+	if(zhuDaunIsTrue.value == true){
+		if(state.tableData.controlBtn.length > 0){
+			state.tableData.controlBtn.splice(0, state.tableData.controlBtn.length);
+			state.tableData.controlBtn = val
+		}else{
+			state.tableData.controlBtn = val
+		}
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:16:13
+@ 功能: 设置功能按钮
+*/
+const setUpFieldBut = () => {
+	// console.log("设置字段属性-->")
+	listButtonIsShow.value = true
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:33:58
+@ 功能: 更新列表记录操作按钮
+*/
+const updataLogBut = (val:attrButton[]) => {
+	// console.log("更新列表记录操作按钮",val)
+	let isWrete = true
+	if(state.tableData.columns && state.tableData.columns.length > 0){
+		state.tableData.columns.forEach((item:any)=>{
+			if(item.fieldClass == "__control"){
+				state.tableData.operateBtn = val.value
+				isWrete = false
+			}
+		})
+	}
+	if(isWrete){
+		state.tableData.operateBtn = [];
+	}
+	// console.log("更新列表记录操作按钮------1------->",state.tableData.operateBtn)
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:39:27
+@ 功能: 解析表单
+*/
+const jieForm = () => {
+	if(props.appPageKey != ""){
+		gainFormTableField({id:props.appPageKey.toString()})
+			.then((data)=>{
+				console.log('解析表单--->',data)
+				formTableField.masterTable=data.data.masterTable
+				formTableField.sunTable=data.data.sunTable
+			})
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:41:53
+@ 功能: 组件加载完毕后执行
+*/
+onMounted(()=>{
+	jieForm();
+	nextTick(() => {
+      	columnDrop()
+		getListInfo();
+    })
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:42:18
+@ 功能: 拖动字段排序
+*/
+const columnDrop = () => {
+    const wrapperTr = container.value.querySelector(
+      	'.el-table__header-wrapper tr'
+    )
+	console.log("wrapperTr",wrapperTr)
+    Sortable.create(wrapperTr, {
+		animation: 180,
+		delay: 0,
+		onEnd: (evt: any) => {
+			console.log("evt",evt.oldIndex,evt.newIndex)
+			const oldItem = state.tableData.columns[evt.oldIndex]
+			state.tableData.columns.splice(evt.oldIndex, 1)
+			state.tableData.columns.splice(evt.newIndex, 0, oldItem)
+			// 重染表格，否则点下面的设置对不上了
+			state.refreshTable = false
+			nextTick(() => {
+				state.refreshTable = true
+				nextTick(() => {
+					columnDrop() // 拖完后拖不到了，再执行一下
+				})
+			})
+		}
+    })
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:43:23
+@ 功能: 获取列表内容
+*/
+const getListInfo = () => {
+	console.log("获取列表内容1111",props.appPageKey)
+	gainFormListCont({id:props.appPageKey.toString()})
+		.then((data)=>{
+			console.log("获取列表内容",data)
+			if(data.data.listjson != null && data.data.listjson != ""){
+				let stateData = string2json(data.data.listjson)
+				console.log("获取列表内容---->",stateData)
+				state.tableData = stateData.tableData
+				state.searchData = stateData.searchData
+				state.loading = stateData.loading
+				state.attrObj = stateData.attrObj
+				state.config = stateData.config
+				state.tagList = stateData.tagList
+				state.formId = stateData.formId
+				state.formList = stateData.formList
+				state.name = stateData.name
+				state.treeData = stateData.treeData
+				state.previewVisible = stateData.previewVisible
+				state.formFieldList = stateData.formFieldList
+				state.formApi = stateData.formApi
+				state.dict = stateData.dict
+				state.refreshTable = stateData.refreshTable
+			}
+			
+
+			zhuDaunIsTrue.value = false
+			
+			if(state.tableData && state.tableData.columns && state.tableData.columns.length > 0) {
+				
+				if(formTableField.masterTable && formTableField.masterTable.length > 0){
+					state.tableData.columns.forEach((itemCol:any)=>{
+						formTableField.masterTable.forEach((item:any)=>{
+							if(itemCol.id == item.id){
+								console.log("========>",item)
+								item.isSearch = true
+								tableFieldList.value!.toggleRowSelection(item, true)
+							}
+						})
+					})
+					
+				}
+				
+				if(tableAttrLogButtonList && tableAttrLogButtonList.length > 0){
+					state.tableData.columns.forEach((itemCol:any)=>{
+						tableAttrLogButtonList.forEach((item:any)=>{
+							if(itemCol.id == item.id){
+								tableFieldAttrBut.value!.toggleRowSelection(item, true)
+							}
+						})
+					})
+				}
+			}
+			
+			if(state.tableData && state.tableData.controlBtn && state.tableData.controlBtn.length > 0) {
+				
+				state.tableData.controlBtn.forEach((itemCol:any)=>{
+					tableButtonList.forEach((item:any)=>{
+						if(itemCol.id == item.id){
+							tableAttrBut.value!.toggleRowSelection(item, true)
+						}
+					})
+				})
+			}
+
+			zhuDaunIsTrue.value = true
+		})
+		
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 15:59:43
+@ 功能: 功能字段
+*/
+const tableFieldAttrButClick = (val:tableButton[]) => {
+	if(zhuDaunIsTrue.value == true){
+		if(val.length > 0){	//判断是否有选中的字段
+			if(state.tableData.columns.length > 0){	//判断列表是否有数据
+				val.forEach((item:tableButton)=>{
+					let isTrue = true;
+					state.tableData.columns.forEach((itemTab:tableButton)=>{
+						if(item.id == itemTab.id){
+							isTrue = false;
+						}
+					});
+					if(isTrue){
+						state.tableData.columns.push(item)
+					}
+				})
+			}else{ //列表无数据,直接新增
+				val.forEach((item:tableButton)=>{
+					state.tableData.columns.push(item)
+				})
+			}
+			//此处往下是处理列表中有为选中的字段
+			let delField = []
+			tableAttrLogButtonList.forEach((item:tableButton)=>{
+				let isTrue = true;
+				val.forEach((itemVal:tableButton)=>{
+					if(item.id == itemVal.id){
+						isTrue = false
+					}
+				})
+				if(isTrue){
+					delField.push(item.id)
+				}
+			});
+			if(delField.length > 0){
+				state.tableData.columns.forEach((itemTab:tableButton,index:number)=>{
+					delField.forEach((item:string)=>{
+						if(item == itemTab.id){
+							state.tableData.columns.splice(index,1)			//删除列表中已经存在的字段
+						}
+					})
+					
+				});
+			}
+		}else{ //无选中的字段
+			if(state.tableData.columns.length > 0){
+				tableAttrLogButtonList.forEach((item:tableButton)=>{
+					state.tableData.columns.forEach((itemTab:tableButton,index:number)=>{
+						if(item.id == itemTab.id){
+							state.tableData.columns.splice(index,1)			//删除列表中已经存在的字段
+						}
+					});
+				});
+			}
+		}
+		if(state.tableData.columns.length > 0){
+			let isOpent = true;
+			state.tableData.columns.forEach((itemTab:tableButton)=>{
+				if(itemTab.fieldClass == "__control"){
+					isOpent = false;
+				}
+			});
+			if(isOpent){
+				state.tableData.operateBtn = [];
+			}
+		}else{
+			state.tableData.operateBtn = [];
+		}
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:00:41
+@ 功能: 定义自定义表头
+*/
+const readerColumn = (column:any) => {
+	let labelLong = column.label.length // 表头label长度
+	if(column.label.length < 3) {
+		labelLong = 3
+	}
+	let size = 30 // 根据需求定义一个字体的标尺
+	return labelLong * size
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:02:55
+@ 功能: 列表字段处理
+*/
+const tableListFieldClick = (val:any[]) => {
+	console.log("列表字段处理-->",val)
+	// zhuDaunIsTrue.value = true
+	if(zhuDaunIsTrue.value == true){
+		if(val.length > 0){
+			if(state.tableData.columns.length > 0){	//判断列表是否有数据
+				val.forEach((item:tableButton)=>{
+					let isTrue = true;
+					state.tableData.columns.forEach((itemTab:tableButton)=>{
+						if(item.id == itemTab.id){
+							console.log("列表字段处理-111->",val)
+							isTrue = false;
+						}
+					});
+					if(isTrue){
+						state.tableData.columns.push(item)
+					}
+				})
+			}else{ //列表无数据,直接新增
+				val.forEach((item:any)=>{
+					state.tableData.columns.push(item)
+				})
+			}
+			//此处往下是处理列表中有为选中的字段
+			let delField = []
+			formTableField.masterTable.forEach((item:tableButton)=>{
+				let isTrue = true;
+				val.forEach((itemVal:tableButton)=>{
+					if(item.id == itemVal.id){
+						isTrue = false
+					}
+				})
+				if(isTrue){
+					delField.push(item.id)
+				}
+			});
+			if(delField.length > 0){
+				state.tableData.columns.forEach((itemTab:tableButton,index:number)=>{
+					delField.forEach((item:string)=>{
+						if(item == itemTab.id){
+							state.tableData.columns.splice(index,1)			//删除列表中已经存在的字段
+						}
+					})
+					
+				});
+			}
+		}else{
+			if(state.tableData.columns.length > 0){
+				formTableField.masterTable.forEach((item:tableButton)=>{
+					state.tableData.columns.forEach((itemTab:tableButton,index:number)=>{
+						if(item.id == itemTab.id){
+							state.tableData.columns.splice(index,1)			//删除列表中已经存在的字段
+						}
+					});
+				});
+			}
+		}
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:05:22
+@ 功能: 处理查询条件
+*/
+const addOrDelSearchField = (val:attrButton,isTrue:boolean) => {
+	if(isTrue){
+		if(state.searchData.length>0){
+			let isWrite = true;
+			state.searchData.forEach((item:attrButton,index:number)=>{
+				if(item.id==val.id){
+					isWrite = false;
+				}
+			})
+			if(isWrite){
+				state.searchData.push(val)
+			}
+		}else{
+			state.searchData.push(val)
+		}
+	}else{
+		if(state.searchData.length>0){
+			state.searchData.forEach((item:attrButton,index:number)=>{
+				if(item.id==val.id){
+					state.searchData.splice(index,1)
+				}
+			})
+		}
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:25:05
+@ 功能: 列表头部按钮操作
+*/
+const listPageTools = (type: string) => {
+	console.log("列表头部操作--》",type)
+	switch(type){
+		case "del":
+			clearData()
+			break;
+		case "eye":
+			state.previewVisible = true
+			break;
+		case "json":
+			drawer.title = "查看表格列表结构"
+			dialogOpen(state, { direction: 'ltr', type: 'json' })
+			break;
+		case "save":
+			saveFormListData()
+		case "close":
+			emits('closeFormPage')
+			break;
+		default:
+	}
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:34:26
+@ 功能: 添加自定义表单列表设定
+*/
+const saveFormListData = () => {
+	const { type ,addApiUrl ,editApiUrl,delApiUrl,lookApiUrl } = state.formApi
+	if(!props.appPageKey || props.appPageKey == "" || props.appPageKey == null || props.appPageKey == undefined){
+		return ElMessage.error('未知表单参数！请先保存前置表单后再操作！')
+	}
+	console.log("添加自定义表单列表设定",state.formApi)
+	if(type != 1){
+		if(addApiUrl=="" || editApiUrl=="" || delApiUrl=="" || lookApiUrl == ""){
+			return ElMessage.error('请补全列表第三方APIUrl！')
+		}
+	}
+	if(state.tableData.columns.length < 1){
+		return ElMessage.error('未设置表单查询项！不可提交！')
+	}
+	let params: any = {
+		data: json2string(state),
+		id: props.appPageKey.toString()
+	}
+	console.log("添加自定义表单列表设定",params)
+	editCustomerFormList(params)
+		.then((data)=>{
+			console.log("添加自定义表单列表设定",data)
+			ElMessage.success(data.msg)
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:25:22
+@ 功能: 关闭预览
+*/
+const handlePreviewClose = () => {
+	state.previewVisible = false
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:25:35
+@ 功能: 清空数据
+*/
+const clearData = () => {
+	tableFieldList.value!.clearSelection()
+	tableFieldAttrBut.value!.clearSelection()
+	tableAttrBut.value!.clearSelection()
+	state.searchData = []
+	// state.tableData.controlBtn = []
+	// state.tableData.columns = []
+	state.tableData.operateBtn = []
+	state.tableData.config = {}
+	if(formTableField.masterTable){
+		formTableField.masterTable.forEach((item)=>{
+			item.isSearch = false;
+		})
+	}
+	
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-21 16:26:01
+@ 功能: 数据格式处理
+*/
+const dialogOpen = (obj: any, params: any = {}) => {
+    drawer.visible = true
+    Object.assign(drawer, { direction: 'ltr' }, params)
+    let editData = objToStringify(obj, true)
+    switch (params.type) {
+      case 'dict':
+        editData = json2string(obj, true)
+        break
+      case 'beforeRequest':
+      case 'beforeDelete':
+      case 'treeBeforeRequest':
+        if (!obj) {
+          editData = beforeRequest
+        }
+        break
+      case 'afterResponse':
+      case 'treeAfterResponse':
+        if (!obj) {
+          editData = afterResponse
+        }
+        break
+    }
+    drawer.content = editData
+}
 </script>
 <template>
-	<el-main class="mainBox">Main</el-main>
-	<el-aside class="asideBox">Aside</el-aside>
+	<el-main class="mainBox">
+		<div class="header">
+			<div class="field">
+				
+			</div>
+			<PageListHeadTools @clearData="listPageTools" />
+		</div>
+		<div  ref="container"  class="table_box main_table">
+
+			<div class="search-box" >
+				<SearchField v-if="state.searchData&&state.searchData.length>0&&state.config.searchIsShow" v-model:searchData="state.searchData" />
+				<div v-else class="tipBox" >条件查询搜索区域</div>
+			</div>
+
+
+
+			<div class="operateButArea">
+				<div class="operatLeft">
+					<el-text v-if="state.tableData.controlBtn.length === 0" class="mx-1 tipBox" type="info">操作按钮区域</el-text>
+					<el-button
+						v-for="item in state.tableData.controlBtn"
+						v-bind="item"
+						:key="item.type"
+					>
+						{{ item.label }}
+					</el-button>
+				</div>
+				<div>
+					<el-tooltip
+						v-if="state.config.searchFormIsShow"
+						class="box-item"
+						effect="dark"
+						content="折叠查询表单"
+						placement="bottom"
+					>
+						<el-icon @click="state.config.searchIsShow=!state.config.searchIsShow"><Search /></el-icon>
+					</el-tooltip>
+				</div>
+			</div>
+
+			<div class="operateButArea tipBox" v-if="!state.tableData.columns?.length">
+				表格列设置区域，可从左上角 添加表格列字段
+				选择已有列或直接从上方工具栏 生成脚本预览 编辑
+			</div>
+			<el-table
+				:data="[{}]"
+				v-bind="state.tableData.tableProps || {}"
+				ref="tableEl"
+				
+			>
+				<template
+					v-for="item in state.tableData.columns"
+					:key="item.prop || item.label"
+				>
+
+					<el-table-column v-bind="item" :width="readerColumn(item)">
+
+						<template #header="scope">
+							<div class="field_close">
+								<el-text>{{ item.label }}</el-text>
+								<i ><el-icon  @click="delCol(item)"><Close /></el-icon></i>
+							</div>
+							<el-tooltip placement="top" v-if="item.help">
+								<template #content>
+									<span v-html="item.help"></span>
+								</template>
+								<i class="icon-help"></i>
+							</el-tooltip>
+						</template>
+						<template #default v-if="item.field !== 'index'">
+							<el-checkbox v-if="item.field === 'checkbox'" />
+							<span v-if="item.field === 'operate'">操作</span>
+							<span v-if="item.field !== 'checkbox'&&item.field !== 'operate'" >数据</span>
+						</template>
+					</el-table-column>
+				</template>
+			</el-table>
+			<div class="table-tip">
+				操作提示：<br />
+				*从数据列表配置中选择 所属表单<br />
+				*从左上角 添加表格字段 选择预设字段<br />
+				*可拖动表头字段移动调整表头字段排列顺序<br />
+				*可通过顶部工具栏 生成脚本预览 查看或编辑添加自定义字段<br />
+
+			</div>
+		</div>
+		
+		<ace-drawer
+			v-model="drawer.visible"
+			:title="drawer.title"
+			:direction="drawer.direction"
+			:content="drawer.content"
+			:code-type="drawer.codeType"
+			@before-close="drawerBeforeClose"
+			@confirm="dialogConfirm"
+		/>
+		<FieldSetUp v-model:is-open="setUpFieldIsOpen" :setup-field-info="setUpFieldInfo" />
+		<ControlSetup v-model:is-show="listButtonIsShow" v-model:contbutary:="state.tableData.operateBtn" @updata-log-but="updataLogBut" />
+		<CodePage  v-model:is-show="codeIsShow" :list-data="state" />
+
+		<el-drawer
+			v-model="state.previewVisible"
+			title="列表预览"
+			direction="btt"
+			:before-close="handlePreviewClose"
+			size="90%"
+		>
+			<ak-page-list
+				:data="state.tableData"
+				:search-data="state.searchData"
+				:config="state.config"
+				:form-id="props.appPageKey"
+				v-if="state.previewVisible"
+			/>
+
+		</el-drawer>
+	</el-main>
+	<el-aside class="asideBox">
+		<el-tabs ref="multipleTableRef" v-model="formTableActive" @tab-click="handleClick">
+			<el-tab-pane label="字段设置" :name="1">
+				<el-divider content-position="left">功能字段</el-divider>
+				<div class="form_tabs">
+					<el-table ref="tableFieldAttrBut" :data="tableAttrLogButtonList" border  style="width: 100%" @selection-change="tableFieldAttrButClick">
+						<el-table-column fixed type="selection" width="40"  align="center" />
+						<el-table-column prop="label" label="字段" />
+						<el-table-column fixed="right" label="设置" width="55" align="center">
+							<template #default="scope">
+								<el-icon v-if="scope.row.fieldClass=='__control'" title="设置" @click="setUpFieldBut(scope.row)" class="shoushi"><Setting /></el-icon>
+							</template>
+						</el-table-column>
+					</el-table>
+				</div>
+				<el-divider content-position="left">列表字段</el-divider>
+				<div class="form_tabs">
+					<el-table ref="tableFieldList" :data="formTableField.masterTable" border @selection-change="tableListFieldClick"  style="width: 100%">
+						<el-table-column fixed type="selection" width="40"  align="center" />
+						<el-table-column prop="label" label="字段">
+							<template #default="scope">
+								{{scope.row.label}}({{scope.row.fieldClass}}[{{scope.row.pattern}}])
+							</template>
+						</el-table-column>
+						<el-table-column fixed="right" label="查询" width="55" align="center">
+							<template #default="scope">
+								<el-switch
+									v-model="scope.row.isSearch"
+									:active-action-icon="View"
+									:inactive-action-icon="Hide"
+									style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+									@change="addOrDelSearchField(scope.row, $event)"
+								/>
+							</template>
+						</el-table-column>
+					</el-table>
+				</div>
+			</el-tab-pane>
+			<el-tab-pane label="列表设置" :name="2">
+				<el-divider content-position="left">功能按钮</el-divider>
+				<div class="form_tabs">
+					<el-table ref="tableAttrBut" :data="tableButtonList" border  style="width: 100%" @selection-change="tableAttrButClick">
+						<el-table-column fixed type="selection" width="40"  align="center" />
+						<el-table-column prop="label" label="字段" />
+					</el-table>
+				</div>
+				<el-divider content-position="left">基本功能设置</el-divider>
+				<div class="form_tabs">
+					<el-form :model="state.config" label-width="auto">
+						<el-form-item label="每页显示数据得数量">
+							<el-input-number
+								v-model="state.config.pageSize"
+								class="mx-4"
+								:min="1"
+								:max="10000"
+								controls-position="right"
+							/>
+						</el-form-item>
+						<el-form-item label="数据添加编辑打开方式">
+							
+							<el-select
+								v-model="state.config.openPageMode"
+								clearable
+								placeholder="请选择"
+							>
+								<el-option
+									v-for="itemOpt in diaOrDrawer"
+									:key="itemOpt.value"
+									:label="itemOpt.label"
+									:value="itemOpt.value"
+								/>
+							</el-select>
+						</el-form-item>
+						<el-form-item label="可折叠查询表单">
+							<el-switch
+								v-model="state.config.searchFormIsShow"
+								:active-action-icon="View"
+								:inactive-action-icon="Hide"
+								style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
+							/>
+						</el-form-item>
+					</el-form>
+				</div>
+				<el-divider content-position="left">数据处理事件</el-divider>
+				<div class="form_tabs">
+					<el-form :model="state.formApi" label-width="auto">
+						<el-form-item label="数据处理方式">
+							<el-switch
+								v-model="state.formApi.type"
+								active-text="默认"
+    							inactive-text="第三方API"
+								active-value="1"
+      							inactive-value="2"
+								style="--el-switch-on-color: #13ce66; --el-switch-off-color: #409EFF"
+							/>
+						</el-form-item>
+						<el-form-item v-if="state.formApi.type!=1" label="填加APIUrl">
+							<el-input v-model="state.formApi.addApiUrl" placeholder="请输入接口地址">
+								<template #prefix>http://</template>
+							</el-input>
+						</el-form-item>
+						<el-form-item v-if="state.formApi.type!=1" label="编辑APIUrl">
+							<el-input v-model="state.formApi.editApiUrl" placeholder="请输入接口地址">
+								<template #prefix>http://</template>
+							</el-input>
+						</el-form-item>
+						<el-form-item v-if="state.formApi.type!=1" label="删除APIUrl">
+							<el-input v-model="state.formApi.delApiUrl" placeholder="请输入接口地址">
+								<template #prefix>http://</template>
+							</el-input>
+						</el-form-item>
+						<el-form-item v-if="state.formApi.type!=1" label="查看APIUrl">
+							<el-input v-model="state.formApi.lookApiUrl" placeholder="请输入接口地址">
+								<template #prefix>http://</template>
+							</el-input>
+						</el-form-item>
+					</el-form>
+				</div>
+			</el-tab-pane>
+		</el-tabs>
+	</el-aside>
 </template>
 <style  lang='scss' scoped>
 .asideBox{
 	height: calc(100vh - 40px);
 	width: 300px;
 	overflow-y : auto;
+	.form_tabs{
+		padding: 0 10px;
+	}
+	.shoushi{
+		cursor:pointer;
+	}
 }
+
 .mainBox{
 	border-left: 1px solid #ECECEC;
 	border-right: 1px solid #ECECEC;
 	padding: 0;
 	overflow-y : auto;
+	.table_box{
+		background: #fff;
+		border: 1px dashed #999;
+		margin: 10px;
+		height: calc(100vh - 100px);
+		overflow-y: auto;
+		overflow-x: hidden;
+		position: relative;
+		.table-tip{
+			color: #999;
+			padding: 30px 0;
+			line-height: 22px;
+		}
+		.operateButArea{
+			width: 100%;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-top:15px;
+			.operatLeft{
+				padding-bottom: 2px;
+			}
+		}
+	}
+	.main_table{
+		padding: 10px 20px;
+		
+	}
+}
+.cell{
+		min-width:120px;
+	}
+.field_close{
+	i{
+		display: none;
+		cursor: pointer;
+	}
+	
+}
+.field_close:hover{
+	i{
+		display: inline;
+		cursor: pointer;
+	}
+	
+}
+.tipBox{
+	border: 1px dotted #ddd;
+    padding: 3px 5px;
+    border-radius: 5px;
+    color: #999;
+    text-align: center;
+    cursor: pointer;
 }
 </style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue b/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
index d55f3b788..b6f1332ab 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
@@ -38,9 +38,13 @@ const props = defineProps({
 	menuId:{
 		type:String,
 		default:""
+	},
+	appPageKey:{
+		type:String,
+		default:""
 	}
 });
-const emits = defineEmits(["update:isShow","gainSunAppContent"]);
+const emits = defineEmits(["update:isShow","gainSunAppContent","updateInit"]);
 const tabsActive = ref(1)
 const route: any = useRoute().query || {}
 const formConfigCont = reactive<customerFormConfig>({
@@ -79,6 +83,7 @@ const state = reactive<formStruct>({
 		formName: formConfigCont.formName
     }
 })
+const appPageInfo = ref(null)
 /**
 @ 作者: 秦东
 @ 时间: 2024-05-07 15:11:24
@@ -86,26 +91,30 @@ const state = reactive<formStruct>({
 */
 const closeSavePageForm = () =>{
 	emits("update:isShow",false)
-	emits("gainSunAppContent",false)
-	
+	emits("gainSunAppContent")
+	emits("updateInit")
+	// console.log("appPageInfo.value",appPageInfo.value)
+	appPageInfo.value.gainTableForm()
 }
 
 onBeforeMount(() => {
 	let send = {
 		types:3
 	}
-	getProductionMarkForm(send)
-		.then(({data})=>{
-			formConfigCont.formlogo = data.formlogo
-			formConfigCont.formName = data.formname
-			formConfigCont.signCode = data.signCode
-			state.formData.form.name = data.formlogo
-			state.formData.form.formName = data.formname
-			state.formOtherData.formName = data.formname
-		})
-		.finally(()=>{
-			
-		})
+	if(props.appPageKey == ""){
+		getProductionMarkForm(send)
+			.then(({data})=>{
+				formConfigCont.formlogo = data.formlogo
+				formConfigCont.formName = data.formname
+				formConfigCont.signCode = data.signCode
+				state.formData.form.name = data.formlogo
+				state.formData.form.formName = data.formname
+				state.formOtherData.formName = data.formname
+			})
+			.finally(()=>{
+				
+			})
+	}
 })
 </script>
 <template>
@@ -146,14 +155,13 @@ onBeforeMount(() => {
 						</el-tabs>
 					</div>
 					<div class="headRight">
-				
 						<el-button type="danger" size="small" @click="closeSavePageForm" >关闭</el-button>
 					</div>
 				</el-header>
 				<el-container>
-					<PageForm v-if="tabsActive==1" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey" v-model:state="state" v-model:form-version="formVersion" :formconfigcont="formConfigCont" />
-					<PageFlow v-if="tabsActive==2" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey" />
-					<PageList v-if="tabsActive==3" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey" />
+					<PageForm ref="appPageInfo" v-if="tabsActive==1" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey" v-model:state="state" v-model:form-version="formVersion" :formconfigcont="formConfigCont" :app-page-key="appPageKey" />
+					<PageFlow v-if="tabsActive==2" v-model:state="state" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey"  :app-page-key="appPageKey" v-model:form-version="formVersion"  />
+					<PageList v-if="tabsActive==3" v-model:state="state" :form-Key="props.formKey" :app-cont="props.appCont" :menu-id="menuId" :group-key="props.groupKey" :app-page-key="appPageKey" v-model:form-version="formVersion" />
 				</el-container>
 			</el-container>
 		</div>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/editAppMenuNamePage.vue b/src/views/sysworkflow/lowcodepage/appPage/editAppMenuNamePage.vue
index 12c2078e3..992739f0d 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/editAppMenuNamePage.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/editAppMenuNamePage.vue
@@ -69,6 +69,7 @@ const saveMenuData = () => {
 			editAppMenuLable({id:appMenuInfo.value.id, label:appMenuInfo.value.label})
 				.then((data) =>{
 					console.log("提交数据", data)
+					emits("updateMenu")
 					ElMessage({
 						message: data.msg,
 						type: 'success',
diff --git a/src/views/sysworkflow/lowcodepage/appPage/index.vue b/src/views/sysworkflow/lowcodepage/appPage/index.vue
index d396b97d1..2708b5f40 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/index.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/index.vue
@@ -12,6 +12,9 @@ import SvgIcon from "@/components/SvgIcon/index.vue";
 import AppMenus from "@/views/sysworkflow/lowcodepage/appPage/appMenus.vue"
 import AppMenuGroup from "@/views/sysworkflow/lowcodepage/appPage/appMenuGroup.vue"
 import CreateAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue"
+import OpenAppFormPage from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue"
+
+
 
 const props = defineProps({
 	drawerWith:{
@@ -45,6 +48,7 @@ const appCont = reactive<appSetInfo>({
 })
 const menuParentKey = ref<string>("")
 const menuGroupShow = ref(false) //添加菜单分组
+const appPageKey = ref<string>("")	//自定义App表单Id
 /**
 @ 作者: 秦东
 @ 时间: 2024-04-19 15:47:12
@@ -59,6 +63,7 @@ const handleClick = () =>{}
 const closeAppDraw = () =>{
 	emits("update:isShow",false)
 	emits("refreshPage")
+	checkedMenu.value = ""
 }
 onMounted(() =>{
 	// gainAppContent()
@@ -111,6 +116,35 @@ const saveAppFormIsShow = ref(false)
 const addAppPageForm = (key?:string) => {
 	saveAppFormIsShow.value = true
 }
+
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-18 09:00:00
+@ 功能: 操作表单页面
+*/
+const checkedMenu = ref<appMenuTreeInfo>("")
+const openAppPageForm = (val:appMenuTreeInfo) => {
+	checkedMenu.value = val
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-20 13:27:37
+@ 功能: 编辑app页面
+*/
+const editAppInfo = (id:string) => {
+	appPageKey.value = id
+	saveAppFormIsShow.value = true
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-20 16:20:08
+@ 功能: 重新初始化app
+*/
+const openAppPageInit = ref(null)
+const updataPageInit = () => {
+	openAppPageInit.value.gainAppFormPageInit()
+}
+
 </script>
 <template>
 	<div  class="drawerClass">
@@ -144,7 +178,7 @@ const addAppPageForm = (key?:string) => {
 							<el-button type="danger" size="small" @click="closeAppDraw">关闭</el-button>
 						</div>
 					</el-header>
-					<el-container>
+					<el-container v-if="tabsActive==1">
 						<el-aside class="asideBox">
 							<el-row>
 								<el-col :span="24" class="asideBoxSearch">
@@ -259,18 +293,32 @@ const addAppPageForm = (key?:string) => {
 									</el-menu-item>
 								</el-menu> -->
 
-								<AppMenus :form-Key="props.formKey" v-model:menus-tree="menusTree" :group-key="props.groupKey" :app-cont="appCont" :drawer-with="props.drawerWith" />
+								<AppMenus :form-Key="props.formKey" v-model:menus-tree="menusTree" :group-key="props.groupKey" :app-cont="appCont" :drawer-with="props.drawerWith" @openAppPageForm="openAppPageForm" />
 
-								<CreateAppFormPage v-if="saveAppFormIsShow" v-model:is-show="saveAppFormIsShow" :drawer-with="props.drawerWith"  :form-Key="props.formKey" :app-cont="appCont"  :group-key="props.groupKey" :menu-id="props.formKey" @gainSunAppContent="gainAppContent"   />
+								<CreateAppFormPage v-if="saveAppFormIsShow" v-model:is-show="saveAppFormIsShow" :drawer-with="props.drawerWith"  :form-Key="props.formKey" :app-cont="appCont"  :group-key="props.groupKey" :menu-id="props.formKey" v-model:app-page-key="appPageKey" @gainSunAppContent="gainAppContent" @updateInit="updataPageInit"  />
 
 							</el-scrollbar>
 						</el-aside>
 						<el-main class="mainBox">
 							<el-scrollbar class="scroBox">
-								<svg-icon icon-class="0213-lmp" />
+								<OpenAppFormPage ref="openAppPageInit" :form-Key="props.formKey" :group-key="props.groupKey" :app-cont="appCont" :drawer-with="props.drawerWith" :menus-info="checkedMenu" @editAppInfo="editAppInfo" />
+
 							</el-scrollbar>
 						</el-main>
 					</el-container>
+
+
+
+
+					<el-container v-if="tabsActive==2">
+						集成与自动化
+					</el-container>
+					<el-container v-if="tabsActive==3">
+						应用设置
+					</el-container>
+					<el-container v-if="tabsActive==4">
+						应用发布
+					</el-container>
 				</el-container>
 			</div>
 			<AppMenuGroup v-model:is-show="menuGroupShow" :menu-parent-key="menuParentKey" :app-cont="appCont" @updateMenu="gainAppContent" />
@@ -342,9 +390,9 @@ const addAppPageForm = (key?:string) => {
 	}
 	.mainBox{
 		background-color: #F1F2F3;
-
+		padding:0px;
 		.scroBox{
-			height: calc(100vh - 60px);
+			height: calc(100vh - 40px);
 		}
 	}
 }
diff --git a/src/views/sysworkflow/lowcodepage/pageListHeadToolsApp.vue b/src/views/sysworkflow/lowcodepage/pageListHeadToolsApp.vue
new file mode 100644
index 000000000..af04a2b84
--- /dev/null
+++ b/src/views/sysworkflow/lowcodepage/pageListHeadToolsApp.vue
@@ -0,0 +1,76 @@
+<!-- Created by weiXin:337547038 -->
+<template>
+	<div class="main-toolsTable">
+	  <slot></slot>
+	  <el-button
+		link
+		
+		@click="btnClick(item.icon)"
+		v-for="item in btnList"
+		:key="item.icon"
+		:type="item.key==6?'danger':'primary'"
+	  >
+		<i v-if="item.iconFont==''" :class="['icon-' + item.icon]" ></i><i v-if="item.iconFont!=''" :class="['fa ' + item.iconFont]" ></i>{{ item.label }}
+	  </el-button>
+	</div>
+</template>
+  
+  <script lang="ts" setup>
+	import { computed } from 'vue'
+  
+	const props = withDefaults(
+	  defineProps<{
+		showKey?: string[] // showKey,hideKey设置其中一个即可，showKey优先
+		hideKey?: string[] // 设置了showKey时，hideKey无效
+	  }>(),
+	  {
+		showKey: () => {
+		  return []
+		},
+		hideKey: () => {
+		  return []
+		}
+	  }
+	)
+	const emits = defineEmits<{
+	  (e: 'click', value: string): void
+	}>()
+  
+	const btnList = computed(() => {
+	  const list = [
+		{ icon: 'del',iconFont:"", label: '清空', key: 1 },
+		{ icon: 'eye',iconFont:"", label: '预览', key: 2 },
+		{ icon: 'json',iconFont:"", label: '生成脚本预览', key: 3 },
+		// { icon: 'vue', label: '导出vue文件', key: 4 },
+		{ icon: 'save',iconFont:"fa-save", label: '保存', key: 5 },
+		// { icon: 'close',iconFont:"fa-close", label: '关闭', key: 6 }
+	  ]
+	  if (props.showKey?.length) {
+		// 按照指定的key显示
+		return list.filter((item: any) => {
+		  return props.showKey.includes(item.key)
+		})
+	  } else if (props.hideKey?.length) {
+		// 按照指定的key隐藏
+		return list.filter((item: any) => {
+		  return !props.hideKey.includes(item.key)
+		})
+	  } else {
+		return list // 否则显示全部
+	  }
+	})
+	const btnClick = (type: string) => {
+	  emits('clearData', type)
+	}
+  </script>
+<style  lang='scss' scoped>
+.main-toolsTable{
+	line-height: 26px;
+    border-bottom: 2px solid #e4e7ed;
+    /* margin-right: 10px; */
+    padding: 8px 10px 8px 0;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+}
+</style>