diff --git a/src/components/DesignForm/aceDrawer.vue b/src/components/DesignForm/aceDrawer.vue
index 953b0e858..e221b85ab 100644
--- a/src/components/DesignForm/aceDrawer.vue
+++ b/src/components/DesignForm/aceDrawer.vue
@@ -83,5 +83,8 @@ onUnmounted(() => {
 	</el-drawer>
 </template>
 <style  lang='scss' scoped>
-
+#editJson, #editJsonCopy {
+    width: 100%;
+    height: calc(100vh - 90px);
+}
 </style>
diff --git a/src/components/DesignForm/dragControl.vue b/src/components/DesignForm/dragControl.vue
index 92e965505..ef5ad7a33 100644
--- a/src/components/DesignForm/dragControl.vue
+++ b/src/components/DesignForm/dragControl.vue
@@ -86,6 +86,7 @@ const useTemplateSelect = (data: FormData) => {
     emits('click', data)
 }
 const clone = (origin: any) => {
+	// console.log("All--->克隆选中的组件数据结构",origin)
     return jsonParseStringify(origin)
 }
 //数据监听
diff --git a/src/components/DesignForm/dragControlApp.vue b/src/components/DesignForm/dragControlApp.vue
index 30d91a195..c68f84d61 100644
--- a/src/components/DesignForm/dragControlApp.vue
+++ b/src/components/DesignForm/dragControlApp.vue
@@ -4,6 +4,7 @@
 @ 备注: 自定义表单组件页面(App专用)
 -->
 <script lang='ts' setup>
+import { jsonParseStringify } from '@/utils/DesignForm'
 import controlListData from '@/components/DesignForm/assembly'
 import Draggable from 'vuedraggable-es'
 import '@/assets/iconfont/iconfont.css'
@@ -93,6 +94,15 @@ const activities = [
     timestamp: '2018-04-11',
   },
 ]
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 10:15:14
+@ 功能: 克隆选中的组件数据结构
+*/
+const clone = (origin: any) => {
+	// console.log("克隆选中的组件数据结构",origin)
+    return jsonParseStringify(origin)
+}
 </script>
 <template>
 	<div class="components-list">
@@ -113,7 +123,7 @@ const activities = [
 				ghost-class="ghost"
 				:sort="false"
 				:clone="clone"
-				item-key="key123"
+				:item-key="key123"
 			>
 			
 				<template #item="{ element }">
diff --git a/src/components/DesignForm/dragControlNew.vue b/src/components/DesignForm/dragControlNew.vue
index 2b899b6ee..e35e34ef4 100644
--- a/src/components/DesignForm/dragControlNew.vue
+++ b/src/components/DesignForm/dragControlNew.vue
@@ -4,6 +4,7 @@
 @ 备注: 自定义表单组件
 -->
 <script lang='ts' setup>
+import { jsonParseStringify } from '@/utils/DesignForm'
 import controlListData from '@/components/DesignForm/assembly'
 import Draggable from 'vuedraggable-es'
 import '@/assets/iconfont/iconfont.css'
@@ -93,6 +94,18 @@ const activities = [
     timestamp: '2018-04-11',
   },
 ]
+
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 10:15:14
+@ 功能: 克隆选中的组件数据结构
+*/
+const clone = (origin: any) => {
+	// console.log("new--->克隆选中的组件数据结构",origin)
+    return jsonParseStringify(origin)
+}
+
+
 </script>
 <template>
 	<div class="components-list">
diff --git a/src/components/DesignForm/formControlAttr.vue b/src/components/DesignForm/formControlAttr.vue
index 7cfb9531e..730b20f9c 100644
--- a/src/components/DesignForm/formControlAttr.vue
+++ b/src/components/DesignForm/formControlAttr.vue
@@ -62,7 +62,7 @@
     const { formConfig, formData } = toRefs(props)
     const store = useDesignFormStore() as any
     const controlData = computed(() => {
-        console.log("注册自定义事件----------------->",props.formInfo)
+        // console.log("注册自定义事件----------------->",props.formInfo)
         // console.log("注册自定义事件--------1--------->",store.controlAttr)
         return store.controlAttr
     })
@@ -3004,7 +3004,7 @@ const loadNextPage = () => {
                             </el-button>
                         </div>
                         <el-divider content-position="left">高级属性</el-divider>
-                        
+                       
                         <LayoutPage v-if="cssIsShouw(attrList)"  v-model:styles-val="controlDataStyls" :place="controlData.type" />
     
     
diff --git a/src/components/DesignForm/formControlAttres.vue b/src/components/DesignForm/formControlAttres.vue
index 87305a695..67bf990a6 100644
--- a/src/components/DesignForm/formControlAttres.vue
+++ b/src/components/DesignForm/formControlAttres.vue
@@ -120,6 +120,19 @@ const isSearch = state.isSearch
       }*/
     ]
 })
+/** 
+    * 获取非负整数随机数 
+    * @param Min 最小整数  
+    * @param Max 最大整数 
+    * @returns 随机数 
+    */
+const Rand = (Min: number, Max: number) => {
+        switch (Min) {
+            case 0: return Math.round(Math.random() * Max);
+            case 1: return Math.ceil(Math.random() * Max);
+            default: return Math.round(Math.random() * (Max - Min) + Min);
+        }
+}
 const attrList = computed(() => {
     if (Object.keys(controlData.value).length) {
       const {
diff --git a/src/components/DesignForm/formControlProperties.vue b/src/components/DesignForm/formControlProperties.vue
index 3ff623007..6a06faabf 100644
--- a/src/components/DesignForm/formControlProperties.vue
+++ b/src/components/DesignForm/formControlProperties.vue
@@ -62,7 +62,7 @@ const designType = inject('formDesignType')
 const dataSourceOption = ref([])
 
 const controlData = computed(() => {
-    console.log("注册自定义事件----------------->",store.controlAttr)
+    // console.log("注册自定义事件----------------->",store.controlAttr)
     return store.controlAttr
 })
 /**
@@ -290,7 +290,7 @@ const editFormDict = (tooltip: string) => {
 @ 时间: 2024-05-10 13:19:37
 @ 功能: 组件属性
 */
-const componentProperties = computed(()=>{
+const attrList = computed(()=>{
 	if (Object.keys(controlData.value).length){
 		const {
             control = {},
@@ -1046,6 +1046,7 @@ const componentProperties = computed(()=>{
 @ 时间: 2024-05-10 13:33:51
 @ 功能: 组件属性变化
 */
+const fileSignAry = reactive<any>([])
 const controlChange = (obj: any, val: any) => {
 	switch (obj.eventName) {
         case 'selectMultiple':
@@ -1237,21 +1238,68 @@ const showHide = (type: string[], show?: boolean) => {
 @ 功能: 判断是否是组件
 */
 const cssIsShouw = (val:any) => {  
-	console.log("判断是否是组件",val)
+	// console.log("判断是否是组件",val)
     if(val && val.length  && val.length > 0){ 
         return true;
     }    
     return false;
 }
+/** 
+    * 获取非负整数随机数 
+    * @param Min 最小整数  
+    * @param Max 最大整数 
+    * @returns 随机数 
+    */
+    const Rand = (Min: number, Max: number) => {
+        switch (Min) {
+            case 0: return Math.round(Math.random() * Max);
+            case 1: return Math.ceil(Math.random() * Max);
+            default: return Math.round(Math.random() * (Max - Min) + Min);
+        }
+    }
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-13 15:46:24
+@ 功能: 
+*/
+watch(()=>store.activeKey, (val:string) => {
+    // console.log("监听数据编号--->", val)
+	if(controlData.value.type==='lowcodeCarsusel'){
+            const carsuselConfigData:CarsuselConfig[] = controlData.value.control.carsuselConfigArr
+            carsuselConfigData.forEach(element => {
+                //console.log(element)
+                if(element.imgId==''){
+                    //console.log("初始化imgid")
+                    let onlyNumber = uuidv4().replaceAll('-','').toString();   //获取唯一编码
+                    element.imgId = onlyNumber;
+                }
+            });
+    }else if(controlData.value.type==='associatedForms'){
+            controlData.value.control.fillRoles[0].id = uuidv4().replaceAll('-','').toString();
+    }
+	if (val) {
+        // 有值时自动跳到第一项
+        state.tabsName = 'first'
+        cssIsShouw(attrList)
+    }
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 11:07:37
+@ 功能: 获取组件样式Demo
+*/
+const controlDataStyls = computed(() => {
+        return store.controlAttr.styles
+})
 </script>
 <template>
-	<div class="sidebar-tools">
+	<div class="sidebar-tools_e">
 		<el-tabs v-model="state.tabsName">
 			<el-tab-pane label="字段配置" name="first">
 				<el-scrollbar class="formAttributeBox">
 					<el-form size="small" class="form">
 						<el-divider content-position="left">通用属性</el-divider>
-						<template v-for="(item, index) in componentProperties" :key="index">
+						<template v-for="(item, index) in attrList" :key="index">
 							<el-form-item :label="item.label"  class="form_cont">
 								<el-select
                                     v-if="item.type === 'select'"
@@ -1894,7 +1942,7 @@ const cssIsShouw = (val:any) => {
                             </el-button>
                         </div>
                         <el-divider content-position="left">高级属性</el-divider>
-                        
+                       
                         <LayoutPage v-if="cssIsShouw(attrList)"  v-model:styles-val="controlDataStyls" :place="controlData.type" />
     
 
@@ -2149,8 +2197,10 @@ li::before {
     margin-bottom: 3.5px;
 }
 
-.sidebar-tools .el-tabs__content{
-    padding: 0;
+.sidebar-tools_e .el-tabs__content{
+		padding: 0;
+	
+    
 }
 .el-collapse-item__header {
     padding-left: 10px;
diff --git a/src/components/DesignForm/public/form/calculate/cssInfo.ts b/src/components/DesignForm/public/form/calculate/cssInfo.ts
index 504d6dccf..168e0f0ab 100644
--- a/src/components/DesignForm/public/form/calculate/cssInfo.ts
+++ b/src/components/DesignForm/public/form/calculate/cssInfo.ts
@@ -174,7 +174,7 @@ export const AnalysisCss = (ele:any) =>{
     if(ele['fontColor'] && ele['fontColor'] != ""){
         styleObject['color'] = ele['fontColor'];
     }
-  console.log("分析css==>",styleObject);
+//   console.log("分析css==>",styleObject);
   return styleObject
 }
 
diff --git a/src/components/DesignForm/public/form/formGroup.vue b/src/components/DesignForm/public/form/formGroup.vue
index 04f37fd10..37a550f23 100644
--- a/src/components/DesignForm/public/form/formGroup.vue
+++ b/src/components/DesignForm/public/form/formGroup.vue
@@ -50,7 +50,10 @@ watch(
     (v: FormList[]) => {
       	dataList.value = v
 		// console.log("监听表单变化++++++++++>",v)
-    }
+    },
+	{
+    deep: true
+}
 )
 const activeKey = computed(() => {
     return store.activeKey
@@ -102,7 +105,11 @@ const draggableAdd = (evt: any) => {
     const key = new Date().getTime().toString()
     const obj: any = dataList.value[newIndex]
     const isNested = evt.target && evt.target.getAttribute('data-type') // 不能嵌套
-	// console.log("不能嵌套",obj,isNested)
+	// console.log("设计拖拽事件-----1------->",newIndex)
+    // console.log("设计拖拽事件-----2------->",key)
+    // console.log("设计拖拽事件-----3------->",obj)
+	// console.log("设计拖拽事件-----4------->",isNested)
+	// console.log("设计拖拽事件-----4------->",dataList.value)
     if ((isNested === 'not-nested' && notNested(obj.type))  || ((isNested === 'not-table' || isNested === 'not-flex') && notNestedTableFlex(obj.type))) {
 		dataList.value.splice(newIndex, 1)
 		return
@@ -150,6 +157,11 @@ const draggableAdd = (evt: any) => {
 			name: obj.type + key
 		}
     }
+
+	// console.log("设计拖拽事件-----5------->",obj)
+    // console.log("设计拖拽事件-----6------->",nameObj)
+    // console.log("设计拖拽事件-----7------->",objectItem)
+
     Object.assign(obj, nameObj, objectItem)
     groupClick(obj)
 }
@@ -203,7 +215,7 @@ const getFormItemStyle = (ele: FormList) => {
       	return { width: (ele.config.span / 24) * 100 + '%' }
     }
 	if(ele.styles?.divStyle){
-      console.log("返回栅格宽度3",AnalysisCss(ele.styles.divStyle))
+    //   console.log("返回栅格宽度3",AnalysisCss(ele.styles.divStyle))
       return AnalysisCss(ele.styles.divStyle)
     }
 }
@@ -502,7 +514,7 @@ const getFormItemLableStyle = (ele: any) => {
 						</div>
 						<div class="drag-move icon-move"></div>
 					</div>
-					<div class="tooltip" style="display: none;">{{ element.name }}</div>
+					<div class="tooltip" style="display: black;">{{ element.name }}</div>
 				</template>
 
 			</div>
diff --git a/src/components/DesignForm/public/form/formItem.vue b/src/components/DesignForm/public/form/formItem.vue
index 1f5991f6b..88c2c9022 100644
--- a/src/components/DesignForm/public/form/formItem.vue
+++ b/src/components/DesignForm/public/form/formItem.vue
@@ -469,13 +469,13 @@ onUnmounted(() => {})
 */
 const getFormItemLableStyle = (ele: any) => {
     if(ele?.labelStyle){
-      console.log("返回栅格宽度3",AnalysisCss(ele?.labelStyle))
+    //   console.log("返回栅格宽度3",AnalysisCss(ele?.labelStyle))
       return AnalysisCss(ele?.labelStyle)
     }
 }
 const getFormItemInputStyle = (ele: any,sty:number) => {
     if(ele?.inputStyle){
-      console.log("返回栅格宽度4",AnalysisInputCss(ele?.inputStyle,sty))
+    //   console.log("返回栅格宽度4",AnalysisInputCss(ele?.inputStyle,sty))
       return AnalysisInputCss(ele?.inputStyle,sty)
     }
 }
diff --git a/src/components/DesignForm/public/headToolsApp.vue b/src/components/DesignForm/public/headToolsApp.vue
new file mode 100644
index 000000000..b01f39060
--- /dev/null
+++ b/src/components/DesignForm/public/headToolsApp.vue
@@ -0,0 +1,82 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-13 14:36:07
+@ 备注: App表单头部控制
+-->
+<script lang='ts' setup>
+const props = withDefaults(
+	defineProps<{
+      showKey?: string[] // showKey,hideKey设置其中一个即可，showKey优先
+      hideKey?: string[] // 设置了showKey时，hideKey无效
+	  customerformid?: string,
+    }>(),
+	{
+		showKey: () => {
+			return []
+		},
+		hideKey: () => {
+			return []
+		},
+		customerformid: () => {
+			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: 'branch',iconFont:"fa-code-fork", label: '另存为新版', key: 4 },
+		// { 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('click', type)
+}
+
+</script>
+<template>
+	<div class="main-head-tools">
+		<div></div>
+		<div>
+			<span v-for="item in btnList">
+				<el-button
+					link
+					v-if="(item.icon != 'branch') || (item.icon == 'branch' && (props.customerformid !=''))"
+					@click="btnClick(item.icon)"
+					:key="item.icon"
+					:type="item.key==6?'danger':item.key==5?'success':item.key==4?'warning':'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>
+			</span>
+		</div>
+	</div>
+</template>
+<style  lang='scss' scoped>
+.main-head-tools{
+	line-height: 26px;
+    border-bottom: 2px solid #e4e7ed;
+    padding: 6px 0;
+    display: flex;
+    align-items: center;
+    justify-content:space-between;
+}
+</style>
diff --git a/src/types/components.d.ts b/src/types/components.d.ts
index e0a3166d9..f70557cd4 100644
--- a/src/types/components.d.ts
+++ b/src/types/components.d.ts
@@ -35,7 +35,6 @@ declare module '@vue/runtime-core' {
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCarousel: typeof import('element-plus/es')['ElCarousel']
     ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
-    ElCascader: typeof import('element-plus/es')['ElCascader']
     ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
     ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
     ElCol: typeof import('element-plus/es')['ElCol']
@@ -60,7 +59,6 @@ declare module '@vue/runtime-core' {
     ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
     ElInput: typeof import('element-plus/es')['ElInput']
     ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
-    ElLink: typeof import('element-plus/es')['ElLink']
     ElMain: typeof import('element-plus/es')['ElMain']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
@@ -68,7 +66,6 @@ declare module '@vue/runtime-core' {
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
     ElPopover: typeof import('element-plus/es')['ElPopover']
-    ElProgress: typeof import('element-plus/es')['ElProgress']
     ElRadio: typeof import('element-plus/es')['ElRadio']
     ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
     ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
@@ -117,11 +114,13 @@ declare module '@vue/runtime-core' {
     GithubCorner: typeof import('./../components/GithubCorner/index.vue')['default']
     Hamburger: typeof import('./../components/Hamburger/index.vue')['default']
     HeadTools: typeof import('./../components/DesignForm/public/headTools.vue')['default']
+    HeadToolsApp: typeof import('./../components/DesignForm/public/headToolsApp.vue')['default']
     HeadToolsNew: typeof import('./../components/DesignForm/public/headToolsNew.vue')['default']
     IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
     IEpCaretBottom: typeof import('~icons/ep/caret-bottom')['default']
     IEpCaretTop: typeof import('~icons/ep/caret-top')['default']
     IEpClose: typeof import('~icons/ep/close')['default']
+<<<<<<< HEAD
     IEpCollection: typeof import('~icons/ep/collection')['default']
     IEpDelete: typeof import('~icons/ep/delete')['default']
     IEpDownload: typeof import('~icons/ep/download')['default']
@@ -140,6 +139,9 @@ declare module '@vue/runtime-core' {
     IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
     IEpUser: typeof import('~icons/ep/user')['default']
     IEpView: typeof import('~icons/ep/view')['default']
+=======
+    IEpSetting: typeof import('~icons/ep/setting')['default']
+>>>>>>> v8_master
     LangSelect: typeof import('./../components/LangSelect/index.vue')['default']
     LayoutPage: typeof import('./../components/DesignForm/layoutPage/index.vue')['default']
     List: typeof import('./../components/DesignForm/public/form/components/list.vue')['default']
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index e8e25e700..ba0021956 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,250 +1,146 @@
-<script lang="ts">
-export default { name: "Dashboard" };
-</script>
+<!--
+@ 作者: 秦东
+@ 时间: 2023-11-06 13:39:13
+@ 备注: 首页
+-->
+<script lang='ts' setup>
+import * as echarts from 'echarts';	//引入图形界面
 
-<script setup lang="ts">
 import { useUserStore } from "@/store/modules/user";
-import { useTransition, TransitionPresets } from "@vueuse/core";
 
-import GithubCorner from "@/components/GithubCorner/index.vue";
-import SvgIcon from "@/components/SvgIcon/index.vue";
-import BarChart from "./components/BarChart.vue";
-import PieChart from "./components/PieChart.vue";
-import RadarChart from "./components/RadarChart.vue";
 
-const userStore = useUserStore();
+import { orgInfo } from '@/api/displayboardapi/types'
+import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi'
 
-const date: Date = new Date();
+import UserInfo from "@/views/dashboard/components/userinfo.vue";
+import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
+import EducationChart from "@/views/dashboard/components/education.vue";
+import AllOrgYear from "@/views/dashboard/components/allorgyear.vue";
+import OrgUserAge from "@/views/dashboard/components/orguserage.vue"; 
+import OrgEducation from "@/views/dashboard/components/orgeducation.vue"; 
+import Application from "@/views/dashboard/components/application.vue";  
+import HostNews from "@/views/dashboard/components/hostnews.vue";
 
-const greetings = computed(() => {
-  if (date.getHours() >= 6 && date.getHours() < 8) {
-    return "晨起披衣出草堂，轩窗已自喜微凉🌅！";
-  } else if (date.getHours() >= 8 && date.getHours() < 12) {
-    return "上午好🌞！";
-  } else if (date.getHours() >= 12 && date.getHours() < 18) {
-    return "下午好☕！";
-  } else if (date.getHours() >= 18 && date.getHours() < 24) {
-    return "晚上好🌃！";
-  } else if (date.getHours() >= 0 && date.getHours() < 6) {
-    return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
-  }
-});
+const userStore = useUserStore();
+const orgListCont = ref<orgInfo[]>([])
+const educationOrgId = ref<number>(309)
+const masterBody = ref<any>(null)
+const drawerWidht = ref<any>()
+/**
+ * 获取行政组织
+ */
+function getOrgList(){
+	getOrgChiled({id:313})
+		.then(( {data} )=>{
+			console.log("获取行政组织-2-->",data)
+			orgListCont.value = data.list
+			educationOrgId.value = data.current
+		})
+}
 
-const duration = 5000;
 
-// 收入金额
-const amount = ref(0);
-const amountOutput = useTransition(amount, {
-  duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-amount.value = 2000;
 
-// 访问数
-const visitCount = ref(0);
-const visitCountOutput = useTransition(visitCount, {
-  duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-visitCount.value = 2000;
+const orgAllYears = ref<any>()	//当前年
 
-//消息数
-const messageCount = ref(0);
-const messageCountOutput = useTransition(messageCount, {
-  duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-messageCount.value = 2000;
+const oenOrg = ref<any>() //单一行政组织
 
-// 订单数
-const orderCount = ref(0);
-const orderCountOutput = useTransition(orderCount, {
-  duration: duration,
-  transition: TransitionPresets.easeOutExpo,
-});
-orderCount.value = 2000;
-</script>
 
+//渲染完页面再执行
+onMounted(() => {
+	
+	drawerWidht.value = masterBody.value?.clientWidth
+	getOrgList();
+	// console.log("热门新闻----100---->",drawerWidht.value)
+})
+</script>
 <template>
-  <div class="dashboard-container">
-    <!-- github角标 -->
-    
-
-    <!-- 用户信息 -->
-    <el-row class="mb-8">
-      <el-card class="w-full">
-        <div class="flex justify-between flex-wrap">
-          <div class="flex items-center">
-            <img
-              class="user-avatar"
-              :src="userStore.avatar + '?imageView2/1/w/80/h/80'"
-            />
-            <span class="ml-[10px] text-[16px]">
-              {{ userStore.nickname }}
-            </span>
-          </div>
-
-          <div class="leading-[40px]">
-            {{ greetings }}
-          </div>
-
-          <div v-if="false" class="space-x-2 flex items-center" >
-            <el-link
-              target="_blank"
-              type="danger"
-              href="https://www.cnblogs.com/haoxianrui/p/16090029.html"
-              >官方0到1教程</el-link
-            >
-            <el-divider direction="vertical" />
-            <el-link
-              target="_blank"
-              type="success"
-              href="https://gitee.com/youlaiorg/vue3-element-admin"
-              >Gitee源码</el-link
-            >
-            <el-divider direction="vertical" />
-            <el-link
-              target="_blank"
-              type="primary"
-              href="https://github.com/youlaitech/vue3-element-admin"
-              >GitHub源码
-            </el-link>
-          </div>
-        </div>
-      </el-card>
-    </el-row>
-
-    <!-- 数据卡片 -->
-    <el-row :gutter="40" class="mb-4">
-      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
-        <div class="data-box">
-          <div
-            class="text-[#40c9c6] hover:!text-white hover:bg-[#40c9c6] p-3 rounded"
-          >
-            <svg-icon icon-class="uv" size="3em" />
-          </div>
-          <div class="flex flex-col space-y-3">
-            <div class="text-[var(--el-text-color-secondary)]">访问数</div>
-            <div class="text-lg">
-              {{ Math.round(visitCountOutput) }}
-            </div>
-          </div>
-        </div>
-      </el-col>
-
-      <!--消息数-->
-      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
-        <div class="data-box">
-          <div
-            class="text-[#36a3f7] hover:!text-white hover:bg-[#36a3f7] p-3 rounded"
-          >
-            <svg-icon icon-class="message" size="3em" />
-          </div>
-          <div class="flex flex-col space-y-3">
-            <div class="text-[var(--el-text-color-secondary)]">消息数</div>
-            <div class="text-lg">
-              {{ Math.round(messageCountOutput) }}
-            </div>
-          </div>
-        </div>
-      </el-col>
-
-      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
-        <div class="data-box">
-          <div
-            class="text-[#f4516c] hover:!text-white hover:bg-[#f4516c] p-3 rounded"
-          >
-            <svg-icon icon-class="money" size="3em" />
-          </div>
-          <div class="flex flex-col space-y-3">
-            <div class="text-[var(--el-text-color-secondary)]">收入金额</div>
-            <div class="text-lg">
-              {{ Math.round(amountOutput) }}
-            </div>
-          </div>
-        </div>
-      </el-col>
-      <el-col :xs="24" :sm="12" :lg="6" class="mb-2">
-        <div class="data-box">
-          <div
-            class="text-[#34bfa3] hover:!text-white hover:bg-[#34bfa3] p-3 rounded"
-          >
-            <svg-icon icon-class="shopping" size="3em" />
-          </div>
-          <div class="flex flex-col space-y-3">
-            <div class="text-[var(--el-text-color-secondary)]">订单数</div>
-            <div class="text-lg">
-              {{ Math.round(orderCountOutput) }}
-            </div>
-          </div>
-        </div>
-      </el-col>
-    </el-row>
-
-    <!-- Echarts 图表 -->
-    <el-row :gutter="40">
-      <el-col :sm="24" :lg="8" class="mb-4">
-        <BarChart
-          id="barChart"
-          height="400px"
-          width="100%"
-          class="bg-[var(--el-bg-color-overlay)]"
-        />
-      </el-col>
-
-      <el-col :xs="24" :sm="12" :lg="8" class="mb-4">
-        <PieChart
-          id="pieChart"
-          height="400px"
-          width="100%"
-          class="bg-[var(--el-bg-color-overlay)]"
-        />
-      </el-col>
-
-      <el-col :xs="24" :sm="12" :lg="8" class="mb-4">
-        <RadarChart
-          id="radarChart"
-          height="400px"
-          width="100%"
-          class="bg-[var(--el-bg-color-overlay)]"
-        />
-      </el-col>
-    </el-row>
-  </div>
+		<div ref="masterBody" class="app_container">
+			<el-row :gutter="10">
+				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
+					<AllOrgYear  :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
+				</el-col>
+				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
+					<UserInfo :user-store="userStore" />
+				</el-col>
+			</el-row>
+			<el-row :gutter="10" class="cart_top_juLi">
+				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
+
+					<el-row :gutter="10">
+						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
+						
+							<OrgUserAge :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
+						
+						</el-col>
+						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
+							
+							<OrgEducation :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
+						
+						</el-col>
+					</el-row>
+					
+					
+
+
+
+				</el-col>
+				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
+				
+					<HostNews v-model:drawer-widht="drawerWidht" />
+				
+				</el-col>
+			</el-row>
+			<el-row :gutter="10" class="cart_top_juLi">
+				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
+				
+					<SanLianpIng />
+				
+				</el-col>
+				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
+					<Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
+					
+				</el-col>
+			</el-row>
+			
+		</div>
 </template>
-
-<style lang="scss" scoped>
-.dashboard-container {
-  position: relative;
-  padding: 24px;
-
-  .user-avatar {
-    width: 40px;
-    height: 40px;
-    border-radius: 50%;
-  }
-
-  .github-corner {
-    position: absolute;
-    top: 0;
-    right: 0;
-    z-index: 99;
-    border: 0;
-  }
-
-  .data-box {
-    display: flex;
-    justify-content: space-between;
-    padding: 20px;
-    font-weight: bold;
-    color: var(--el-text-color-regular);
-    background: var(--el-bg-color-overlay);
-    border-color: var(--el-border-color);
-    box-shadow: var(--el-box-shadow-dark);
-  }
-
-  .svg-icon {
-    fill: currentcolor !important;
-  }
+<style  lang='scss' scoped>
+.app_container{
+	padding: 10px 20px 0px 20px;
+	height: calc(100vh - 90px);
+	overflow: hidden;
+	overflow-y: auto;
+}
+.readback{
+	// background-color:#FF0000;
+	.allOrgAxisCares{
+		display: block;
+		width:100%;
+		height:280px;
+		overflow:auto;
+	}
+	
+}
+.orgAllMothsTitle{
+	width:100%;
+	display: flex;
+	align-items: center;
+	justify-content:space-between;
+		
+}
+.greenColor{
+	// background-color:#FFAC52;
+	
+	// padding:0 10px 0 10px;
+}
+.span_icon_left{
+	margin-right:10px;
+}
+.cart_top_juLi{
+	// margin-top:10px;
+}
+.titleInfo{
+	font-size: 20px;
+	font-weight: bold;
 }
 </style>
diff --git a/src/views/dashboard/index_1.vue b/src/views/dashboard/index_1.vue
deleted file mode 100644
index ba0021956..000000000
--- a/src/views/dashboard/index_1.vue
+++ /dev/null
@@ -1,146 +0,0 @@
-<!--
-@ 作者: 秦东
-@ 时间: 2023-11-06 13:39:13
-@ 备注: 首页
--->
-<script lang='ts' setup>
-import * as echarts from 'echarts';	//引入图形界面
-
-import { useUserStore } from "@/store/modules/user";
-
-
-import { orgInfo } from '@/api/displayboardapi/types'
-import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi'
-
-import UserInfo from "@/views/dashboard/components/userinfo.vue";
-import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
-import EducationChart from "@/views/dashboard/components/education.vue";
-import AllOrgYear from "@/views/dashboard/components/allorgyear.vue";
-import OrgUserAge from "@/views/dashboard/components/orguserage.vue"; 
-import OrgEducation from "@/views/dashboard/components/orgeducation.vue"; 
-import Application from "@/views/dashboard/components/application.vue";  
-import HostNews from "@/views/dashboard/components/hostnews.vue";
-
-const userStore = useUserStore();
-const orgListCont = ref<orgInfo[]>([])
-const educationOrgId = ref<number>(309)
-const masterBody = ref<any>(null)
-const drawerWidht = ref<any>()
-/**
- * 获取行政组织
- */
-function getOrgList(){
-	getOrgChiled({id:313})
-		.then(( {data} )=>{
-			console.log("获取行政组织-2-->",data)
-			orgListCont.value = data.list
-			educationOrgId.value = data.current
-		})
-}
-
-
-
-const orgAllYears = ref<any>()	//当前年
-
-const oenOrg = ref<any>() //单一行政组织
-
-
-//渲染完页面再执行
-onMounted(() => {
-	
-	drawerWidht.value = masterBody.value?.clientWidth
-	getOrgList();
-	// console.log("热门新闻----100---->",drawerWidht.value)
-})
-</script>
-<template>
-		<div ref="masterBody" class="app_container">
-			<el-row :gutter="10">
-				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
-					<AllOrgYear  :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
-				</el-col>
-				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
-					<UserInfo :user-store="userStore" />
-				</el-col>
-			</el-row>
-			<el-row :gutter="10" class="cart_top_juLi">
-				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
-
-					<el-row :gutter="10">
-						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
-						
-							<OrgUserAge :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
-						
-						</el-col>
-						<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
-							
-							<OrgEducation :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
-						
-						</el-col>
-					</el-row>
-					
-					
-
-
-
-				</el-col>
-				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
-				
-					<HostNews v-model:drawer-widht="drawerWidht" />
-				
-				</el-col>
-			</el-row>
-			<el-row :gutter="10" class="cart_top_juLi">
-				<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
-				
-					<SanLianpIng />
-				
-				</el-col>
-				<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
-					<Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
-					
-				</el-col>
-			</el-row>
-			
-		</div>
-</template>
-<style  lang='scss' scoped>
-.app_container{
-	padding: 10px 20px 0px 20px;
-	height: calc(100vh - 90px);
-	overflow: hidden;
-	overflow-y: auto;
-}
-.readback{
-	// background-color:#FF0000;
-	.allOrgAxisCares{
-		display: block;
-		width:100%;
-		height:280px;
-		overflow:auto;
-	}
-	
-}
-.orgAllMothsTitle{
-	width:100%;
-	display: flex;
-	align-items: center;
-	justify-content:space-between;
-		
-}
-.greenColor{
-	// background-color:#FFAC52;
-	
-	// padding:0 10px 0 10px;
-}
-.span_icon_left{
-	margin-right:10px;
-}
-.cart_top_juLi{
-	// margin-top:10px;
-}
-.titleInfo{
-	font-size: 20px;
-	font-weight: bold;
-}
-</style>
diff --git a/src/views/dashboard/index_old.vue b/src/views/dashboard/index_old.vue
new file mode 100644
index 000000000..e8e25e700
--- /dev/null
+++ b/src/views/dashboard/index_old.vue
@@ -0,0 +1,250 @@
+<script lang="ts">
+export default { name: "Dashboard" };
+</script>
+
+<script setup lang="ts">
+import { useUserStore } from "@/store/modules/user";
+import { useTransition, TransitionPresets } from "@vueuse/core";
+
+import GithubCorner from "@/components/GithubCorner/index.vue";
+import SvgIcon from "@/components/SvgIcon/index.vue";
+import BarChart from "./components/BarChart.vue";
+import PieChart from "./components/PieChart.vue";
+import RadarChart from "./components/RadarChart.vue";
+
+const userStore = useUserStore();
+
+const date: Date = new Date();
+
+const greetings = computed(() => {
+  if (date.getHours() >= 6 && date.getHours() < 8) {
+    return "晨起披衣出草堂，轩窗已自喜微凉🌅！";
+  } else if (date.getHours() >= 8 && date.getHours() < 12) {
+    return "上午好🌞！";
+  } else if (date.getHours() >= 12 && date.getHours() < 18) {
+    return "下午好☕！";
+  } else if (date.getHours() >= 18 && date.getHours() < 24) {
+    return "晚上好🌃！";
+  } else if (date.getHours() >= 0 && date.getHours() < 6) {
+    return "偷偷向银河要了一把碎星，只等你闭上眼睛撒入你的梦中，晚安🌛！";
+  }
+});
+
+const duration = 5000;
+
+// 收入金额
+const amount = ref(0);
+const amountOutput = useTransition(amount, {
+  duration: duration,
+  transition: TransitionPresets.easeOutExpo,
+});
+amount.value = 2000;
+
+// 访问数
+const visitCount = ref(0);
+const visitCountOutput = useTransition(visitCount, {
+  duration: duration,
+  transition: TransitionPresets.easeOutExpo,
+});
+visitCount.value = 2000;
+
+//消息数
+const messageCount = ref(0);
+const messageCountOutput = useTransition(messageCount, {
+  duration: duration,
+  transition: TransitionPresets.easeOutExpo,
+});
+messageCount.value = 2000;
+
+// 订单数
+const orderCount = ref(0);
+const orderCountOutput = useTransition(orderCount, {
+  duration: duration,
+  transition: TransitionPresets.easeOutExpo,
+});
+orderCount.value = 2000;
+</script>
+
+<template>
+  <div class="dashboard-container">
+    <!-- github角标 -->
+    
+
+    <!-- 用户信息 -->
+    <el-row class="mb-8">
+      <el-card class="w-full">
+        <div class="flex justify-between flex-wrap">
+          <div class="flex items-center">
+            <img
+              class="user-avatar"
+              :src="userStore.avatar + '?imageView2/1/w/80/h/80'"
+            />
+            <span class="ml-[10px] text-[16px]">
+              {{ userStore.nickname }}
+            </span>
+          </div>
+
+          <div class="leading-[40px]">
+            {{ greetings }}
+          </div>
+
+          <div v-if="false" class="space-x-2 flex items-center" >
+            <el-link
+              target="_blank"
+              type="danger"
+              href="https://www.cnblogs.com/haoxianrui/p/16090029.html"
+              >官方0到1教程</el-link
+            >
+            <el-divider direction="vertical" />
+            <el-link
+              target="_blank"
+              type="success"
+              href="https://gitee.com/youlaiorg/vue3-element-admin"
+              >Gitee源码</el-link
+            >
+            <el-divider direction="vertical" />
+            <el-link
+              target="_blank"
+              type="primary"
+              href="https://github.com/youlaitech/vue3-element-admin"
+              >GitHub源码
+            </el-link>
+          </div>
+        </div>
+      </el-card>
+    </el-row>
+
+    <!-- 数据卡片 -->
+    <el-row :gutter="40" class="mb-4">
+      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
+        <div class="data-box">
+          <div
+            class="text-[#40c9c6] hover:!text-white hover:bg-[#40c9c6] p-3 rounded"
+          >
+            <svg-icon icon-class="uv" size="3em" />
+          </div>
+          <div class="flex flex-col space-y-3">
+            <div class="text-[var(--el-text-color-secondary)]">访问数</div>
+            <div class="text-lg">
+              {{ Math.round(visitCountOutput) }}
+            </div>
+          </div>
+        </div>
+      </el-col>
+
+      <!--消息数-->
+      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
+        <div class="data-box">
+          <div
+            class="text-[#36a3f7] hover:!text-white hover:bg-[#36a3f7] p-3 rounded"
+          >
+            <svg-icon icon-class="message" size="3em" />
+          </div>
+          <div class="flex flex-col space-y-3">
+            <div class="text-[var(--el-text-color-secondary)]">消息数</div>
+            <div class="text-lg">
+              {{ Math.round(messageCountOutput) }}
+            </div>
+          </div>
+        </div>
+      </el-col>
+
+      <el-col :xs="24" :sm="12" :lg="6" class="mb-4">
+        <div class="data-box">
+          <div
+            class="text-[#f4516c] hover:!text-white hover:bg-[#f4516c] p-3 rounded"
+          >
+            <svg-icon icon-class="money" size="3em" />
+          </div>
+          <div class="flex flex-col space-y-3">
+            <div class="text-[var(--el-text-color-secondary)]">收入金额</div>
+            <div class="text-lg">
+              {{ Math.round(amountOutput) }}
+            </div>
+          </div>
+        </div>
+      </el-col>
+      <el-col :xs="24" :sm="12" :lg="6" class="mb-2">
+        <div class="data-box">
+          <div
+            class="text-[#34bfa3] hover:!text-white hover:bg-[#34bfa3] p-3 rounded"
+          >
+            <svg-icon icon-class="shopping" size="3em" />
+          </div>
+          <div class="flex flex-col space-y-3">
+            <div class="text-[var(--el-text-color-secondary)]">订单数</div>
+            <div class="text-lg">
+              {{ Math.round(orderCountOutput) }}
+            </div>
+          </div>
+        </div>
+      </el-col>
+    </el-row>
+
+    <!-- Echarts 图表 -->
+    <el-row :gutter="40">
+      <el-col :sm="24" :lg="8" class="mb-4">
+        <BarChart
+          id="barChart"
+          height="400px"
+          width="100%"
+          class="bg-[var(--el-bg-color-overlay)]"
+        />
+      </el-col>
+
+      <el-col :xs="24" :sm="12" :lg="8" class="mb-4">
+        <PieChart
+          id="pieChart"
+          height="400px"
+          width="100%"
+          class="bg-[var(--el-bg-color-overlay)]"
+        />
+      </el-col>
+
+      <el-col :xs="24" :sm="12" :lg="8" class="mb-4">
+        <RadarChart
+          id="radarChart"
+          height="400px"
+          width="100%"
+          class="bg-[var(--el-bg-color-overlay)]"
+        />
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.dashboard-container {
+  position: relative;
+  padding: 24px;
+
+  .user-avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+  }
+
+  .github-corner {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 99;
+    border: 0;
+  }
+
+  .data-box {
+    display: flex;
+    justify-content: space-between;
+    padding: 20px;
+    font-weight: bold;
+    color: var(--el-text-color-regular);
+    background: var(--el-bg-color-overlay);
+    border-color: var(--el-border-color);
+    box-shadow: var(--el-box-shadow-dark);
+  }
+
+  .svg-icon {
+    fill: currentcolor !important;
+  }
+}
+</style>
diff --git a/src/views/sysworkflow/codepage/page.vue b/src/views/sysworkflow/codepage/page.vue
index 217e483f1..b1fe5cc36 100644
--- a/src/views/sysworkflow/codepage/page.vue
+++ b/src/views/sysworkflow/codepage/page.vue
@@ -1,252 +1,56 @@
 <!--
-@ 作者: 袁纪菲
-@ 时间: 2024.4.16
-@ 备注: 应用管理
+@ 作者: 秦东
+@ 时间: 2024-05-13 16:10:18
+@ 备注: webservice服务
 -->
-<script lang="ts" setup>
-import editpage from './editpage.vue';
-import { ref , onMounted } from 'vue';
-import { useRouter } from 'vue-router';
-
-//页面跳转
-const router = useRouter();
-const goToCreatePage = () => {
-  try {
-    router.push({ name: 'create' });
-  } catch (error) {
-    console.error("导航到创建页面时发生错误:", error);
-  }
-};
-const dialogRefedit = ref(false);
-interface cardDatas {
-    id: number;
-    name: string;
-    icon: string;
-}
-//初始化应用卡片数据
-const cardData = ref<cardDatas[]>([]);
-const emits = defineEmits(["update:Visible", "data"]);
+<script lang='ts' setup>
+const message = ref('');
+const ws = ref(null);
 
 onMounted(() => {
-    if (!cardData.value.length) {
-    for (let i = 0; i < 9; i++) {
-        cardData.value.push({
-            id: i,
-            name: '标题' + i,
-            icon: 'https://img.zcool.cn/community/01f3fb5a66a75ea80120a123a9f582.jpg@2o.jpg'
-        });
-    }
-    }
+  connect();
 });
-//编辑应用
-const showEditPage = (index: number) => {
-    dialogRefedit.value = true;
-    editpage.value.cardData = cardData.value[index];
-    editpage.value.onSubmit = handleEdit;
-};
-//编辑应用数据的接受与处理
-const handleEdit = (newCard: cardDatas) => {
-    cardData.value.splice(0, 1, newCard);
-};
-//删除卡片
-const deleteCard = (index: number) => {
-    cardData.value.splice(index, 1);
-};
-</script>
-<template>
-
-  <editpage v-model:Visible="dialogRefedit" @data="handleEdit" />
-  <div class="common-layout">
-    <el-container>
-      <el-container>
-        <el-main class="layout-content">
-          <el-header class="content-header">
-              <el-button class="create-btn" @click="goToCreatePage">
-                  <el-icon><Plus /></el-icon>
-                  新建应用
-              </el-button>
-          </el-header>
-          <el-main>
-              <el-scrollbar class="scrollbar">
-                  <div class="xiangying">
-                      <el-col v-for="(card) in cardData" :key="card.id">
-                          <el-card class="cardpattern" shadow="hover" >
-                              <div class="button">
-                                <img :src="card.icon" class="picture" />
-                                <span>自定义卡片</span>
-                                <el-icon class="star">
-                                    <Star />
-                                </el-icon>
-                                <el-dropdown class="xiala" trigger="click">
-                                    <el-icon>
-                                        <MoreFilled />
-                                    </el-icon>
-                                    <template #dropdown>
-                                        <el-dropdown-menu>
-                                            <el-dropdown-item @click = "() => showEditPage">编辑应用</el-dropdown-item>
-                                            <el-dropdown-item @click = "() => deleteCard">删除</el-dropdown-item>
-                                        </el-dropdown-menu>
-                                    </template>
-                                </el-dropdown>
-                              </div>
-                              <div class="cardhead">
-                                  <span>{{ card.name }}</span>
-                              </div>
-                          </el-card>
-                      </el-col>
-                  </div>
-              </el-scrollbar>
-          </el-main>
-        </el-main>
-      </el-container>
-    </el-container>
-  </div>
-</template>
-<style scoped>
-.common-layout {
-    width: 100%;
-    height: 100%;
-    .el-container {
-      height: 100%;
-    /* 不折叠的时候宽度是200px，折叠的时候宽度自适应 */
-    }
-  }
-  svg {
-    width: 1.5em;
-    margin-right: 5px;
+ 
+onUnmounted(() => {
+  if (ws.value) {
+    ws.value.close();
   }
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-  width: 200px;
-  min-height: 400px;
-}
-.el-aside {
-  width: auto;
-}
-.el-menu-vertical-demo {
-  border-right: none;
-  margin-top: 0;
-  height: 100%;
-  background-color: #586177;
-  color: #fff;
-}
-.el-menu-item {
-  color: #ffffff;
-}
-/* 侧边栏标题 */
-.side-header {
-  height: 64px;
-  padding: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-/* 右侧上方标题 */
-.up-header {
-  display: flex;
-  align-items : center;
-  justify-content:left;
-  background-color: #fff;
-  padding: 0;
-}
-/* 缩放侧边栏按钮 */
-.trigger {
-  font-size: 18px;
-  line-height: 64px;
-  padding: 0 24px;
-  cursor: pointer;
-}
-.el-main {
-  overflow-y: auto;
-  padding-right: 0; /* 取消内外边距以免影响滚动区域 */
-}
-/* 内容框 */
-.layout-content{
-    padding: 15px;
-    background: #f5f5f5;
-    min-height: 280px;
-}
-/* 新建按钮框 */
-.content-header {
-  display: flex;
-  justify-content: space-between;
-  text-align: right; 
-  font-size: 12px;
-  height: 40px;
-}
-/* 新建按钮 */
-.create-btn {
-    margin-right: 10px;
-    background-color: #1090ff;
-    color: #ffffff;
-}
-/* 卡片整体所在区域 */
-.scrollbar{
-    height: 700px;
-    overflow-y: auto; /* 自动显示垂直滚动条 */
-    margin-right: 10px;
-    box-sizing: border-box; /* 保证高度计算包含内边距和边框 */
-    
-    /* 当内容不够一屏时，禁用滚动条 */
-    &::-webkit-scrollbar {
-        width: 0;
-        height: 0;
-    }
-}
-/* 内容部分卡片响应式 */
-.xiangying {
-    display: grid;
-    grid-auto-rows: minmax(160px, auto); /* 或者指定最大高度 */
-    grid-gap: 1px;
-    grid-template-columns: repeat(auto-fit, 230px);
-    overflow-y: auto; /* 添加此行以允许卡片区域内部内容滚动 */
-}
-/* 卡片 */
-.cardpattern {
-    padding: 0px;
-    margin-bottom: 10px;
-    width: 220px;
-    height: 150px;
-    transition: all 0.3s ease;
-}
+});
 
-/* 卡片标题 */
-.cardhead {
-    margin-top: 50px;
-    font-size: 18px;
-    color: #000000;
-    font-weight: 500;
-    text-align: left;
-    font-family: PingFangSC-Regular;
-    line-height: 20px;
-}
-/* 收藏按钮与下拉框区域 */
-.button {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    margin-top: 3px; 
-}
-/* 收藏按钮 */
-.star {
-    font-size: 20px;
-    margin-right: -5px;
+function connect() {
+	ws.value = new WebSocket('ws://120.0.0.1:14250');
+	
+	ws.value.onopen = function(event) {
+		console.log('WebSocket 连接已打开', event);
+	};
+	
+	ws.value.onerror = function(error) {
+		console.error('WebSocket 出错', error);
+	};
+	
+	ws.value.onmessage = function(event) {
+		console.log('收到消息', event.data);
+	};
+	
+	ws.value.onclose = function() {
+		console.log('WebSocket 连接已关闭');
+	};
 }
 
-/* 占位元素 */
-.placeholder {
-    height:14px;
-    /* 设置为图标按钮组的高度 */
-    width:100%;
-    /* 设置为图标按钮组的宽度 */
-    visibility: hidden;
-    /* 或者 opacity: 0; 保证不会影响布局但不可见 */
-    pointer-events: none;
-    /* 防止此元素捕获鼠标事件 */
-}
-/* 图片 */
-.picture {
-    width: 3cap;
-    margin: 1px;
+function sendMessage() {
+  if (ws.value && ws.value.readyState === WebSocket.OPEN) {
+    ws.value.send(message.value);
+  } else {
+    console.error('WebSocket 连接未打开');
+  }
 }
+</script>
+<template>
+	<div>
+		<input v-model="message" placeholder="输入消息" />
+    	<button @click="sendMessage">发送</button>
+	</div>
+</template>
+<style  lang='scss' scoped>
 
 </style>
diff --git a/src/views/sysworkflow/codepage/page_20240513.vue b/src/views/sysworkflow/codepage/page_20240513.vue
new file mode 100644
index 000000000..217e483f1
--- /dev/null
+++ b/src/views/sysworkflow/codepage/page_20240513.vue
@@ -0,0 +1,252 @@
+<!--
+@ 作者: 袁纪菲
+@ 时间: 2024.4.16
+@ 备注: 应用管理
+-->
+<script lang="ts" setup>
+import editpage from './editpage.vue';
+import { ref , onMounted } from 'vue';
+import { useRouter } from 'vue-router';
+
+//页面跳转
+const router = useRouter();
+const goToCreatePage = () => {
+  try {
+    router.push({ name: 'create' });
+  } catch (error) {
+    console.error("导航到创建页面时发生错误:", error);
+  }
+};
+const dialogRefedit = ref(false);
+interface cardDatas {
+    id: number;
+    name: string;
+    icon: string;
+}
+//初始化应用卡片数据
+const cardData = ref<cardDatas[]>([]);
+const emits = defineEmits(["update:Visible", "data"]);
+
+onMounted(() => {
+    if (!cardData.value.length) {
+    for (let i = 0; i < 9; i++) {
+        cardData.value.push({
+            id: i,
+            name: '标题' + i,
+            icon: 'https://img.zcool.cn/community/01f3fb5a66a75ea80120a123a9f582.jpg@2o.jpg'
+        });
+    }
+    }
+});
+//编辑应用
+const showEditPage = (index: number) => {
+    dialogRefedit.value = true;
+    editpage.value.cardData = cardData.value[index];
+    editpage.value.onSubmit = handleEdit;
+};
+//编辑应用数据的接受与处理
+const handleEdit = (newCard: cardDatas) => {
+    cardData.value.splice(0, 1, newCard);
+};
+//删除卡片
+const deleteCard = (index: number) => {
+    cardData.value.splice(index, 1);
+};
+</script>
+<template>
+
+  <editpage v-model:Visible="dialogRefedit" @data="handleEdit" />
+  <div class="common-layout">
+    <el-container>
+      <el-container>
+        <el-main class="layout-content">
+          <el-header class="content-header">
+              <el-button class="create-btn" @click="goToCreatePage">
+                  <el-icon><Plus /></el-icon>
+                  新建应用
+              </el-button>
+          </el-header>
+          <el-main>
+              <el-scrollbar class="scrollbar">
+                  <div class="xiangying">
+                      <el-col v-for="(card) in cardData" :key="card.id">
+                          <el-card class="cardpattern" shadow="hover" >
+                              <div class="button">
+                                <img :src="card.icon" class="picture" />
+                                <span>自定义卡片</span>
+                                <el-icon class="star">
+                                    <Star />
+                                </el-icon>
+                                <el-dropdown class="xiala" trigger="click">
+                                    <el-icon>
+                                        <MoreFilled />
+                                    </el-icon>
+                                    <template #dropdown>
+                                        <el-dropdown-menu>
+                                            <el-dropdown-item @click = "() => showEditPage">编辑应用</el-dropdown-item>
+                                            <el-dropdown-item @click = "() => deleteCard">删除</el-dropdown-item>
+                                        </el-dropdown-menu>
+                                    </template>
+                                </el-dropdown>
+                              </div>
+                              <div class="cardhead">
+                                  <span>{{ card.name }}</span>
+                              </div>
+                          </el-card>
+                      </el-col>
+                  </div>
+              </el-scrollbar>
+          </el-main>
+        </el-main>
+      </el-container>
+    </el-container>
+  </div>
+</template>
+<style scoped>
+.common-layout {
+    width: 100%;
+    height: 100%;
+    .el-container {
+      height: 100%;
+    /* 不折叠的时候宽度是200px，折叠的时候宽度自适应 */
+    }
+  }
+  svg {
+    width: 1.5em;
+    margin-right: 5px;
+  }
+.el-menu-vertical-demo:not(.el-menu--collapse) {
+  width: 200px;
+  min-height: 400px;
+}
+.el-aside {
+  width: auto;
+}
+.el-menu-vertical-demo {
+  border-right: none;
+  margin-top: 0;
+  height: 100%;
+  background-color: #586177;
+  color: #fff;
+}
+.el-menu-item {
+  color: #ffffff;
+}
+/* 侧边栏标题 */
+.side-header {
+  height: 64px;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+/* 右侧上方标题 */
+.up-header {
+  display: flex;
+  align-items : center;
+  justify-content:left;
+  background-color: #fff;
+  padding: 0;
+}
+/* 缩放侧边栏按钮 */
+.trigger {
+  font-size: 18px;
+  line-height: 64px;
+  padding: 0 24px;
+  cursor: pointer;
+}
+.el-main {
+  overflow-y: auto;
+  padding-right: 0; /* 取消内外边距以免影响滚动区域 */
+}
+/* 内容框 */
+.layout-content{
+    padding: 15px;
+    background: #f5f5f5;
+    min-height: 280px;
+}
+/* 新建按钮框 */
+.content-header {
+  display: flex;
+  justify-content: space-between;
+  text-align: right; 
+  font-size: 12px;
+  height: 40px;
+}
+/* 新建按钮 */
+.create-btn {
+    margin-right: 10px;
+    background-color: #1090ff;
+    color: #ffffff;
+}
+/* 卡片整体所在区域 */
+.scrollbar{
+    height: 700px;
+    overflow-y: auto; /* 自动显示垂直滚动条 */
+    margin-right: 10px;
+    box-sizing: border-box; /* 保证高度计算包含内边距和边框 */
+    
+    /* 当内容不够一屏时，禁用滚动条 */
+    &::-webkit-scrollbar {
+        width: 0;
+        height: 0;
+    }
+}
+/* 内容部分卡片响应式 */
+.xiangying {
+    display: grid;
+    grid-auto-rows: minmax(160px, auto); /* 或者指定最大高度 */
+    grid-gap: 1px;
+    grid-template-columns: repeat(auto-fit, 230px);
+    overflow-y: auto; /* 添加此行以允许卡片区域内部内容滚动 */
+}
+/* 卡片 */
+.cardpattern {
+    padding: 0px;
+    margin-bottom: 10px;
+    width: 220px;
+    height: 150px;
+    transition: all 0.3s ease;
+}
+
+/* 卡片标题 */
+.cardhead {
+    margin-top: 50px;
+    font-size: 18px;
+    color: #000000;
+    font-weight: 500;
+    text-align: left;
+    font-family: PingFangSC-Regular;
+    line-height: 20px;
+}
+/* 收藏按钮与下拉框区域 */
+.button {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-top: 3px; 
+}
+/* 收藏按钮 */
+.star {
+    font-size: 20px;
+    margin-right: -5px;
+}
+
+/* 占位元素 */
+.placeholder {
+    height:14px;
+    /* 设置为图标按钮组的高度 */
+    width:100%;
+    /* 设置为图标按钮组的宽度 */
+    visibility: hidden;
+    /* 或者 opacity: 0; 保证不会影响布局但不可见 */
+    pointer-events: none;
+    /* 防止此元素捕获鼠标事件 */
+}
+/* 图片 */
+.picture {
+    width: 3cap;
+    margin: 1px;
+}
+
+</style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
index 5bb53cf7b..c86497d6a 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
@@ -4,14 +4,19 @@
 @ 备注: 自定义表单
 -->
 <script lang='ts' setup>
+import { useDesignFormStore } from '@/store/DesignForm/designForm'
 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 } from '@/api/DesignForm/requestapi'
 
 
 //引入页面
 import DragControlApp from '@/components/DesignForm/dragControlApp.vue';
+import HeadToolsApp from '@/components/DesignForm/public/headToolsApp.vue';
+import FormDesign from '@/components/DesignForm/public/form/form.vue'
+import PreviewPage from '@/views/sysworkflow/lowcodepage/appPage/appPageForm/previewPage.vue'
 
 const props = defineProps({
 	appCont:{
@@ -24,6 +29,10 @@ const props = defineProps({
 		type:String,
 		default:""
 	},
+	appPageKey:{
+		type:String,
+		default:""
+	},
 	groupKey:{
 		type:String,
 		default:""
@@ -63,6 +72,7 @@ const state =  computed({
 		emits('update:state', val)
 	}
 });
+
 provide('formDesignType', state.value.designType)
 const appFormKeyVal =  computed({
 	get() {
@@ -72,8 +82,19 @@ const appFormKeyVal =  computed({
 		emits('update:formKey', val)
 	}
 });
+const route: any = useRoute().query || {}
 const versionCont = ref<customerFormVersionCont[]>([])			//版本内容列表
 const tableKey = ref("")
+const versionId = ref<string>("")		//版本号
+const store = useDesignFormStore()
+const drawer = reactive<DrawerStruct>({
+    visible: false,
+    type: '',
+    title: '',
+    codeType: '',
+    direction: undefined, //弹出方向rtl / ltr
+    callback: ''
+})
 // 搜索设计时左侧快速添加字段
 const searchCheckField = (data: FormData) => {
     state.value.formData.list.push(data)
@@ -88,7 +109,258 @@ const editversionstaus = (id:string) =>{
 }
 //打开脚本预览
 const openAceEditDrawer = (params: any) => {
+	const { type, direction, codeType, title, callback, content } = params
+	drawer.direction = direction // 窗口位置ltr/rtl
+    drawer.type = type // 作为窗口唯一标识，在窗口关闭时可根据type作不同处理
+    drawer.codeType = codeType || '' // 显示代码类型
+    drawer.title = title ? `提示：${title}` : ''
+    drawer.visible = true
+    drawer.callback = callback
+    let editData =codeType === 'json'? json2string(content, true): objToStringify(content, true)
+	switch (type) {
+		case 'css':
+			editData = state.value.formData.config?.style || ''
+			break
+		case 'dict':
+			// 格式化一下
+			editData = json2string(state.value.formDict, true)
+			break
+		case 'beforeRequest':
+		case 'beforeSubmit':
+		case 'afterResponse':
+		case 'afterSubmit':
+		case 'change':
+			// eslint-disable-next-line no-case-declarations
+			const beforeData = state.value.formData.events || {}
+			if (beforeData[type]) {
+				editData = objToStringify(beforeData[type], true)
+			} else {
+				if (['afterResponse', 'afterSubmit'].includes(type)) {
+					editData = afterResponse
+				} else if (type === 'change') {
+					editData = onChange
+				} else {
+					editData = beforeRequest
+				}
+			}
+			break
+		// case 'afterResponse':
+		// case 'afterSubmit':
+		//   const newData = state.formData.events || {}
+		//   if (newData[type]) {
+		//     editData = objToStringify(newData[type], true)
+		//   } else {
+		//     editData = afterResponse
+		//   }
+		//   break
 
+		case 'optionsParams':
+			if (!content) {
+				editData = beforeRequest
+			}
+			break
+		case 'optionsResult':
+			if (!content) {
+				editData = afterResponse
+			}
+			break
+    }
+    drawer.content = editData
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:28:57
+@ 功能: 关闭脚本预览窗，并初始化脚本预览参数
+*/
+const dialogCancel = () => {
+    drawer.visible = false
+    drawer.type = ''
+    drawer.title = ''
+    drawer.codeType = ''
+    drawer.callback = ''
+    drawer.content = ''
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-13 14:40:40
+@ 功能: 表单编辑功能按钮回调事件
+*/
+const buttonCallbackEvent = (type: string) => {
+	console.log("表单编辑功能按钮回调事件", type)
+	switch (type) {
+		case 'del':	//清空
+			state.value.formData.list = []
+			store.setActiveKey('')
+			store.setControlAttr({})
+			break
+		case 'eye':	//预览
+			store.setActiveKey('')
+			store.setControlAttr({})
+			let stringPreview = objToStringify(state.value.formData) // 防止预览窗口数据修改影响
+			const formName = state.value.formData.form.name
+			const reg = new RegExp(`get${formName}ControlByName`, 'g')
+			stringPreview = stringPreview.replace(
+				reg,
+				`getPreview${formName}ControlByName`
+			)
+			state.value.formDataPreview = stringToObj(stringPreview)
+			state.value.formDataPreview.form.name = `Preview${formName}` // 修改下表单名
+			// console.log("预览数据",state.value.formDataPreview);
+			state.value.previewVisible = true
+			break
+		case 'json':	//生成脚本预览
+			openAceEditDrawer({
+				direction: 'rtl',
+				content: state.value.formData,
+				title: '可编辑修改或将已生成的脚本粘贴进来'
+			})
+			break
+		case 'save':	//保存
+			if(props.appPageKey && props.appPageKey != ""){	//存在，进行编辑操作
+
+			}else{ //不存在，进行新增操作
+				saveAppFormData();
+			}
+			break
+		case 'branch':	//另存为新版
+			break
+	}
+}
+
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-14 11:09:20
+@ 功能: 获取表单内容
+*/
+const gainTableForm = () => {
+	if(props.appPageKey){
+		state.value.loading = true
+		getOneProductionForm({id: props.appPageKey.toString()})
+			.then((res:any) => {
+				if(res.code == 0){
+					const result = res.data
+					console.log("初始设计搜索时--1--->",result)
+					// 初始设计搜索时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
+			})
+			.finally(()=>{
+				
+				haveCustomerFormVersion({id:state.value.formData.form.name})
+					.then(({data})=>{
+						versionCont.value = data
+						if(data.length > 0){
+							data.forEach((item:any) => {
+								if(item.status == 1){
+									versionId.value = item.id.toString()
+									emits('update:formVersion', item.id.toString())
+								}
+							});
+						}
+					})
+			})
+			.catch((res: any) => {
+				// console.log(res)
+				ElMessage.error(res.msg || '加载异常')
+				state.value.loading = false
+			})
+	}
+}
+onMounted(() => {
+    if (route.source) {
+      	formControlAttrEl.value.getFormFieldBySource(route.source)
+    }
+	gainTableForm()
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-09 14:29:06
+@ 功能: 根据启用版本进行加载页面
+*/
+const versionUpdateForm = (val:string) => {
+	console.log("加载异常-------111------->",val)
+	versionId.value = val
+	
+	getInitData()
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:14:40
+@ 功能: 关闭预览
+*/
+const closePreviewPage = (val:boolean) => {
+	// console.log("关闭预览",val)
+	state.value.previewVisible = val
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:58:21
+@ 功能: 写入自建应用App表单
+*/
+const saveAppFormData = () => {
+	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: 3, // 1表单 2列表 3:app表单
+		dict: json2string(state.value.formDict),
+		appKey:appFormKeyVal.value,
+		groupKey:props.groupKey
+	}
+	console.log("写入自建应用App表单",sendData)
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 14:07:39
+@ 功能: 编辑App自定义表单
+*/
+const editAppFormTable = () => {
+	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: 1, // 1表单 2列表
+		dict: json2string(state.value.formDict),
+		appKey:appFormKeyVal,
+		groupKey:props.groupKey,
+		id:props.appPageKey.toString(),
+		version:versionId.value.toString(),
+	}
+	console.log("编辑App自定义表单",sendData)
 }
 </script>
 <template>
@@ -99,7 +371,24 @@ const openAceEditDrawer = (params: any) => {
 		/>
 	</el-aside>
 	<el-main class="mainBox rightBox">
-		{{state.formData.config}}
+		<HeadToolsApp  v-loading="state.loading"  :customerformid="propsappPageKey" @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>
+					formKey：{{ props.formKey }} <br>
+					appPageKey：{{ props.appPageKey }} <br>
+					groupKey：{{ props.groupKey }} <br>
+					formVersion：{{ props.formVersion }} <br>
+					formconfigcont：{{ props.formconfigcont }} <br>
+					state：{{ props.state }} <br>
+				</div>
+				<FormDesign 
+					:type="5"
+					:form-data="state.formData"
+					:dict="state.formDict"
+				/>
+		</div>
 	</el-main>
 	<el-aside class="asideBox">
 		<formControlProperties
@@ -113,6 +402,16 @@ const openAceEditDrawer = (params: any) => {
 			@open-dialog="openAceEditDrawer"
 		/>
 	</el-aside>
+	<ace-drawer
+		v-model="drawer.visible"
+		:title="drawer.title"
+		:direction="drawer.direction"
+		:content="drawer.content"
+		:code-type="drawer.codeType"
+		@before-close="dialogCancel"
+		@confirm="dialogConfirm"
+	/>
+	<PreviewPage v-model:state="state"   @clickClose="closePreviewPage" />
 </template>
 <style  lang='scss' scoped>
 .asideBox{
@@ -132,4 +431,25 @@ const openAceEditDrawer = (params: any) => {
 	padding: 0;
 	overflow-y : auto;
 }
+.scr_form_box{
+	height: calc(100vh - 80px);
+}
+.main_form {
+    background: #fff;
+    border: 1px dashed #999;
+    margin: 10px;
+    height: calc(100vh - 105px);
+    overflow-y: auto;
+    overflow-x: hidden;
+    position: relative;
+}
+.main_form .empty-tips {
+    text-align: center;
+    width: 100%;
+    font-size: 20px;
+    color: #ccc;
+    position: absolute;
+    left: 0;
+    top: 100px;
+}
 </style>
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/previewPage.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/previewPage.vue
new file mode 100644
index 000000000..ee4d16c49
--- /dev/null
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/previewPage.vue
@@ -0,0 +1,87 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:09:38
+@ 备注: 预览页面
+-->
+<script lang='ts' setup>
+import FormDesign from '@/components/DesignForm/public/form/form.vue'
+const props = defineProps({
+	state:{
+		type:Object,
+		default(){
+			return {}
+		}
+	}
+});
+const emits = defineEmits<{
+    (e: 'update:state', val: any): void
+	(e: 'clickClose'): void
+}>()
+const state =  computed({
+	get() {
+		return props.state
+	},
+	set(val: formStruct) {
+		emits('update:state', val)
+	}
+});
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:12:54
+@ 功能: 提交预览
+*/
+const previewForm = ref()
+const previewSubmit = () => {
+	previewForm.value.validate((valid: boolean, fields: any) => {
+		if (valid) {
+			// alert('校验通过')
+			ElMessage.success('校验通过')
+			// console.log(fields)
+		} else {
+			// alert('校验不通过')
+			// console.log('error submit!', fields)
+			ElMessage.error('校验不通过')
+			return false
+      	}
+    })
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-15 13:16:09
+@ 功能: 关闭预览
+*/
+const clickClose = () => {
+	// console.log("关闭预览")
+	emits('clickClose', false)
+}
+</script>
+<template>
+	<div>
+		<el-drawer
+			v-model="state.previewVisible"
+			title="预览"
+			:append-to-body="true"
+			size="50%"
+		>
+			<FormDesign 
+				:type="1"
+				ref="previewForm"
+				:form-data="state.formDataPreview"
+				:dict="state.formDict"
+			/>
+			<template #footer>
+				<div class="dialog-footer">
+					<el-button size="small" type="primary" @click="previewSubmit">
+						提交
+					</el-button>
+					<el-button size="small" @click="clickClose">
+						取消
+					</el-button>
+				</div>
+			</template>
+      	</el-drawer>
+	</div>
+</template>
+<style  lang='scss' scoped>
+
+</style>