表单基本配置

 Source/ProjectWeb/src/components/dynamic-components/dynamic-button.vue

@@ -245,6 +245,8 @@
      this.formName = item.name;
      if (item.paramVOS.buttonMethods === 'form') {
        this.visible = true;
      }else if(item.paramVOS.buttonMethods === 'delete'){
        this.$message.success('删除成功！')
      }
    }
  }

 Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue

@@ -1,7 +1,7 @@
<template>
  <basic-container>
    <el-dialog v-if="dialogFormVisible" :visible.sync="dialogFormVisible" :title="title" append-to-body>

    <el-dialog v-if="dialogFormVisible" :title="title" :visible.sync="dialogFormVisible" append-to-body>
      <avue-form v-model="form" :option="option" @submit="submitHandler" @reset-change="changeHandler"></avue-form>
    </el-dialog>
  </basic-container>
</template>
@@ -9,45 +9,46 @@
<script>
export default {
  name: "dynamic-form",
  props:{
    componentVO:{
      type:Object,
  props: {
    componentVO: {
      type: Object,
      default: {}
    },
    inDialog: {
      type: Boolean,
      default: false
    },
    areasName:{
      type:String,
      default:''
    areasName: {
      type: String,
      default: ''
    },
    sourceData:{
    sourceData: {
      //菜单源数据或者弹窗时按钮所属区域的上一区域选中数据
      type:Object,
      type: Object,
      default: {}
    },
    paramVOS:{
      type:Object,
    paramVOS: {
      type: Object,
      default: {}
    },
    visible:{
    visible: {
      type: Boolean,
      default: false,
    },
    title:{
      type:String
    title: {
      type: String
    }
  },
  data() {
    return {
      form: {},
      formList: [
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "",
          defaultValue: "3-15-test",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
@@ -57,10 +58,10 @@
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          required: true,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          suffix: '$',
          text: "名称",
          tooltips: null,
          type: "text",
@@ -105,7 +106,7 @@
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: true,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
@@ -115,32 +116,14 @@
          tooltips: null,
          type: "combox",
          unique: false,
          verify: ""
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "content",
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "备注",
          tooltips: null,
          type: "textarea",
          unique: false,
          verify: ""
          verify: "",
          dicData: [{
            label: '测试1',
            value: 'department'
          }, {
            label: '测试2',
            value: 'departments'
          }]
        },
        {
          comboxKey: null,
@@ -188,14 +171,39 @@
          suffix: null,
          text: "创建时间",
          tooltips: null,
          type: "date",
          type: "datetime",
          unique: false,
          verify: ""
        }
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "content",
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "备注",
          tooltips: null,
          type: "textarea",
          unique: false,
          verify: ""
        },
      ],
    }
  },
  computed:{
  computed: {
    dialogFormVisible: {
      get() {
        return this.visible;
@@ -204,6 +212,45 @@
        this.$emit("update:visible", val);
      },
    },
    option() {
      return {
        column: this.formColumn
      }
    },
    formColumn() {
      return this.formList.map(item => {
        const typeValue = item.type === 'text' ? 'input' : item.type === 'combox' ? 'select' : item.type;

        return {
          label: item.text,
          prop: item.field,
          type: typeValue,
          value: item.defaultValue,
          dicData: item.type === 'combox' ? item.dicData : null,
          readonly: item.readOnly,
          disabled: item.disabled,
          labelSuffix: item.suffix,
          suffixIcon: item.prefix,
          rules: [{
            required: item.required,
            message: `请输入${item.text}!`,
            trigger: "blur"
          }]
        }
      })
    }
  },
  methods:{
    //表单提交
    submitHandler(form,done){
      console.log(form)
      done()
    },
    changeHandler(){
      this.form = {};
      // this.clearValidate() 清空校验
      // this.resetFields()
    },
  }
}
</script>