From 0c38987f747be590af21e3d4c9700401c04fc347 Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期二, 16 四月 2024 17:04:31 +0800 Subject: [PATCH] 显示表达式 --- Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue | 217 +++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 212 insertions(+), 5 deletions(-) diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue index 7cfdbd4..a7f9024 100644 --- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue +++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue @@ -1,13 +1,45 @@ <template> - <div> - + <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid"> + <dynamic-button v-if="componentVO.buttons && componentVO.buttons.length>0" :componentVO="componentVO" + :butttonList="componentVO.buttons" :dataStore="checkDatas" + :sourceData="sourceData" type="tree" style="margin-bottom: 5px;"></dynamic-button> + <el-input + placeholder="杈撳叆鍏抽敭瀛楄繘琛岃繃婊�" + v-model="filterText"> + </el-input> + <el-tree + class="filter-tree" + :show-checkbox="isMuti" + :check-on-click-node="true" + :lazy="lazy" + :data="data" + :load="loadNode" + :props="defaultProps" + :filter-node-method="filterNode" + highlight-current + node-key="oid" + @check="checkNode" + @current-change="changeNode" + ref="tree"> + </el-tree> </div> </template> <script> +import {getList, getTree} from '@/api/base/ui' +import {validatenull} from "@/util/validate"; + export default { name: "dynamic-tree", props:{ + //ui涓婁笅鏂囩殑涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� + uiBtmType: { + type: String + }, + //ui涓婁笅鏂� + uiContext:{ + type: String + }, componentVO:{ type:Object, default: {} @@ -25,17 +57,192 @@ type:Object, default: {} }, + //涓婁竴鍖哄煙涓氬姟绫诲瀷 + sourceBtmType:{ + type: String + }, + dataStore:{ + //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 + type:Array, + default: [] + }, paramVOS:{ type:Object, default: {} + }, + isShow: { + //鎵�鍦ㄥ尯鍩熸槸鍚﹀凡鏄剧ず锛岄拡瀵箃ab鍜宑ollapse + type: Boolean, + default: true + }, + }, + watch: { + filterText(val) { + this.$refs.tree.filter(val); + }, + isShow:{ + handler(newval) { + if(newval) { + //console.log(this.$el.clientHeight) + } + } + }, + checkDatas:{ + handler(newval) { + if(newval) { + this.$emit("setDataStore", { + area: this.areasName, + type:this.componentVO.uiComponentType, + btmType:this.componentVO.treeDefineVO.btmType, + dataStore:newval + }); + } + } + }, + sourceData:{ + handler(newval) { + //婧愭暟鎹湁鍙樺寲鏃跺彉鏇村綋鍓嶅尯鍩熸暟鎹� + this.sourceDataMapParams=this.sourceDataMap(); + this.getParams(); + this.handleRefresh(); + } } }, data() { - return {} - } + return { + filterText: '', + defaultProps: { + children: 'children', + label: 'text' + }, + lazy:this.componentVO.treeDefineVO.loadType == 'node', + isMuti:false, + data:[], + checkDatas:[], + params:{}, + sourceDataMapParams:{} + } + }, + created() { + this.getParams(); + if(!this.lazy){ + this.initData(); + } + }, + mounted() { + if(this.componentVO.buttons && this.componentVO.buttons.length>0){ + this.$children[2].$el.style.height = 'calc(100% - 50px - '+this.$children[0].$el.clientHeight+'px - 10px)'; + } + }, + methods: { + filterNode(value, data) { + if (!value) return true; + return data[this.defaultProps.label].indexOf(value) !== -1; + }, + 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 () { + let parentFieldName = ""; + if(this.componentVO.treeDefineVO.showLinkAbs){ + parentFieldName = this.componentVO.treeDefineVO.showLinkAbs.split(",")[0]; + } + const treeParams={ + queryAllLevel:!this.lazy, + loadType:this.componentVO.treeDefineVO.loadType, + multipleSelect:this.isMuti, + isMuti: this.isMuti, + isQueryAllColumn: true, + btmname: this.componentVO.treeDefineVO.btmType, + componentOid:this.componentVO.oid, + uiDefineId:this.uiContext, + valueField:this.componentVO.treeDefineVO.valueField || 'oid', + parentFieldName:parentFieldName, + textField:this.componentVO.treeDefineVO.treeNodeExpression, + queryTemplate: this.sourceData.querytemplate, + linkTypeFlag: validatenull(this.sourceData.queryType)?(validatenull(this.sourceData.linkType)?false:true):(this.sourceData.queryType==0?false:true), + rootExpress:this.componentVO.treeDefineVO.rootExpress + } + const sourceDataMapList = this.sourceDataMapParams; + + this.params = Object.assign({},treeParams, sourceDataMapList); + }, + initData() { + if (Object.keys(this.sourceData).length > 0 && this.isShow) { + getTree(null,null,Object.assign({ + queryRoot: true + }, this.params)).then(res => { + this.data = res.data.treeData; + this.checkDatas = []; + }).catch(error => { + this.$message.error(error); + }) + } + }, + loadNode(node, resolve) { + //閫愮骇鍔犺浇 + let parentOid = (node.level === 0) ? 0 : node.data.oid; + if (parentOid!=0 && parentOid.indexOf('@vcitreesep@') > -1) { + parentOid= parentOid.split('@vcitreesep@')[1]; + } + const parentBtmName = (node.level === 0) ? '' : node.data.attributes.btmname; + let params=this.params; + if(parentOid===0){ + //params.queryRoot=true; + } + getTree(parentOid,parentBtmName,this.params).then(res => { + resolve(res.data.treeData) + }).catch(error => { + this.$message.error(error); + }) + }, + checkNode(checkedNode, checkedData){ + if (this.isMuti) { + this.checkDatas=checkedData.checkedNodes; + } + }, + changeNode(data,node) { + if (!this.isMuti) { + this.checkDatas=[data]; + } + }, + handleRefresh(){ + this.initData(); + } + }, } </script> <style scoped> - +.filter-tree{ + height: calc(100% - 50px); + overflow: auto; + box-sizing: border-box; + padding-top: 10px; +} </style> -- Gitblit v1.9.3