From 353efff194122e281925a390be5d576c2f4fff6d Mon Sep 17 00:00:00 2001
From: wangting <675591594@qq.com>
Date: 星期三, 27 三月 2024 18:04:04 +0800
Subject: [PATCH] UI上下文展示引擎
---
Source/ProjectWeb/src/views/base/UIContentViewerInDialog.vue | 53 +++++++-----
Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue | 16 +++
Source/ProjectWeb/src/components/dynamic-components/index.vue | 21 +++++
Source/ProjectWeb/src/views/base/UIContentArea.vue | 12 +++
Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue | 12 ++
Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue | 17 +++
Source/ProjectWeb/src/views/base/UIContentViewer.vue | 39 +++++----
Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue | 15 ++-
Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue | 16 +++
9 files changed, 152 insertions(+), 49 deletions(-)
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
index 5ab9176..92a07cb 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-TreeTable.vue
@@ -367,6 +367,12 @@
this.parentHeight = this.$el.clientHeight - this.$children[0].$children[1].$children[0].$el.clientHeight - this.$children[0].$children[2].$el.clientHeight - 5;
}
}
+ },
+ sourceData:{
+ handler(newval) {
+ console.log(this.areasName);
+ console.log(newval);
+ }
}
},
mounted() {
@@ -377,12 +383,16 @@
},
computed: {
pageType() {
- return this.areasName === 'westArea' ? this.simplePage : this.page;
+ return this.areasName.indexOf('westArea') == 0 ? this.simplePage : this.page;
}
},
methods: {
TreeSelectChange(row) {
this.TreeSelectList = row;
+ this.$emit("setDataStore", {
+ area: this.areasName,
+ dataStore:row
+ });
},
}
}
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue
index 40c33d6..5d85586 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-custom.vue
@@ -3,10 +3,11 @@
<div v-if="isError" style="color: #F56C6C">杩欎釜鑷畾涔夐〉闈㈢殑鍦板潃鏍煎紡涓嶆纭�傛帹鑽愪娇鐢║I:type#content?param=xxx杩欑褰㈠紡</div>
<component v-else :is="currentComponent"
:customOptions="customOptions"
- :inDialog="inDialog"
+ :inDialog="true"
:key="areasName+'customCom-'+componentVO.oid"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"></component>
</div>
@@ -38,6 +39,11 @@
type:Object,
default: {}
},
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
+ },
paramVOS:{
type:Object,
default: {}
@@ -56,6 +62,14 @@
currentComponent: 'UI',//缁勪欢name
}
},
+ watch:{
+ sourceData:{
+ handler(newval) {
+ console.log(this.areasName);
+ console.log(newval);
+ }
+ }
+ },
computed:{
customOptions() {
if(this.customClass.indexOf(":") <0){
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue
index 15682f8..9ec835c 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-form.vue
@@ -38,10 +38,15 @@
type: String,
default: ''
},
- sourceData: {
+ sourceData:{
//鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁
- type: Object,
+ type:Object,
default: {}
+ },
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
},
paramVOS: {
type: Object,
@@ -73,6 +78,14 @@
return this.getColumnData(0)
}
},
+ watch:{
+ sourceData:{
+ handler(newval) {
+ console.log(this.areasName);
+ console.log(newval);
+ }
+ }
+ },
methods: {
//杞寲鏁版嵁
formColumn(formList) {
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue
index dbfec95..2bdc3df 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-table.vue
@@ -513,7 +513,7 @@
});
},
pageType() {
- return this.areasName === 'westArea' ? this.simplePage : this.page;
+ return this.areasName.indexOf('westArea') == 0 ? this.simplePage : this.page;
}
},
watch: {
@@ -537,6 +537,12 @@
this.parentHeight = this.$el.clientHeight - this.$children[0].$children[1].$children[0].$el.clientHeight - this.$children[0].$children[2].$el.clientHeight - 5;
}
}
+ },
+ sourceData:{
+ handler(newval) {
+ console.log(this.areasName);
+ console.log(newval);
+ }
}
},
created() {
@@ -551,9 +557,10 @@
methods: {
selectChange(row) {
this.selectList = row;
- },
- TreeSelectChange(row) {
- this.TreeSelectList = row;
+ this.$emit("setDataStore", {
+ area: this.areasName,
+ dataStore:row
+ });
}
}
}
diff --git a/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue b/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue
index 0e0d322..4669c6e 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/dynamic-tree.vue
@@ -42,6 +42,11 @@
type:Object,
default: {}
},
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
+ },
paramVOS:{
type:Object,
default: {}
@@ -66,9 +71,18 @@
checkDatas:{
handler(newval) {
if(newval) {
- console.log(newval)
+ this.$emit("setDataStore", {
+ area: this.areasName,
+ dataStore:newval
+ });
}
}
+ },
+ sourceData:{
+ handler(newval) {
+ console.log(this.areasName);
+ console.log(newval);
+ }
}
},
data() {
diff --git a/Source/ProjectWeb/src/components/dynamic-components/index.vue b/Source/ProjectWeb/src/components/dynamic-components/index.vue
index 10ed89e..f13ad1d 100644
--- a/Source/ProjectWeb/src/components/dynamic-components/index.vue
+++ b/Source/ProjectWeb/src/components/dynamic-components/index.vue
@@ -4,8 +4,10 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="isShow">
</dynamic-table>
@@ -14,8 +16,10 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="isShow">
</dynamicTreeTable>
@@ -24,8 +28,10 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="isShow">
</dynamic-form>
@@ -34,16 +40,20 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="isShow">
</dynamic-tree>
<dynamic-custom v-else-if="componentVO.uiComponentType=='customer'" :inDialog="inDialog"
:key="areasName+'custom-'+componentVO.oid"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="isShow">
</dynamic-custom>
@@ -76,6 +86,11 @@
type:Object,
default: {}
},
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
+ },
paramVOS:{
type:Object,
default: {}
@@ -87,6 +102,12 @@
},
},
created() {
+ },
+ methods:{
+ setDataStore(value) {
+ this.$emit("setDataStore", value);
+ this.dataStore = value.dataStore;
+ }
}
}
</script>
diff --git a/Source/ProjectWeb/src/views/base/UIContentArea.vue b/Source/ProjectWeb/src/views/base/UIContentArea.vue
index b850356..3a368ff 100644
--- a/Source/ProjectWeb/src/views/base/UIContentArea.vue
+++ b/Source/ProjectWeb/src/views/base/UIContentArea.vue
@@ -12,8 +12,10 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index>
</div>
</el-collapse-item>
@@ -23,8 +25,10 @@
:inDialog="inDialog"
:componentVO="areaItem.componentVOs[0]"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="activeName==(areasName+'-Tab-'+index)?true:false"></compoent-index>
</div>
</el-tab-pane>
@@ -40,8 +44,10 @@
:inDialog="inDialog"
:componentVO="componentVO"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="collapseActiveNames.indexOf(areasName+'-collapse-'+componentIndex)!=-1?true:false"></compoent-index>
</div>
</el-collapse-item>
@@ -51,8 +57,10 @@
:inDialog="inDialog"
:componentVO="areasData[0].componentVOs[0]"
:sourceData="sourceData"
+ :dataStore="dataStore"
:areasName="areasName"
:paramVOS="paramVOS"
+ @setDataStore="setDataStore"
:isShow="true"></compoent-index>
</div>
</div>
@@ -108,6 +116,10 @@
},
handleChange(val) {
//console.log(val);
+ },
+ setDataStore(value) {
+ this.$emit("setDataStore", value);
+ this.dataStore = value.dataStore;
}
}
}
diff --git a/Source/ProjectWeb/src/views/base/UIContentViewer.vue b/Source/ProjectWeb/src/views/base/UIContentViewer.vue
index a6ab10d..1e3ee6d 100644
--- a/Source/ProjectWeb/src/views/base/UIContentViewer.vue
+++ b/Source/ProjectWeb/src/views/base/UIContentViewer.vue
@@ -6,8 +6,9 @@
:areasData="uiDefineVO.northAreas"
:inDialog="inDialog"
:sourceData="sourceData"
- :dataStore="dataStore"
- :paramVOS="paramVOS">
+ :dataStore="checkedData.northArea[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-header>
<el-container :style="'height: '+(uiDefineVO.northAreas && uiDefineVO.northAreas.length>0?'calc(100% - 70px)':'100%')">
@@ -17,8 +18,9 @@
:areasData="uiDefineVO.westAreas"
:inDialog="inDialog"
:sourceData="sourceData"
- :dataStore="dataStore"
- :paramVOS="paramVOS">
+ :dataStore="checkedData.westArea[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-aside>
<el-container style="height: 100%">
@@ -27,9 +29,10 @@
cradStyle=""
:areasData="uiDefineVO.centerAreas"
:inDialog="inDialog"
- :sourceData="checkedData.westAreas[0]"
- :dataStore="checkedData.centerAreas[0]"
- :paramVOS="paramVOS">
+ :sourceData="checkedData.westArea[0]"
+ :dataStore="checkedData.centerArea[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-main>
<el-footer v-if="uiDefineVO.southAreas && uiDefineVO.southAreas.length>0" height="35%" style="max-height: 300px">
@@ -37,9 +40,10 @@
cradStyle=""
:areasData="uiDefineVO.southAreas"
:inDialog="inDialog"
- :sourceData="checkedData.centerAreas[0]"
- :dataStore="checkedData.southAreas[0]"
- :paramVOS="paramVOS">
+ :sourceData="checkedData.centerArea[0]"
+ :dataStore="checkedData.southArea[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-footer>
</el-container>
@@ -64,11 +68,6 @@
type:Object,
default: {}
},
- dataStore:{
- //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
- type:Array,
- default: []
- },
paramVOS:{
type:Object,
default: {}
@@ -80,9 +79,10 @@
content:'',//UI涓婁笅鏂囩殑鍚嶇О
checkedData:{
//鍚勫尯鍩熼�変腑鏁版嵁
- westAreas:[],
- centerAreas:[],
- southAreas:[]
+ northArea:[],
+ westArea:[],
+ centerArea:[],
+ southArea:[]
},
uiDefineVO: uiDefineVOData,
centerHeight:'100%'
@@ -108,6 +108,9 @@
initContent(){
},
+ setDataStore(value) {
+ this.checkedData[value.area] = value.dataStore;
+ }
}
}
</script>
diff --git a/Source/ProjectWeb/src/views/base/UIContentViewerInDialog.vue b/Source/ProjectWeb/src/views/base/UIContentViewerInDialog.vue
index 54cb510..af3363a 100644
--- a/Source/ProjectWeb/src/views/base/UIContentViewerInDialog.vue
+++ b/Source/ProjectWeb/src/views/base/UIContentViewerInDialog.vue
@@ -1,44 +1,49 @@
<template>
<!--UI涓婁笅鏂囩殑灞曠ず鍣�-->
- <div style="height:calc(100% - 4px);min-width:800px">
+ <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" areas-name="northAreaInDialog"
:areasData="uiDefineVO.northAreas"
:inDialog="inDialog"
:sourceData="sourceData"
- :dataStore="dataStore"
- :paramVOS="paramVOS">
+ :dataStore="checkedData.northAreaInDialog[0]"
+ :paramVOS="paramVOS"
+ @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' || uiDefineVO.westAreas[0].componentVOs[0].uiComponentType=='TreeTable'?'420px':'320px'" height="100%">
- <UIContentArea :key="'westArea-'+uiDefineVO.oid" areas-name="westArea"
+ <UIContentArea :key="'westArea-'+uiDefineVO.oid" areas-name="westAreaInDialog"
cradStyle=""
:areasData="uiDefineVO.westAreas"
:inDialog="inDialog"
:sourceData="sourceData"
- :dataStore="dataStore"
- :paramVOS="paramVOS">
+ :dataStore="checkedData.westAreaInDialog[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-aside>
<el-container style="height: 100%">
<el-main v-if="uiDefineVO.centerAreas && uiDefineVO.centerAreas.length>0" :style="'height: '+centerHeight">
- <u-i-content-area :key="'centerArea-'+uiDefineVO.oid" areas-name="centerArea"
- cradStyle=""
- :areasData="uiDefineVO.centerAreas"
- :inDialog="inDialog"
- :sourceData="checkedData.westAreas[0]"
- :dataStore="checkedData.centerAreas[0]"
- :paramVOS="paramVOS"></u-i-content-area>
+ <UIContentArea :key="'centerArea-'+uiDefineVO.oid" areas-name="centerAreaInDialog"
+ cradStyle=""
+ :areasData="uiDefineVO.centerAreas"
+ :inDialog="inDialog"
+ :sourceData="checkedData.westAreaInDialog[0]"
+ :dataStore="checkedData.centerAreaInDialog[0]"
+ :paramVOS="paramVOS"
+ @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"
+ <el-footer v-if="uiDefineVO.southAreas && uiDefineVO.southAreas.length>0" height="35%" style="max-height: 300px">
+ <UIContentArea :key="'southArea-'+uiDefineVO.oid" areas-name="southAreaInDialog"
cradStyle=""
:areasData="uiDefineVO.southAreas"
:inDialog="inDialog"
- :sourceData="checkedData.centerAreas[0]"
- :dataStore="checkedData.southAreas[0]"
- :paramVOS="paramVOS">
+ :sourceData="checkedData.centerAreaInDialog[0]"
+ :dataStore="checkedData.southAreaInDialog[0]"
+ :paramVOS="paramVOS"
+ @setDataStore="setDataStore">
</UIContentArea>
</el-footer>
</el-container>
@@ -83,9 +88,10 @@
content:this.customOptions.content,//UI涓婁笅鏂囩殑鍚嶇О
checkedData:{
//鍚勫尯鍩熼�変腑鏁版嵁
- westAreas:[],
- centerAreas:[],
- southAreas:[]
+ northAreaInDialog:[],
+ westAreaInDialog:[],
+ centerAreaInDialog:[],
+ southAreaInDialog:[]
},
uiDefineVO: uiDefineVOData,
centerHeight:'100%'
@@ -111,6 +117,9 @@
initContent(){
},
+ setDataStore(value) {
+ this.checkedData[value.area] = value.dataStore;
+ }
}
}
</script>
--
Gitblit v1.9.3