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/views/base/UIContentViewer.vue | 181 +++++++++++++++++++++++++++----------------- 1 files changed, 111 insertions(+), 70 deletions(-) diff --git a/Source/ProjectWeb/src/views/base/UIContentViewer.vue b/Source/ProjectWeb/src/views/base/UIContentViewer.vue index f110aa5..8279a53 100644 --- a/Source/ProjectWeb/src/views/base/UIContentViewer.vue +++ b/Source/ProjectWeb/src/views/base/UIContentViewer.vue @@ -1,45 +1,65 @@ <template> <!--UI涓婁笅鏂囩殑灞曠ず鍣�--> - <div style="height:calc(100% - 4px) "> + <div style="height:calc(100% - 4px);min-width:1200px" > <el-header v-if="uiDefineVO.northAreas && uiDefineVO.northAreas.length>0"> - <UIContentArea :key="'northArea-'+uiDefineVO.oid" areas-name="northArea" + <UIContentArea :key="'northArea-'+uiDefineVO.oid" + :uiBtmType="btmType" + :uiContext="context" :areasData="uiDefineVO.northAreas" + :dataStore="checkedData.northArea.data" :inDialog="inDialog" :sourceData="sourceData" - :dataStore="dataStore" - :paramVOS="paramVOS"> + :sourceBtmType="btmType" + areas-name="northArea" + @setDataStore="setDataStore"> </UIContentArea> </el-header> - <el-container :style="'height: '+(uiDefineVO.northAreas && uiDefineVO.northAreas.length>0?'calc(100% - 70px)':'100%')"> - <el-aside v-if="uiDefineVO.westAreas && uiDefineVO.westAreas.length>0" :width="uiDefineVO.westAreas[0].componentVOs[0].uiComponentType=='table'?'400px':'320px'" height="100%"> - <UIContentArea :key="'westArea-'+uiDefineVO.oid" areas-name="westArea" - cradStyle="" + <el-container + :style="'height: '+(uiDefineVO.northAreas && uiDefineVO.northAreas.length>0?'calc(100% - 70px)':'100%')"> + <el-aside v-if="uiDefineVO.westAreas && uiDefineVO.westAreas.length>0" + :width="uiDefineVO.westAreas[0].componentVOs[0].uiComponentType=='table' || uiDefineVO.westAreas[0].componentVOs[0].uiComponentType=='TreeTable'?'420px':'320px'" + height="100%"> + <UIContentArea :key="'westArea-'+uiDefineVO.oid" + :uiBtmType="btmType" + :uiContext="context" :areasData="uiDefineVO.westAreas" + :dataStore="checkedData.westArea.data" :inDialog="inDialog" :sourceData="sourceData" - :dataStore="dataStore" - :paramVOS="paramVOS"> + :sourceBtmType="btmType" + areas-name="westArea" + cradStyle="" + @setDataStore="setDataStore"> </UIContentArea> </el-aside> - <el-container style="height: 100%"> - <el-main v-if="uiDefineVO.centerAreas && uiDefineVO.centerAreas.length>0" :style="'height: '+centerHeight"> - <UIContentArea :key="'centerArea-'+uiDefineVO.oid" areas-name="centerArea" - cradStyle="" + <el-container style="height: 100%;display: block"> + <el-main v-if="uiDefineVO.centerAreas && uiDefineVO.centerAreas.length>0" :style="'min-height: 300px;height: '+centerHeight"> + <UIContentArea :key="'centerArea-'+uiDefineVO.oid" + :uiBtmType="btmType" + :uiContext="context" :areasData="uiDefineVO.centerAreas" + :dataStore="checkedData.centerArea.data" :inDialog="inDialog" - :sourceData="checkedData.westAreas[0]" - :dataStore="checkedData.centerAreas[0]" - :paramVOS="paramVOS"> + :sourceData="checkedData.westArea.data[checkedData.westArea.data.length-1]" + :sourceBtmType="checkedData.westArea.DefineVOBtmType" + areas-name="centerArea" + cradStyle="" + @setDataStore="setDataStore"> </UIContentArea> </el-main> - <el-footer v-if="uiDefineVO.southAreas && uiDefineVO.southAreas.length>0" height="300px" style="max-height: 300px"> - <UIContentArea :key="'southArea-'+uiDefineVO.oid" areas-name="southArea" - cradStyle="" + <el-footer v-if="uiDefineVO.southAreas && uiDefineVO.southAreas.length>0" height="35%" + style="min-height: 150px;"> + <UIContentArea :key="'southArea-'+uiDefineVO.oid" + :uiBtmType="btmType" + :uiContext="context" :areasData="uiDefineVO.southAreas" + :dataStore="checkedData.southArea.data" :inDialog="inDialog" - :sourceData="checkedData.centerAreas[0]" - :dataStore="checkedData.southAreas[0]" - :paramVOS="paramVOS"> + :sourceData="checkedData.centerArea.data[checkedData.centerArea.data.length-1]" + :sourceBtmType="checkedData.centerArea.DefineVOBtmType" + areas-name="southArea" + cradStyle="" + @setDataStore="setDataStore"> </UIContentArea> </el-footer> </el-container> @@ -48,78 +68,99 @@ </template> <script> +import {verifyNull} from "@/util/validate"; import UIContentArea from "@/views/base/UIContentArea" -import {uiDefineVOData} from "@/views/base/uiDefineVO" +import {getUIContext} from '@/api/base/ui' export default { name: "UIContentViewer", - components:{UIContentArea}, - props:{ - inDialog: { - type: Boolean, - default: false - }, - sourceData:{ - //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁 - type:Object, - default: {} - }, - dataStore:{ - //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁 - type:Array, - default: [] - }, - paramVOS:{ - type:Object, - default: {} - } - }, + components: {UIContentArea}, data() { return { - btmType:'',//涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� - content:'',//UI涓婁笅鏂囩殑鍚嶇О - checkedData:{ + btmType: '',//涓氬姟绫诲瀷锛堟垨閾炬帴绫诲瀷锛� + context: '',//UI涓婁笅鏂囩殑鍚嶇О + checkedData: { //鍚勫尯鍩熼�変腑鏁版嵁 - westAreas:[], - centerAreas:[], - southAreas:[] + northArea: { + DefineVOBtmType:'', + data:[{}] + }, + westArea: { + DefineVOBtmType:'', + data:[{}] + }, + centerArea: { + DefineVOBtmType:'', + data:[{}] + }, + southArea: { + DefineVOBtmType:'', + data:[{}] + } }, - uiDefineVO: uiDefineVOData, - centerHeight:'100%' + uiDefineVO: {}, + centerHeight: '100%', + inDialog: false, + //鑿滃崟婧愭暟鎹� + sourceData: {}, } }, watch: { - - }, - computed: { - - }, - created() { - if (this.uiDefineVO.southAreas && this.uiDefineVO.southAreas.length > 0) { - this.centerHeight = 'calc(100% - 310px)'; - } else { - this.centerHeight = '100%'; + $route(to, from) { + this.getTheParameters() + this.initUI(); } }, + computed: { + typeAndContext(){ + return this.btmType+this.context; + } + }, + created() { + if (verifyNull(this.$route.query.type) || (verifyNull(this.$route.query.context) && verifyNull(this.$route.query.content))) { + this.$message.error("閰嶇疆鐨勪俊鎭敊璇紝璇峰弬鑰冣��?type=xxx&context=yyy¶m=zzz鈥濊繖绉嶅舰寮忋�傚叾涓璽ype鏄笟鍔$被鍨嬶紙鎴栭摼鎺ョ被鍨嬶級锛宑ontext鏄疷I涓婁笅鏂囩殑鍚嶇О"); + return false; + } + this.getTheParameters() + this.initUI(); + }, methods: { - initUI(){ - + getTheParameters(){ + this.btmType = this.$route.query.type; + this.context = this.$route.query.context || this.$route.query.content; + this.sourceData = this.$route.query; }, - initContent(){ - + initUI() { + getUIContext({btmType: this.btmType, id: this.context}).then(res => { + this.uiDefineVO = res.data.obj; + this.initContext(); + }) }, + initContext() { + if (this.uiDefineVO.southAreas && this.uiDefineVO.southAreas.length > 0) { + this.centerHeight = '65%'; + } else { + this.centerHeight = '100%'; + } + }, + setDataStore(value) { + this.checkedData[value.area].DefineVOBtmType = value.btmType; + this.checkedData[value.area].data = value.dataStore; + } } } </script> <style scoped> -.el-container{ +.el-container { padding: 0 !important; } -.el-header,.el-aside,.el-main,.el-footer{ + +.el-header, .el-aside, .el-main, .el-footer { padding: 0; } -.el-header{ + +.el-header { margin-bottom: 10px; } </style> -- Gitblit v1.9.3