动态表单

packages/processManagement/mattersConfig/components/addConfig.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="add-config">
+  <div class="add-config" :class="[activeStep == 1 ? 'formLayout' : '']">
     <ai-detail>
       <ai-title slot="title" :title="detailTitle" isShowBack isShowBottomBorder @onBackClick="handleBack"/>
       <template slot="step">
@@ -53,7 +53,8 @@ export default {
       },
       processAnnexDefs: [],
       detailObj: {},
-      refresh: true
+      refresh: true,
+      tableFieldInfos: []
     }
   },
   computed: {
@@ -85,12 +86,9 @@ export default {
           this.handleBaseInfo()
           break
         case 1:
-          this.$refs['applyForm'].handleApplyForm().then(ret => {
+          this.$refs['applyForm'].onConfirm().then(res => {
-            this.applyForm.tableId = ret.id
+            this.tableFieldInfos = res
-            this.applyForm.approvalSteps = ret.approvalSteps.toString()
             this.activeStep++
-          }).catch(err => {
-            console.error(err);
           })
           break
         case 2:
@@ -106,7 +104,7 @@ export default {
     handleBaseInfo() {
       this.$refs['baseInfo'].banseInfoForm().then(res => {
         if (res) {
-          this.$refs['applyForm'].getFormList()
+          // this.$refs['applyForm'].getFormList()
           this.baseInfo = res
           this.activeStep++
         }
@@ -121,7 +119,10 @@ export default {
           ...this.detailObj,
           ...this.baseInfo,
           processDefStatus: Number(this.baseInfo.processDefStatus),
-          tableId: this.applyForm.tableId,
+          tableInfo: {
+            tableFieldInfos: this.tableFieldInfos
+          },
+          tableType: 0,
           processAnnexDefs: this.annexs.map(e => ({...e, mustFill: Number(e.mustFill)})),
           processNodeList: res.processNodeList,
           processType: this.processType
@@ -168,6 +169,15 @@ export default {
 .add-config {
   height: 100%;
 
+  &.formLayout {
+    ::v-deep .ai-detail__content--wrapper {
+      max-width: 100%;
+      height: calc(100%)!important;
+      padding: 0!important;
+      overflow: hidden!important;
+    }
+  }
+
   .step {
     width: 100%;
     height: 72px;

packages/processManagement/mattersConfig/components/config.js

@@ -0,0 +1,203 @@
+export const components = [
+	{
+		type: 'info',
+		tips: '（可重复添加）',
+		label: '信息',
+		children: [
+			{
+				type: 'name',
+				fieldName: '姓名',
+				fieldTips: '请输入姓名',
+				fixedLabel: '姓名',
+				disable: '0',
+				grid: 1,
+				fieldDataType: '1',
+				defaultValue: '',
+				icon: 'icontext_box',
+				mustFill: '1',
+				maxLength: 20
+			},
+			{
+				type: 'idNumber',
+				fieldName: '身份证号',
+				fixedLabel: '身份证号',
+				fieldTips: '请输入身份证号',
+				defaultValue: '',
+				icon: 'icontext_area',
+				mustFill: '1',
+				maxLength: 20,
+				disable: '0',
+				grid: 1,
+				fieldDataType: '1',
+				verifyType: 0
+			},
+			{
+				type: 'phone',
+				fieldName: '联系方式',
+				fixedLabel: '联系方式',
+				fieldTips: '请输入联系方式',
+				defaultValue: '',
+				icon: 'icontext_area',
+				mustFill: '1',
+				maxLength: 11,
+				disable: '0',
+				grid: 1,
+				fieldDataType: '1',
+				verifyType: 1
+			}
+		]
+	},
+	{
+		type: 'options',
+		tips: '（可重复添加）',
+		label: '选项',
+		children: [
+			{
+				type: 'radio',
+				fieldName: '单选',
+				fixedLabel: '单选',
+				fieldTips: '请选择',
+				grid: 1,
+				icon: 'iconradio',
+				mustFill: '1',
+				disable: '0',
+				fieldDataType: '4',
+				defaultValue: '',
+				options: [
+					{
+						label: '选项1',
+						value: ''
+					},
+					{
+						label: '选项2',
+						value: ''
+					}
+				],
+				title: ''
+			},
+			{
+				type: 'checkbox',
+				fieldName: '多选',
+				fixedLabel: '多选',
+				fieldTips: '请选择',
+				icon: 'iconcheck_box',
+				fieldDataType: '5',
+				mustFill: '1',
+				grid: 1,
+				disable: '0',
+				defaultValue: [],
+				options: [
+					{
+						label: '选项1',
+						value: ''
+					},
+					{
+						label: '选项2',
+						value: ''
+					}
+				],
+				title: ''
+			},
+			{
+				type: 'select',
+				fieldName: '单下拉框',
+				fixedLabel: '单下拉框',
+				grid: 1,
+				fieldTips: '请选择',
+				icon: 'iconSelect',
+				mustFill: '1',
+				defaultValue: '',
+				fieldDataType: '9',
+				disable: '0',
+				options: [
+					{
+						label: '选项1',
+						value: ''
+					},
+					{
+						label: '选项2',
+						value: ''
+					}
+				],
+				title: ''
+			},
+			{
+				type: 'date',
+				fieldName: '日期',
+				fixedLabel: '日期',
+				grid: 1,
+				fieldDataType: '3',
+				datetimePattern: 'yyyy-MM-dd',
+				fieldTips: '请选择日期',
+				icon: 'iconSelect',
+				mustFill: '1',
+				disable: '0',
+				title: ''
+			},
+			{
+				type: 'datetime',
+				fieldName: '日期时间',
+				fixedLabel: '日期时间',
+				grid: 1,
+				fieldDataType: '8',
+				datetimePattern: 'yyyy-MM-dd HH:mm:ss',
+				fieldTips: '请选择日期时间',
+				icon: 'iconSelect',
+				mustFill: '1',
+				disable: '0',
+				title: ''
+			}
+		]
+	},
+	{
+		type: 'input',
+		tips: '（可重复添加）',
+		label: '填空',
+		children: [
+			{
+				type: 'input',
+				fieldName: '单行填空',
+				fieldTips: '请输入',
+				fixedLabel: '单行填空',
+				disable: '0',
+				grid: 1,
+				fieldDataType: '1',
+				defaultValue: '',
+				icon: 'icontext_box',
+				mustFill: '1',
+				maxLength: 50
+			},
+			{
+				type: 'number',
+				fieldName: '数字输入',
+				fixedLabel: '数字输入',
+				fieldTips: '请输入数字',
+				defaultValue: '',
+				icon: 'icontext_area',
+				mustFill: '1',
+				maxValue: 10000,
+				decimalPlaces: 0,
+				fieldDataType: '0',
+				minValue: 0,
+				maxLength: 500,
+				disable: '0',
+				grid: 1,
+			}
+		]
+	},
+	{
+		type: 'layout',
+		tips: '（可重复添加）',
+		label: '分组',
+		children: [
+			{
+				type: 'group',
+				fieldName: '卡片',
+				fixedLabel: '卡片',
+				icon: 'iconpic',
+				groupName: '分组标题',
+				column: []
+			}
+		]
+	}
+];