1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
| <template>
| <div class="UI-dynamic" :id="'UI-dynamic-'+areasName+componentVO.oid">
| <u-i-content-viewer-in-dialog
| :btmType="btmType"
| :context="context"
| :inDialog="true"
| :key="areasName+'customCom-'+componentVO.oid"
| :componentVO="componentVO"
| :sourceData="sourceData"
| :dataStore="dataStore"
| :areasName="areasName"
| :paramVOS="urlParams"
| @setData="setData"
| @setDataStore="setDataStore">
| </u-i-content-viewer-in-dialog>
| </div>
| </template>
|
| <script>
| import {queryStringToObject} from '@/util/util'
| import UIContentViewerInDialog from "@/views/base/UIContentViewerInDialog";
| export default {
| name: "dynamic-uiParse",
| components: {UIContentViewerInDialog},
| props: {
| //ui上下文的业务类型（或链接类型）
| uiBtmType: {
| type: String
| },
| //ui上下文
| uiContext:{
| type: String
| },
| componentVO: {
| type: Object,
| default: {}
| },
| inDialog: {
| type: Boolean,
| default: false
| },
| canEdit:{
| //内容是否可编辑
| type:Boolean,
| default:false
| },
| areasName: {
| type: String,
| default: ''
| },
| sourceData: {
| //所属区域的上一区域选中数据
| type: Object,
| default: {}
| },
| dataStore: {
| //弹窗时按钮所属区域选中数据
| type: Array,
| default: []
| },
| paramVOS: {
| type: Object,
| default: {}
| },
| isShow: {
| //所在区域是否已显示，针对tab和collapse
| type: Boolean,
| default: true
| },
| },
| data() {
| return {
| btmType: '',
| context: '',
| urlParams: {},
| height: '300px',
| uiParseClass: '', //?type=xxx&context=yyy¶m=zzz
| isError: false, //路径解析失败
| ComponentUrl:'base/UIContentViewerInDialog',
| currentComponent: null
| }
| },
| watch: {
| sourceData:{
| handler(newval) {
| //源数据有变化时变更当前区域数据
| this.sourceDataMap();
| },
| deep: true,
| immediate: true
| }
| },
| computed: {},
| created() {
| this.sourceDataMap();
| },
| mounted() {
| //this.getHeight(this.$parent);
| },
| methods: {
| sourceDataMap: function () {
| this.uiParseClass=this.componentVO.uiParseClass;
| let urlParams = {};
| // 如果路径中存在 '?'
| if (this.uiParseClass.includes('?')) {
| urlParams = queryStringToObject(this.customClass);
| }
|
| this.btmType = urlParams.type;
| this.context = urlParams.context;
| this.urlParams = Object.assign({},this.paramVOS, urlParams)
| },
| getHeight(el) {
| if (el.$el.clientHeight > 50) {
| this.height = el.$el.clientHeight + 'px';
| } else {
| this.getHeight(el.$parent);
| }
| },
| setDataStore(value) {
| this.$emit("setDataStore", value);
| this.dataStore = value.dataStore;
| },
| setData(value) {
| this.$emit("setData", value);
| }
| }
| }
| </script>
|
| <style scoped lang="scss">
|
| </style>
|
|
