diff --git a/src/components/DesignForm/assembly/isSearch.ts b/src/components/DesignForm/assembly/isSearch.ts
index e69de29bb..986549346 100644
--- a/src/components/DesignForm/assembly/isSearch.ts
+++ b/src/components/DesignForm/assembly/isSearch.ts
@@ -0,0 +1,3 @@
+export const formControlProject = (val:any) =>{
+	return []
+}
diff --git a/src/components/DesignForm/dragControlApp.vue b/src/components/DesignForm/dragControlApp.vue
new file mode 100644
index 000000000..30d91a195
--- /dev/null
+++ b/src/components/DesignForm/dragControlApp.vue
@@ -0,0 +1,141 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-09 15:12:45
+@ 备注: 自定义表单组件页面(App专用)
+-->
+<script lang='ts' setup>
+import controlListData from '@/components/DesignForm/assembly'
+import Draggable from 'vuedraggable-es'
+import '@/assets/iconfont/iconfont.css'
+
+//引入页面
+import FormVersion from '@/components/DesignForm/formVersion.vue';
+
+
+const props = withDefaults(
+    defineProps<{
+      tableKey?: number | string,
+	  signCode?: number | string,
+    }>(),
+    {}
+)
+const designType = inject('formDesignType') as string	//注入一个由祖先组件或整个应用 (通过 app.provide()) 提供的值。
+// 默认搜索允许显示的字段
+const searchField = [
+    'input',
+    'radio',
+    'checkbox',
+    'select',
+    'datePicker',
+    'timePicker',
+    'inputNumber',
+    'cascader',
+    'component',
+    'button'
+]
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-09 10:58:56
+@ 功能: 表单组件数据
+*/
+const controlList = computed(() => {
+    if (designType === 'search') {
+		// 只返回基础字段
+		const temp: any = []
+		controlListData.forEach((item: any) => {
+			if (item.children) {
+				const filter = item.children.filter((ch: any) => {
+					return searchField.includes(ch.type)
+				})
+				if (filter && filter.length) {
+					temp.push({ title: item.title, children: filter })
+				}
+			}
+		})
+      	return temp
+    } else {
+      	return controlListData
+    }
+})
+const tableVersion = ref()	//版本显示器
+
+const emits = defineEmits<{
+	(e: 'versionUpdateForm', value: string): void
+}>()
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-09 11:36:59
+@ 功能: 启用和禁用版本
+*/
+const enableOrDisable = (val?:any) =>{
+	console.log("启用和禁用版本",val)
+	emits('versionUpdateForm', val)
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-09 11:40:15
+@ 功能: 打开版本选择页面
+*/
+const useVersionClick = () => {
+	tableVersion.value.open()
+}
+const activities = [
+  {
+    content: 'Event start',
+    timestamp: '2018-04-15',
+  },
+  {
+    content: 'Approved',
+    timestamp: '2018-04-13',
+  },
+  {
+    content: 'Success',
+    timestamp: '2018-04-11',
+  },
+]
+</script>
+<template>
+	<div class="components-list">
+		<div v-for="(list, index) in controlList" :key="index">
+			<div class="title">
+				{{ list.title }}
+				<div
+					class="template"
+					@click="useVersionClick"
+				>
+				版本
+				</div>
+			</div>
+			<draggable
+				v-model="list.children"
+				tag="ul"
+				:group="{ name: 'form', pull: 'clone', put: false }"
+				ghost-class="ghost"
+				:sort="false"
+				:clone="clone"
+				item-key="key123"
+			>
+			
+				<template #item="{ element }">
+					<li class="fontIcon" :class="[element.type]">
+						<i v-if="element.iconFont==''" :class="`icon-${element.icon}`"></i>
+						<i  v-if="element.iconFont!=''" :class="`fa ${element.iconFont} `"></i>
+						<span :title="element.label">{{ element.label }}</span>
+					</li>
+				</template>
+			</draggable>
+		</div>
+	</div>
+	<FormVersion ref="tableVersion" :table-key="props.tableKey" :sign-code="props.signCode" @enableOrDisable="enableOrDisable" />
+</template>
+<style  lang='scss' scoped>
+.tab_pane_body{
+	text-align: center;
+	
+}
+.fontIcon{
+	i{
+		padding: 4px 0px 0 0px;
+	}
+}
+</style>
diff --git a/src/components/DesignForm/formControlAttr.vue b/src/components/DesignForm/formControlAttr.vue
index 515cad92c..7cfb9531e 100644
--- a/src/components/DesignForm/formControlAttr.vue
+++ b/src/components/DesignForm/formControlAttr.vue
@@ -1423,7 +1423,7 @@
     defineExpose({ getFormFieldBySource })
     //判断输入框是否可写
     const isNotWrite = (val:any) =>{
-        // console.log("判断输入框是否可写--->",val)
+        console.log("判断输入框是否可写--->",val,props.customerformid)
         if(val.key === "name" && props.customerformid != ""){
             return true
         }
diff --git a/src/components/DesignForm/formControlProperties.vue b/src/components/DesignForm/formControlProperties.vue
new file mode 100644
index 000000000..3ff623007
--- /dev/null
+++ b/src/components/DesignForm/formControlProperties.vue
@@ -0,0 +1,2197 @@
+<!--
+@ 作者: 秦东
+@ 时间: 2024-05-10 08:47:28
+@ 备注: 表单控件（app）专用
+-->
+<script lang='ts' setup>
+import { getRequest } from '@/api/DesignForm'
+import { chineseToPinyin,customerFormGroupList } from '@/api/DesignForm/requestapi'
+import { formatNumber } from '@/api/DesignForm/utils'
+import appValidate from './validateApp'
+import appNumberValidate from './rule/numberRules'
+import { useDesignFormStore } from '@/store/DesignForm/designForm'
+
+import { VideoMsg,PublicAtrr } from '@/api/DesignForm/types'
+import { genFileId } from 'element-plus'
+import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
+
+//数学计算公式编辑器
+import MathFormula from '@/components/DesignForm/math/mathFormula.vue'
+//样式布局
+import LayoutPage from '@/components/DesignForm/layoutPage/index.vue'
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 09:07:53
+@ 功能: 接收父级参数
+*/
+const props = withDefaults(			
+    defineProps<{
+        formData: any
+        formList: any
+        formConfig: any
+        formOtherData: any
+        customerformid: number | string,
+		formInfo: any
+    }>(),
+    {
+        formConfig: () => {
+            return {}
+        },
+        formOtherData: () => {
+            // 其他不需要保存在formData里的数据
+            return {}
+        }
+    }
+)
+//注册自定义事件
+const emits = defineEmits<{
+    (e: 'openDialog', data: any): void
+    (e: 'update:formOtherData', data: any): void
+    (e: 'videoMsgChange', data: VideoMsg): void
+        //(e: 'update:formData', data: any): void
+        //(e: 'update:formConfig', data: any): void
+}>()
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 09:08:19
+@ 功能: 接收值转化ref对象
+*/
+const { formConfig, formData } = toRefs(props)
+const store = useDesignFormStore() as any
+const designType = inject('formDesignType')
+const dataSourceOption = ref([])
+
+const controlData = computed(() => {
+    console.log("注册自定义事件----------------->",store.controlAttr)
+    return store.controlAttr
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 09:14:03
+@ 功能: 表单及组件单元控制属性
+*/
+const state = reactive({
+	dataSourceList: [],			//数据源列表
+	customRulesList: [
+		...appValidate
+	], // 自定义校验规则
+	tooltip: {
+        css: '当前表单应用页的样式，类似于.vue文件中的style scoped中的样式',
+        dict: '数据字典，用于匹配多选组、下拉选择等，提供动态获取Options接口字典数据，一般不设置，从接口dict获取。json格式："sex":{"0":"男","1":"女"}',
+        rules:"可参考UI组件表单校验，<a href='https://element-plus.gitee.io/zh-CN/component/form.html#%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C' target='_blank' style='color:red'>详情点击</a>",
+        props: '可添加当前组件所有prop属性及事件方法'
+    },
+	tabsName: 'second',
+	numberRulesList:[
+		...appNumberValidate
+	]
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 10:15:14
+@ 功能: 分组数据
+*/
+const page = ref<number>(1)
+const pageSize = ref<number>(200000)
+const loadingmore = ref(false)
+const loadingnomore = ref(false)
+const formGroup = ref<any[]>([])
+const gainFormGroupList = () =>{
+	loadingmore.value = true;
+	let sendInfo = {
+		page:page.value,
+		pagesize:pageSize.value,
+		state:1
+	}
+	customerFormGroupList(sendInfo)
+		.then((data)=>{
+			formGroup.value = data.data
+		})
+		.finally(()=>{
+			loadingmore.value = false;
+		})
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 09:44:23
+@ 功能: 表单控制项
+*/
+const formControlProject = computed(()=>{
+	const isSearch = state.isSearch;
+	return [
+		{
+            label: '表单名称',
+            placeholder: '用于保存的表单名称',
+            value: props.formOtherData.formName,
+            key: 'formName',
+            hide: isSearch
+        },
+        {
+            label: '数据源',
+            placeholder: '请选择数据源',
+            value: formatNumber(props.formOtherData.source),
+            type: 'select',
+            options: dataSourceOption.value,
+            key: 'source',
+            hide: isSearch || !dataSourceOption.value?.length,
+            clearable: true
+        },
+        {
+            label: '表单标识',
+            value: formData.value.name,
+            placeholder: '表单唯一标识，可为空',
+            key: 'name',
+            hide: isSearch
+        }
+	];
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:20:18
+@ 功能: 根据选定数据源获取表单字段
+*/
+const getFormFieldBySource = (id?: string) => {
+    if (state.isSearch) {
+        // 搜索设计这里不需要数据源
+        return
+    }
+    const source = id
+    if (source) {
+        getRequest('sourceById', { id: source })
+            .then(res => {
+                    // console.log(res)
+                const tableData = res.data.result?.tableData
+                if (tableData && tableData.length) {
+                    state.dataSourceList = tableData.filter(
+                    (item: any) => item.enterable
+                    )
+                }
+            })
+            .catch(res => {
+                // console.log(res)
+            })
+    }
+}
+defineExpose({ getFormFieldBySource })
+
+
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:19:01
+@ 功能: 表单属性修改
+*/
+const formAttrChange = (obj: any, val?: any) => {
+    console.log("表单属性修改--->",obj,val,{ [obj.key]: obj.value })
+    if (obj.key === 'source') {
+        getFormFieldBySource(obj.value) // 改变了数据源了，重新请求数据
+            // 清空设计区已选择的组件，再一次选择时字段标识才会变
+        store.setActiveKey('')
+        store.setControlAttr({})
+    }
+    if (['formName', 'source'].includes(obj.key)) {
+        emits(
+            'update:formOtherData',
+            Object.assign(props.formOtherData, { [obj.key]: obj.value })
+        )
+        formData.value[obj.key] = obj.value
+        return
+    }
+    if (obj.path === 'config') {
+        formConfig.value[obj.key] = obj.value || val
+    } else {
+        formData.value[obj.key] = obj.value
+    }
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 10:17:29
+@ 功能: 组件加载完毕执行
+*/
+onMounted(() => {
+    gainFormGroupList()
+})
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:22:26
+@ 功能: 判断输入框是否可写
+*/
+const isNotWrite = (val:any) =>{
+    // console.log("判断输入框是否可写--->",val,props.customerformid)
+    if(val.key === "name" && props.customerformid != ""){
+        return true
+    }
+    return false
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-03-18 11:42:52
+@ 功能: 上传图标相关
+*/
+const imgUploadApiUrl = import.meta.env.VITE_APP_BASE_API+"/api/upordown" //上传地址
+const handleAvatarSuccess: UploadProps['onSuccess'] = (
+	response,
+	uploadFile
+) => {
+	//   imageUrl.value = URL.createObjectURL(uploadFile.raw!)
+	formConfig.value.imageUrl = response.data.url
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:28:40
+@ 功能: 上传前验证
+*/
+const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
+	console.log("beforeAvatarUpload",rawFile.type)
+  	if (rawFile.type !== 'image/jpeg' && rawFile.type !== 'image/jpg' && rawFile.type !== 'image/png' && rawFile.type !== 'image/gif' && rawFile.type !== 'image/icon') {
+    	ElMessage.error('请上传以下格式的图片(jpg、jpeg、png、gif、icon)!'+rawFile.type)
+    	return false
+  	} else if (rawFile.size / 1024 / 1024 > 2) {
+    	ElMessage.error('图片大小不要大于 2MB!')
+    	return false
+  	}
+  	return true
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:34:15
+@ 功能: 表单接口事件
+*/
+const eventClick = (type: string, tooltip?: string) => {
+    emits('openDialog', { type: type, title: tooltip, direction: 'ltr' })
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:52:57
+@ 功能: 编辑表单样式
+*/
+const editFormStyle = (tooltip: string) => {
+    emits('openDialog', {
+        codeType: 'css',
+        direction: 'ltr',
+        type: 'css',
+        title: tooltip
+    })
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 11:53:45
+@ 功能: 设置数据字典
+*/
+const editFormDict = (tooltip: string) => {
+    emits('openDialog', {
+        type: 'dict',
+        direction: 'ltr',
+        codeType: 'json',
+        title: tooltip
+    })
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 13:19:37
+@ 功能: 组件属性
+*/
+const componentProperties = computed(()=>{
+	if (Object.keys(controlData.value).length){
+		const {
+            control = {},
+            type,
+            name,
+            config = {},
+            item = {},
+            attr = {},
+            selectvalue = "default",
+            mathFormula = {}
+        }: { 
+			control: any;
+			type:any;
+			name:any;
+			item:any;
+			attr:any; 
+			config: any,
+			selectvalue:any,
+			mathFormula:any 
+		} = controlData.value
+		let columnIndex = false // 是否显示序号列
+		if (type === 'table') {
+            // 表格时处理
+            const list = controlData.value && controlData.value.list
+            if (list && list.length > 0) {
+                columnIndex = list[0].type === 'index'
+            }
+        }
+		const temp =reactive<PublicAtrr[]>([
+			{
+                label: '自定义Class',
+                value: config.className,
+                placeholder: '样式类名',
+                path: 'config.className'
+            },
+			{
+                label: '字段标识',
+                value: name,
+                type:Object.keys(state.dataSourceList).length > 0 ? 'select' : 'text',
+                placeholder: '字段唯一标识，对应数据库',
+                dict: state.dataSourceList,
+                path: 'name',
+                vHide: [
+                    'grid',
+                    'tabs',
+                    'card',
+                    'title',
+                    'gridChild',
+                    'tableColumn',
+                    'divider',
+                    'txt',
+                    'div',
+                    'button'
+                ],
+                eventName: 'filedNameKey'
+            },
+			{
+                label: '占位内容',
+                value: control.placeholder,
+                placeholder: 'placeholder',
+                path: 'control.placeholder',
+                vShow: [
+                    'password',
+                    'input',
+                    'textarea',
+                    'select',
+                    'date',
+                    'number',
+                    'datePicker',
+                    'tinymce',
+                    'timePicker',
+                    'treeSelect'
+                ]
+            },
+			{
+                label: '按钮类型',
+                value: control.type,
+                path: 'control.type',
+                type: 'select',
+                dict: {
+                    primary: 'primary',
+                    success: 'success',
+                    info: 'info',
+                    warning: 'warning',
+                    danger: 'danger'
+                },
+                vShow: ['button'],
+                clearable: true
+            },
+            {
+                label: '按钮名称',
+                value: control.label,
+                path: 'control.label',
+                vShow: ['button']
+            },
+			{
+                label: '按钮事件',
+                value: control.key,
+                path: 'control.key',
+                type: 'select',
+                dict: {
+                    submit: '提交表单',
+                    reset: '重置表单',
+                    cancel: '取消返回',
+                    none: '无动作(自定义)'
+                },
+                vShow: ['button']
+            },
+			{
+                label: '对齐方式',
+                value: config.textAlign,
+                path: 'config.textAlign',
+                type: 'select',
+                dict: {
+                    left: 'left',
+                    right: 'right',
+                    center: 'center'
+                },
+                vShow: ['button', 'div']
+            },
+			{
+                label: 'label值',
+                value: item.label,
+                path: 'item.label',
+                vHide: [
+                    'table',
+                    'grid',
+                    'tabs',
+                    'title',
+                    'gridChild',
+                    'div',
+                    'inputSlot',
+                    'flex',
+                    'button',
+                    'txt'
+                ],
+                eventName: 'labelNameVal'
+            },
+			{
+                label: '隐藏label',
+                value: item.showLabel,
+                path: 'item.showLabel',
+                type: 'switch',
+                vHide: [
+                    'table',
+                    'grid',
+                    'tabs',
+                    'title',
+                    'gridChild',
+                    'divider',
+                    'card',
+                    'div',
+                    'inputSlot',
+                    'flex',
+                    'button',
+                    'txt'
+                ]
+            },
+			{
+                label: '帮助信息',
+                value: config.help,
+                path: 'config.help',
+                vHide: [
+                    'table',
+                    'grid',
+                    'tabs',
+                    'gridChild',
+                    'divider',
+                    'div',
+                    'inputSlot',
+                    'flex',
+                    'button',
+                    'txt'
+                ]
+            },
+            {
+                label: '表单栅格',
+                value: config.span,
+                placeholder: '表单区域栅格宽，0为自动宽',
+                path: 'config.span',
+                vHide: ['gridChild'],
+                isNum: true
+            },
+			{
+                label: '文本值',
+                value: control.modelValue,
+                placeholder: '支持html',
+                path: 'control.modelValue',
+                vShow: ['txt'],
+                inputStyle: 'textarea'
+            },
+            {
+                label: '设为密码',
+                value: type,
+                type: 'select',
+                dict: { input: '文本', password: '密码' },
+                path: 'type',
+                vShow: ['input', 'password'],
+                vIf: state.isSearch // 搜索模式下隐藏 为true
+            },
+            {
+                label: '文本域高度',
+                value: control.rows,
+                placeholder: '输入框行数',
+                path: 'control.rows',
+                vShow: ['textarea'],
+                isNum: true
+            },
+            {
+                label: '前缀',
+                value: config.prepend,
+                placeholder: '文本前缀',
+                path: 'config.prepend',
+                vShow: ['input', 'password']
+            },
+            {
+                label: '后缀',
+                value: config.append,
+                placeholder: '文本后缀',
+                path: 'config.append',
+                vShow: ['input', 'password']
+            },
+            {
+                label: '状态打开时的值',
+                value: control.activeValue,
+                placeholder: '状态打开时的值',
+                path: 'control.activeValue',
+                vShow: ['switch'],
+                isNum: true
+            },
+            {
+                label: '状态关闭时的值',
+                value: control.inactiveValue,
+                placeholder: '状态关闭时的值',
+                path: 'control.inactiveValue',
+                vShow: ['switch'],
+                isNum: true
+            },
+			{
+                label: '增加按钮文案',
+                value: config.addBtnText,
+                path: 'config.addBtnText',
+                type: 'text',
+                Show: ['flex', 'table']
+            },
+            {
+                label: '删除按钮文案',
+                value: config.delBtnText,
+                path: 'config.delBtnText',
+                type: 'text',
+                vShow: ['flex', 'table']
+            },
+            {
+                label: '是否多选',
+                value: control.multiple,
+                path: 'control.multiple',
+                type: 'switch',
+                vShow: ['select', 'treeSelect'],
+                eventName: 'selectMultiple'
+            },
+            {
+                label: '可清空',
+                value: control.clearable,
+                path: 'control.clearable',
+                type: 'switch',
+                vShow: ['select']
+            },
+            {
+                label: '是否禁用',
+                value: control.disabled,
+                path: 'control.disabled',
+                type: 'switch',
+                vShow: [
+                    'input',
+                    'password',
+                    'textarea',
+                    'radio',
+                    'checkbox',
+                    'select',
+                    'date',
+                    'switch',
+                    'number',
+                    'cascader',
+                    'upload',
+                    'rate',
+                    'tinymce',
+                    'treeSelect'
+                ],
+                vIf: state.isSearch
+            },
+            {
+                label: '是否禁用编辑',
+                value: config.editDisabled,
+                path: 'config.editDisabled',
+                type: 'switch',
+                vShow: [
+                    'input',
+                    'password',
+                    'textarea',
+                    'radio',
+                    'checkbox',
+                    'select',
+                    'date',
+                    'switch',
+                    'number',
+                    'cascader',
+                    'upload',
+                    'treeSelect',
+                    'table',
+                    'flex'
+                ],
+                vIf: state.isSearch
+            },
+            {
+                    label: '添加页隐藏',
+                    value: config.disabledAdd,
+                    path: 'config.disabledAdd',
+                    type: 'switch',
+                    vIf: state.isSearch,
+                    vHide: ['inputSlot']
+            },
+            {
+                label: '编辑页隐藏',
+                value: config.disabledEdit,
+                path: 'config.disabledEdit',
+                type: 'switch',
+                vIf: state.isSearch,
+                vHide: ['inputSlot']
+            },
+            {
+                label: '详情页隐藏',
+                value: config.disabledDetail,
+                path: 'config.disabledDetail',
+                type: 'switch',
+                vIf: state.isSearch,
+                vHide: ['inputSlot']
+            },
+            {
+                label: '设为Input输入框的前/后缀',
+                value: type === 'inputSlot',
+                path: '',
+                type: 'switch',
+                vShow: ['select', 'inputSlot'],
+                eventName: 'setInputSlot'
+            },
+            {
+                label: '标题',
+                value: control.modelValue,
+                path: 'control.modelValue',
+                vShow: ['title']
+            },
+            {
+                label: '占据的列数span',
+                value: attr.span,
+                path: 'attr.span',
+                vShow: ['gridChild'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '左侧的间隔格数offset',
+                value: attr.offset,
+                path: 'attr.offset',
+                vShow: ['gridChild'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '向右移动格数push',
+                value: attr.push,
+                path: 'attr.push',
+                vShow: ['gridChild'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '向左移动格数pull',
+                value: attr.pull,
+                path: 'attr.pull',
+                vShow: ['gridChild'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '序号列',
+                value: columnIndex,
+                type: 'switch',
+                vShow: ['table'],
+                eventName: 'tableColumn1'
+            },
+				{
+                label: '组件名',
+                value: config.componentName,
+                placeholder: '全局注册的组件名称',
+                path: 'config.componentName',
+                vShow: ['component']
+            },
+			{
+				label: '隐藏条件',
+				value: config.associatedForms,
+				path: 'config.associatedForms',
+				type: 'associatedForms_hide',
+				vIf: state.isSearch,
+				vShow: ['associatedForms']
+			},
+            {
+				label: '关联表单',
+				value: config.associatedForms,
+				path: 'config.associatedForms',
+				type: 'associatedForms_form',
+				vIf: state.isSearch,
+				vShow: ['associatedForms']
+			},
+            {
+				label: '数据范围',
+				value: config.associatedForms,
+				path: 'config.associatedForms',
+				type: 'associatedForms_dataRange',
+				vIf: state.isSearch,
+				vShow: ['associatedForms']
+			},
+            {
+				label: '数据填充规则',
+				value: config.associatedForms,
+				path: 'config.associatedForms',
+				type: 'associatedForms_FillRoles',
+				vIf: state.isSearch,
+				vShow: ['associatedForms']
+			},
+            {
+                label: '轮播图设置',
+                value: config.carousel,
+                path: 'config.carousel',
+                type: 'carousel',
+                vIf: state.isSearch,
+                vShow: ['lowcodeCarsusel']
+            },
+
+			{
+				label: '穿梭框名',
+				value: config.transfer,
+				path: 'config.transfer',
+				type: 'transfer_name',
+				vIf: state.isSearch,
+				vShow: ['lowcodeTransfer']
+			},
+			{
+				label: '选项数据源',
+				value: config.transfer,
+				path: 'config.transfer',
+				type: 'transfer_options_datasource',
+				vIf: state.isSearch,
+				vShow: ['lowcodeTransfer']
+			},
+            {
+                label: '上传视频',
+                value: config.uploadvideo,
+                path: 'config.uploadvideo',
+                type: 'uploadvideo_url',
+                vIf: state.isSearch,
+                vShow: ['videoUpAndPlay']
+            },
+			{
+				label: '上传图片',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_url',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '尺寸',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_showMode',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '契合度',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_fit',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '圆角',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_radius',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '边框和阴影',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_boderAndShadow',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '图片链接',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_link',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '浮动',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_float',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+			{
+				label: '内外四边距',
+				value: config.lowcodeImage,
+				path: 'config.lowcodeImage',
+				type: 'lowcodeImage_marginAndPadding',
+				vIf: state.isSearch,
+				vShow: ['lowcodeImage']
+			},
+            {
+                label: '视频宽度(像素)',
+                value: config.uploadvideo,
+                path: 'config.uploadvideo',
+                type: 'uploadvideo_width',
+                vIf: state.isSearch,
+                vShow: ['videoUpAndPlay']
+            },
+            {
+                label: '视频高度(像素)',
+                value: config.uploadvideo,
+                path: 'config.uploadvideo',
+                type: 'uploadvideo_height',
+                vIf: state.isSearch,
+                vShow: ['videoUpAndPlay']
+            },
+            {
+                label: '视频自动播放',
+                value: config.uploadvideo,
+                path: 'config.uploadvideo',
+                type: 'uploadvideo_autoPlay',
+                vIf: state.isSearch,
+                vShow: ['videoUpAndPlay']
+            },
+            {
+                label: '视频循环播放',
+                value: config.uploadvideo,
+                path: 'config.uploadvideo',
+                type: 'uploadvideo_loopPlay',
+                vIf: state.isSearch,
+                vShow: ['videoUpAndPlay']
+            },
+            
+            
+            {
+                label: '上传地址',
+                value: control.action,
+                placeholder: '图片/文件上传地址,可不填有默认值',
+                path: 'control.action',
+                vShow: ['upload']
+            },
+            {
+                label: '文件字段名',
+                value: control.name,
+                placeholder: '上传的文件字段名,默认file',
+                path: 'control.name',
+                vShow: ['upload']
+            },
+            {
+                label: '列表类型',
+                value: control.listType,
+                type: 'select',
+                dict: {
+                    text: 'text',
+                    picture: 'picture',
+                    'picture-card': 'picture-card'
+                },
+                path: 'control.listType',
+                vShow: ['upload']
+            },
+            {
+                label: '提示文字',
+                value: config.tip,
+                placeholder: '提示说明文字',
+                path: 'config.tip',
+                vShow: ['upload']
+            },
+            {
+                label: '按钮文本',
+                value: config.btnText,
+                placeholder: '上传按钮文本',
+                path: 'config.btnText',
+                vShow: ['upload']
+            },
+            {
+                label: 'direction',
+                type: 'select',
+                dict: { horizontal: 'horizontal', vertical: 'vertical' },
+                placeholder: '分割线方向，默认horizontal',
+                value: control.direction,
+                path: 'control.direction',
+                vShow: ['divider']
+            },
+            {
+                label: 'border-style',
+                placeholder: '分隔符样式，默认solid',
+                value: control.borderStyle,
+                path: 'control.borderStyle',
+                vShow: ['divider']
+            },
+            {
+                label: 'content-position',
+                type: 'select',
+                dict: { left: 'left', right: 'right', center: 'center' },
+                value: control.contentPosition,
+                path: 'control.contentPosition',
+                vShow: ['divider']
+            },
+            {
+                label: '最小值',
+                value: control.min,
+                path: 'control.min',
+                vShow: ['slider'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '最大值',
+                value: control.max,
+                path: 'control.max',
+                vShow: ['rate', 'slider'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: '步长',
+                value: control.step,
+                path: 'control.step',
+                vShow: ['slider'],
+                eventName: 'formatNumber',
+                isNum: true
+            },
+            {
+                label: 'type',
+                value: control.type,
+                path: 'control.type',
+                vShow: ['datePicker'],
+                type: 'select',
+                placeholder: '显示类型',
+                dict: {
+                    year: 'year',
+                    month: 'month',
+                    date: 'date',
+                    datetime: 'datetime',
+                    week: 'week',
+                    datetimerange: 'datetimerange',
+                    daterange: 'daterange',
+                    monthrange: 'monthrange'
+                }
+            },
+            {
+                label: 'format',
+                value: control.format,
+                path: 'control.format',
+                vShow: ['datePicker', 'timePicker'],
+                placeholder: '显示在输入框中的格式'
+            },
+            {
+                label: 'color-format',
+                value: control.colorFormat,
+                path: 'control.colorFormat',
+                type: 'select',
+                placeholder: '写入 v-model 的颜色的格式',
+                dict: { hsl: 'hsl', hsv: 'hsv', hex: 'hex', rgb: 'rgb' },
+                vShow: ['colorPicker']
+            },
+            {
+                label: '文本高度',
+                value: control.height,
+                path: 'control.height',
+                placeholder: '文本高度(预览查看效果)',
+                vShow: ['tinymce']
+            },
+            {
+                label: '文本宽度',
+                value: control.width,
+                path: 'control.width',
+                placeholder: '文本宽度(预览查看效果)',
+                vShow: ['tinymce']
+            },
+            {
+                label: '图片上传地址',
+                value: control.imgUrl,
+                path: 'control.imgUrl',
+                placeholder: '图片上传地址',
+                vShow: ['tinymce']
+            },
+            {
+                label: '附件上传地址',
+                value: control.blobUrl,
+                path: 'control.blobUrl',
+                placeholder: '附件上传地址',
+                vShow: ['tinymce']
+            },
+            {
+                label: '显示模式',
+                value: config.style,
+                path: 'config.style',
+                placeholder: '显示风格(预览查看效果)',
+                type: 'select',
+                dict: { default: 'default', simple: 'simple' },
+                vShow: ['tinymce']
+            },
+            {
+                label: '默认值',
+                value: control.mathsValue,
+                selectvalue: selectvalue,
+                path: 'control.mathsValue',
+                placeholder: '显示风格(预览查看效果)',
+                type: 'digitpage',
+                dict: { default: '自定义', simple: '编辑公式' },
+                vShow: ['digitpage'],
+                control:control
+            }
+		])
+		// 过滤显示对应的值
+		return temp.filter((item: any) => {
+            let hasFilter = true
+            if (item.vShow) {
+                hasFilter = item.vShow.includes(type)
+            }
+            if (item.vHide) {
+                hasFilter = !item.vHide.includes(type)
+            }
+            if (item.vIf) {
+            // 不显示vif＝true的
+                hasFilter = false
+            }
+            return hasFilter
+        })
+	} else {
+        return []
+    }
+});
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 13:33:51
+@ 功能: 组件属性变化
+*/
+const controlChange = (obj: any, val: any) => {
+	switch (obj.eventName) {
+        case 'selectMultiple':
+            if (val) {
+                // 多选，将值改为数组
+                controlData.value.control.modelValue = []
+            } else {
+                // 单选
+                controlData.value.control.modelValue = ''
+            }
+            break
+        case 'tableColumn1':
+            tableColumnAdd(val)
+            break
+        case 'formatNumber':
+            val = parseInt(val) // 将值转数值
+            break
+        case 'filedNameKey':
+            // 选择字段标识时，同时修改显示标题
+            // 根据value找key
+            if (obj.type === 'select') {
+                state.dataSourceList.forEach((item: any) => {
+                    if (item.name === val) {
+                        if (controlData.value.item) {
+                            controlData.value.item.label = item.label
+                        }
+                        controlData.value.name = item.label
+                    }
+                })
+            }
+            break
+        case 'setInputSlot':
+            if (val) {
+                // 将类型改为inputSlot
+                controlData.value.type = 'inputSlot'
+                ElMessage.success(
+                    `请在对应的Input输入框属性前后缀设置key:${controlData.value.name}`
+                )
+            } else {
+                controlData.value.type = 'select'
+            }
+            // 这里会报错Cannot set properties of null (setting 'checked')
+            // 因value:type===inputSlot，这里使用了v-model，影响不大暂不处理
+            break
+        case 'labelNameVal':
+            if(val != ""){
+                chineseToPinyin({title:val,types:8,connector:"",formJson:JSON.stringify(props.formInfo)})
+                    .then((data:any)=>{
+                        if(data.code == 0){
+                            if(data.data != ""){
+                                if(!fileSignAry.includes(data.data)){
+                                    controlData.value.name = data.data
+                                    fileSignAry.push(data.data)
+                                }else{
+                                    let isEnd = true;
+                                    do{
+                                        let titleVal = data.data + Rand(10000000,99999999)
+                                        if(!fileSignAry.includes(titleVal)){
+                                            controlData.value.name = titleVal;
+                                            fileSignAry.push(titleVal);
+                                            isEnd=false;
+                                        }
+                                    }while(isEnd);
+                                }
+                            }else{
+                                if(!fileSignAry.includes(val)){
+                                    controlData.value.name = val 
+                                    fileSignAry.push(val)
+                                }else{
+                                    let titleVal = val + Rand(10000000,99999999)
+                                    if(!fileSignAry.includes(titleVal)){
+                                        controlData.value.name = titleVal;
+                                        fileSignAry.push(titleVal);
+                                    }
+                                }
+                                
+                            }
+                            
+                        }
+                    })
+            }
+                
+                // console.log("字段编辑--fileSignAry--》",fileSignAry)
+        	break
+    }
+    if (obj.path) {
+        const newVal = obj.isNum ? formatNumber(val) : val // 类型为数字时转整数
+        obj.path && getPropByPath(controlData.value, obj.path, newVal)
+    }
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 13:39:12
+@ 功能: 子表时添加序号和操作列
+*/
+const tableColumnAdd = (val: string) => {
+    const item = {
+        name: 'index',
+        type: 'index',
+        item: {
+            label: '序号'
+        },
+        control: {},
+        config: {}
+    }
+    if (val) {
+          controlData.value.list.unshift(item)
+    } else {
+          controlData.value.list.splice(0, 1)
+    }
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 13:40:14
+@ 功能: 修改指定路径下的值
+*/
+const getPropByPath = (obj: any, path: string, val: any) => {
+    let tempObj = obj
+    const keyArr = path.split('.')
+    let i = 0
+    for (i; i < keyArr.length - 1; i++) {
+        const key = keyArr[i]
+        if (key in tempObj) {
+            tempObj = tempObj[key]
+        } else {
+            throw new Error(`${key} is undefined`)
+        }
+    }
+    const key = keyArr[i]
+    const value = tempObj[keyArr[i]]
+       
+    if (val !== undefined) {
+        tempObj[key] = val
+    }
+    return {
+        obj: tempObj,
+        key: key,
+        value: value
+    }
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 15:02:37
+@ 功能: 默认值处理
+*/
+const unitInfo = ref<any>()
+const formListmap = ref<any>()
+const subUnit = ref<any>()
+const mathBoxShow = ref(false)
+const digitPageSub = (val:any,envt:any) => {
+    subUnit.value = val
+    controlData.value.selectvalue = envt
+    formListmap.value = props.formList
+    if(envt == "simple"){
+        unitInfo.value = attrList.value
+        mathBoxShow.value = true
+    }
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 15:05:47
+@ 功能: 打开数学公司编辑器
+*/
+const openMathDialog = (val:any) => {
+    subUnit.value = val
+    formListmap.value = props.formList
+    unitInfo.value = attrList.value
+    mathBoxShow.value = true
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 15:30:55
+@ 功能: 根据不同类型判断是否显示当前属性
+*/
+const showHide = (type: string[], show?: boolean) => {
+        // show=true 条件成立显示，false符合条件隐藏
+	if (
+	    (type && type.length === 0) ||
+	    Object.keys(controlData.value).length === 0
+	) {
+	      return false
+	}
+	const index = type.indexOf(controlData.value.type)
+	return show ? index !== -1 : index === -1
+}
+/**
+@ 作者: 秦东
+@ 时间: 2024-03-01 08:16:459097
+@ 功能: 判断是否是组件
+*/
+const cssIsShouw = (val:any) => {  
+	console.log("判断是否是组件",val)
+    if(val && val.length  && val.length > 0){ 
+        return true;
+    }    
+    return false;
+}
+</script>
+<template>
+	<div class="sidebar-tools">
+		<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">
+							<el-form-item :label="item.label"  class="form_cont">
+								<el-select
+                                    v-if="item.type === 'select'"
+                                    :placeholder="item.placeholder"
+                                    v-model="item.value"
+                                    :filterable="item.path === 'name'"
+                                    :allow-create="item.path === 'name'"
+                                    :clearable="item.clearable"
+                                    @change="controlChange(item, $event)"
+                                >
+                                    <el-option
+										v-for="(opt, key) in item.dict"
+										:key="key"
+										:value="item.path === 'name' ? opt.name : key"
+										:label="item.path === 'name' ? `${opt.label}(${opt.name})` : opt"
+                                    />
+                                </el-select>
+								<el-switch
+                                    v-else-if="item.type === 'switch'"
+                                    v-model="item.value"
+                                    @change="controlChange(item, $event)"
+                                />
+								<template v-else-if="item.type === 'digitpage'">
+									<el-row>
+										<el-col :span="12">
+                                            <el-select
+                                                v-model="item.selectvalue"
+                                                :placeholder="item.placeholder"
+                                                :filterable="item.path === 'name'"
+                                                :allow-create="item.path === 'name'"
+                                                :clearable="item.clearable"
+                                                @change="digitPageSub(item, $event)"
+                                            >
+                                                <el-option
+                                                    v-for="(opt, key) in item.dict"
+                                                    :key="key"
+                                                    :value="item.path === 'name' ? opt.name : key"
+                                                    :label="item.path === 'name' ? `${opt.label}(${opt.name})` : opt"
+                                                />
+                                            </el-select>
+                                        </el-col>
+                                        <el-col :span="12">
+                                            <el-input-number
+                                                v-if="item.selectvalue == 'default'"
+                                                v-model="item.value"
+                                                class="mx-4"
+                                            />
+                                        </el-col>
+									</el-row>
+									<div  v-if="item.selectvalue == 'simple'" style="width:100%;cursor: pointer; margin-top:10px;"  @click="openMathDialog(item)" v-html="item.control.mathFormula.formulaHtml"></div>
+                                    <MathFormula  v-model:show="mathBoxShow" :sub-unit="subUnit" :unit-info="attrList" :form-listmap="formListmap" @updata-digit="updataDigit" />
+								</template>
+								<el-row v-else-if="item.type === 'uploadvideo_url'">
+									<el-upload  
+										:action="uploadUrl"  :before-remove="beforeRemove"
+										:on-success="videoUploadOk" :show-file-list="true"
+										:on-error="videoUploadErr"
+										:limit="1"
+										:on-exceed="handleExceed"
+										accept=".mp4,.MOV,.WMV,.FLV,.AVI,.AVCHD,.WebM,.MKV,.rmvb"
+									>
+                                        <el-button v-if="!controlData.control.videoMsg[videoIndex].videoReady" type="primary">点此上传</el-button>
+                                        <el-button v-if="controlData.control.videoMsg[videoIndex].videoReady" type="primary">已上传,点击修改</el-button>
+                                    </el-upload>
+								</el-row>
+								<el-row v-else-if="item.type === 'uploadvideo_autoPlay'">
+                                    <el-switch v-model="controlData.control.videoMsg[videoIndex].videoAutoPlay" />
+                                </el-row>
+                                <el-row v-else-if="item.type === 'uploadvideo_loopPlay'">
+                                    <el-switch v-model="controlData.control.videoMsg[videoIndex].loop" />
+                                </el-row>
+                                <el-row v-else-if="item.type === 'uploadvideo_width'">
+                                    <el-input-number v-model="controlData.control.videoMsg[videoIndex].videoWidth" :step="50" :max="4096"/>
+                                </el-row>
+                                <el-row v-else-if="item.type === 'uploadvideo_height'">
+                                    <el-input-number v-model="controlData.control.videoMsg[videoIndex].videoHeight" :step="50" :max="2160"/>
+                                </el-row>
+                                <el-row v-else-if="item.type === 'carousel'">
+                                    <el-button  type="primary" append-to-body="true" modal="true" @click="dialogTableVisible = true"  >轮播图设置</el-button>
+                                </el-row>
+								<el-row v-else-if="item.type === 'transfer_name'">
+									<el-input
+										v-model="controlData.config.transferName"
+										placeholder="请输入穿梭框名"
+										style="width:221px"
+									/>
+								</el-row>
+								<el-row v-else-if="item.type ==='transfer_options_datasource'">
+									<el-select
+										v-model="controlData.config.transferDataSource"
+										placeholder="选项数据源"
+										style="width: 150px; height:20px"
+									>
+										<el-option
+											v-for="dataSourceOption1 in transferDataSourceOptions"
+											:key="dataSourceOption1.value"
+											:label="dataSourceOption1.label"
+											:value="dataSourceOption1.value"
+										/>
+									</el-select>
+									<div v-if="controlData.config.transferDataSource==='固定选项'" style="width: auto;margin-top:33px;margin-left:-220px;padding-bottom: 6px;">
+										<el-button  type="primary" append-to-body="true" modal="true" @click="transferDialogTableVisible = true"  >编辑固定选项</el-button>
+									</div>
+									<div v-if="controlData.config.transferDataSource==='数据源'" style="width: auto;margin-top: 20px;">
+										<el-input
+											v-model="controlData.config.apiUrl"
+											style="width:278px;margin-left: -68px;margin-top: -5px;"
+											placeholder="数据源接口url"
+										>
+											<template #prepend>
+												<el-select
+													v-model="controlData.config.method"
+													style="width: 100px"
+												>
+													<el-option label="get" value="get" />
+													<el-option label="post" value="post" />
+												</el-select>
+											</template>
+										</el-input>
+									</div>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_radius'">
+									<el-switch v-model="controlData.control.radius" style="margin-right: 15px;"/>
+									<el-popover
+										placement="top-start"
+										:width="200"
+										trigger="hover"
+										content="数值越大圆角程度越高"
+									>
+										<template #reference>
+											<el-input-number v-if="controlData.control.radius" v-model="controlData.control.radiusNum" :step="1"/>
+										</template>
+									</el-popover>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_url'">
+									<el-upload 
+										:action="uploadUrl"  :before-remove="beforeRemove"
+										:on-success="lowcodeImageUploadSuccess" 
+										:on-error="videoUploadErr"
+										:limit="1"
+										accept=".jpg,.jpeg,.png,.tif,.tga,.bmp,.dds,.svg,.eps,.pdf,.hdr,.raw,.exr,.psd,.afphoto,.afdesign"
+									>
+										<el-button v-if="!controlData.control.uploadFlag" type="primary">点此上传</el-button>
+										<el-button v-if="controlData.control.uploadFlag" type="primary">已上传,点击修改</el-button>
+									</el-upload>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_showMode'">
+									<el-select
+										v-model="controlData.control.showMode"
+										placeholder="选项数据源"
+										style="width: 150px; height:20px"
+									>
+										<el-option
+											v-for="showModeSelected in showModeSelectOptions"
+											:key="showModeSelected.value"
+											:label="showModeSelected.label"
+											:value="showModeSelected.value"
+										/>
+									</el-select>
+									<div v-if="controlData.control.showMode==='自定义像素值'" style="width: auto;margin-top:33px;margin-left:-187px;padding-bottom: 6px;">
+										<span style="margin-right: 10px;">宽度(像素) </span><el-input-number  v-model="controlData.control.pxWidth" style="margin-bottom: 10px;" /><br/>
+										<span style="margin-right: 10px;">高度(像素) </span><el-input-number v-model="controlData.control.pxHeight" />
+									</div>
+									<div v-if="controlData.control.showMode==='自定义占父容器比例'" style="width: auto;margin-top:33px;margin-left:-187px;padding-bottom: 6px;">
+										<span style="margin-right: 10px;">百分比宽 </span><el-input-number v-model="controlData.control.widthPercent" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;">百分比高 </span><el-input-number v-model="controlData.control.heightPercent" />
+									</div>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_fit'">
+									<el-radio-group v-model="controlData.control.fit">
+										<el-popover
+											placement="top-start"
+											title="fill"
+											:width="200"
+											trigger="hover"
+											content="默认值。调整替换后的内容大小，以填充元素的内容框。如有必要，将拉伸或挤压物体以适应该对象。"
+										>
+											<template #reference>
+												<el-radio :label="1" :value="1">fill</el-radio>
+											</template>
+										</el-popover>
+										<el-popover
+											placement="top-start"
+											title="contain"
+											:width="200"
+											trigger="hover"
+											content="缩放替换后的内容以保持其纵横比，同时将其放入元素的内容框。"
+										>
+											<template #reference>
+												<el-radio :label="2" :value="2">contain</el-radio>
+											</template>
+										</el-popover>
+
+										<el-popover
+											placement="top-start"
+											title="cover"
+											:width="200"
+											trigger="hover"
+											content="调整替换内容的大小，以在填充元素的整个内容框时保持其长宽比。该对象将被裁剪以适应。"
+										>
+											<template #reference>
+												<el-radio :label="3" :value="3">cover</el-radio>
+											</template>
+										</el-popover>
+
+										<el-popover
+											placement="top-start"
+											title="none"
+											:width="200"
+											trigger="hover"
+											content="不对替换的内容调整大小。"
+										>
+											<template #reference>
+												<el-radio :label="4" :value="4">none</el-radio>
+											</template>
+										</el-popover>										
+										<el-popover
+											placement="top-start"
+											title="scale-down"
+											:width="200"
+											trigger="hover"
+											content="调整内容大小就像没有指定内容或包含内容一样（将导致较小的具体对象尺寸）"
+										>
+											<template #reference>
+												<el-radio :label="5" :value="5">scale-down</el-radio>
+											</template>
+										</el-popover>
+									</el-radio-group>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_boderAndShadow'">
+									<el-switch v-model="controlData.control.boderAndShadow" style="margin-right: 15px;"/>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_link'">
+									<el-input
+									v-model="controlData.control.link"
+									placeholder="请录入图片链接地址"
+									style="width:221px"
+									/>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_marginAndPadding'">
+									<div style="width: auto;margin-top:33px;margin-left:-47px;padding-bottom: 6px;">
+										<span style="margin-right: 10px;"> 外边距(上)</span><el-input-number  v-model="controlData.control.mt" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 外边距(下)</span><el-input-number v-model="controlData.control.mb" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 外边距(左)</span><el-input-number  v-model="controlData.control.ml" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 外边距(右)</span><el-input-number v-model="controlData.control.mr" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 内边距(上)</span><el-input-number  v-model="controlData.control.pt" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 内边距(下)</span><el-input-number v-model="controlData.control.pb" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 内边距(左)</span><el-input-number  v-model="controlData.control.pl" style="margin-bottom: 10px;"/><br/>
+										<span style="margin-right: 10px;"> 内边距(右)</span><el-input-number v-model="controlData.control.pr" style="margin-bottom: 10px;"/><br/>
+									</div>
+								</el-row>
+								<el-row v-else-if="item.type === 'lowcodeImage_float'">
+									<el-switch v-model="controlData.control.floatFlag" style="margin-right: 15px;"/>
+									<el-select
+										v-if="controlData.control.floatFlag"
+										v-model="controlData.control.floatValue"
+										style="width: 150px; height:20px"
+									>
+										<el-option
+											v-for="showModeSelected1 in floatSelectOptions"
+											:key="showModeSelected1.value"
+											:label="showModeSelected1.label"
+											:value="showModeSelected1.value"
+										/>
+									</el-select>
+									
+								</el-row>
+								<el-row v-else-if="item.type === 'associatedForms_hide'">
+									<el-button v-if="controlData.control.hideConditionHtml===''" style="padding-top: 5px;" type="primary" link append-to-body="true" modal="true" @click="associatedFormsHideDialoghandle"  >设置隐藏条件</el-button>
+									<div   style="width:100%; cursor: pointer;"  @click="associatedFormsHideDialoghandle" v-html="controlData.control.hideConditionHtml"></div>
+								</el-row>
+								<el-row v-else-if="item.type === 'associatedForms_form'">
+                                    <div  style="margin-top: 25px;margin-left: -60px;">
+                                        <el-tree-select
+                                            v-model="controlData.control.formid"
+                                            style="width: 260px;"
+                                            :data="customerFormTree[0].children"
+                                            check-strictly
+                                            :render-after-expand="false"
+                                            filterable
+                                            @change="formidChanged"
+                                        />
+                                    </div>
+                                    <!-- <div v-html="controlData.control.formid"></div> -->
+								</el-row> 
+
+                                <el-row v-else-if="item.type === 'associatedForms_dataRange'">
+									<el-button v-if="controlData.control.dataRangeConditionHtml===''" style="padding-top: 5px;" type="primary" link append-to-body="true" modal="true" @click="associatedFormsDataRangeDialoghandle"  >设置数据范围</el-button>
+									<div style="width:100%; cursor: pointer;" @click="associatedFormsDataRangeDialoghandle"  v-html="controlData.control.dataRangeConditionHtml"></div>
+								</el-row>
+
+
+                                <el-row v-else-if="item.type === 'associatedForms_FillRoles'">
+									<el-button  style="padding-top: 5px;" type="primary" link append-to-body="true" modal="true" @click="associatedFormsDataFillRolesDialoghandle"  >设置数据填充规则</el-button>
+								
+								</el-row>
+								<el-input
+                                    v-else
+                                    :type="item.inputStyle"
+                                    v-model="item.value"
+                                    :placeholder="item.placeholder"
+                                    @input="controlChange(item, $event)"
+                                />
+							</el-form-item>
+						</template>
+						<template v-if="controlData.config">
+							<el-form-item label="联动条件"  class="form_cont">
+                                <el-switch v-model="controlData.config.linkKey" />
+                            </el-form-item>
+							<template v-if="controlData.config.linkKey">
+                                <el-form-item  class="form_cont">
+                                    <el-input
+                                    v-model="controlData.config.linkValue"
+                                    type="textarea"
+                                    placeholder="表达式如: $.input>1 $表示为当前表单数据，input为字段标识"
+                                    />
+                                </el-form-item>
+                                <el-form-item
+                                    class="form_cont"
+                                    v-if="
+                                    showHide(
+                                        [
+                                        'input',
+                                        'textarea',
+                                        'radio',
+                                        'checkbox',
+                                        'select',
+                                        'date',
+                                        'switch',
+                                        'number',
+                                        'cascader',
+                                        'slider',
+                                        'datePicker',
+                                        'timePicker',
+                                        'colorPicker',
+                                        'inputNumber',
+                                        'rate',
+                                        'treeSelect'
+                                        ],
+                                        true
+                                    )
+                                    "
+                                    label="联动结果"
+                                >
+                                    <el-radio-group
+                                        v-model="controlData.config.linkResult"
+                                        class="option-radio"
+                                    >
+                                        <el-radio label="hidden">隐藏(默认)</el-radio>
+                                        <el-radio label="disabled">禁用</el-radio>
+                                    </el-radio-group>
+                                </el-form-item>
+                            </template>
+						</template>
+						<template v-if="showHide(['tabs'], true)">
+                            <!-- <div class="h3"><h3>标签配置项</h3></div> -->
+                            <el-divider content-position="left">标签配置项</el-divider>
+                            <el-form-item
+                                class="form_cont"
+                                v-for="(item, index) in controlData.columns"
+                                :key="index"
+                            >
+                                <el-col :span="12">
+                                    <el-input v-model="item.label" placeholder="标签配置项" />
+                                </el-col>
+                                <el-col :span="2" :offset="1">
+                                    <i
+                                        class="icon-del"
+                                        @click="delSelectOption(index as number, 'tabs')"
+                                    ></i>
+                                </el-col>
+                            </el-form-item>
+                            <el-form-item  class="form_cont">
+                                <el-button @click="addSelectOption('tabs')">增加标签</el-button>
+                            </el-form-item>
+                        </template>
+						<!--编号规则设置--->
+						<div v-if="showHide(['serialNumber'],true)">
+							<el-divider content-position="left">编码规则配置</el-divider>
+							<el-form-item label="编码方式" class="form_cont">
+                                <el-switch v-model="controlData.config.automatic" inline-prompt active-text="自动编码" inactive-text="手动编码" style="--el-switch-on-color: #13ce66; --el-switch-off-color: #E6A23C" />
+                            </el-form-item>
+							<div v-if="controlData.config.automatic">
+                                <el-form-item v-for="(item, index) in controlData.config.customRules" :key="index" class="form_cont">
+                                    
+                                    <el-input v-model="item.rule" :placeholder="item.message?item.message:'请输入自定义字符'">
+                                        <template #prepend>
+                                            <el-select
+                                                v-model="item.type"
+                                                style="width: 100px"
+                                                @change="rulesSelectNumChange(item, $event)"
+                                            >
+                                                <el-option
+                                                    v-for="list in state.numberRulesList"
+                                                    :key="list.type"
+                                                    :label="list.label"
+                                                    :value="list.type"
+                                                />
+                                            </el-select>
+                                        </template>
+                                        <template #append>
+                                            <i
+                                            class="icon-del"
+                                            @click="delNumRules(index as number)"
+                                            ></i>
+                                        </template>
+                                    </el-input>
+    
+    
+                                </el-form-item>
+                                <el-form-item class="form_cont">
+                                    <el-button @click="addNumRules">添加规则</el-button>
+                                </el-form-item>
+                            </div>
+						</div>
+						<div
+                            v-if="
+                            showHide(
+                                [
+                                'radio',
+                                'select',
+                                'checkbox',
+                                'cascader',
+                                'inputSlot',
+                                'treeSelect'
+                                ],
+                                true
+                            )
+                            "
+                        >
+							<el-divider content-position="left">选项配置</el-divider>
+							<el-form-item v-if="showHide(['select'], true)" label="添加全部项" class="form_cont">
+                                <el-input
+                                    v-model="controlData.config.addAll"
+                                    placeholder="请输入全部项文案"
+                                />
+                            </el-form-item>
+							<el-form-item label="选项数据源" class="form_cont">
+                                <el-select
+                                    v-model="controlData.config.optionsType"
+                                    @change="controlData.config.optionsFun = ''"
+                                >
+                                    <el-option :value="0" label="固定选项" />
+                                    <el-option :value="1" label="数据源" />
+                                    <el-option :value="2" label="接口字典" />
+                                </el-select>
+                            </el-form-item>
+							<template v-if="controlData.config.optionsType === 0">
+                                <div v-if="controlData.type !== 'cascader'">
+                                    <el-form-item
+                                        v-for="(item, index) in controlData.options"
+                                        :key="index"
+                                        class="form_cont"
+                                    >
+                                        <el-col :span="10">
+                                            <el-input v-model="item.label" placeholder="选项标签" />
+                                        </el-col>
+                                        <el-col :span="10" :offset="1">
+                                            <el-input v-model="item.value" placeholder="选项值" />
+                                        </el-col>
+                                        <el-col :span="2" :offset="1">
+                                            <i
+                                                class="icon-del"
+                                                @click="delSelectOption(index as number)"
+                                            ></i>
+                                        </el-col>
+                                    </el-form-item>
+                                </div>
+                                <el-form-item class="form_cont">
+                                    <el-button @click="addSelectOption">{{ controlData.type === 'cascader' ? '编辑' : '新增' }}</el-button>
+                                </el-form-item>
+                            </template>
+							<template v-else>
+                                <el-form-item class="form_cont">
+                                    <el-input
+                                        v-model="controlData.config.optionsFun"
+                                        :placeholder="
+                                            getOptionPlaceholder(controlData.config.optionsType)
+                                        "
+                                    >
+                                        <template
+                                            v-if="controlData.config.optionsType === 1"
+                                            #prepend
+                                        >
+                                            <el-select
+                                                v-model="controlData.config.method"
+                                                style="width: 80px"
+                                            >
+                                                <el-option label="get" value="get" />
+                                                <el-option label="post" value="post" />
+                                            </el-select>
+                                        </template>
+                                    </el-input>
+                                </el-form-item>
+                                <template v-if="controlData.config.optionsType === 1">
+                                    <el-form-item label="指定label属性值" class="form_cont">
+                                        <el-input
+                                            v-model="controlData.config.label"
+                                            placeholder="返回数据中没有label时可设置"
+                                        />
+                                    </el-form-item>
+                                    <el-form-item label="指定value属性值" class="form_cont">
+                                        <el-input
+                                            v-model="controlData.config.value"
+                                            placeholder="返回数据中没有value时可设置"
+                                        />
+                                    </el-form-item>
+                                </template>
+                                <el-form-item v-if="controlData.config.optionsType === 1" class="form_cont">
+                                    <el-button
+                                        @click="
+                                            optionsEvent(
+                                            'optionsParams',
+                                            '请求前处理事件，参数(data,route,form) data请求参数,route页面路由,form表单值'
+                                            )
+                                        "
+                                    >beforeRequest</el-button>
+                                    <el-button
+                                        @click="
+                                            optionsEvent(
+                                            'optionsResult',
+                                            '请求返回结束处理；，也可为字符串，如opt=formatTest'
+                                            )
+                                        "
+                                    >afterResponse</el-button>
+                                </el-form-item>
+                            </template>
+                            <el-form-item label="尝试转换value值为" class="form_cont">
+                                <el-select
+                                    v-model="controlData.config.transformData"
+                                    placeholder="默认为number"
+                                >
+                                    <el-option value="none">不转换</el-option>
+                                    <el-option value="number">number</el-option>
+                                    <el-option value="string">string</el-option>
+                                </el-select>
+                            </el-form-item>
+						</div>
+						<template
+                            v-if="
+								!state.isSearch &&
+								showHide([
+									'txt',
+									'title',
+									'table',
+									'grid',
+									'tabs',
+									'card',
+									'switch',
+									'gridChild',
+									'tableColumn',
+									'divider',
+									'div',
+									'button'
+								])
+                            "
+                        >
+							<el-divider content-position="left">校验设置</el-divider>
+							<div v-if="showHide(['input', 'password', 'component'], true)">
+                                <el-form-item
+                                    v-for="(item, index) in controlData.customRules"
+                                    :key="item.type"
+                                    class="form_cont"
+                                >
+                                    <el-input v-model="item.message" placeholder="校验提示信息">
+                                        <template #prepend>
+                                            <el-select
+                                            v-model="item.type"
+                                            style="width: 80px"
+                                            @change="rulesSelectChange(item, $event)"
+                                            >
+                                            <el-option
+                                                v-for="list in state.customRulesList"
+                                                :key="list.type"
+                                                :label="list.label"
+                                                :value="list.type"
+                                            />
+                                            </el-select>
+                                        </template>
+                                        <template #append>
+                                            <i
+                                            class="icon-del"
+                                            @click="delAddRules(index as number)"
+                                            ></i>
+                                        </template>
+                                    </el-input>
+                                    <el-input
+                                        v-if="item.type === 'rules'"
+                                        v-model="item.rules"
+                                        placeholder="正则表达式"
+                                    />
+                                    <el-input
+                                        v-if="item.type === 'methods'"
+                                        v-model="item.methods"
+                                        placeholder="方法名称，此方法仅适用于导出vue文件"
+                                    />
+                                </el-form-item>
+                                <el-form-item class="form_cont">
+                                    <el-button @click="addRulesFast">快速添加</el-button>
+                                    <el-button @click="addRules(state.tooltip.rules)"
+                                    >编写校验规则
+                                        <el-tooltip
+                                            :content="state.tooltip.rules"
+                                            placement="top"
+                                            raw-content
+                                        >
+                                            <el-icon>
+                                                <QuestionFilled />
+                                            </el-icon>
+                                        </el-tooltip>
+                                    </el-button>
+                                </el-form-item>
+                            </div>
+							<el-form-item class="form_cont" v-else>
+								<el-checkbox
+									:model-value="checkboxRequired"
+									@change="requiredChange"
+									>必填
+								</el-checkbox>
+								<el-input
+									v-if="controlData.item?.rules && controlData.item?.rules[0]"
+									v-model="controlData.item.rules[0].message"
+									placeholder="自定义必填错误提示"
+								/>
+                            </el-form-item>
+						</template>
+						<el-divider content-position="left">其他属性</el-divider>
+						<div v-if="showHide(['grid', 'card', 'gridChild', 'divider', 'div'])"  class="form_cont">
+                            
+    
+                            <el-button
+                            size="small"
+                            @click="openAttrDialog('', state.tooltip.props)"
+                            >编辑属性
+                            <el-tooltip :content="state.tooltip.props" placement="top">
+                                <el-icon>
+                                <QuestionFilled />
+                                </el-icon>
+                            </el-tooltip>
+                            </el-button>
+                        </div>
+                        <el-divider content-position="left">高级属性</el-divider>
+                        
+                        <LayoutPage v-if="cssIsShouw(attrList)"  v-model:styles-val="controlDataStyls" :place="controlData.type" />
+    
+
+
+
+
+
+
+
+					</el-form>
+				</el-scrollbar>
+			</el-tab-pane>
+			<el-tab-pane label="表单配置" name="second">
+				<el-scrollbar class="formAttributeBox">
+					<el-form size="small" class="form">
+						<el-divider content-position="left">基础配置</el-divider>
+						<el-form-item  class="form_cont">
+							<template #label>
+								归属分组
+							</template>
+							<el-select id="groupForm" v-model="formConfig.groupKey" placeholder="Select" ref="groupForm">
+								<el-option v-for="item in formGroup.list" :key="item.idStr" :label="item.title" :value="item.idStr" />
+								<p v-if="loadingmore">加载中</p>
+								<p v-if="loadingnomore">无数据</p>
+							</el-select>
+						</el-form-item>
+						<el-form-item
+                            v-for="(item, index) in formControlProject.filter(item => !item.hide)"
+                            :label="item.label"
+                            :key="index"
+                            class="form_cont"
+                        >
+							<el-select
+                                v-if="item.type === 'select'"
+                                v-model="item.value"
+                                :filterable="item.key === 'class'"
+                                :allow-create="item.key === 'class'"
+                                :placeholder="item.placeholder"
+                                :clearable="item.clearable"
+                                @change="formAttrChange(item)"
+                            >
+                                <el-option        
+                                    v-for="opt in item.options"
+                                    :key="opt.label || opt.name"
+                                    :label="opt.label || opt.name"
+                                    :value="formatNumber(opt.value ?? opt.id)"
+                                />
+                            </el-select>
+							<el-switch
+                                v-else-if="item.type === 'switch'"
+                                v-model="item.value"
+                                @input="formAttrChange(item)"
+                            />
+							<el-input
+                                v-else
+                                v-model="item.value"
+                                :placeholder="item.placeholder"
+                                :disabled="isNotWrite(item)"
+                                @input="formAttrChange(item)"
+                            />
+						</el-form-item>
+						<el-form-item  class="form_cont">
+							<template #label>
+								表单图标
+							</template>
+							<el-upload
+								class="avatar-uploader"
+								:action="imgUploadApiUrl"
+								:show-file-list="false"
+								:on-success="handleAvatarSuccess"
+								:before-upload="beforeAvatarUpload"
+							>
+								<img v-if="formConfig.imageUrl" :src="formConfig.imageUrl" class="avatar" />
+								<el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
+							</el-upload>
+						</el-form-item>
+						<template v-if="!state.isSearch">
+							<el-divider content-position="left">接口数据事件</el-divider>
+							<el-form-item v-if="!state.isSearch" class="form_cont">
+                                <template #label >
+                                    添加时获取请求
+                                    <el-tooltip
+                                        content="新增表单数据时，从接口获取新增初始数据"
+                                        placement="top"
+                                    >
+                                        <el-icon><QuestionFilled /></el-icon>
+                                    </el-tooltip>
+                                </template>
+                                <el-switch
+                                    v-model="formConfig.addLoad"
+                                    @change="formAttrChange({ key: 'addLoad', path: 'config' }, $event)"
+                                />
+                            </el-form-item>
+							<el-form-item label="新增数据保存url" class="form_cont">
+                                <el-input
+                                    v-model="formConfig.addUrl"
+                                    placeholder="表单提交的url，非特殊不需要设置"
+                                />
+                            </el-form-item>
+                            <el-form-item label="修改数据保存url" class="form_cont">
+                                <el-input
+                                    v-model="formConfig.editUrl"
+                                    placeholder="修改提交的url，非特殊不需要设置"
+                                />
+                            </el-form-item>
+                            <el-form-item label="获取表单数据url" class="form_cont">
+                                <el-input
+                                    v-model="formConfig.requestUrl"
+                                    placeholder="获取表单数据url，非特殊不需要设置"
+                                />
+                            </el-form-item>
+							<el-form-item class="event-btn form_cont">
+								<el-button
+                                    @click="
+                                    eventClick(
+                                        'beforeRequest',
+                                        '获取表单初始数据前事件，可修改请求参数'
+                                    )
+                                    "
+                                >
+									beforeRequest
+                                </el-button>
+								<el-button
+                                    @click="
+                                    eventClick(
+                                        'afterResponse',
+                                        '获取表单初始数据后事件，可对请求返回数据进行处理；也可为字符串，如opt=formatTest'
+                                    )
+                                    "
+                                    >afterResponse
+                                </el-button>
+                                <el-button
+                                    @click="
+                                    eventClick(
+                                        'beforeSubmit',
+                                        '表单数据提交前事件，可对提交数据进行处理；也可为字符串，如opt=formatTest'
+                                    )
+                                    "
+                                    >beforeSubmit
+                                </el-button>
+                                <el-button
+                                    @click="eventClick('afterSubmit', '表单数据提交成功事件')"
+                                    >afterSubmit
+                                </el-button>
+                                <el-button
+                                    @click="
+                                    eventClick(
+                                        'change',
+                                        '表单组件值改变事件。当表单某值改变时，可修改其他组件的值；也可为字符串，如opt=formChange,字符串即为/utils/formChangeValue(name,model,key)中的key值'
+                                    )
+                                    "
+                                    >表单组件改变事件change
+                                </el-button>
+							</el-form-item>
+						</template>
+						<el-divider content-position="left">表单整体布局</el-divider>
+						<el-form-item label="组件尺寸" class="form_cont">
+                            <el-radio-group v-model="formData.size">
+                                <el-radio-button label="large">大</el-radio-button>
+                                <el-radio-button label="default">适中</el-radio-button>
+                                <el-radio-button label="small">小</el-radio-button>
+                            </el-radio-group>
+                        </el-form-item>
+						<el-form-item label="表单样式名称" class="form_cont">
+							<el-select
+                                v-model="formData.class"
+                                class="m-2"
+                                placeholder="额外添加的表单class类名"
+                            >
+                                <el-option
+									v-for="item in optionsCss"
+									:key="item.value"
+									:label="item.label"
+									:value="item.value"
+                                />
+                            </el-select>
+						</el-form-item>
+						<el-form-item label="行内表单模式" class="form_cont">
+                            <el-switch v-model="formData.inline" active-text="开启" inactive-text="关闭" />
+                        </el-form-item>
+						<el-form-item label="标签宽度" class="form_cont">
+                            <el-input v-model="formData.labelWidth" clearable placeholder="表单标签宽度">
+                                <template #suffix >PX</template>
+                            </el-input>
+                        </el-form-item>
+						<el-form-item label="标签后缀" class="form_cont">
+                            <el-input v-model="formData.labelSuffix" placeholder="表单标签后缀" />
+                        </el-form-item>
+						<el-form-item label="表单标签对齐方式" class="form_cont">
+                            <el-radio-group v-model="formData.labelPosition">
+                                <el-radio-button label="left">左</el-radio-button>
+                                <el-radio-button label="right">右</el-radio-button>
+                                <el-radio-button label="top">上</el-radio-button>
+                            </el-radio-group>
+                        </el-form-item>
+						<el-form-item label="必填项星号位置" class="form_cont">
+                            <el-radio-group v-model="formData.requireAsteriskPosition">
+                                <el-radio-button label="left">左</el-radio-button>
+                                <el-radio-button label="right">右</el-radio-button>
+                            </el-radio-group>
+                        </el-form-item>
+						<el-form-item label="是否隐藏星号" class="form_cont">
+                            <el-switch v-model="formData.hideRequiredAsterisk" active-text="隐藏" inactive-text="显示" style="--el-switch-on-color: #ff4949; --el-switch-off-color: #13ce66" />
+                        </el-form-item>
+						<el-form-item label="校验错误信息" class="form_cont">
+                            <el-switch v-model="formData.showMessage" active-text="显示" inactive-text="隐藏" />
+                        </el-form-item>
+                        <el-form-item label="以行内形式展示校验信息" class="form_cont">
+                            <el-switch v-model="formData.inlineMessage" active-text="显示" inactive-text="隐藏" />
+                        </el-form-item>
+                        <el-form-item label="是否显示校验结果反馈图标" class="form_cont">
+                            <el-switch v-model="formData.statusIcon" active-text="显示" inactive-text="隐藏" />
+                        </el-form-item>
+						<el-divider content-position="left">表单功能补充</el-divider>
+						<el-form-item class="form_cont">
+                            <el-button @click="editFormStyle(state.tooltip.css)">
+                                编辑表单样式
+                                <el-tooltip :content="state.tooltip.css" placement="top">
+                                    <el-icon>
+                                        <QuestionFilled />
+                                    </el-icon>
+                                </el-tooltip>
+                            </el-button>
+                            <el-button @click="editFormDict(state.tooltip.dict)">
+                                设置数据字典
+                                <el-tooltip :content="state.tooltip.dict" placement="top">
+                                    <el-icon>
+                                        <QuestionFilled />
+                                    </el-icon>
+                                </el-tooltip>
+                            </el-button>
+                        </el-form-item>
+					</el-form>
+				</el-scrollbar>
+			</el-tab-pane>
+		</el-tabs>
+	</div>
+</template>
+<style  lang='scss' scoped>
+.formAttributeBox{
+	height: calc(100vh - 105px)
+}
+li::before {
+    content: "";
+    display: inline-block;
+    width: 4px;
+    height: 4px;
+    border-radius: 50%;
+    background-color: gray;
+    margin-right: 5px;
+    margin-left: 5px;
+    margin-bottom: 3.5px;
+}
+
+.sidebar-tools .el-tabs__content{
+    padding: 0;
+}
+.el-collapse-item__header {
+    padding-left: 10px;
+    background-color: rgb(229, 229, 229);
+}
+.el-collapse-item__header{
+    padding-left: 10px;
+    background-color: rgb(229, 229, 229);
+}
+
+.form_cont{
+    padding: 0 10px;
+}
+.avatar-uploader{
+	width: 100px;
+	height: 100px;
+	.avatar{
+		width: 100px;
+		height: 100px;
+	}
+	.avatar-uploader-icon{
+		width: 100px;
+		height: 100px;
+	}
+}
+.custom-tree-node {
+	flex: 1;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	font-size: 14px;
+	padding-right: 8px;
+}
+.custom-tree-node:hover{
+	background-color:antiquewhite;
+}
+
+.associatedFormsHideDialogMain7{
+	display: flex;
+}
+.el-main{
+	--el-main-padding: 5px
+}
+</style>
diff --git a/src/components/DesignForm/rule/numberRules.ts b/src/components/DesignForm/rule/numberRules.ts
new file mode 100644
index 000000000..3c7283809
--- /dev/null
+++ b/src/components/DesignForm/rule/numberRules.ts
@@ -0,0 +1,33 @@
+/**
+@ 作者: 秦东
+@ 时间: 2024-05-10 09:38:51
+@ 功能: 数字规则列表
+*/
+interface NumberValidateTypes {
+	type: string
+	label: string
+	msg: string
+}
+const NumberValidateConfig: NumberValidateTypes[] = [
+	{
+		type: 'time',
+		label: '时间',
+		msg:'请选择时间格式'
+	},
+	{
+		type: 'text',
+		label: '自定义字符',
+		msg:'请输入自定义字符'
+	},
+	{
+		type: 'serialnumber',
+		label: '流水序号',
+		msg:'流水号起始值'
+	},
+	{
+		type: 'randomnumber',
+		label: '随机数',
+		msg:'请输入随机数位数'
+	}
+]
+export default NumberValidateConfig
diff --git a/src/components/DesignForm/validateApp.ts b/src/components/DesignForm/validateApp.ts
new file mode 100644
index 000000000..c2478bad1
--- /dev/null
+++ b/src/components/DesignForm/validateApp.ts
@@ -0,0 +1,104 @@
+// 快速添加 内置校验规则
+interface ValidateTypes {
+	type: string
+	label: string
+	regExp?: RegExp
+	message?: string
+}
+const validateConfig: ValidateTypes[] = [
+	{
+	  type: 'required',
+	  label: '必填',
+	  regExp: /^\s*$/,
+	  message: '必填项'
+	},
+	{
+	  type: 'mobile',
+	  label: '手机号码',
+	  regExp: /^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/,
+	  message: '请输入手机号码'
+	},
+	{
+	  type: 'tel',
+	  label: '固话',
+	  regExp: /^0\d{2,3}-\d{7,8}$/,
+	  message: '请输入固定电话号码'
+	},
+	{
+	  type: 'phone',
+	  label: '固话或手机',
+	  regExp: /^((0\d{2,3}(-?)\d{7,8})|(1[3456789]\d{9}))$/,
+	  message: '请输入固定电话号码或手机号'
+	},
+	{
+	  type: 'email',
+	  label: '邮箱',
+	  regExp: /^[a-z0-9A-Z._%-]+@([a-z0-9A-Z-]+\.)+[a-zA-Z]{2,4}$/,
+	  message: '请输入邮箱地址'
+	},
+	{
+	  type: 'int',
+	  label: '正整数',
+	  regExp: /^[0-9]*[1-9][0-9]*$/,
+	  message: '请输入正整数'
+	},
+	{
+	  type: 'number',
+	  label: '数字',
+	  regExp: /^\d+(\.\d+)?$/,
+	  message: '请输入数字'
+	},
+	{
+	  type: 'money',
+	  label: '金额',
+	  regExp: /^[0-9]+\.?[0-9]{0,2}$/,
+	  message: '请输入正确的金额，最多两位小数'
+	},
+	{
+	  type: 'card',
+	  label: '身份证',
+	  regExp:
+		/(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
+	  message: '请输入身份证号'
+	},
+	{
+	  type: 'cn',
+	  label: '中文',
+	  regExp: /[\u4e00-\u9fa5]+/,
+	  message: '请输入中文'
+	},
+	{
+	  type: 'numberLetter',
+	  label: '数字字母',
+	  regExp: /[0-9a-zA-Z]$/,
+	  message: '请输入数字或字母'
+	},
+	{
+	  type: 'url',
+	  label: '网址',
+	  regExp: /^https?:\/\/((.)+(\.)?)*(:\d+)?(\/((\.)?(\?)?=?&?.(\?)?)*)*$/,
+	  message: '请输入网址'
+	},
+	{
+	  type: 'longitude',
+	  label: '经度',
+	  regExp: /^[-+]?(0?\d{1,2}\.\d{1,10}|1[0-7]?\d\.\d{1,10}|180\.0{1,10})$/,
+	  message: '请输入正确的经度'
+	},
+	{
+	  type: 'latitude',
+	  label: '纬度',
+	  regExp: /^[-+]?([0-8]?\d{1}\.\d{1,10}|90\.0{1,10})$/,
+	  message: '请输入正确的纬度'
+	},
+	{
+		type: 'rules',
+		label: '自定义正则',
+		message:""
+	},
+	{
+		type: 'methods',
+		label: '自定义方法'
+	}
+]
+export default validateConfig
diff --git a/src/styles/workflowcss/workflow.css b/src/styles/workflowcss/workflow.css
new file mode 100644
index 000000000..9b5a0e6cf
--- /dev/null
+++ b/src/styles/workflowcss/workflow.css
@@ -0,0 +1,1733 @@
+body {
+  background: #eee;
+}
+
+@font-face {
+  font-family: Chinese Quote;
+  src: local("PingFang SC"), local("SimSun");
+  unicode-range: u+2018, u+2019, u+201c, u+201d;
+}
+
+body,
+html {
+  width: 100%;
+  /* height: 100% */
+}
+
+input::-ms-clear,
+input::-ms-reveal {
+  display: none;
+}
+
+*,
+:after,
+:before {
+  box-sizing: border-box;
+}
+
+html {
+  font-family: sans-serif;
+  line-height: 1.15;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  -ms-overflow-style: scrollbar;
+  -webkit-tap-highlight-color: transparent;
+}
+
+@-ms-viewport {
+  width: device-width;
+}
+
+article,
+aside,
+dialog,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+nav,
+section {
+  display: block;
+}
+
+body {
+  margin: 0;
+  font-family: Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  font-variant: tabular-nums;
+  line-height: 1.5;
+  color: rgba(0, 0, 0, 0.65);
+  background-color: #fff;
+}
+
+[tabindex="-1"]:focus {
+  outline: none !important;
+}
+
+hr {
+  box-sizing: content-box;
+  height: 0;
+  overflow: visible;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  margin-top: 0;
+  margin-bottom: .5em;
+  color: rgba(0, 0, 0, 0.85);
+  font-weight: 500;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1em;
+}
+
+abbr[data-original-title],
+abbr[title] {
+  text-decoration: underline;
+  text-decoration: underline dotted;
+  cursor: help;
+  border-bottom: 0;
+}
+
+address {
+  margin-bottom: 1em;
+  font-style: normal;
+  line-height: inherit;
+}
+
+input[type=number],
+input[type=password],
+input[type=text],
+textarea {
+  -webkit-appearance: none;
+}
+
+dl,
+ol,
+ul {
+  margin-top: 0;
+  margin-bottom: 1em;
+}
+
+ol ol,
+ol ul,
+ul ol,
+ul ul {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 500;
+}
+
+dd {
+  margin-bottom: .5em;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 1em;
+}
+
+dfn {
+  font-style: italic;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 80%;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 75%;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -.25em;
+}
+
+sup {
+  top: -.5em;
+}
+
+a {
+  color: #1890ff;
+  background-color: transparent;
+  text-decoration: none;
+  outline: none;
+  cursor: pointer;
+  transition: color .3s;
+  -webkit-text-decoration-skip: objects;
+}
+
+a:focus {
+  text-decoration: underline;
+  text-decoration-skip: auto;
+}
+
+a:hover {
+  color: #40a9ff;
+}
+
+a:active {
+  color: #096dd9;
+}
+
+a:active,
+a:hover {
+  outline: 0;
+  text-decoration: none;
+}
+
+code,
+kbd,
+pre,
+samp {
+  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;
+  font-size: 1em;
+}
+
+pre {
+  margin-top: 0;
+  margin-bottom: 1em;
+  overflow: auto;
+}
+
+figure {
+  margin: 0 0 1em;
+}
+
+img {
+  vertical-align: middle;
+  border-style: none;
+}
+
+svg:not(:root) {
+  overflow: hidden;
+}
+
+[role=button],
+a,
+area,
+button,
+input:not([type=range]),
+label,
+select,
+summary,
+textarea {
+  touch-action: manipulation;
+}
+
+table {
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: .75em;
+  padding-bottom: .3em;
+  color: rgba(0, 0, 0, 0.45);
+  text-align: left;
+  caption-side: bottom;
+}
+
+th {
+  text-align: inherit;
+}
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+  color: inherit;
+}
+
+button,
+input {
+  overflow: visible;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[type=reset],
+[type=submit],
+button,
+html [type=button] {
+  -webkit-appearance: button;
+}
+
+[type=button]::-moz-focus-inner,
+[type=reset]::-moz-focus-inner,
+[type=submit]::-moz-focus-inner,
+button::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+input[type=checkbox],
+input[type=radio] {
+  box-sizing: border-box;
+  padding: 0;
+}
+
+input[type=date],
+input[type=datetime-local],
+input[type=month],
+input[type=time] {
+  -webkit-appearance: listbox;
+}
+
+textarea {
+  overflow: auto;
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  display: block;
+  width: 100%;
+  max-width: 100%;
+  padding: 0;
+  margin-bottom: .5em;
+  font-size: 1.5em;
+  line-height: inherit;
+  color: inherit;
+  white-space: normal;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[type=number]::-webkit-inner-spin-button,
+[type=number]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  outline-offset: -2px;
+  -webkit-appearance: none;
+}
+
+[type=search]::-webkit-search-cancel-button,
+[type=search]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+summary {
+  display: list-item;
+}
+
+template {
+  display: none;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+mark {
+  padding: .2em;
+  background-color: #feffe6;
+}
+
+::selection {
+  background: #1890ff;
+  color: #fff;
+}
+
+.clearfix {
+  zoom: 1;
+}
+
+.clearfix:after,
+.clearfix:before {
+  content: "";
+  display: table;
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+@font-face {
+  font-family: anticon;
+  font-display: fallback;
+  src: url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.eot");
+  src: url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.woff") format("woff"), url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.ttf") format("truetype"), url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.svg#iconfont") format("svg");
+}
+
+.anticon {
+  display: inline-block;
+  font-style: normal;
+  vertical-align: baseline;
+  text-align: center;
+  text-transform: none;
+  line-height: 1;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.anticon:before {
+  display: block;
+  font-family: anticon !important;
+}
+
+.anticon-close:before {
+  content: "\E633";
+}
+
+.anticon-right:before {
+  content: "\E61F";
+}
+
+.anticon-exclamation-circle {
+  color: #f25643;
+}
+
+.anticon-exclamation-circle:before {
+  content: "\E62C";
+}
+
+.anticon-left:before {
+  content: "\E620";
+}
+
+.anticon-close-circle:before {
+  content: "\E62E";
+}
+
+.ant-btn {
+  line-height: 1.5;
+  display: inline-block;
+  font-weight: 400;
+  text-align: center;
+  touch-action: manipulation;
+  cursor: pointer;
+  background-image: none;
+  border: 1px solid transparent;
+  white-space: nowrap;
+  padding: 0 15px;
+  font-size: 14px;
+  border-radius: 4px;
+  height: 32px;
+  user-select: none;
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  position: relative;
+  color: rgba(0, 0, 0, 0.65);
+  background-color: #fff;
+  border-color: #d9d9d9;
+}
+
+.ant-btn > .anticon {
+  line-height: 1;
+}
+
+.ant-btn,
+.ant-btn:active,
+.ant-btn:focus {
+  outline: 0;
+}
+
+.ant-btn > a:only-child {
+  color: currentColor;
+}
+
+.ant-btn > a:only-child:after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: transparent;
+}
+
+.ant-btn:focus,
+.ant-btn:hover {
+  color: #40a9ff;
+  background-color: #fff;
+  border-color: #40a9ff;
+}
+
+.ant-btn:focus > a:only-child,
+.ant-btn:hover > a:only-child {
+  color: currentColor;
+}
+
+.ant-btn:focus > a:only-child:after,
+.ant-btn:hover > a:only-child:after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: transparent;
+}
+
+.ant-btn.active,
+.ant-btn:active {
+  color: #096dd9;
+  background-color: #fff;
+  border-color: #096dd9;
+}
+
+.ant-btn.active > a:only-child,
+.ant-btn:active > a:only-child {
+  color: currentColor;
+}
+
+.ant-btn.active > a:only-child:after,
+.ant-btn:active > a:only-child:after {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  background: transparent;
+}
+
+.ant-btn.active,
+.ant-btn:active,
+.ant-btn:focus,
+.ant-btn:hover {
+  background: #fff;
+  text-decoration: none;
+}
+
+.ant-btn > i,
+.ant-btn > span {
+  pointer-events: none;
+}
+
+.ant-btn:before {
+  position: absolute;
+  top: -1px;
+  left: -1px;
+  bottom: -1px;
+  right: -1px;
+  background: #fff;
+  opacity: .35;
+  content: "";
+  border-radius: inherit;
+  z-index: 1;
+  transition: opacity .2s;
+  pointer-events: none;
+  display: none;
+}
+
+.ant-btn .anticon {
+  transition: margin-left 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.ant-btn:active > span,
+.ant-btn:focus > span {
+  position: relative;
+}
+
+.ant-btn > .anticon + span,
+.ant-btn > span + .anticon {
+  margin-left: 8px;
+}
+
+.fd-nav-container {
+  display: inline-block;
+  position: relative;
+}
+
+.fd-nav-container .ghost-bar {
+  position: absolute;
+  width: 150px;
+  height: 100%;
+  left: 0;
+  background: #1583f2;
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.fd-nav-container .ghost-bar:after {
+  content: "";
+  position: absolute;
+  bottom: 0;
+  left: 50%;
+  margin-left: -5px;
+  width: 0;
+  height: 0;
+  border-style: solid;
+  border-width: 0 5px 6px;
+  border-color: transparent transparent #f6f6f6;
+}
+
+.fd-nav-item {
+  position: relative;
+  cursor: pointer;
+  display: inline-block;
+  line-height: 60px;
+  width: 150px;
+  text-align: center;
+  white-space: nowrap;
+}
+
+.fd-nav-item .order-num {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  border: 1px solid #fff;
+  border-radius: 50%;
+  margin-right: 6px;
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.fd-nav-item.active .order-num {
+  color: #1583f2;
+  background: #fff;
+}
+
+.ant-input {
+  font-family: Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;
+  font-variant: tabular-nums;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  position: relative;
+  display: inline-block;
+  padding: 4px 11px;
+  width: 100%;
+  height: 32px;
+  font-size: 14px;
+  line-height: 1.5;
+  color: rgba(0, 0, 0, 0.65);
+  background-color: #fff;
+  background-image: none;
+  border: 1px solid #d9d9d9;
+  border-radius: 4px;
+  transition: all .3s;
+}
+
+.ant-input::-moz-placeholder {
+  color: #bfbfbf;
+  opacity: 1;
+}
+
+.ant-input:-ms-input-placeholder {
+  color: #bfbfbf;
+}
+
+.ant-input::-webkit-input-placeholder {
+  color: #bfbfbf;
+}
+
+.ant-input:focus,
+.ant-input:hover {
+  border-color: #40a9ff;
+  border-right-width: 1px !important;
+}
+
+.ant-input:focus {
+  outline: 0;
+  box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+}
+
+textarea.ant-input {
+  max-width: 100%;
+  height: auto;
+  vertical-align: bottom;
+  transition: all .3s, height 0s;
+  min-height: 32px;
+}
+
+a,
+abbr,
+acronym,
+address,
+applet,
+article,
+aside,
+audio,
+b,
+big,
+blockquote,
+body,
+canvas,
+caption,
+center,
+cite,
+code,
+dd,
+del,
+details,
+dfn,
+div,
+dl,
+dt,
+em,
+fieldset,
+figcaption,
+figure,
+footer,
+form,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+header,
+hgroup,
+html,
+i,
+iframe,
+img,
+ins,
+kbd,
+label,
+legend,
+li,
+mark,
+menu,
+nav,
+object,
+ol,
+p,
+pre,
+q,
+s,
+samp,
+section,
+small,
+span,
+strike,
+strong,
+sub,
+summary,
+sup,
+table,
+tbody,
+td,
+tfoot,
+th,
+thead,
+time,
+tr,
+tt,
+u,
+ul,
+var,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+*,
+:after,
+:before {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+html {
+  font-family: sans-serif;
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+}
+
+body,
+html {
+  font-size: 14px;
+}
+
+body {
+  font-family: Microsoft Yahei, Lucida Grande, Lucida Sans Unicode, Helvetica, Arial, Verdana, sans-serif;
+  line-height: 1.6;
+  background-color: #fff;
+  position: static !important;
+  -webkit-tap-highlight-color: transparent;
+}
+
+ol,
+ul {
+  list-style-type: none;
+}
+
+b,
+strong {
+  font-weight: 700;
+}
+
+img {
+  border: 0;
+}
+
+button,
+input,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+  margin: 0;
+}
+
+textarea {
+  overflow: auto;
+  vertical-align: top;
+  -webkit-appearance: none;
+}
+
+button,
+input {
+  line-height: normal;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+button,
+html input[type=button],
+input[type=reset],
+input[type=submit] {
+  -webkit-appearance: button;
+  cursor: pointer;
+}
+
+input[type=search] {
+  -webkit-appearance: textfield;
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  box-sizing: content-box;
+}
+
+input[type=search]::-webkit-search-cancel-button,
+input[type=search]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+
+table {
+  width: 100%;
+  border-spacing: 0;
+  border-collapse: collapse;
+}
+
+table,
+td,
+th {
+  border: 0;
+}
+
+td,
+th {
+  padding: 0;
+  vertical-align: top;
+}
+
+th {
+  font-weight: 700;
+  text-align: left;
+}
+
+thead th {
+  white-space: nowrap;
+}
+
+a {
+  text-decoration: none;
+  cursor: pointer;
+  color: #3296fa;
+}
+
+a:active,
+a:hover {
+  outline: 0;
+  color: #3296fa;
+}
+
+small {
+  font-size: 80%;
+}
+
+body,
+html {
+  font-size: 12px !important;
+  color: #191f25 !important;
+  background: #f6f6f6 !important;
+}
+
+.wrap {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  height: 100%;
+}
+
+@font-face {
+  font-family: IconFont;
+  src: url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.eot");
+  src: url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.woff") format("woff"), url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.ttf") format("truetype"), url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.svg#IconFont") format("svg");
+}
+
+.iconfont {
+  font-family: IconFont !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -webkit-text-stroke-width: .2px;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.fd-nav {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 997;
+  width: 100%;
+  height: 60px;
+  font-size: 14px;
+  color: #fff;
+  background: #3296fa;
+  display: flex;
+  align-items: center;
+}
+
+.fd-nav > * {
+  flex: 1;
+  width: 100%;
+}
+
+.fd-nav .fd-nav-left {
+  display: -webkit-box;
+  display: flex;
+  align-items: center;
+}
+
+.fd-nav .fd-nav-center {
+  flex: none;
+  width: 600px;
+  text-align: center;
+}
+
+.fd-nav .fd-nav-right {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  text-align: right;
+}
+
+.fd-nav .fd-nav-back {
+  display: inline-block;
+  width: 60px;
+  height: 60px;
+  font-size: 22px;
+  border-right: 1px solid #1583f2;
+  text-align: center;
+  cursor: pointer;
+}
+
+.fd-nav .fd-nav-back:hover {
+  background: #5af;
+}
+
+.fd-nav .fd-nav-back:active {
+  background: #1583f2;
+}
+
+.fd-nav .fd-nav-back .anticon {
+  line-height: 60px;
+}
+
+.fd-nav .fd-nav-title {
+  width: 0;
+  flex: 1;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  padding: 0 15px;
+}
+
+.fd-nav a {
+  color: #fff;
+  margin-left: 12px;
+}
+
+.fd-nav .button-publish {
+  min-width: 80px;
+  margin-left: 4px;
+  margin-right: 15px;
+  color: #3296fa;
+  border-color: #fff;
+}
+
+.fd-nav .button-publish.ant-btn:focus,
+.fd-nav .button-publish.ant-btn:hover {
+  color: #3296fa;
+  border-color: #fff;
+  box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.3);
+}
+
+.fd-nav .button-publish.ant-btn:active {
+  color: #3296fa;
+  background: #d6eaff;
+  box-shadow: none;
+}
+
+.fd-nav .button-preview {
+  min-width: 80px;
+  margin-left: 16px;
+  margin-right: 4px;
+  color: #fff;
+  border-color: #fff;
+  background: transparent;
+}
+
+.fd-nav .button-preview.ant-btn:focus,
+.fd-nav .button-preview.ant-btn:hover {
+  color: #fff;
+  border-color: #fff;
+  background: #59acfc;
+}
+
+.fd-nav .button-preview.ant-btn:active {
+  color: #fff;
+  border-color: #fff;
+  background: #2186ef;
+}
+
+.fd-nav-content {
+  position: fixed;
+  top: 60px;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 1;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding-bottom: 30px;
+}
+
+.fd-nav-content-new {
+  position: relative;
+  width: initial;
+  height: calc(100% - 60px);
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding-bottom: 30px;
+}
+
+.error-modal-desc {
+  font-size: 13px;
+  color: rgba(25, 31, 37, 0.56);
+  line-height: 22px;
+  margin-bottom: 14px;
+}
+
+.error-modal-list {
+  height: 200px;
+  overflow-y: auto;
+  margin-right: -25px;
+  padding-right: 25px;
+}
+
+.error-modal-item {
+  padding: 10px 20px;
+  line-height: 21px;
+  background: #f6f6f6;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 8px;
+  border-radius: 4px;
+}
+
+.error-modal-item-label {
+  flex: none;
+  font-size: 15px;
+  color: rgba(25, 31, 37, 0.56);
+  padding-right: 10px;
+}
+
+.error-modal-item-content {
+  text-align: right;
+  flex: 1;
+  font-size: 13px;
+  color: #191f25;
+}
+
+#body.blur {
+  -webkit-filter: blur(3px);
+  filter: blur(3px);
+}
+
+.zoom {
+  display: flex;
+  position: fixed;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  height: 40px;
+  width: 125px;
+  right: 40px;
+  margin-top: 30px;
+  z-index: 10;
+}
+
+.zoom .zoom-in,
+.zoom .zoom-out {
+  width: 30px;
+  height: 30px;
+  background: #fff;
+  color: #c1c1cd;
+  cursor: pointer;
+  background-size: 100%;
+  background-repeat: no-repeat;
+}
+
+.zoom .zoom-out {
+  background-image: url(https://gw.alicdn.com/tfs/TB1s0qhBHGYBuNjy0FoXXciBFXa-90-90.png);
+}
+
+.zoom .zoom-out.disabled {
+  opacity: .5;
+}
+
+.zoom .zoom-in {
+  background-image: url(https://gw.alicdn.com/tfs/TB1UIgJBTtYBeNjy1XdXXXXyVXa-90-90.png);
+}
+
+.zoom .zoom-in.disabled {
+  opacity: .5;
+}
+
+.auto-judge:hover .editable-title,
+.node-wrap-box:hover .editable-title {
+  border-bottom: 1px dashed #fff;
+}
+
+.auto-judge:hover .editable-title.editing,
+.node-wrap-box:hover .editable-title.editing {
+  text-decoration: none;
+  border: 1px solid #d9d9d9;
+}
+
+.auto-judge:hover .editable-title {
+  border-color: #15bc83;
+}
+
+.editable-title {
+  line-height: 15px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  border-bottom: 1px dashed transparent;
+}
+
+.editable-title:before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 40px;
+}
+
+.editable-title:hover {
+  border-bottom: 1px dashed #fff;
+}
+
+.editable-title-input {
+  flex: none;
+  height: 18px;
+  padding-left: 4px;
+  text-indent: 0;
+  font-size: 12px;
+  line-height: 18px;
+  z-index: 1;
+}
+
+.editable-title-input:hover {
+  text-decoration: none;
+}
+
+.ant-btn {
+  position: relative;
+}
+
+.node-wrap-box {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  width: 220px;
+  min-height: 72px;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  background: #fff;
+  border-radius: 4px;
+  cursor: pointer;
+}
+
+.node-wrap-box:after {
+  pointer-events: none;
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 2;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+
+.node-wrap-box.active:after,
+.node-wrap-box:active:after,
+.node-wrap-box:hover:after {
+  border: 1px solid #3296fa;
+  box-shadow: 0 0 6px 0 rgba(50, 150, 250, 0.3);
+}
+
+.node-wrap-box.active .close,
+.node-wrap-box:active .close,
+.node-wrap-box:hover .close {
+  display: block;
+}
+
+.node-wrap-box.error:after {
+  border: 1px solid #f25643;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+
+.node-wrap-box .title {
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding-left: 16px;
+  padding-right: 30px;
+  width: 100%;
+  height: 24px;
+  line-height: 24px;
+  font-size: 12px;
+  color: #fff;
+  text-align: left;
+  background: #576a95;
+  border-radius: 4px 4px 0 0;
+}
+
+.node-wrap-box .title .iconfont {
+  font-size: 12px;
+  margin-right: 5px;
+}
+
+.node-wrap-box .placeholder {
+  color: #bfbfbf;
+}
+
+.node-wrap-box .close {
+  display: none;
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 20px;
+  height: 20px;
+  font-size: 14px;
+  color: #fff;
+  border-radius: 50%;
+  text-align: center;
+  line-height: 20px;
+}
+
+.node-wrap-box .content {
+  position: relative;
+  font-size: 14px;
+  padding: 16px;
+  padding-right: 30px;
+}
+
+.node-wrap-box .content .text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+
+.node-wrap-box .content .arrow {
+  position: absolute;
+  right: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 20px;
+  height: 14px;
+  font-size: 14px;
+  color: #979797;
+}
+
+.start-node.node-wrap-box .content .text {
+  display: block;
+  white-space: nowrap;
+}
+
+.node-wrap-box:before {
+  content: "";
+  position: absolute;
+  top: -12px;
+  left: 50%;
+  -webkit-transform: translateX(-50%);
+  transform: translateX(-50%);
+  width: 0;
+  height: 4px;
+  border-style: solid;
+  border-width: 8px 6px 4px;
+  border-color: #cacaca transparent transparent;
+  background: #f5f5f7;
+}
+
+.node-wrap-box.start-node:before {
+  content: none;
+}
+
+.top-left-cover-line {
+  left: -1px;
+}
+
+.top-left-cover-line,
+.top-right-cover-line {
+  position: absolute;
+  height: 8px;
+  width: 50%;
+  background-color: #f5f5f7;
+  top: -4px;
+}
+
+.top-right-cover-line {
+  right: -1px;
+}
+
+.bottom-left-cover-line {
+  left: -1px;
+}
+
+.bottom-left-cover-line,
+.bottom-right-cover-line {
+  position: absolute;
+  height: 8px;
+  width: 50%;
+  background-color: #f5f5f7;
+  bottom: -4px;
+}
+
+.bottom-right-cover-line {
+  right: -1px;
+}
+
+.dingflow-design {
+  width: 100%;
+  background-color: #f5f5f7;
+  overflow: auto;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  top: 0;
+}
+
+.dingflow-design .box-scale {
+  transform: scale(1);
+  display: inline-block;
+  position: relative;
+  width: 100%;
+  padding: 54.5px 0;
+  -webkit-box-align: start;
+  -ms-flex-align: start;
+  align-items: flex-start;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  min-width: -webkit-min-content;
+  min-width: -moz-min-content;
+  min-width: min-content;
+  background-color: #f5f5f7;
+  transform-origin: 50% 0px 0px;
+}
+
+.dingflow-design .node-wrap {
+  flex-direction: column;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  justify-content: flex-start;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  -webkit-box-flex: 1;
+  -ms-flex-positive: 1;
+  padding: 0 50px;
+  position: relative;
+}
+
+.dingflow-design .branch-wrap,
+.dingflow-design .node-wrap {
+  display: inline-flex;
+  width: 100%;
+}
+
+.dingflow-design .branch-box-wrap {
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  min-height: 270px;
+  width: 100%;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}
+
+.dingflow-design .branch-box {
+  display: flex;
+  overflow: visible;
+  min-height: 180px;
+  height: auto;
+  border-bottom: 2px solid #ccc;
+  border-top: 2px solid #ccc;
+  position: relative;
+  margin-top: 15px;
+}
+
+.dingflow-design .branch-box .col-box {
+  background: #f5f5f7;
+}
+
+.dingflow-design .branch-box .col-box:before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 0;
+  margin: auto;
+  width: 2px;
+  height: 100%;
+  background-color: #cacaca;
+}
+
+.dingflow-design .add-branch {
+  border: none;
+  outline: none;
+  user-select: none;
+  justify-content: center;
+  font-size: 12px;
+  padding: 0 10px;
+  height: 30px;
+  line-height: 30px;
+  border-radius: 15px;
+  color: #3296fa;
+  background: #fff;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
+  position: absolute;
+  top: -16px;
+  left: 50%;
+  transform: translateX(-50%);
+  transform-origin: center center;
+  cursor: pointer;
+  z-index: 1;
+  display: inline-flex;
+  align-items: center;
+  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.dingflow-design .add-branch:hover {
+  transform: translateX(-50%) scale(1.1);
+  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.1);
+}
+
+.dingflow-design .add-branch:active {
+  transform: translateX(-50%);
+  box-shadow: none;
+}
+
+.dingflow-design .col-box {
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  flex-direction: column;
+  -webkit-box-align: center;
+  align-items: center;
+  position: relative;
+}
+
+.dingflow-design .condition-node {
+  min-height: 220px;
+}
+
+.dingflow-design .condition-node,
+.dingflow-design .condition-node-box {
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  flex-direction: column;
+  -webkit-box-flex: 1;
+}
+
+.dingflow-design .condition-node-box {
+  padding-top: 30px;
+  padding-right: 50px;
+  padding-left: 50px;
+  -webkit-box-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  align-items: center;
+  flex-grow: 1;
+  position: relative;
+}
+
+.dingflow-design .condition-node-box:before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  margin: auto;
+  width: 2px;
+  height: 100%;
+  background-color: #cacaca;
+}
+
+.dingflow-design .auto-judge {
+  position: relative;
+  width: 220px;
+  min-height: 72px;
+  background: #fff;
+  border-radius: 4px;
+  padding: 14px 19px;
+  cursor: pointer;
+}
+
+.dingflow-design .auto-judge:after {
+  pointer-events: none;
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 2;
+  border-radius: 4px;
+  border: 1px solid transparent;
+  transition: all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+
+.dingflow-design .auto-judge.active:after,
+.dingflow-design .auto-judge:active:after,
+.dingflow-design .auto-judge:hover:after {
+  border: 1px solid #3296fa;
+  box-shadow: 0 0 6px 0 rgba(50, 150, 250, 0.3);
+}
+
+.dingflow-design .auto-judge.active .close,
+.dingflow-design .auto-judge:active .close,
+.dingflow-design .auto-judge:hover .close {
+  display: block;
+}
+
+.dingflow-design .auto-judge.error:after {
+  border: 1px solid #f25643;
+  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
+}
+
+.dingflow-design .auto-judge .title-wrapper {
+  position: relative;
+  font-size: 12px;
+  color: #15bc83;
+  text-align: left;
+  line-height: 16px;
+}
+
+.dingflow-design .auto-judge .title-wrapper .editable-title {
+  display: inline-block;
+  max-width: 120px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.dingflow-design .auto-judge .title-wrapper .priority-title {
+  display: inline-block;
+  float: right;
+  margin-right: 10px;
+  color: rgba(25, 31, 37, 0.56);
+}
+
+.dingflow-design .auto-judge .placeholder {
+  color: #bfbfbf;
+}
+
+.dingflow-design .auto-judge .close {
+  display: none;
+  position: absolute;
+  right: -10px;
+  top: -10px;
+  width: 20px;
+  height: 20px;
+  font-size: 14px;
+  color: rgba(0, 0, 0, 0.25);
+  border-radius: 50%;
+  text-align: center;
+  line-height: 20px;
+  z-index: 2;
+}
+
+.dingflow-design .auto-judge .content {
+  font-size: 14px;
+  color: #191f25;
+  text-align: left;
+  margin-top: 6px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+
+.dingflow-design .auto-judge .sort-left,
+.dingflow-design .auto-judge .sort-right {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  display: none;
+  z-index: 1;
+}
+
+.dingflow-design .auto-judge .sort-left {
+  left: 0;
+  border-right: 1px solid #f6f6f6;
+}
+
+.dingflow-design .auto-judge .sort-right {
+  right: 0;
+  border-left: 1px solid #f6f6f6;
+}
+
+.dingflow-design .auto-judge:hover .sort-left,
+.dingflow-design .auto-judge:hover .sort-right {
+  display: flex;
+  align-items: center;
+}
+
+.dingflow-design .auto-judge .sort-left:hover,
+.dingflow-design .auto-judge .sort-right:hover {
+  background: #efefef;
+}
+
+.dingflow-design .end-node {
+  border-radius: 50%;
+  font-size: 14px;
+  color: rgba(25, 31, 37, 0.4);
+  text-align: left;
+}
+
+.dingflow-design .end-node .end-node-circle {
+  width: 10px;
+  height: 10px;
+  margin: auto;
+  border-radius: 50%;
+  background: #dbdcdc;
+}
+
+.dingflow-design .end-node .end-node-text {
+  margin-top: 5px;
+  text-align: center;
+}
+
+.approval-setting {
+  border-radius: 2px;
+  margin: 20px 0;
+  position: relative;
+  background: #fff;
+}
+
+.ant-btn {
+  position: relative;
+}
diff --git a/src/styles/workflowcss/workflow.min.css b/src/styles/workflowcss/workflow.min.css
new file mode 100644
index 000000000..9634dc5c7
--- /dev/null
+++ b/src/styles/workflowcss/workflow.min.css
@@ -0,0 +1 @@
+body{background:#eee}@font-face{font-family:Chinese Quote;src:local("PingFang SC"),local("SimSun");unicode-range:u+2018, u+2019, u+201c, u+201d}body,html{width:100%}input::-ms-clear,input::-ms-reveal{display:none}*,:after,:before{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-ms-overflow-style:scrollbar;-webkit-tap-highlight-color:transparent}@-ms-viewport{width:device-width}article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;font-size:14px;font-variant:tabular-nums;line-height:1.5;color:rgba(0,0,0,0.65);background-color:#fff}[tabindex="-1"]:focus{outline:none !important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5em;color:rgba(0,0,0,0.85);font-weight:500}p{margin-top:0;margin-bottom:1em}abbr[data-original-title],abbr[title]{text-decoration:underline;text-decoration:underline dotted;cursor:help;border-bottom:0}address{margin-bottom:1em;font-style:normal;line-height:inherit}input[type=number],input[type=password],input[type=text],textarea{-webkit-appearance:none}dl,ol,ul{margin-top:0;margin-bottom:1em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:500}dd{margin-bottom:.5em;margin-left:0}blockquote{margin:0 0 1em}dfn{font-style:italic}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#1890ff;background-color:transparent;text-decoration:none;outline:none;cursor:pointer;transition:color .3s;-webkit-text-decoration-skip:objects}a:focus{text-decoration:underline;text-decoration-skip:auto}a:hover{color:#40a9ff}a:active{color:#096dd9}a:active,a:hover{outline:0;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier, monospace;font-size:1em}pre{margin-top:0;margin-bottom:1em;overflow:auto}figure{margin:0 0 1em}img{vertical-align:middle;border-style:none}svg:not(:root){overflow:hidden}[role=button],a,area,button,input:not([type=range]),label,select,summary,textarea{touch-action:manipulation}table{border-collapse:collapse}caption{padding-top:.75em;padding-bottom:.3em;color:rgba(0,0,0,0.45);text-align:left;caption-side:bottom}th{text-align:inherit}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding:0;border-style:none}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5em;font-size:1.5em;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item}template{display:none}[hidden]{display:none !important}mark{padding:.2em;background-color:#feffe6}::selection{background:#1890ff;color:#fff}.clearfix{zoom:1}.clearfix:after,.clearfix:before{content:"";display:table}.clearfix:after{clear:both}@font-face{font-family:anticon;font-display:fallback;src:url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.eot");src:url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.woff") format("woff"),url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.ttf") format("truetype"),url("https://at.alicdn.com/t/font_148784_v4ggb6wrjmkotj4i.svg#iconfont") format("svg")}.anticon{display:inline-block;font-style:normal;vertical-align:baseline;text-align:center;text-transform:none;line-height:1;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.anticon:before{display:block;font-family:anticon !important}.anticon-close:before{content:"\E633"}.anticon-right:before{content:"\E61F"}.anticon-exclamation-circle{color:#f25643}.anticon-exclamation-circle:before{content:"\E62C"}.anticon-left:before{content:"\E620"}.anticon-close-circle:before{content:"\E62E"}.ant-btn{line-height:1.5;display:inline-block;font-weight:400;text-align:center;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:0 15px;font-size:14px;border-radius:4px;height:32px;user-select:none;transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);position:relative;color:rgba(0,0,0,0.65);background-color:#fff;border-color:#d9d9d9}.ant-btn>.anticon{line-height:1}.ant-btn,.ant-btn:active,.ant-btn:focus{outline:0}.ant-btn>a:only-child{color:currentColor}.ant-btn>a:only-child:after{content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:transparent}.ant-btn:focus,.ant-btn:hover{color:#40a9ff;background-color:#fff;border-color:#40a9ff}.ant-btn:focus>a:only-child,.ant-btn:hover>a:only-child{color:currentColor}.ant-btn:focus>a:only-child:after,.ant-btn:hover>a:only-child:after{content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:transparent}.ant-btn.active,.ant-btn:active{color:#096dd9;background-color:#fff;border-color:#096dd9}.ant-btn.active>a:only-child,.ant-btn:active>a:only-child{color:currentColor}.ant-btn.active>a:only-child:after,.ant-btn:active>a:only-child:after{content:"";position:absolute;top:0;left:0;bottom:0;right:0;background:transparent}.ant-btn.active,.ant-btn:active,.ant-btn:focus,.ant-btn:hover{background:#fff;text-decoration:none}.ant-btn>i,.ant-btn>span{pointer-events:none}.ant-btn:before{position:absolute;top:-1px;left:-1px;bottom:-1px;right:-1px;background:#fff;opacity:.35;content:"";border-radius:inherit;z-index:1;transition:opacity .2s;pointer-events:none;display:none}.ant-btn .anticon{transition:margin-left 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.ant-btn:active>span,.ant-btn:focus>span{position:relative}.ant-btn>.anticon+span,.ant-btn>span+.anticon{margin-left:8px}.fd-nav-container{display:inline-block;position:relative}.fd-nav-container .ghost-bar{position:absolute;width:150px;height:100%;left:0;background:#1583f2;-webkit-transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.fd-nav-container .ghost-bar:after{content:"";position:absolute;bottom:0;left:50%;margin-left:-5px;width:0;height:0;border-style:solid;border-width:0 5px 6px;border-color:transparent transparent #f6f6f6}.fd-nav-item{position:relative;cursor:pointer;display:inline-block;line-height:60px;width:150px;text-align:center;white-space:nowrap}.fd-nav-item .order-num{display:inline-block;width:20px;height:20px;line-height:20px;border:1px solid #fff;border-radius:50%;margin-right:6px;-webkit-transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.fd-nav-item.active .order-num{color:#1583f2;background:#fff}.ant-input{font-family:Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif;font-variant:tabular-nums;box-sizing:border-box;margin:0;padding:0;list-style:none;position:relative;display:inline-block;padding:4px 11px;width:100%;height:32px;font-size:14px;line-height:1.5;color:rgba(0,0,0,0.65);background-color:#fff;background-image:none;border:1px solid #d9d9d9;border-radius:4px;transition:all .3s}.ant-input::-moz-placeholder{color:#bfbfbf;opacity:1}.ant-input:-ms-input-placeholder{color:#bfbfbf}.ant-input::-webkit-input-placeholder{color:#bfbfbf}.ant-input:focus,.ant-input:hover{border-color:#40a9ff;border-right-width:1px !important}.ant-input:focus{outline:0;box-shadow:0 0 0 2px rgba(24,144,255,0.2)}textarea.ant-input{max-width:100%;height:auto;vertical-align:bottom;transition:all .3s, height 0s;min-height:32px}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;font:inherit;vertical-align:baseline}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body,html{font-size:14px}body{font-family:Microsoft Yahei, Lucida Grande, Lucida Sans Unicode, Helvetica, Arial, Verdana, sans-serif;line-height:1.6;background-color:#fff;position:static !important;-webkit-tap-highlight-color:transparent}ol,ul{list-style-type:none}b,strong{font-weight:700}img{border:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}textarea{overflow:auto;vertical-align:top;-webkit-appearance:none}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}table{width:100%;border-spacing:0;border-collapse:collapse}table,td,th{border:0}td,th{padding:0;vertical-align:top}th{font-weight:700;text-align:left}thead th{white-space:nowrap}a{text-decoration:none;cursor:pointer;color:#3296fa}a:active,a:hover{outline:0;color:#3296fa}small{font-size:80%}body,html{font-size:12px !important;color:#191f25 !important;background:#f6f6f6 !important}.wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%}@font-face{font-family:IconFont;src:url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.eot");src:url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.eot?#iefix") format("embedded-opentype"),url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.woff") format("woff"),url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.ttf") format("truetype"),url("//at.alicdn.com/t/font_135284_ph2thxxbzgf.svg#IconFont") format("svg")}.iconfont{font-family:IconFont !important;font-size:16px;font-style:normal;-webkit-font-smoothing:antialiased;-webkit-text-stroke-width:.2px;-moz-osx-font-smoothing:grayscale}.fd-nav{position:fixed;top:0;left:0;right:0;z-index:997;width:100%;height:60px;font-size:14px;color:#fff;background:#3296fa;display:flex;align-items:center}.fd-nav>*{flex:1;width:100%}.fd-nav .fd-nav-left{display:-webkit-box;display:flex;align-items:center}.fd-nav .fd-nav-center{flex:none;width:600px;text-align:center}.fd-nav .fd-nav-right{display:flex;align-items:center;justify-content:flex-end;text-align:right}.fd-nav .fd-nav-back{display:inline-block;width:60px;height:60px;font-size:22px;border-right:1px solid #1583f2;text-align:center;cursor:pointer}.fd-nav .fd-nav-back:hover{background:#5af}.fd-nav .fd-nav-back:active{background:#1583f2}.fd-nav .fd-nav-back .anticon{line-height:60px}.fd-nav .fd-nav-title{width:0;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0 15px}.fd-nav a{color:#fff;margin-left:12px}.fd-nav .button-publish{min-width:80px;margin-left:4px;margin-right:15px;color:#3296fa;border-color:#fff}.fd-nav .button-publish.ant-btn:focus,.fd-nav .button-publish.ant-btn:hover{color:#3296fa;border-color:#fff;box-shadow:0 10px 20px 0 rgba(0,0,0,0.3)}.fd-nav .button-publish.ant-btn:active{color:#3296fa;background:#d6eaff;box-shadow:none}.fd-nav .button-preview{min-width:80px;margin-left:16px;margin-right:4px;color:#fff;border-color:#fff;background:transparent}.fd-nav .button-preview.ant-btn:focus,.fd-nav .button-preview.ant-btn:hover{color:#fff;border-color:#fff;background:#59acfc}.fd-nav .button-preview.ant-btn:active{color:#fff;border-color:#fff;background:#2186ef}.fd-nav-content{position:fixed;top:60px;left:0;right:0;bottom:0;z-index:1;overflow-x:hidden;overflow-y:auto;padding-bottom:30px}.fd-nav-content-new{position:relative;width:initial;height:calc(100% - 60px);overflow-x:hidden;overflow-y:auto;padding-bottom:30px}.error-modal-desc{font-size:13px;color:rgba(25,31,37,0.56);line-height:22px;margin-bottom:14px}.error-modal-list{height:200px;overflow-y:auto;margin-right:-25px;padding-right:25px}.error-modal-item{padding:10px 20px;line-height:21px;background:#f6f6f6;display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;border-radius:4px}.error-modal-item-label{flex:none;font-size:15px;color:rgba(25,31,37,0.56);padding-right:10px}.error-modal-item-content{text-align:right;flex:1;font-size:13px;color:#191f25}#body.blur{-webkit-filter:blur(3px);filter:blur(3px)}.zoom{display:flex;position:fixed;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;height:40px;width:125px;right:40px;margin-top:30px;z-index:10}.zoom .zoom-in,.zoom .zoom-out{width:30px;height:30px;background:#fff;color:#c1c1cd;cursor:pointer;background-size:100%;background-repeat:no-repeat}.zoom .zoom-out{background-image:url(https://gw.alicdn.com/tfs/TB1s0qhBHGYBuNjy0FoXXciBFXa-90-90.png)}.zoom .zoom-out.disabled{opacity:.5}.zoom .zoom-in{background-image:url(https://gw.alicdn.com/tfs/TB1UIgJBTtYBeNjy1XdXXXXyVXa-90-90.png)}.zoom .zoom-in.disabled{opacity:.5}.auto-judge:hover .editable-title,.node-wrap-box:hover .editable-title{border-bottom:1px dashed #fff}.auto-judge:hover .editable-title.editing,.node-wrap-box:hover .editable-title.editing{text-decoration:none;border:1px solid #d9d9d9}.auto-judge:hover .editable-title{border-color:#15bc83}.editable-title{line-height:15px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-bottom:1px dashed transparent}.editable-title:before{content:"";position:absolute;top:0;left:0;bottom:0;right:40px}.editable-title:hover{border-bottom:1px dashed #fff}.editable-title-input{flex:none;height:18px;padding-left:4px;text-indent:0;font-size:12px;line-height:18px;z-index:1}.editable-title-input:hover{text-decoration:none}.ant-btn{position:relative}.node-wrap-box{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;position:relative;width:220px;min-height:72px;-ms-flex-negative:0;flex-shrink:0;background:#fff;border-radius:4px;cursor:pointer}.node-wrap-box:after{pointer-events:none;content:"";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2;border-radius:4px;border:1px solid transparent;transition:all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);box-shadow:0 2px 5px 0 rgba(0,0,0,0.1)}.node-wrap-box.active:after,.node-wrap-box:active:after,.node-wrap-box:hover:after{border:1px solid #3296fa;box-shadow:0 0 6px 0 rgba(50,150,250,0.3)}.node-wrap-box.active .close,.node-wrap-box:active .close,.node-wrap-box:hover .close{display:block}.node-wrap-box.error:after{border:1px solid #f25643;box-shadow:0 2px 5px 0 rgba(0,0,0,0.1)}.node-wrap-box .title{position:relative;display:flex;align-items:center;padding-left:16px;padding-right:30px;width:100%;height:24px;line-height:24px;font-size:12px;color:#fff;text-align:left;background:#576a95;border-radius:4px 4px 0 0}.node-wrap-box .title .iconfont{font-size:12px;margin-right:5px}.node-wrap-box .placeholder{color:#bfbfbf}.node-wrap-box .close{display:none;position:absolute;right:10px;top:50%;transform:translateY(-50%);width:20px;height:20px;font-size:14px;color:#fff;border-radius:50%;text-align:center;line-height:20px}.node-wrap-box .content{position:relative;font-size:14px;padding:16px;padding-right:30px}.node-wrap-box .content .text{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.node-wrap-box .content .arrow{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:20px;height:14px;font-size:14px;color:#979797}.start-node.node-wrap-box .content .text{display:block;white-space:nowrap}.node-wrap-box:before{content:"";position:absolute;top:-12px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;height:4px;border-style:solid;border-width:8px 6px 4px;border-color:#cacaca transparent transparent;background:#f5f5f7}.node-wrap-box.start-node:before{content:none}.top-left-cover-line{left:-1px}.top-left-cover-line,.top-right-cover-line{position:absolute;height:8px;width:50%;background-color:#f5f5f7;top:-4px}.top-right-cover-line{right:-1px}.bottom-left-cover-line{left:-1px}.bottom-left-cover-line,.bottom-right-cover-line{position:absolute;height:8px;width:50%;background-color:#f5f5f7;bottom:-4px}.bottom-right-cover-line{right:-1px}.dingflow-design{width:100%;background-color:#f5f5f7;overflow:auto;position:absolute;bottom:0;left:0;right:0;top:0}.dingflow-design .box-scale{transform:scale(1);display:inline-block;position:relative;width:100%;padding:54.5px 0;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;background-color:#f5f5f7;transform-origin:50% 0px 0px}.dingflow-design .node-wrap{flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-ms-flex-positive:1;padding:0 50px;position:relative}.dingflow-design .branch-wrap,.dingflow-design .node-wrap{display:inline-flex;width:100%}.dingflow-design .branch-box-wrap{display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-height:270px;width:100%;-ms-flex-negative:0;flex-shrink:0}.dingflow-design .branch-box{display:flex;overflow:visible;min-height:180px;height:auto;border-bottom:2px solid #ccc;border-top:2px solid #ccc;position:relative;margin-top:15px}.dingflow-design .branch-box .col-box{background:#f5f5f7}.dingflow-design .branch-box .col-box:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;margin:auto;width:2px;height:100%;background-color:#cacaca}.dingflow-design .add-branch{border:none;outline:none;user-select:none;justify-content:center;font-size:12px;padding:0 10px;height:30px;line-height:30px;border-radius:15px;color:#3296fa;background:#fff;box-shadow:0 2px 4px 0 rgba(0,0,0,0.1);position:absolute;top:-16px;left:50%;transform:translateX(-50%);transform-origin:center center;cursor:pointer;z-index:1;display:inline-flex;align-items:center;-webkit-transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transition:all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)}.dingflow-design .add-branch:hover{transform:translateX(-50%) scale(1.1);box-shadow:0 8px 16px 0 rgba(0,0,0,0.1)}.dingflow-design .add-branch:active{transform:translateX(-50%);box-shadow:none}.dingflow-design .col-box{display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-align:center;align-items:center;position:relative}.dingflow-design .condition-node{min-height:220px}.dingflow-design .condition-node,.dingflow-design .condition-node-box{display:inline-flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;flex-direction:column;-webkit-box-flex:1}.dingflow-design .condition-node-box{padding-top:30px;padding-right:50px;padding-left:50px;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;flex-grow:1;position:relative}.dingflow-design .condition-node-box:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;width:2px;height:100%;background-color:#cacaca}.dingflow-design .auto-judge{position:relative;width:220px;min-height:72px;background:#fff;border-radius:4px;padding:14px 19px;cursor:pointer}.dingflow-design .auto-judge:after{pointer-events:none;content:"";position:absolute;top:0;bottom:0;left:0;right:0;z-index:2;border-radius:4px;border:1px solid transparent;transition:all 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);box-shadow:0 2px 5px 0 rgba(0,0,0,0.1)}.dingflow-design .auto-judge.active:after,.dingflow-design .auto-judge:active:after,.dingflow-design .auto-judge:hover:after{border:1px solid #3296fa;box-shadow:0 0 6px 0 rgba(50,150,250,0.3)}.dingflow-design .auto-judge.active .close,.dingflow-design .auto-judge:active .close,.dingflow-design .auto-judge:hover .close{display:block}.dingflow-design .auto-judge.error:after{border:1px solid #f25643;box-shadow:0 2px 5px 0 rgba(0,0,0,0.1)}.dingflow-design .auto-judge .title-wrapper{position:relative;font-size:12px;color:#15bc83;text-align:left;line-height:16px}.dingflow-design .auto-judge .title-wrapper .editable-title{display:inline-block;max-width:120px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dingflow-design .auto-judge .title-wrapper .priority-title{display:inline-block;float:right;margin-right:10px;color:rgba(25,31,37,0.56)}.dingflow-design .auto-judge .placeholder{color:#bfbfbf}.dingflow-design .auto-judge .close{display:none;position:absolute;right:-10px;top:-10px;width:20px;height:20px;font-size:14px;color:rgba(0,0,0,0.25);border-radius:50%;text-align:center;line-height:20px;z-index:2}.dingflow-design .auto-judge .content{font-size:14px;color:#191f25;text-align:left;margin-top:6px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.dingflow-design .auto-judge .sort-left,.dingflow-design .auto-judge .sort-right{position:absolute;top:0;bottom:0;display:none;z-index:1}.dingflow-design .auto-judge .sort-left{left:0;border-right:1px solid #f6f6f6}.dingflow-design .auto-judge .sort-right{right:0;border-left:1px solid #f6f6f6}.dingflow-design .auto-judge:hover .sort-left,.dingflow-design .auto-judge:hover .sort-right{display:flex;align-items:center}.dingflow-design .auto-judge .sort-left:hover,.dingflow-design .auto-judge .sort-right:hover{background:#efefef}.dingflow-design .end-node{border-radius:50%;font-size:14px;color:rgba(25,31,37,0.4);text-align:left}.dingflow-design .end-node .end-node-circle{width:10px;height:10px;margin:auto;border-radius:50%;background:#dbdcdc}.dingflow-design .end-node .end-node-text{margin-top:5px;text-align:center}.approval-setting{border-radius:2px;margin:20px 0;position:relative;background:#fff}.ant-btn{position:relative}
diff --git a/src/types/components.d.ts b/src/types/components.d.ts
index 58d574dfb..629ff6695 100644
--- a/src/types/components.d.ts
+++ b/src/types/components.d.ts
@@ -22,6 +22,7 @@ declare module '@vue/runtime-core' {
     DesignLayoutPage: typeof import('./../components/DesignForm/designLayout/designLayoutPage.vue')['default']
     DiyIconfont: typeof import('./../components/DesignForm/public/expand/diy-iconfont.vue')['default']
     DragControl: typeof import('./../components/DesignForm/dragControl.vue')['default']
+    DragControlApp: typeof import('./../components/DesignForm/dragControlApp.vue')['default']
     DragControlNew: typeof import('./../components/DesignForm/dragControlNew.vue')['default']
     ElAffix: typeof import('element-plus/es')['ElAffix']
     ElAside: typeof import('element-plus/es')['ElAside']
@@ -58,6 +59,7 @@ 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']
@@ -102,6 +104,7 @@ declare module '@vue/runtime-core' {
     FormControlAttr: typeof import('./../components/DesignForm/formControlAttr.vue')['default']
     FormControlAttr_2024024: typeof import('./../components/DesignForm/formControlAttr_2024024.vue')['default']
     FormControlAttres: typeof import('./../components/DesignForm/formControlAttres.vue')['default']
+    FormControlProperties: typeof import('./../components/DesignForm/formControlProperties.vue')['default']
     FormGroup: typeof import('./../components/DesignForm/public/form/formGroup.vue')['default']
     FormGroup1: typeof import('./../components/DesignForm/public/form/formGroup1.vue')['default']
     FormItem: typeof import('./../components/DesignForm/public/form/formItem.vue')['default']
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index ba0021956..e8e25e700 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,146 +1,250 @@
-<!--
-@ 作者: 秦东
-@ 时间: 2023-11-06 13:39:13
-@ 备注: 首页
--->
-<script lang='ts' setup>
-import * as echarts from 'echarts';	//引入图形界面
+<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 { 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";
+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 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 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 orgAllYears = ref<any>()	//当前年
+const duration = 5000;
 
-const oenOrg = ref<any>() //单一行政组织
+// 收入金额
+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;
 
-//渲染完页面再执行
-onMounted(() => {
-	
-	drawerWidht.value = masterBody.value?.clientWidth
-	getOrgList();
-	// console.log("热门新闻----100---->",drawerWidht.value)
-})
+//消息数
+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 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>
+  <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>
-.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 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/dashboard/index_1.vue b/src/views/dashboard/index_1.vue
new file mode 100644
index 000000000..ba0021956
--- /dev/null
+++ b/src/views/dashboard/index_1.vue
@@ -0,0 +1,146 @@
+<!--
+@ 作者: 秦东
+@ 时间: 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
deleted file mode 100644
index e8e25e700..000000000
--- a/src/views/dashboard/index_old.vue
+++ /dev/null
@@ -1,250 +0,0 @@
-<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/lowcodepage/appFormList.vue b/src/views/sysworkflow/lowcodepage/appFormList.vue
index 4d63f1f3f..002717e0f 100644
--- a/src/views/sysworkflow/lowcodepage/appFormList.vue
+++ b/src/views/sysworkflow/lowcodepage/appFormList.vue
@@ -226,6 +226,7 @@ const appKey = ref<string>("")
 @ 功能: 编辑app内容
 */
 const editAppCont = (val:string) => {
+	emits('getRongQiAttr')
 	appKey.value = val.toString();
 	appPageShow.value = true;
 }
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue b/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
index b49320eb6..1a6f5ae94 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
@@ -239,6 +239,7 @@ const createNewPage = (val?:string) => {
 		@node-drop="handleDrop"
 	>
 		<template #default="{ node, data }">
+		
 		<div class="appMenuTitle">
 			<el-space wrap>
 				<svg-icon  prefix="icon" :icon-class="data.svg" @click="setAppMenusSvg(data)" />
diff --git a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
index 61af4c2fc..5bb53cf7b 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
@@ -11,7 +11,7 @@ import { FormData,formStruct,DrawerStruct, VideoMsg } from '@/api/DesignForm/typ
 
 
 //引入页面
-import DragControl from '@/components/DesignForm/dragControl.vue';
+import DragControlApp from '@/components/DesignForm/dragControlApp.vue';
 
 const props = defineProps({
 	appCont:{
@@ -63,8 +63,8 @@ const state =  computed({
 		emits('update:state', val)
 	}
 });
-
-const formKeyVal =  computed({
+provide('formDesignType', state.value.designType)
+const appFormKeyVal =  computed({
 	get() {
 		return props.formKey
 	},
@@ -73,7 +73,7 @@ const formKeyVal =  computed({
 	}
 });
 const versionCont = ref<customerFormVersionCont[]>([])			//版本内容列表
-
+const tableKey = ref("")
 // 搜索设计时左侧快速添加字段
 const searchCheckField = (data: FormData) => {
     state.value.formData.list.push(data)
@@ -93,25 +93,21 @@ const openAceEditDrawer = (params: any) => {
 </script>
 <template>
 	<el-aside class="asideBox leftBox">
-		<DragControl
-			v-model:versionid="props.formVersion"
-			:formid="state.formOtherData.source"
-			:versioncont="versionCont"
-      		@click-check="searchCheckField"
-      		@click="selectTemplate"
-			@editversionstaus="editversionstaus"
+		<DragControlApp
+			:table-key="state.formData.form.name"
+			@versionUpdateForm="versionUpdateForm"
 		/>
 	</el-aside>
 	<el-main class="mainBox rightBox">
-		
+		{{state.formData.config}}
 	</el-main>
 	<el-aside class="asideBox">
-		<form-control-attr
+		<formControlProperties
 			ref="formControlAttrEl"
 			v-model:formOtherData="state.formOtherData"
 			:form-data="state.formData.form"
 			:form-config="state.formData.config"
-			:customerformid="props.groupKey"
+			:customerformid="tableKey"
 			:form-list="state.formData.list"
 			:form-info="state.formData"
 			@open-dialog="openAceEditDrawer"
diff --git a/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue b/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
index 02c102fbc..1383808f5 100644
--- a/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
+++ b/src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue
@@ -57,7 +57,7 @@ const state = reactive<formStruct>({
 			formName: formConfigCont.formName
 		},
 		config: {
-			groupKey:props.formGroupKey
+			groupKey:props.groupKey
 		},
 		styles:{
 			divStyle:{},
@@ -138,7 +138,7 @@ onBeforeMount(() => {
 						</el-tabs>
 					</div>
 					<div class="headRight">
-					{{ props.menuId }}
+					{{props.groupKey}}
 						<el-button type="danger" size="small" @click="closeSavePageForm" >关闭</el-button>
 					</div>
 				</el-header>