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-table.vue | 684 +++++++++++++++++++------------------------------------- 1 files changed, 238 insertions(+), 446 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue index eebd67d..92ee092 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue @@ -1,29 +1,51 @@ <template> - <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid"> - <avue-crud v-model="form" - ref="dataTable" - :data="tableList" - :option="option" - :page.sync="page" - :table-loading="loading" - @selection-change="selectChange"> - <!--top鍖哄煙鎸夐挳--> - <template slot="menuLeft" slot-scope="scope"> - <dynamic-button LocationType="top" type="table":butttonList="componentVO.buttons" :selectList="selectList"></dynamic-button> - </template> + <div :id="'UI-dynamic-'+areasName+componentVO.oid" class="UI-dynamic"> + <avue-crud ref="dataTable" + v-model="form" + :data="tableList" + :option="option" + :page.sync="pageType" + :table-loading="loading" + @on-load="onLoad" + @search-reset="searchReset" + @refresh-change="handleRefresh" + @current-change="currentChange" + @size-change="sizeChange" + @row-click="rowClickChange" + @search-change='searchChange' + @selection-change="selectChange"> + <!--top鍖哄煙鎸夐挳--> + <template slot="menuLeft" slot-scope="scope"> + <dynamic-button :componentVO="componentVO" + :key="areasName+'buttons-'+componentVO.oid" + :butttonList="componentVO.buttons" :dataStore="selectList" LocationType="top" :sourceData="sourceData" + type="table"></dynamic-button> + </template> - <!--menu鍖哄煙鎸夐挳--> - <template slot="menu" slot-scope="scope"> - <dynamic-button :scope="scope" LocationType="menu" type="table":butttonList="componentVO.buttons" :selectList="selectList"></dynamic-button> - </template> - </avue-crud> - </div> + <!--menu鍖哄煙鎸夐挳--> + <template slot="menu" slot-scope="scope"> + <dynamic-button :componentVO="componentVO" :butttonList="componentVO.buttons" :scope="scope" :dataStore="selectList" :sourceData="sourceData" LocationType="menu" + type="table"></dynamic-button> + </template> + </avue-crud> + </div> </template> <script> +import {validatenull} from '@/util/validate' +import {getList} from '@/api/base/ui' + export default { name: "dynamic-table", props: { + //ui涓婁笅鏂囩殑涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� + uiBtmType: { + type: String + }, + //ui涓婁笅鏂� + uiContext:{ + type: String + }, componentVO: { type: Object, default: {} @@ -41,6 +63,10 @@ type: Object, default: {} }, + //涓婁竴鍖哄煙涓氬姟绫诲瀷 + sourceBtmType:{ + type: String + }, paramVOS: { type: Object, default: {} @@ -50,458 +76,77 @@ type: Boolean, default: true }, - dataStore:{ + dataStore: { //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 - type:Array, + type: Array, default: [] }, + tableType: { + type: String + } }, data() { return { - parentHeight:'100%',//褰撳墠缁勪欢鏍硅妭鐐瑰厓绱犻珮搴� + currentDefineVO:this.componentVO.uiComponentType=='table'?this.componentVO.tableDefineVO:this.componentVO.treeTableDefineVO, + parentHeight: '100%',//褰撳墠缁勪欢鏍硅妭鐐瑰厓绱犻珮搴� form: {}, - formName: '', + query:{}, + params:{}, loading: false, - visible: false, page: { pageSize: 10, currentPage: 1, - total: 5, + total: 0, + }, + simplePage: { + currentPage: 1, + total: 0, + pagerCount: 4, + layout: "prev, pager, next" }, //琛ㄦ牸鏁版嵁 - tableList: [ - { - code: "20220102", - lastmodifier: "jhming", - revisionseq: "1", - versionvalue: "1", - description: "", - oid: "2E66D17B-E3E6-4725-BB83-93F4A20D4E20", - versionseq: "1", - content: "绗簩娆′腑鏈熻瘎瀹$姽澶汉", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-01-13 13:58:43.035", - isfirstv: "1", - lastmodifier_name: "濮滅孩鏄�", - revisionoid: "4F400A1B-2313-4B11-894C-4F4F0B01368A", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "1鏈堣瘎瀹�3", - islastr: "1", - lastmodifytime: "2022-07-15 16:04:43.703", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "CF350DE8-8E6D-470B-B273-4FD78D41BA4A", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-07-15 16:04:43.703" - }, - { - code: "w02", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "2f8d94b2-d65a-4f9b-9a71-caa3afd96459", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:35:45.03", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "31612b9f-022d-4b05-a24c-370a0fd457da", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯02", - islastr: "1", - lastmodifytime: "2022-02-18 14:35:45.03", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "dfc0d8a5-ebe7-40f2-af56-fa437d3866e0", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:35:45.03" - }, - { - code: "webt01", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "38033242-3cb4-415c-9cc4-acdb86c2ee8f", - versionseq: "0", - content: "wbtest123淇敼鍚�", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "寰呰瘎瀹�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-01-21 10:04:08.053", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "3f3b2112-f356-4809-969b-1e63f6daa08d", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web绔柊澧炴祴璇�01", - islastr: "1", - lastmodifytime: "2022-02-09 09:45:56.044", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "d8975a06-4c1e-462b-af84-093068c58e9e", - lcstatus: "Waiting", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-09 09:45:56.044" - }, - { - code: "w017", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "4011e1a7-9eb6-4b5c-89bf-847abff56682", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:37:53.247", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "648f5cf8-b42a-4b78-9928-883c94a83081", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯17", - islastr: "1", - lastmodifytime: "2022-02-18 14:37:53.247", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "5d14e204-f085-4be0-9da6-b08c99172f8a", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:37:53.247" - }, - { - code: "w03", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "68583bec-b9ca-4321-8b66-a11d2298f51e", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:35:53.177", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "ff85f436-4dd1-498e-9665-44d53e27ac29", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯03", - islastr: "1", - lastmodifytime: "2022-02-18 14:35:53.177", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "e0f20755-6954-4757-911e-7b9929fbe9a2", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:35:53.177" - }, - { - code: "20220102", - lastmodifier: "jhming", - revisionseq: "1", - versionvalue: "1", - description: "", - oid: "2E66D17B-E3E6-4725-BB83-93F4A20D4E20", - versionseq: "1", - content: "绗簩娆′腑鏈熻瘎瀹$姽澶汉", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-01-13 13:58:43.035", - isfirstv: "1", - lastmodifier_name: "濮滅孩鏄�", - revisionoid: "4F400A1B-2313-4B11-894C-4F4F0B01368A", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "1鏈堣瘎瀹�3", - islastr: "1", - lastmodifytime: "2022-07-15 16:04:43.703", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "CF350DE8-8E6D-470B-B273-4FD78D41BA4A", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-07-15 16:04:43.703" - }, - { - code: "w02", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "2f8d94b2-d65a-4f9b-9a71-caa3afd96459", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:35:45.03", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "31612b9f-022d-4b05-a24c-370a0fd457da", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯02", - islastr: "1", - lastmodifytime: "2022-02-18 14:35:45.03", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "dfc0d8a5-ebe7-40f2-af56-fa437d3866e0", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:35:45.03" - }, - { - code: "webt01", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "38033242-3cb4-415c-9cc4-acdb86c2ee8f", - versionseq: "0", - content: "wbtest123淇敼鍚�", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "寰呰瘎瀹�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-01-21 10:04:08.053", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "3f3b2112-f356-4809-969b-1e63f6daa08d", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web绔柊澧炴祴璇�01", - islastr: "1", - lastmodifytime: "2022-02-09 09:45:56.044", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "d8975a06-4c1e-462b-af84-093068c58e9e", - lcstatus: "Waiting", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-09 09:45:56.044" - }, - { - code: "w017", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "4011e1a7-9eb6-4b5c-89bf-847abff56682", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:37:53.247", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "648f5cf8-b42a-4b78-9928-883c94a83081", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯17", - islastr: "1", - lastmodifytime: "2022-02-18 14:37:53.247", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "5d14e204-f085-4be0-9da6-b08c99172f8a", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:37:53.247" - }, - { - code: "w03", - lastmodifier: "1", - revisionseq: "0", - versionvalue: "1", - description: "", - oid: "68583bec-b9ca-4321-8b66-a11d2298f51e", - versionseq: "0", - content: "", - checkinby: "", - revisionrule: "ObjectVersion", - reviewtypetext: "閮ㄩ棬绾�", - lctid: "ProcessReviewLC", - reviewtype: "department", - lcstatus_text: "缂栬緫涓�", - id: "", - owner: "1", - checkoutby: "", - creator: "1", - createtime: "2022-02-18 14:35:53.177", - isfirstv: "1", - lastmodifier_name: "娴嬭瘯", - revisionoid: "ff85f436-4dd1-498e-9665-44d53e27ac29", - btmname: "processreview", - checkouttime: "", - revisionvalue: "A", - versionrule: "0", - name: "web椤甸潰娴嬭瘯03", - islastr: "1", - lastmodifytime: "2022-02-18 14:35:53.177", - copyfromversion: "", - creator_name: "娴嬭瘯", - nameoid: "e0f20755-6954-4757-911e-7b9929fbe9a2", - lcstatus: "Editing", - islastv: "1", - checkintime: "", - isfirstr: "1", - ts: "2022-02-18 14:35:53.177" - }, - ], + tableList: [], option: { index: true, addBtn: false, editBtn: false, delBtn: false, - selection:true, + selection: true, + tip: false, height: '100%', calcHeight: 15, indexFixed: false, - menuFixed: false, + menuFixed: this.areasName === 'westArea' ? false : 'right', + searchMenuSpan:12, + searchShow:false, column: [], }, - selectList:[] + selectList: [], + columnType: { + text: "input", + combox: "select", + truefalse: "switch", + number: "number", + textarea: "textarea", + datetime: "datetime", + date: "date", + refer: "refer", + }, + sourceDataMapParams:{} } }, computed: { - updatedColumns() { - return this.componentVO.tableDefineVO.cols[0].map(item => { - const typeValue = item.fieldType === 'text' || item.fieldType === 'combox' ? 'input' : item.fieldType; // 琛ㄥ崟Type绫诲瀷 - - return { - align: item.align, - colspan: item.colspan, - prop: item.field, - type: typeValue, - hidden: item.hidden, - label: item.title, - width: item.width, - }; - }); - }, + pageType() { + return this.areasName === 'westArea' ? this.simplePage : this.page; + } }, - watch:{ - parentHeight:{ + watch: { + parentHeight: { handler(newval) { - if(newval >50){ - this.option.height=newval; + if (newval > 50) { + this.option.height = newval; //doLayout涓嶇敓鏁堬紝鎵嬪姩璁剧疆琛ㄦ牸楂樺害 - this.$children[0].$children[1].$children[1].$children[0].$el.style.height=newval+'px'; + this.$children[0].$children[1].$children[1].$children[0].$el.style.height = newval + 'px'; /*this.$nextTick(() => { if (this.$refs.dataTable && this.$refs.dataTable.doLayout) { this.$refs.dataTable.doLayout(); @@ -510,26 +155,173 @@ } } }, - isShow:{ + isShow: { handler(newval) { - if(newval && this.$el.clientHeight>50) { + if (newval && this.$el.clientHeight > 50) { this.parentHeight = this.$el.clientHeight - this.$children[0].$children[1].$children[0].$el.clientHeight - this.$children[0].$children[2].$el.clientHeight - 5; + } + if(newval){ + this.handleRefresh(); + } + } + }, + 'sourceData':{ + handler(newval) { + if(newval) { + this.sourceDataMapParams=this.sourceDataMap(); + this.getParams(); + this.handleRefresh(); } } } }, created() { - this.option.column=this.updatedColumns; + this.getParams(); + this.option.column = this.updatedColumns(); + if (this.componentVO.uiComponentType == 'TreeTable') { + //鏍戣〃 + this.option.rowKey = this.currentDefineVO.treeCurrentField || 'oid'; + this.option.rowParentKey = this.currentDefineVO.treeParentField || 'parentOid' + } + this.page = { + pageSize: this.currentDefineVO.pageVO ? this.currentDefineVO.pageVO.limit : 10, + currentPage: this.currentDefineVO.pageVO ? this.currentDefineVO.pageVO.page : 1, + total: 0, + pageSizes: this.currentDefineVO.limits || [10, 20, 30, 40, 50, 100] + }; }, mounted() { - if(this.$el.clientHeight>50) { + if (this.$el.clientHeight > 50) { //鐖跺厓绱犻珮搴�-鎸夐挳楂樺害-鍒嗛〉楂樺害 this.parentHeight = this.$el.clientHeight - this.$children[0].$children[1].$children[0].$el.clientHeight - this.$children[0].$children[2].$el.clientHeight - 5; } }, methods: { - selectChange(row){ + updatedColumns: function () { + const queryFields = !validatenull(this.currentDefineVO.queryColumns) ? this.currentDefineVO.queryColumns.map(item => item.field) : []; + return this.currentDefineVO.cols[0].map(item => { + const search = queryFields.includes(item.field); // 鍒ゆ柇 field 鏄惁鍦� queryColumns 閲� + if (this.currentDefineVO.btmType == 'fileobject' && item.field == 'name') { + //鏄枃浠� + item.formatter = function (d) { + return '<a class="layui-btn layui-btn-intable" lay-event="PREVIEW">' + d.name + '</a>' + } + } + let formatter = item.formatter || item.templet; + if (typeof formatter == "string" && formatter != '') { + formatter = eval("(" + formatter + ")"); + } + item.type = this.columnType[item.fieldType] || item.fieldType; + return { + ...item, + prop: item.field, + label: item.title, + search: search, + formatter: formatter + }; + }); + }, + 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; + }, + getParams: function () { + const tableParams = { + btmname: this.currentDefineVO.btmType, + btmType:this.currentDefineVO.btmType, + tableDefineId: this.currentDefineVO.id, + componentOid: this.componentVO.oid, + uiDefineId: this.uiContext, + linkTypeFlag: this.currentDefineVO.linkTypeFlag, + treeTableFlag:this.componentVO.uiComponentType == 'TreeTable' + }; + + const sourceDataMapList = this.sourceDataMapParams; + + this.params = Object.assign({},tableParams, sourceDataMapList); + }, + onLoad(page, params = {}) { + if (Object.keys(this.sourceData).length>0 && this.isShow) { + this.loading = true; + getList(page.currentPage, page.pageSize, Object.assign(params,this.params,this.query)).then(res => { + let data = []; + if (res.data && res.data.data) { + data = res.data.data; + this.page.total = res.data.total; + } else { + data = res.data; + this.page.total = res.total; + } + if (!data || data == null) { + data = []; + } + this.tableList = data; + this.loading = false; + this.selectionClear(); + }).catch(error => { + this.$message.error(error); + this.loading = false; + }); + } + }, + rowClickChange(row){ + this.$refs.dataTable.toggleRowSelection(row); + }, + selectChange(row) { this.selectList = row; + this.$emit("setDataStore", { + area: this.areasName, + type:this.componentVO.uiComponentType, + btmType:this.currentDefineVO.btmType, + dataStore:row + }); + }, + currentChange(currentPage) { + this.page.currentPage = currentPage; + }, + sizeChange(pageSize) { + this.page.pageSize = pageSize; + }, + searchChange(params,done){ + this.query = params; + this.page.currentPage = 1; + this.onLoad(this.page); + done(); + }, + searchReset() { + this.query = {}; + this.onLoad(this.page); + }, + selectionClear() { + this.selectionList = []; + this.$refs.dataTable.toggleSelection(); + }, + handleRefresh() { + this.onLoad(this.page, this.query); } } } -- Gitblit v1.9.3