From 51636e9cd814bddba7a9b4ff21b5bc94e95fb6cb Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期二, 14 五月 2024 09:21:36 +0800 Subject: [PATCH] 配置文档 --- Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue | 359 ++++++++++++++++++++++++----------------------------------- 1 files changed, 146 insertions(+), 213 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue index acae2e5..e08c6b3 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue @@ -1,15 +1,34 @@ <template> - <basic-container> - <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> + <div :id="'UI-dynamic-'+areasName+componentVO.oid" class="UI-dynamic"> + <dynamic-button v-if="componentVO && componentVO.buttons" :key="areasName+'buttons-'+componentVO.oid" + :componentVO="componentVO" :butttonList="componentVO.buttons" :dataStore="[form]" :sourceData="sourceData" + @afterMethod="handleRefresh" type="form"></dynamic-button> + <basic-form :key="areasName+'basicForm-'+componentVO.oid" + :span="this.componentVO.formDefineVO.columnOneRow?(24/this.componentVO.formDefineVO.columnOneRow) : 12" + :formItems="this.componentVO.formDefineVO && this.componentVO.formDefineVO.items" + :disabled="!inDialog" + :isEdit="canEdit" + :formData="form" + :initValue="paramVOS.initvalue" + @getFormData="getFormData"> + </basic-form> + </div> </template> <script> +import {dataForm} from "@/api/base/ui"; + export default { name: "dynamic-form", props: { + //ui涓婁笅鏂囩殑涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� + uiBtmType: { + type: String + }, + //ui涓婁笅鏂� + uiContext:{ + type: String + }, componentVO: { type: Object, default: {} @@ -18,239 +37,153 @@ type: Boolean, default: false }, + canEdit:{ + //鍐呭鏄惁鍙紪杈� + type:Boolean, + default:false + }, + actionType:{ + //鎸夐挳鎿嶄綔绫诲瀷 + default:"" + }, areasName: { type: String, default: '' }, sourceData: { - //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 + //鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 type: Object, default: {} + }, + //涓婁竴鍖哄煙涓氬姟绫诲瀷 + sourceBtmType:{ + type: String + }, + dataStore: { + //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 + type: Array, + default: [] }, paramVOS: { type: Object, default: {} }, - visible: { + isShow: { + //鎵�鍦ㄥ尯鍩熸槸鍚﹀凡鏄剧ず锛岄拡瀵箃ab鍜宑ollapse type: Boolean, - default: false, + default: true }, - title: { - type: String - } }, 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: "" - }, - ], + params:{}, + sourceDataMapParams:{}, + currentDefineVO:this.componentVO.formDefineVO, } }, - computed: { - dialogFormVisible: { - get() { - return this.visible; + mounted() { + }, + watch: { + form:{ + handler(newval) { + if(newval) { + + } }, - set(val) { - this.$emit("update:visible", val); - }, + deep: true, + immediate: true }, - option() { - return { - column: this.formColumn + sourceData: { + handler(newval) { + //婧愭暟鎹湁鍙樺寲鏃跺彉鏇村綋鍓嶅尯鍩熸暟鎹� + this.sourceDataMapParams=this.sourceDataMap(); + this.getParams(); + this.handleRefresh(); + }, + deep: true, + immediate: true + } + }, + created() { + this.getParams(); + }, + methods: { + sourceDataMap: function () { + const sourceDataMap = {}; + if (Object.keys(this.sourceData).length > 0) { + if (this.sourceData.oid) { + if (this.sourceData.oid.indexOf('@vcitreesep@') > -1) { + this.sourceData.oid = this.sourceData.oid.split('@vcitreesep@')[1]; + } + sourceDataMap.sourceBtmName = this.sourceBtmType; + ; + sourceDataMap.sourceOid = this.sourceData.oid; + } + for (let i in this.sourceData) { + const item = this.sourceData[i] + if (item && item.constructor === Object) continue; + if (i == 'type' || i == 'context' || i == 'content') continue; + sourceDataMap['sourceData["' + i + '"]'] = item + } + } + + if (Object.keys(this.paramVOS).length > 0) { + for (let j in this.paramVOS) { + if (this.paramVOS[j] && this.paramVOS[j].constructor === Object) continue; + if (j == 'type' || j == 'context' || j == 'content' || j == "getdataurl" || j == "getdatamethod" || j == "url" || j == "method" || j == "uploadfileurl" || j == "title") continue; + sourceDataMap['sourceData["' + j + '"]'] = this.paramVOS[j] + } + } + return sourceDataMap; + }, + getParams: function () { + const formParams = { + btmname: this.currentDefineVO.btmType, + btmType: this.currentDefineVO.btmType, + formDefineId: this.currentDefineVO.id, + oid: this.currentDefineVO.oid + }; + if (this.dataStore[0] && this.dataStore[0].oid) { + formParams.oid = this.dataStore[0].oid; + } + const sourceDataMapList = this.sourceDataMapParams; + + this.params = Object.assign({}, formParams, sourceDataMapList); + }, + onLoad: function () { + if (this.paramVOS.initvalue) { + this.form = this.paramVOS.initvalue; + } + if (Object.keys(this.sourceData).length > 0 && this.isShow && this.actionType != "add") { + this.loading = true; + dataForm(this.params, this.paramVOS.getdataurl, this.paramVOS.getdatamethod).then(res => { + this.form = res.data.obj.data; + this.loading = false; + this.$emit("setDataStore", { + area: this.areasName, + type: this.componentVO.uiComponentType, + btmType: this.currentDefineVO.btmType, + dataStore: [this.form] + }); + this.$emit("setData", { + area: this.areasName, + type: this.componentVO.uiComponentType, + currentDefineVO: this.currentDefineVO, + data: this.form + }); + }).catch(error => { + this.loading = false; + }); } }, - 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" - }] - } - }) + handleRefresh() { + this.form = {} + this.onLoad(); + }, + getFormData(form) { + this.form = form; } - }, - methods:{ - //琛ㄥ崟鎻愪氦 - submitHandler(form,done){ - console.log(form) - done() - }, - changeHandler(){ - this.form = {}; - // this.clearValidate() 娓呯┖鏍¢獙 - // this.resetFields() - }, } } </script> -- Gitblit v1.9.3