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

@@ -1,6 +1,6 @@
<template>
  <basic-container>
    <el-dialog v-if="dialogFormVisible" :title="title" :visible.sync="dialogFormVisible" append-to-body>
    <el-dialog v-if="dialogFormVisible" :title="title" :visible.sync="dialogFormVisible" @close="closeHandler" append-to-body>
      <avue-form v-model="form" :option="option" @submit="submitHandler" @reset-change="changeHandler"></avue-form>
    </el-dialog>
  </basic-container>
@@ -37,170 +37,14 @@
    },
    title: {
      type: String
    }
    },
    formList:{
      type:Array
    },
  },
  data() {
    return {
      form: {},
      formList: [
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "3-15-test",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "name",
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: true,
          selectLibFlag: null,
          showField: null,
          suffix: '$',
          text: "名称",
          tooltips: null,
          type: "text",
          unique: false,
          verify: ""
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "code",
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "编码",
          tooltips: null,
          type: "text",
          unique: false,
          verify: ""
        },
        {
          comboxKey: "EnumReviewType",
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "department",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "reviewtype",
          hidden: false,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "类型",
          tooltips: null,
          type: "combox",
          unique: false,
          verify: "",
          dicData: [{
            label: '测试1',
            value: 'department'
          }, {
            label: '测试2',
            value: 'departments'
          }]
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: null,
          defaultValue: "",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "creator",
          hidden: true,
          keyAttr: false,
          prefix: null,
          readOnly: true,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "创建人",
          tooltips: null,
          type: "text",
          unique: false,
          verify: ""
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: "yyyy-MM-dd HH:mm:ss",
          defaultValue: "",
          displayExtension: "",
          extendAttrMap: null,
          extendAttrString: null,
          field: "createtime",
          hidden: true,
          keyAttr: false,
          prefix: null,
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: null,
          showField: null,
          suffix: null,
          text: "创建时间",
          tooltips: null,
          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: {
@@ -214,11 +58,23 @@
    },
    option() {
      return {
        column: this.formColumn
        column: this.formColumn(this.formList)
      }
    },
    formColumn() {
      return this.formList.map(item => {
  },
  methods:{
    //表单提交
    submitHandler(form,done){
      console.log(form)
      done()
    },
    changeHandler(){
      this.form = {};
      // this.clearValidate() 清空校验
      // this.resetFields()
    },
    formColumn(formList) {
      return formList.map(item => {
        const typeValue = item.type === 'text' ? 'input' : item.type === 'combox' ? 'select' : item.type;

        return {
@@ -231,6 +87,8 @@
          disabled: item.disabled,
          labelSuffix: item.suffix,
          suffixIcon: item.prefix,
          placeholder:item.placeholder,
          clearable:item.clearable,
          rules: [{
            required: item.required,
            message: `请输入${item.text}!`,
@@ -238,18 +96,9 @@
          }]
        }
      })
    }
  },
  methods:{
    //表单提交
    submitHandler(form,done){
      console.log(form)
      done()
    },
    changeHandler(){
    closeHandler(){
      this.form = {};
      // this.clearValidate() 清空校验
      // this.resetFields()
    },
  }
}