From c4d9e7a20dac267c5496ad3586c5053be279a17a Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期五, 26 四月 2024 20:09:59 +0800 Subject: [PATCH] 添加action,表单组件 --- Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue | 172 ++++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 114 insertions(+), 58 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue index 65e77a0..0ae6114 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue @@ -1,31 +1,31 @@ <template> - <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid"> - <avue-form v-model="form" :option="option"> - <template v-for="item in slotData" :slot="item.prop + 'Label'"> - <span> - <span>{{ item.label }} </span> - <el-tooltip - v-if="item.keyAttr" - class="item" - content="璇ュ睘鎬т负鍏抽敭灞炴��" - effect="dark" - placement="top-start" - > - <i class="el-icon-star-on" style="font-size: 17px !important; color: red;vertical-align: baseline;"></i> - </el-tooltip> - </span> - </template> - <template slot="menuForm"> - <dynamic-button type="form" :butttonList="componentVO.buttons" @buttonClick="buttonClick"></dynamic-button> - </template> - </avue-form> + <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" 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="inDialog" + :formData="form"> + </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: {} @@ -39,67 +39,123 @@ default: '' }, sourceData: { - //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 + //鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 type: Object, default: {} + }, + //涓婁竴鍖哄煙涓氬姟绫诲瀷 + sourceBtmType:{ + type: String + }, + dataStore: { + //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 + type: Array, + default: [] }, paramVOS: { type: Object, default: {} }, + isShow: { + //鎵�鍦ㄥ尯鍩熸槸鍚﹀凡鏄剧ず锛岄拡瀵箃ab鍜宑ollapse + type: Boolean, + default: true + }, }, data() { return { form: {}, + params:{}, + sourceDataMapParams:{}, + currentDefineVO:this.componentVO.formDefineVO, } }, mounted() { - // console.log('componentVO--',this.componentVO.tableDefineVO.cols[0]) }, - computed: { - option() { - return { - submitBtn: false, - emptyBtn: false, - height: 300, - column: this.formColumn(this.componentVO.tableDefineVO.cols[0]) + watch: { + form:{ + handler(newval) { + if(newval) { + this.$emit("setDataStore", { + area: this.areasName, + type:this.componentVO.uiComponentType, + btmType:this.componentVO.treeDefineVO.btmType, + dataStore:[newval] + }); + } } }, - slotData() { - return this.formColumn(this.componentVO.tableDefineVO.cols[0]) + sourceData: { + handler(newval) { + //婧愭暟鎹湁鍙樺寲鏃跺彉鏇村綋鍓嶅尯鍩熸暟鎹� + this.sourceDataMapParams=this.sourceDataMap(); + this.getParams(); + this.handleRefresh(); + } } }, + created() { + this.getParams(); + }, methods: { - //杞寲鏁版嵁 - formColumn(formList) { - return 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 : item.dicUrl, - readonly: item.readOnly, - disabled: item.disabled, - labelSuffix: item.suffix, - suffixIcon: item.prefix, - placeholder: item.placeholder, - clearable: item.clearable, - tip: item.tooltips, - keyAttr: item.keyAttr, - rules: [{ - required: item.required, - message: `璇疯緭鍏�${item.text}!`, - trigger: "blur" - }] + 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) { + let item = this.sourceData[i] + if (item && item.constructor === Object) return; + if (i == 'type' || i == 'context' || i == 'content') return; + sourceDataMap['sourceData["' + i + '"]'] = item + } + } + + if (Object.keys(this.paramVOS).length>0) { + for (let i in this.paramVOS) { + let item = this.paramVOS[i] + if (item && item.constructor === Object) return; + if (i == 'type' || i == 'context' || i == 'content') return; + sourceDataMap['sourceData["' + i + '"]'] = item + } + } + return sourceDataMap; }, - buttonClick(item) { - console.log(item.id) + 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); + console.log(this.params) }, + onLoad:function () { + if (Object.keys(this.sourceData).length>0 && this.isShow) { + this.loading = true; + dataForm(this.params).then(res => { + this.form = res.data.obj; + this.loading = false; + }).catch(error => { + this.$message.error(error); + this.loading = false; + }); + } + }, + handleRefresh(){ + + } } } </script> -- Gitblit v1.9.3