| | |
| | | <!-- eslint-disable vue/valid-v-for -->
|
| | | <!-- eslint-disable vue/require-v-for-key -->
|
| | | <template>
|
| | | <div>
|
| | | <avue-form v-model="form" :option="option" v-loading="loading" ref="form" :style="{minHeight: loading ? '300px' : ''}">
|
| | | <template :slot="item.prop + 'Label'" v-for="item in slotColumnList">
|
| | | <span>
|
| | | <span>{{ item.label }} </span>
|
| | | <el-tooltip
|
| | | v-if="item.keyAttr"
|
| | | class="item"
|
| | | effect="dark"
|
| | | content="该属性为关键属性"
|
| | | placement="top-start"
|
| | | >
|
| | | <i class="el-icon-star-on key_attr_icon"></i>
|
| | | </el-tooltip>
|
| | | </span>
|
| | | </template>
|
| | | <template :slot="groupItem.prop + ''" v-for="groupItem in option.group">
|
| | | <template :slot="item.prop + ''" v-for="item in groupItem.column">
|
| | | <span>1111</span>
|
| | | <vciWebRefer v-if="item.type=='refer'" :value="item.value" :options="item.referConfig"></vciWebRefer>
|
| | | <avue-form
|
| | | v-model="form"
|
| | | :option="option"
|
| | | v-loading="loading"
|
| | | ref="form"
|
| | | :style="{ minHeight: loading ? '300px' : '' }"
|
| | | >
|
| | | <template :slot="item.prop + 'Label'" v-for="item in slotColumnList">
|
| | | <span>
|
| | | <span>{{ item.label }} </span>
|
| | | <el-tooltip
|
| | | v-if="item.keyAttr"
|
| | | class="item"
|
| | | effect="dark"
|
| | | content="该属性为关键属性"
|
| | | placement="top-start"
|
| | | >
|
| | | <i class="el-icon-star-on key_attr_icon"></i>
|
| | | </el-tooltip>
|
| | | </span>
|
| | | </template>
|
| | |
|
| | | </template>
|
| | | </avue-form>
|
| | | <template :slot="item.prop + ''" v-for="item in slotColumnList">
|
| | | <vciWebRefer
|
| | | v-if="item.type == 'refer'"
|
| | | :value="item.value"
|
| | | :options="item.referConfig || {}"
|
| | | ></vciWebRefer>
|
| | | </template>
|
| | | </avue-form>
|
| | | </div>
|
| | | </template>
|
| | |
|
| | | <script>
|
| | | import { getFormTemplate } from "@/api/formTemplate";
|
| | | import { getFormTemplate, getFormDetail } from "@/api/formTemplate";
|
| | | import { getDictionary } from "../../api/system/dict";
|
| | | import vciWebRefer from "../refer/vciWebRefer.vue";
|
| | | export default {
|
| | | name: "FormTemplate",
|
| | | components: { vciWebRefer},
|
| | | components: { vciWebRefer },
|
| | | props: {
|
| | | // 默认禁用元素
|
| | | disabledProp: {
|
| | |
| | | type: String,
|
| | | default: "",
|
| | | },
|
| | | // 修改回显的数据
|
| | | editForm: {
|
| | | type: Object,
|
| | | default: () => ({}),
|
| | | // 列表数据oid
|
| | | rowOid: {
|
| | | type: String,
|
| | | default: "",
|
| | | },
|
| | | // 表单类型(add, edit, detail)
|
| | | type: {
|
| | |
| | | option: {
|
| | | emptyBtn: false,
|
| | | submitBtn: false,
|
| | | labelWidth: "130",
|
| | | labelWidth: "140",
|
| | | column: [],
|
| | | group: [],
|
| | | },
|
| | |
| | | textarea: "textarea",
|
| | | datetime: "datetime",
|
| | | date: "date",
|
| | | refer: "refer",
|
| | | },
|
| | | // 假数据
|
| | | // testItems: [
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "id",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "传值禁用功能",
|
| | | // tooltips: "",
|
| | | // type: "combox",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "state",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: true,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "接口禁用功能",
|
| | | // tooltips: "",
|
| | | // type: "combox",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "oldcode",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "el-icon-search",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "文本后缀测试",
|
| | | // text: "前后缀功能",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "materialname",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: true,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "正则校验功能",
|
| | | // tooltips: "请输入数字",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "/[0-9]/",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: [
|
| | | // {
|
| | | // attributes: {},
|
| | | // key: "model_type",
|
| | | // value: "模型",
|
| | | // },
|
| | | // {
|
| | | // attributes: {},
|
| | | // key: "part_type",
|
| | | // value: "零件",
|
| | | // },
|
| | | // ],
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "dataSelect",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "直接返回下拉",
|
| | | // tooltips: "",
|
| | | // type: "combox",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: "formTemplateTest",
|
| | | // customClass: null,
|
| | | // data: [],
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "dictSelect",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "字典返回下拉",
|
| | | // tooltips: "",
|
| | | // type: "combox",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "firstfl",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "数字输入框",
|
| | | // tooltips: "",
|
| | | // type: "number",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "yyyy-MM-dd HH:mm:ss",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "datetime",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "日期时间选择器",
|
| | | // tooltips: "",
|
| | | // type: "datetime",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "time",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "时间选择器",
|
| | | // tooltips: "",
|
| | | // type: "date",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "false",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "xiaoshouwl",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "开关",
|
| | | // tooltips: "",
|
| | | // type: "truefalse",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "我是默认值",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "tuhao",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "默认值功能",
|
| | | // tooltips: "提示",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "xinghaoguige",
|
| | | // hidden: false,
|
| | | // keyAttr: true,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "属性关键值",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "jiliangdw",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // tip: "我是提示功能",
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: "jiliangdwname",
|
| | | // suffix: "",
|
| | | // text: "提示功能",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: "this.form.sum = this.form.fun1 + this.form.fun2",
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "fun1",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "参数1测试js",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: "this.form.sum = this.form.fun1 + this.form.fun2",
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "fun2",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: "hesuanfenleiname",
|
| | | // suffix: "",
|
| | | // text: "参数2测试js",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: "",
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "sum",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: true,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: "",
|
| | | // suffix: "",
|
| | | // text: "参数1参数2求和",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "textarea",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: false,
|
| | | // referConfig: null,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: null,
|
| | | // suffix: "",
|
| | | // text: "文本域",
|
| | | // tooltips: "",
|
| | | // type: "textarea",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // {
|
| | | // comboxKey: null,
|
| | | // customClass: null,
|
| | | // data: null,
|
| | | // dateFormate: "",
|
| | | // defaultValue: "",
|
| | | // displayExtension: null,
|
| | | // extendAttrMap: null,
|
| | | // extendAttrString: null,
|
| | | // field: "cz",
|
| | | // hidden: false,
|
| | | // keyAttr: false,
|
| | | // prefix: "",
|
| | | // readOnly: true,
|
| | | // referConfig: true,
|
| | | // required: false,
|
| | | // selectLibFlag: "",
|
| | | // showField: "depId",
|
| | | // suffix: "",
|
| | | // text: "参照",
|
| | | // tooltips: "",
|
| | | // type: "text",
|
| | | // unique: false,
|
| | | // verify: "",
|
| | | // },
|
| | | // ],
|
| | | testItems: [
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "id",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "传值禁用功能",
|
| | | tooltips: "",
|
| | | type: "combox",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "state",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: true,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "接口禁用功能",
|
| | | tooltips: "",
|
| | | type: "combox",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "oldcode",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "el-icon-search",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "文本后缀测试",
|
| | | text: "前后缀功能",
|
| | | tooltips: "",
|
| | | type: "text",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "materialname",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: true,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "正则校验功能",
|
| | | tooltips: "请输入数字",
|
| | | type: "text",
|
| | | unique: false,
|
| | | verify: "/[0-9]/",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: [
|
| | | {
|
| | | attributes: {},
|
| | | key: "model_type",
|
| | | value: "模型",
|
| | | },
|
| | | {
|
| | | attributes: {},
|
| | | key: "part_type",
|
| | | value: "零件",
|
| | | },
|
| | | ],
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "dataSelect",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "直接返回下拉",
|
| | | tooltips: "",
|
| | | type: "combox",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: "formTemplateTest",
|
| | | customClass: null,
|
| | | data: [],
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "dictSelect",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "字典返回下拉",
|
| | | tooltips: "",
|
| | | type: "combox",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "firstfl",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "数字输入框",
|
| | | tooltips: "",
|
| | | type: "number",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "yyyy-MM-dd HH:mm:ss",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "datetime",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "日期时间选择器",
|
| | | tooltips: "",
|
| | | type: "datetime",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "time",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "时间选择器",
|
| | | tooltips: "",
|
| | | type: "date",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "false",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "xiaoshouwl",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "开关",
|
| | | tooltips: "",
|
| | | type: "truefalse",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "我是默认值",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "tuhao",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "默认值功能",
|
| | | tooltips: "提示",
|
| | | type: "text",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "xinghaoguige",
|
| | | hidden: false,
|
| | | keyAttr: true,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "属性关键值",
|
| | | tooltips: "",
|
| | | type: "text",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "jiliangdw",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | tip: "我是提示功能",
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: "jiliangdwname",
|
| | | suffix: "",
|
| | | text: "提示功能",
|
| | | tooltips: "",
|
| | | type: "text",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "textarea",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: false,
|
| | | referConfig: null,
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: null,
|
| | | suffix: "",
|
| | | text: "文本域",
|
| | | tooltips: "",
|
| | | type: "textarea",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | {
|
| | | comboxKey: null,
|
| | | customClass: null,
|
| | | data: null,
|
| | | dateFormate: "",
|
| | | defaultValue: "",
|
| | | displayExtension: null,
|
| | | extendAttrMap: null,
|
| | | extendAttrString: null,
|
| | | field: "cz",
|
| | | hidden: false,
|
| | | keyAttr: false,
|
| | | prefix: "",
|
| | | readOnly: true,
|
| | | referConfig: {},
|
| | | required: false,
|
| | | selectLibFlag: "",
|
| | | showField: "depId",
|
| | | suffix: "",
|
| | | text: "参照",
|
| | | tooltips: "",
|
| | | type: "refer",
|
| | | unique: false,
|
| | | verify: "",
|
| | | },
|
| | | ],
|
| | | trendsSpan: 8,
|
| | | defaultValue: {},
|
| | | // 表单属性
|
| | | attributes: [],
|
| | | slotColumnList: []
|
| | | slotColumnList: [],
|
| | | };
|
| | | },
|
| | | mounted() {
|
| | | this.handleResize();
|
| | | },
|
| | | methods: {
|
| | | // 初始化
|
| | | init(columnList) {
|
| | | if (Array.isArray(columnList)) {
|
| | | this.templateRender(columnList);
|
| | |
| | | this.getFormTemplate();
|
| | | }
|
| | | },
|
| | | // 接口获取表单数据
|
| | | getFormTemplate() {
|
| | | getFormTemplate({
|
| | | templateOid: this.templateOid,
|
| | |
| | | console.log(err);
|
| | | });
|
| | | },
|
| | | // 渲染表单模板
|
| | | templateRender(formItemList) {
|
| | | // 无需分组数据
|
| | | let column = [];
|
| | | let group = [];
|
| | | let dictKeys = [];
|
| | | let slotColumnList = []
|
| | | let slotColumnList = [];
|
| | | formItemList.forEach((formItem) => {
|
| | | formItem = this.resetFormConfig(formItem);
|
| | | if (formItem.type === "line") {
|
| | |
| | | dictKeys.push({ dictKey: formItem.comboxKey, field: formItem.field });
|
| | | }
|
| | | // 禁用部分属性(外部传值禁用和参照禁用)
|
| | | if (
|
| | | this.disabledProp.includes(formItem.field) ||
|
| | | this.$utilFunc.isValuableObj(formItem.referConfig)
|
| | | ) {
|
| | | if (this.disabledProp.includes(formItem.field)) {
|
| | | formItem.readOnly = true;
|
| | | }
|
| | | // 设置表单校验的规则,文本
|
| | |
| | | format: formItem.dateFormate,
|
| | | keyAttr: formItem.keyAttr,
|
| | | value: formItem.defaultValue,
|
| | | tip: formItem.tooltips,
|
| | | tipPlacement: "right",
|
| | | // tip: formItem.tooltips,
|
| | | // tipPlacement: "right",
|
| | | placeholder: formItem.inputTip,
|
| | | comboxKey: formItem.comboxKey,
|
| | | display: !formItem.hidden,
|
| | | maxlength: formItem.maxlength,
|
| | |
| | | this.changeFun(formItem.displayExtension, formItem.prop);
|
| | | },
|
| | | span: formItem.type === "textarea" ? 24 : this.trendsSpan,
|
| | | click: () => {
|
| | | this.clickFun(formItem.referConfig)
|
| | | },
|
| | | rules: [
|
| | | {
|
| | | required: formItem.required,
|
| | |
| | | value: "key",
|
| | | },
|
| | | };
|
| | | slotColumnList.push(columnItem)
|
| | | slotColumnList.push(columnItem);
|
| | | if (group.length === 0) {
|
| | | column.push(columnItem);
|
| | | } else {
|
| | | group[group.length - 1]["column"].push(columnItem);
|
| | | }
|
| | | });
|
| | | this.slotColumnList = slotColumnList
|
| | | this.slotColumnList = slotColumnList;
|
| | | this.$set(this.option, "column", column);
|
| | | this.$set(this.option, "group", group);
|
| | | this.formIndex++;
|
| | | this.loading = false
|
| | | this.loading = false;
|
| | | this.geDictData(dictKeys);
|
| | | this.getFormDetail()
|
| | | },
|
| | | // 使用传入的表单数据配置
|
| | | resetFormConfig(formItem) {
|
| | |
| | | }
|
| | | return formItem;
|
| | | },
|
| | | // 根据屏幕动态配置表单布局
|
| | | handleResize() {
|
| | | let windowWidth = document.body.clientWidth;
|
| | | this.trendsSpan = 24 / Math.floor(windowWidth / 500);
|
| | |
| | | // executeCode({displayExtension, data: this.form}).then(res => {
|
| | | // this.form[prop] = res.data.data
|
| | | // })
|
| | | },
|
| | | clickFun(referConfig) {
|
| | | console.log(123123);
|
| | | if (this.type === "detail") {
|
| | | return;
|
| | | }
|
| | | },
|
| | | // 获取swich和已拿到的下拉数据
|
| | | getDataList(type, dicData) {
|
| | |
| | | }
|
| | | return [];
|
| | | },
|
| | | // 获取字典数据
|
| | | // 异步获取字典数据
|
| | | geDictData(dictKeys) {
|
| | | dictKeys.forEach((dictObj) => {
|
| | | getDictionary({ code: dictObj.dictKey }).then((res) => {
|
| | |
| | | });
|
| | | });
|
| | | },
|
| | | // 表单校验
|
| | | validate() {
|
| | | return new Promise((resolve) => {
|
| | | this.$refs.form.validate((valid, done, msg) => {
|
| | | console.error(msg, valid)
|
| | | if (valid) {
|
| | | resolve(true)
|
| | | } else {
|
| | | resolve(false);
|
| | | }
|
| | | });
|
| | | })
|
| | | |
| | | },
|
| | | // 获取表单数据
|
| | | getFormDetail() {
|
| | | if (this.type === 'add') return
|
| | | getFormDetail({templateOid: this.templateOid, oid: this.rowOid}).then(res => {
|
| | | console.log(res, 'res');
|
| | | })
|
| | | }
|
| | | },
|
| | | watch: {
|
| | | // 表单数据修改反馈到父组件
|
| | | form: {
|
| | | deep: true,
|
| | | immediate: true,
|
| | |
| | | };
|
| | | </script>
|
| | |
|
| | | <style lang="less" scoped></style>
|
| | | <style lang="scss" scoped>
|
| | | .key_attr_icon {
|
| | | font-size: 20px !important;
|
| | | vertical-align: baseline;
|
| | | color: red;
|
| | | }
|
| | | </style>
|