From 5b8030f47d66a13ffe11e26ed3ac4cdd7d85e24f Mon Sep 17 00:00:00 2001
From: wangting <675591594@qq.com>
Date: 星期五, 15 三月 2024 15:35:00 +0800
Subject: [PATCH] UI上下文展示引擎
---
Source/ProjectWeb/src/components/dynamic-components/index.vue | 47 ++++++
Source/ProjectWeb/src/views/base/UIContentVIewer.vue | 142 ++++---------------
Source/ProjectWeb/src/views/base/UIContentArea.vue | 91 +++++++++++++
Source/ProjectWeb/src/views/base/uiDefineVO.js | 138 +++++++++++++++++++
4 files changed, 310 insertions(+), 108 deletions(-)
diff --git a/Source/ProjectWeb/src/components/dynamic-components/index.vue b/Source/ProjectWeb/src/components/dynamic-components/index.vue
new file mode 100644
index 0000000..eeb1065
--- /dev/null
+++ b/Source/ProjectWeb/src/components/dynamic-components/index.vue
@@ -0,0 +1,47 @@
+<template>
+ <div>
+ <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-table>
+ <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-form>
+ <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-tree>
+ <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-custom>
+ </div>
+</template>
+
+<script>
+import dynamicTable from "@/components/dynamic-components/dynamic-table"
+import dynamicForm from "@/components/dynamic-components/dynamic-form"
+import dynamicTree from "@/components/dynamic-components/dynamic-tree"
+import dynamicCustom from "@/components/dynamic-components/dynamic-custom"
+export default {
+ name: "dynamicIndex",
+ components:{dynamicCustom, dynamicTree, dynamicForm, dynamicTable},
+ props:{
+ componentVO:{
+ type:Object,
+ default: {}
+ },
+ inDialog: {
+ type: Boolean,
+ default: false
+ },
+ sourceData:{
+ //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁
+ type:Object,
+ default: {}
+ },
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
+ },
+ paramVOS:{
+ type:Object,
+ default: {}
+ }
+ },
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/Source/ProjectWeb/src/views/base/UIContentArea.vue b/Source/ProjectWeb/src/views/base/UIContentArea.vue
new file mode 100644
index 0000000..24ed6bd
--- /dev/null
+++ b/Source/ProjectWeb/src/views/base/UIContentArea.vue
@@ -0,0 +1,91 @@
+<template>
+ <basic-container :cradStyle="cradStyle">
+ <el-tabs v-if="areasData.length>1" v-model="activeName" type="card" @tab-click="tabHandleClick">
+ <el-tab-pane v-for="(areaItem,index) in areasData" :key="areaItem.oid" :label="areaItem.name" :name="areasName+'-Tab-'+index">
+ <el-collapse v-model="collapseActiveNames" v-if="areaItem.componentVOs.length>1">
+ <el-collapse-item v-for="(componentVO,componentIndex) in areaItem.componentVOs" :name="areasName+'-collapse-'+componentIndex">
+ <template slot="title">
+ {{componentVO.name}}
+ </template>
+ <div class="componentVO" style="height: 60%">
+ <compoent-index :key="componentVO.oid" :componentVO="componentVO" :sourceData="sourceData" :areasName="areasName" :paramVOS="paramVOS"></compoent-index>
+ </div>
+ </el-collapse-item>
+ </el-collapse>
+ <div v-else class="componentVO">
+ <compoent-index :key="areaItem.componentVOs[0].oid" :componentVO="areaItem.componentVOs[0]" :sourceData="sourceData" :areasName="areasName" :paramVOS="paramVOS"></compoent-index>
+ </div>
+ </el-tab-pane>
+ </el-tabs>
+ <div v-else>
+ <el-collapse v-model="collapseActiveNames" v-if="areasData[0].componentVOs.length>1">
+ <el-collapse-item v-for="(componentVO,componentIndex) in areasData[0].componentVOs" :name="areasName+'-collapse-'+componentIndex">
+ <template slot="title">
+ {{componentVO.name}}
+ </template>
+ <div class="componentVO" style="height: 60%">
+ <compoent-index :key="componentVO.oid" :componentVO="componentVO" :sourceData="sourceData" :areasName="areasName" :paramVOS="paramVOS"></compoent-index>
+ </div>
+ </el-collapse-item>
+ </el-collapse>
+ <div v-else class="componentVO">
+ <compoent-index :key="areasData[0].componentVOs[0].oid" :componentVO="areasData[0].componentVOs[0]" :sourceData="sourceData" :areasName="areasName" :paramVOS="paramVOS"></compoent-index>
+ </div>
+ </div>
+ </basic-container>
+</template>
+
+<script>
+import compoentIndex from "@/components/dynamic-components/index"
+export default {
+ name: "UIContentArea",
+ components:{compoentIndex},
+ props:{
+ inDialog: {
+ type: Boolean,
+ default: false
+ },
+ areasName:{
+ type:String,
+ default:''
+ },
+ areasData:{
+ type:Array,
+ default:[]
+ },
+ sourceData:{
+ //鑿滃崟婧愭暟鎹垨鑰呭脊绐楁椂鎸夐挳鎵�灞炲尯鍩熺殑涓婁竴鍖哄煙閫変腑鏁版嵁
+ type:Object,
+ default: {}
+ },
+ dataStore:{
+ //寮圭獥鏃舵寜閽墍灞炲尯鍩熼�変腑鏁版嵁
+ type:Array,
+ default: []
+ },
+ paramVOS:{
+ type:Object,
+ default: {}
+ },
+ cradStyle:''
+ },
+ data(){
+ return{
+ activeName:this.areasName+'-Tab-0',
+ collapseActiveNames:[this.areasName+'-collapse-0']
+ }
+ },
+ mounted() {
+ console.log(this.areasData);
+ },
+ methods:{
+ tabHandleClick(tab, event) {
+ console.log(tab, event);
+ },
+ }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/Source/ProjectWeb/src/views/base/UIContentVIewer.vue b/Source/ProjectWeb/src/views/base/UIContentVIewer.vue
index 55372b6..3bc7c5c 100644
--- a/Source/ProjectWeb/src/views/base/UIContentVIewer.vue
+++ b/Source/ProjectWeb/src/views/base/UIContentVIewer.vue
@@ -2,94 +2,45 @@
<!--UI涓婁笅鏂囩殑灞曠ず鍣�-->
<div style="height:calc(100% - 4px) ">
<el-header v-if="uiDefineVO.northAreas && uiDefineVO.northAreas.length>0">
- <basic-container>
- <el-tabs v-if="uiDefineVO.northAreas.length>1" v-model="northActiveName" type="card" @tab-click="northHandleClick">
- <el-tab-pane v-for="(areaItem,index) in uiDefineVO.northAreas" :key="areaItem.oid" :label="areaItem.name" :name="'northTab'+index">
- <div class="componentVO" v-for="(componentVO,index) in areaItem.componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-custom>
- </div>
- </el-tab-pane>
- </el-tabs>
- <div v-else>
- <div class="componentVO" v-for="(componentVO,index) in uiDefineVO.northAreas[0].componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-custom>
- </div>
- </div>
- </basic-container>
+ <UIContentArea :key="'northArea-'+uiDefineVO.oid" areas-name="northArea"
+ :areasData="uiDefineVO.northAreas"
+ :inDialog="inDialog"
+ :sourceData="sourceData"
+ :dataStore="dataStore"
+ :paramVOS="paramVOS">
+ </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="320px" height="100%">
- <basic-container cradStyle="height:100%">
- <el-tabs v-if="uiDefineVO.westAreas.length>1" v-model="westActiveName" type="card" @tab-click="westHandleClick">
- <el-tab-pane v-for="(areaItem,index) in uiDefineVO.westAreas" :key="areaItem.oid" :label="areaItem.name" :name="'westTab'+index">
- <div class="componentVO" v-for="(componentVO,index) in areaItem.componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-custom>
- </div>
- </el-tab-pane>
- </el-tabs>
- <div v-else>
- <div class="componentVO" v-for="(componentVO,index) in uiDefineVO.westAreas[0].componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="sourceData"></dynamic-custom>
- </div>
- </div>
- </basic-container>
+ <UIContentArea :key="'westArea-'+uiDefineVO.oid" areas-name="westArea"
+ cradStyle="height:100%"
+ :areasData="uiDefineVO.westAreas"
+ :inDialog="inDialog"
+ :sourceData="sourceData"
+ :dataStore="dataStore"
+ :paramVOS="paramVOS">
+ </UIContentArea>
</el-aside>
<el-container>
<el-main v-if="uiDefineVO.centerAreas && uiDefineVO.centerAreas.length>0" style="min-height: calc(100% - 310px)">
- <basic-container cradStyle="height:100%">
- <el-tabs v-if="uiDefineVO.centerAreas.length>1" v-model="centerActiveName" type="card" @tab-click="centerHandleClick">
- <el-tab-pane v-for="(areaItem,index) in uiDefineVO.centerAreas" :key="areaItem.oid" :label="areaItem.name" :name="'centerTab'+index">
- <div class="componentVO" v-for="(componentVO,index) in areaItem.componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-custom>
- </div>
- </el-tab-pane>
- </el-tabs>
- <div v-else>
- <div class="componentVO" v-for="(componentVO,index) in uiDefineVO.centerAreas[0].componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="checkedData.westAreas[0]"></dynamic-custom>
- </div>
- </div>
- </basic-container>
+ <UIContentArea :key="'centerArea-'+uiDefineVO.oid" areas-name="centerArea"
+ cradStyle="height:100%"
+ :areasData="uiDefineVO.centerAreas"
+ :inDialog="inDialog"
+ :sourceData="checkedData.westAreas[0]"
+ :dataStore="checkedData.centerAreas[0]"
+ :paramVOS="paramVOS">
+ </UIContentArea>
</el-main>
<el-footer v-if="uiDefineVO.southAreas && uiDefineVO.southAreas.length>0" height="500px" style="max-height: 300px">
- <basic-container cradStyle="height:100%">
- <el-tabs v-if="uiDefineVO.southAreas.length>1" v-model="southActiveName" type="card" @tab-click="southHandleClick">
- <el-tab-pane v-for="(areaItem,index) in uiDefineVO.southAreas" :key="areaItem.oid" :label="areaItem.name" :name="'southTab'+index">
- <div class="componentVO" v-for="(componentVO,index) in areaItem.componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-custom>
- </div>
- </el-tab-pane>
- </el-tabs>
- <div v-else>
- <div class="componentVO" v-for="(componentVO,index) in uiDefineVO.southAreas[0].componentVOs" >
- <dynamic-table v-if="componentVO.uiComponentType=='table'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-table>
- <dynamic-form v-else-if="componentVO.uiComponentType=='form'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-form>
- <dynamic-tree v-else-if="componentVO.uiComponentType=='tree'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-tree>
- <dynamic-custom v-else-if="componentVO.uiComponentType=='custom'" :componentVO="componentVO" :sourceData="checkedData.centerAreas[0]"></dynamic-custom>
- </div>
- </div>
- </basic-container>
+ <UIContentArea :key="'southArea-'+uiDefineVO.oid" areas-name="southArea"
+ cradStyle="height:100%"
+ :areasData="uiDefineVO.southAreas"
+ :inDialog="inDialog"
+ :sourceData="checkedData.centerAreas[0]"
+ :dataStore="checkedData.southAreas[0]"
+ :paramVOS="paramVOS">
+ </UIContentArea>
</el-footer>
</el-container>
</el-container>
@@ -97,18 +48,12 @@
</template>
<script>
-import dynamicTable from "@/components/dynamic-components/dynamic-table"
-import dynamicForm from "@/components/dynamic-components/dynamic-form"
-import dynamicTree from "@/components/dynamic-components/dynamic-tree"
-import dynamicCustom from "@/components/dynamic-components/dynamic-custom"
-
+import UIContentArea from "@/views/base/UIContentArea"
import {uiDefineVOData} from "@/views/base/uiDefineVO"
-import DynamicForm from "@/components/dynamic-components/dynamic-form";
-import DynamicTree from "@/components/dynamic-components/dynamic-tree";
-import DynamicCustom from "@/components/dynamic-components/dynamic-custom";
export default {
- components:{DynamicCustom, DynamicTree, DynamicForm, dynamicTable},
+ name: "UIContentViewer",
+ components:{UIContentArea},
props:{
inDialog: {
type: Boolean,
@@ -139,10 +84,6 @@
centerAreas:[],
southAreas:[]
},
- northActiveName: 'northTab0',
- westActiveName: 'westTab0',
- centerActiveName: 'centerTab0',
- southActiveName: 'southTab0',
uiDefineVO: uiDefineVOData
}
},
@@ -156,23 +97,8 @@
initUI(){
},
- showContent(){
-
- },
initContent(){
- },
- northHandleClick(tab, event) {
- console.log(tab, event);
- },
- westHandleClick(tab, event) {
- console.log(tab, event);
- },
- centerHandleClick(tab, event) {
- console.log(tab, event);
- },
- southHandleClick(tab, event) {
- console.log(tab, event);
},
}
}
diff --git a/Source/ProjectWeb/src/views/base/uiDefineVO.js b/Source/ProjectWeb/src/views/base/uiDefineVO.js
index c0fbbb9..ed29532 100644
--- a/Source/ProjectWeb/src/views/base/uiDefineVO.js
+++ b/Source/ProjectWeb/src/views/base/uiDefineVO.js
@@ -4517,6 +4517,144 @@
"versionRule": null,
"versionSeq": 0,
"versionValue": null
+ },
+ {
+ "btmname": null,
+ "buttons": [
+ {
+ "actionVO": {
+ "actionCls": "",
+ "actionUsedType": "business",
+ "bsUrl": "null",
+ "createTime": "2014-03-14 15:54:05.000",
+ "creator": "1",
+ "csClass": "plm.uif.actions.client.AddSaveAction",
+ "description": "鍒涘缓淇濆瓨鎸夐挳",
+ "id": "addsave",
+ "lastModifier": "1",
+ "lastModifyTime": "2014-03-14 15:54:05.000",
+ "licensors": null,
+ "name": "鍒涘缓淇濆瓨鎸夐挳",
+ "oid": "2AAFDEE1-B760-A0AD-6C2A-CB2C0C3407A3"
+ },
+ "areaType": "tab",
+ "authorization": true,
+ "children": null,
+ "createTime": "2024-03-15 10:52:57.000",
+ "creator": "developer",
+ "csUrl": "plm.uif.actions.client.AddSaveAction",
+ "description": "",
+ "displayMode": "textandimage",
+ "hidden": false,
+ "iconPath": "",
+ "id": "addsave",
+ "lastModifier": "developer",
+ "lastModifyTime": "2024-03-15 10:52:57.000",
+ "name": "鏂板",
+ "oid": "A974C16B-4751-6365-8756-C11B74AA1C53",
+ "orderNum": 1,
+ "paramVOS": {
+ "type": "folder"
+ },
+ "pkComponent": "0BA77BDF-7023-AE81-4EAC-7396C56FA7C9",
+ "pkParentOid": "",
+ "url": "null"
+ },
+ {
+ "actionVO": {
+ "actionCls": "",
+ "actionUsedType": "business",
+ "bsUrl": "null",
+ "createTime": "2014-03-14 15:54:05.000",
+ "creator": "1",
+ "csClass": "plm.uif.actions.client.AddSaveAction",
+ "description": "鍒涘缓淇濆瓨鎸夐挳",
+ "id": "addsave",
+ "lastModifier": "1",
+ "lastModifyTime": "2014-03-14 15:54:05.000",
+ "licensors": null,
+ "name": "鍒涘缓淇濆瓨鎸夐挳",
+ "oid": "2AAFDEE1-B760-A0AD-6C2A-CB2C0C3407A3"
+ },
+ "areaType": "tab",
+ "authorization": true,
+ "children": null,
+ "createTime": "2024-03-15 10:52:57.000",
+ "creator": "developer",
+ "csUrl": "plm.uif.actions.client.AddSaveAction",
+ "description": "",
+ "displayMode": "textandimage",
+ "hidden": false,
+ "iconPath": "",
+ "id": "addsave",
+ "lastModifier": "developer",
+ "lastModifyTime": "2024-03-15 10:52:57.000",
+ "name": "鏂板",
+ "oid": "A974C16B-4751-6365-8756-C11B74AA1C53",
+ "orderNum": 1,
+ "paramVOS": {
+ "type": "folder"
+ },
+ "pkComponent": "0BA77BDF-7023-AE81-4EAC-7396C56FA7C9",
+ "pkParentOid": "",
+ "url": "null"
+ }
+ ],
+ "checkInBy": null,
+ "checkInTime": null,
+ "checkOutBy": null,
+ "checkOutTime": null,
+ "copyFromVersion": null,
+ "createTime": null,
+ "creator": null,
+ "customClass": null,
+ "data": null,
+ "description": "",
+ "extendAttr": "",
+ "firstR": null,
+ "firstV": null,
+ "formDefineVO": null,
+ "id": null,
+ "lastModifier": null,
+ "lastModifyTime": null,
+ "lastR": null,
+ "lastV": null,
+ "lcStatus": null,
+ "lcStatusText": null,
+ "lctid": null,
+ "name": "宸ヨ壓璇勫鏍�",
+ "nameOid": null,
+ "oid": "0BA77BDF-7023-AE81-4EAC-7396C56FA7C9",
+ "orderNum": 2,
+ "owner": null,
+ "pkLayout": "E28B0555-FAF3-4F59-0EE8-64A30A77C9CB",
+ "revisionOid": null,
+ "revisionRule": null,
+ "revisionSeq": 0,
+ "revisionValue": null,
+ "secretGrade": null,
+ "secretGradeText": null,
+ "tableDefineVO": null,
+ "treeDefineVO": {
+ "btmType": "folder",
+ "fieldSep": ",",
+ "linkType": "",
+ "loadType": "node",
+ "orientation": true,
+ "queryTemplateName": "cardtemplateflodertree",
+ "rootContent": "id",
+ "showImage": false,
+ "showLinkAbs": "affiliatedfolder,material",
+ "treeNodeExpression": "name"
+ },
+ "treeTableDefineVO": null,
+ "ts": null,
+ "uiComponentType": "tree",
+ "uiComponentTypeText": "鏍�",
+ "uiParseClass": "",
+ "versionRule": null,
+ "versionSeq": 0,
+ "versionValue": null
}
],
"copyFromVersion": null,
--
Gitblit v1.9.3