From 04af966bddb7dfb8e850bf0e314defc83cbe3f4e Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期三, 20 三月 2024 17:28:30 +0800 Subject: [PATCH] UI上下文展示引擎 --- Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue | 327 ++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 243 insertions(+), 84 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue index f510742..f90dbcd 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue @@ -1,5 +1,5 @@ <template> - <div> + <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid" style="overflow: hidden"> <avue-crud v-model="form" :data="tableList" :option="option" @@ -7,103 +7,60 @@ :table-loading="loading"> <!--top鍖哄煙鎸夐挳--> <template slot="menuLeft" slot-scope="scope"> - <dynamic-button LocationType="top" type="table" @buttonClick="buttonClick"></dynamic-button> + <dynamic-button LocationType="top" type="table":butttonList="componentVO.buttons" @buttonClick="buttonClick" ></dynamic-button> </template> <!--menu鍖哄煙鎸夐挳--> <template slot="menu" slot-scope="scope"> - <dynamic-button LocationType="menu" type="table" @buttonClick="buttonClick"></dynamic-button> + <dynamic-button :scope="scope" LocationType="menu" type="table":butttonList="componentVO.buttons" @buttonClick="buttonClick" ></dynamic-button> </template> </avue-crud> <!-- 琛ㄦ牸鍐呮寜閽搷浣滃璇濇琛ㄥ崟 --> -<!-- <dynamic-form :visible.sync="visible" style="display: none"></dynamic-form>--> + <dynamic-table-form ref="dynamicForm" :formList="formList" :title="formName" :visible.sync="visible" + style="display: none"></dynamic-table-form> </div> </template> <script> export default { name: "dynamic-table", + props: { + componentVO: { + type: Object, + default: {} + }, + inDialog: { + type: Boolean, + default: false + }, + areasName: { + type: String, + default: ''//westArea瀵艰埅鍖� + }, + sourceData: { + //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 + type: Object, + default: {} + }, + paramVOS: { + type: Object, + default: {} + } + }, data() { return { + clientHeight:0, + parentHeight:'100%',//褰撳墠缁勪欢鏍硅妭鐐瑰厓绱犻珮搴� form: {}, + formName: '', loading: false, - visible:false, + visible: false, page: { pageSize: 10, currentPage: 1, total: 5, }, - tableHeadList: [ - { - align: "left", - colspan: 1, - field: "name", - fieldType: "text", - hidden: false, - title: "鍚嶇О", - width: 100, - }, - { - align: "left", - colspan: 1, - field: "code", - fieldType: "text", - hidden: false, - title: "缂栫爜", - width: 100 - }, - { - align: "left", - colspan: 1, - comboxKey: "EnumReviewType", - field: "reviewtypetext", - fieldType: "combox", - hidden: false, - sortField: "reviewtype", - title: "绫诲瀷", - width: 80 - }, - { - align: "left", - colspan: 1, - field: "content", - fieldType: "textarea", - hidden: false, - title: "澶囨敞", - width: 150 - }, - { - align: "left", - colspan: 1, - comboxKey: "ProcessReviewLC${lcstatus}", - field: "lcstatus_text", - fieldType: "text", - hidden: false, - sortField: "lcstatus", - title: "鐘舵��", - width: 100 - }, - { - align: "left", - colspan: 1, - field: "creator_name", - fieldType: "text", - hidden: false, - sortField: "creator", - title: "鍒涘缓浜�", - width: 80 - }, - { - align: "left", - colspan: 1, - dateFormate: "yyyy-MM-dd HH:mm:ss", - field: "createtime", - fieldType: "date", - hidden: false, - title: "鍒涘缓鏃ユ湡", - width: 160 - } - ], + //琛ㄦ牸鏁版嵁 tableList: [ { code: "20220102", @@ -497,7 +454,168 @@ isfirstr: "1", ts: "2022-02-18 14:35:53.177" }, - ] + ], + // 琛ㄥ崟鏁版嵁 + formList: [ + { + comboxKey: null, + customClass: null, + data: null, + dateFormate: null, + defaultValue: "", + displayExtension: "", + extendAttrMap: null, + extendAttrString: null, + field: "name", + hidden: false, + keyAttr: true, + prefix: null, + readOnly: false, + referConfig: null, + required: true, + selectLibFlag: null, + showField: null, + suffix: '$', + text: "鍚嶇О", + tooltips: '鍚嶇О', + 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, + disabled:true, + 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: { @@ -507,14 +625,15 @@ addBtn: false, editBtn: false, delBtn: false, - height: 'auto', - // indexFixed:false, - // menuFixed:false, + height: this.parentHeight, + calcHeight: 15, + indexFixed: false, + menuFixed: false, column: this.updatedColumns, }; }, updatedColumns() { - return this.tableHeadList.map(item => { + return this.componentVO.tableDefineVO.cols[0].map(item => { const typeValue = item.fieldType === 'text' || item.fieldType === 'combox' ? 'input' : item.fieldType; // 琛ㄥ崟Type绫诲瀷 return { @@ -529,10 +648,50 @@ }); }, }, + watch:{ + clientHeight: { + handler(newval) { + if(newval>50){ + //鐖跺厓绱犻珮搴�-鎸夐挳楂樺害-鍒嗛〉楂樺害 + this.parentHeight=this.$el.clientHeight-this.$children[0].$children[1].$children[0].$el.clientHeight-this.$children[0].$children[2].$el.clientHeight; + console.log(this.parentHeight) + } + } + }, + }, + mounted() { + this.clientHeight=this.$el.clientHeight; + }, methods: { - buttonClick(id) { - console.log(id) - this.visible = true; + buttonClick(scope, item) { + this.formName = item.name; + + function handleAdd() { + this.visible = true; + } + + function handleEdit() { + this.visible = true; + this.$refs.dynamicForm.form = scope.row; + } + + function handleDelete() { + this.$message.success('鍒犻櫎鎴愬姛锛�'); + } + + const methodHandlers = { + add: handleAdd.bind(this), + edit: handleEdit.bind(this), + delete: handleDelete.bind(this), + }; + + const method = item.paramVOS.buttonMethods; + const handler = methodHandlers[method]; + if (handler) { + handler(); + } else { + this.$message.error('璇烽噸鏂伴厤缃寜閽紒') + } } } } -- Gitblit v1.9.3