vue2-client 1.12.26 → 1.12.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,279 +1,47 @@
1
1
  <template>
2
2
  <div>
3
- <template v-if="this.activatedConfig.designMode === 'json'">
4
- <XReportJsonRender
3
+ <template v-if="isWidget">
4
+ <!-- 插槽展示 -->
5
+ <x-report-tr-group
6
+ v-for="(row, rowIndex) in activatedConfig.columns"
5
7
  @updateImg="updateImg"
6
8
  @selectRow="selectRow"
7
- :img-prefix="imgPrefix"
9
+ :show-img-in-cell="showImgInCell"
8
10
  :server-name="serverName"
9
- :display-only="displayOnly"
10
- :show-title="showTitle"
11
- :no-padding="noPadding"
11
+ :env="env"
12
+ :key="rowIndex"
13
+ :columns="row"
12
14
  :no-top-border="noTopBorder"
13
- :config="activatedConfig"/>
15
+ :config-data="activatedConfig.data"
16
+ :config="activatedConfig"
17
+ :display="true">
18
+ </x-report-tr-group>
14
19
  </template>
15
- <template v-else-if="isWidget">
16
- <template v-for="(row, rowIndex) in activatedConfig.columns">
17
- <!-- 插槽展示 -->
18
- <template v-if="row[0].type === 'slot'">
19
- <x-report-tr-group
20
- @updateImg="updateImg"
21
- @selectRow="selectRow"
22
- :show-img-in-cell="showImgInCell"
23
- :img-prefix="imgPrefix"
24
- :server-name="serverName"
25
- :env="env"
26
- :use-oss-for-img="useOssForImg"
27
- :key="rowIndex"
28
- :columns="row"
29
- :no-top-border="noTopBorder"
30
- :config-data="activatedConfig.data"
31
- :config="activatedConfig"
32
- :display="true">
33
- </x-report-tr-group>
34
- </template>
35
- <!-- 普通行 -->
36
- <template v-else>
37
- <template v-if="!forDisplay">
20
+ <template v-else>
21
+ <div
22
+ :class=" noPadding ? 'reportMainNoPadding' : 'reportMain'"
23
+ :style="activatedConfig.width > 0 ? ('width:' + activatedConfig.width + 'px') : undefined">
24
+ <!-- 主体表格 -->
25
+ <table class="reportTable" v-if="render" :style="activatedConfig.style ? activatedConfig.style : undefined">
26
+ <tbody class="reportTable">
27
+ <!-- 插槽展示 -->
38
28
  <x-report-tr-group
29
+ v-for="(row, rowIndex) in activatedConfig.columns"
39
30
  @updateImg="updateImg"
40
31
  @selectRow="selectRow"
32
+ @slotRendered="slotRendered"
41
33
  :show-img-in-cell="showImgInCell"
42
- :img-prefix="imgPrefix"
43
34
  :server-name="serverName"
44
35
  :env="env"
45
- :use-oss-for-img="useOssForImg"
46
36
  :key="rowIndex"
47
37
  :columns="row"
48
38
  :no-top-border="noTopBorder"
49
39
  :config-data="activatedConfig.data"
50
- :config="activatedConfig">
51
- </x-report-tr-group>
52
- </template>
53
- <template v-else>
54
- <x-report-tr-group
55
- @updateImg="updateImg"
56
- @selectRow="selectRow"
57
- :show-img-in-cell="showImgInCell"
58
- :img-prefix="imgPrefix"
59
- :server-name="serverName"
60
- :env="env"
61
- :use-oss-for-img="useOssForImg"
62
40
  :config="activatedConfig"
63
- :key="rowIndex"
64
- :columns="row"
65
- :no-top-border="noTopBorder"
66
- :config-data="activatedConfig.data"
67
41
  :display="true">
68
42
  </x-report-tr-group>
69
- </template>
70
- </template>
71
- </template>
72
- </template>
73
- <template v-else>
74
- <div :class=" noPadding ? 'reportMainNoPadding' : 'reportMain'" :style="activatedConfig.width > 0 ? ('width:' + activatedConfig.width + 'px') : undefined">
75
- <!-- 大标题 -->
76
- <h2 class="reportTitle" v-if="showTitle && activatedConfig.title" v-html="activatedConfig.title"></h2>
77
- <!-- 小标题 / 介乎于标题与表格之间的内容 -->
78
- <div class="subTitle" v-if="activatedConfig.subTitle && activatedConfig.subTitle.length">
79
- <div class="subTitleItems" v-for="(item, itemIndex) in activatedConfig.subTitle" :key="itemIndex">
80
- <template v-if="item.type === 'column'">
81
- <span>{{ item.text }}</span>
82
- </template>
83
- <template v-else-if="item.type === 'inputs'">
84
- <div class="inputsDiv">
85
- <div class="inputsDivItem" v-for="(num, index) of calcFormatInputNum(item.format)" :key="index">
86
- <span class="inputsDivItemLabel">{{ displayFormatStartText(item.format) }}</span>
87
- <template v-if="!forDisplay">
88
- <template v-if="item.inputReadOnly === true">
89
- <a-input v-model="data[item.dataIndex][index]" :style="'width:' + (item.inputWidth ? item.inputWidth : '100') + '%'" :disabled="true"/>
90
- </template>
91
- <template v-else>
92
- <a-input v-model="data[item.dataIndex][index]" :style="'width:' + (item.inputWidth ? item.inputWidth : '100') + '%'"/>
93
- </template>
94
- </template>
95
- <template v-else>
96
- {{ activatedConfig.data[item.dataIndex][index] }}
97
- </template>
98
- <span class="inputsDivItemLabel">{{ displayFormatText(item.format, index) }}</span>
99
- </div>
100
- </div>
101
- </template>
102
- </div>
103
- </div>
104
- <!-- 主体表格 -->
105
- <table class="reportTable" v-if="render" :style="activatedConfig.style ? activatedConfig.style : undefined">
106
- <tbody class="reportTable">
107
- <template v-for="(row, rowIndex) in activatedConfig.columns">
108
- <!-- 插槽展示 -->
109
- <template v-if="row[0].type === 'slot'">
110
- <x-report-tr-group
111
- @updateImg="updateImg"
112
- @selectRow="selectRow"
113
- @slotRendered="slotRendered"
114
- :show-img-in-cell="showImgInCell"
115
- :img-prefix="imgPrefix"
116
- :server-name="serverName"
117
- :env="env"
118
- :use-oss-for-img="useOssForImg"
119
- :key="rowIndex"
120
- :columns="row"
121
- :no-top-border="noTopBorder"
122
- :config-data="activatedConfig.data"
123
- :config="activatedConfig"
124
- :display="true">
125
- </x-report-tr-group>
126
- </template>
127
- <!-- 列表 list -->
128
- <template v-else-if="row[0].type === 'list'" >
129
- <template v-for="(num, listIndex) in row[0].listLength + 1">
130
- <template v-if="!forDisplay">
131
- <x-report-tr-group
132
- @slotRendered="slotRendered"
133
- @updateImg="updateImg"
134
- @selectRow="selectRow"
135
- :show-img-in-cell="showImgInCell"
136
- :img-prefix="imgPrefix"
137
- :server-name="serverName"
138
- :env="env"
139
- :use-oss-for-img="useOssForImg"
140
- :config="activatedConfig"
141
- :key="rowIndex + listIndex"
142
- :columns="row"
143
- :no-top-border="noTopBorder"
144
- :config-data="activatedConfig.data"
145
- :list-index="listIndex">
146
- </x-report-tr-group>
147
- </template>
148
- <template v-else>
149
- <x-report-tr-group
150
- @slotRendered="slotRendered"
151
- @updateImg="updateImg"
152
- @selectRow="selectRow"
153
- :show-img-in-cell="showImgInCell"
154
- :img-prefix="imgPrefix"
155
- :server-name="serverName"
156
- :env="env"
157
- :use-oss-for-img="useOssForImg"
158
- :config="activatedConfig"
159
- :key="rowIndex + listIndex"
160
- :columns="row"
161
- :no-top-border="noTopBorder"
162
- :config-data="activatedConfig.data"
163
- :list-index="listIndex"
164
- :display="true">
165
- </x-report-tr-group>
166
- </template>
167
- </template>
168
- </template>
169
- <!-- 动态行 inputColumns -->
170
- <template v-else-if="row[0].type === 'inputColumns'">
171
- <template v-if="forDisplay">
172
- <x-report-tr-group
173
- @slotRendered="slotRendered"
174
- @updateImg="updateImg"
175
- @selectRow="selectRow"
176
- :show-img-in-cell="showImgInCell"
177
- :img-prefix="imgPrefix"
178
- :server-name="serverName"
179
- :env="env"
180
- :use-oss-for-img="useOssForImg"
181
- :config="activatedConfig"
182
- :columns="row[0].definition"
183
- :config-data="{arr: activatedConfig.data[row[0].dataIndex]}"
184
- :input-columns="true"
185
- :no-top-border="noTopBorder"
186
- v-for="(item, definitionIndex) in activatedConfig.data[row[0].dataIndex]"
187
- :input-columns-definition-index="definitionIndex"
188
- :display="true"
189
- :key="row[0].dataIndex + definitionIndex + rowIndex"></x-report-tr-group>
190
- </template>
191
- <template v-if="!forDisplay">
192
- <x-report-tr-group
193
- @slotRendered="slotRendered"
194
- @updateImg="updateImg"
195
- @selectRow="selectRow"
196
- :show-img-in-cell="showImgInCell"
197
- :img-prefix="imgPrefix"
198
- :server-name="serverName"
199
- :env="env"
200
- :use-oss-for-img="useOssForImg"
201
- :config="activatedConfig"
202
- :columns="row[0].definition"
203
- :config-data="{arr: activatedConfig.data[row[0].dataIndex]}"
204
- :input-columns="true"
205
- :no-top-border="noTopBorder"
206
- v-for="(item, definitionIndex) in activatedConfig.data[row[0].dataIndex]"
207
- :input-columns-definition-index="definitionIndex"
208
- :key="row[0].dataIndex + definitionIndex + rowIndex"></x-report-tr-group>
209
- <!-- 动态行交互按钮 -->
210
- <x-report-tr-group
211
- @slotRendered="slotRendered"
212
- @updateImg="updateImg"
213
- @selectRow="selectRow"
214
- :show-img-in-cell="showImgInCell"
215
- :img-prefix="imgPrefix"
216
- :server-name="serverName"
217
- :env="env"
218
- :use-oss-for-img="useOssForImg"
219
- :config="activatedConfig"
220
- :key="rowIndex"
221
- :columns="row"
222
- :no-top-border="noTopBorder"
223
- :config-data="activatedConfig.data"
224
- :input-columns-button="true"
225
- :input-columns="true">
226
- </x-report-tr-group>
227
- </template>
228
- </template>
229
- <!-- 普通行 -->
230
- <template v-else>
231
- <template v-if="!forDisplay">
232
- <x-report-tr-group
233
- @slotRendered="slotRendered"
234
- @updateImg="updateImg"
235
- @selectRow="selectRow"
236
- :show-img-in-cell="showImgInCell"
237
- :img-prefix="imgPrefix"
238
- :server-name="serverName"
239
- :env="env"
240
- :use-oss-for-img="useOssForImg"
241
- :key="rowIndex"
242
- :columns="row"
243
- :no-top-border="noTopBorder"
244
- :config-data="activatedConfig.data"
245
- :config="activatedConfig">
246
- </x-report-tr-group>
247
- </template>
248
- <template v-else>
249
- <x-report-tr-group
250
- @slotRendered="slotRendered"
251
- @updateImg="updateImg"
252
- @selectRow="selectRow"
253
- :show-img-in-cell="showImgInCell"
254
- :img-prefix="imgPrefix"
255
- :server-name="serverName"
256
- :env="env"
257
- :use-oss-for-img="useOssForImg"
258
- :config="activatedConfig"
259
- :key="rowIndex"
260
- :columns="row"
261
- :no-top-border="noTopBorder"
262
- :config-data="activatedConfig.data"
263
- :display="true">
264
- </x-report-tr-group>
265
- </template>
266
- </template>
267
- </template>
268
43
  </tbody>
269
44
  </table>
270
- <div v-if="showImages" style="margin-top: 5%; display: flex;margin-bottom: 5%">
271
- <p>图片:</p>
272
- <div :key="imgIndex" v-for="(img,imgIndex) in imageList" style="margin-left: 3%;width: 200px">
273
- <img :src="img.url" class="img" :alt="img.name"/>
274
- <p style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 100%;">{{ img.name }}</p>
275
- </div>
276
- </div>
277
45
  </div>
278
46
  </template>
279
47
  </div>
@@ -281,7 +49,6 @@
281
49
 
282
50
  <script>
283
51
  import XReportTrGroup from './XReportTrGroup.vue'
284
- import XReportJsonRender from './XReportJsonRender.vue'
285
52
  import { getConfigByName } from '@vue2-client/services/api/common'
286
53
  import XFormTable from '@vue2-client/base-client/components/common/XFormTable/XFormTable'
287
54
 
@@ -292,7 +59,8 @@ export default {
292
59
  config: {
293
60
  type: Object,
294
61
  require: true,
295
- default: () => {}
62
+ default: () => {
63
+ }
296
64
  },
297
65
  showImgInCell: {
298
66
  type: Boolean,
@@ -323,16 +91,6 @@ export default {
323
91
  type: String,
324
92
  default: undefined
325
93
  },
326
- // 将图片全部展示在表格之后,挨个罗列
327
- showImages: {
328
- type: Boolean,
329
- default: false
330
- },
331
- // 图片罗列的数组
332
- imageList: {
333
- type: Array,
334
- default: undefined
335
- },
336
94
  // 表格没有边距
337
95
  noPadding: {
338
96
  type: Boolean,
@@ -343,26 +101,10 @@ export default {
343
101
  type: Boolean,
344
102
  default: false
345
103
  },
346
- // 是否展示标题
347
- showTitle: {
348
- type: Boolean,
349
- default: true
350
- },
351
- // 图片是否使用OSS来保存
352
- useOssForImg: {
353
- type: Boolean,
354
- default: true
355
- },
356
- // 图片上传后添加前缀
357
- imgPrefix: {
358
- type: String,
359
- default: undefined
360
- }
361
104
  },
362
105
  components: {
363
106
  XFormTable,
364
- XReportTrGroup,
365
- XReportJsonRender
107
+ XReportTrGroup
366
108
  },
367
109
  inject: ['isWidget'],
368
110
  data () {
@@ -390,50 +132,6 @@ export default {
390
132
  console.log('XReportDesign')
391
133
  this.$emit('selectRow', selectedRowKeys, selectedRows)
392
134
  },
393
- // 根据format计算需要多少个输入框
394
- calcFormatInputNum (formatStr) {
395
- let count = 0
396
- for (let i = 0; i < formatStr.length; i++) {
397
- if (formatStr[i] == '{') {
398
- count++
399
- }
400
- }
401
- return count
402
- },
403
- // 根据format计算输入框之后的文字显示
404
- displayFormatText (formatStr, num) {
405
- let start = 0
406
- let count = 0
407
- num++
408
- for (let i = 0; i < formatStr.length; i++) {
409
- if (formatStr[i] === '}') {
410
- start = i
411
- count++
412
- }
413
- if (count === num) {
414
- for (let j = start + 1; j < formatStr.length; j++) {
415
- if (formatStr[j] === '{') {
416
- return formatStr.slice(start + 1, j)
417
- }
418
- if (j === formatStr.length - 1 && formatStr[j] !== '}') {
419
- return formatStr[j]
420
- }
421
- }
422
- }
423
- }
424
- },
425
- // 根据format计算输入框之前的文字显示
426
- displayFormatStartText (formatStr) {
427
- let count = 0
428
- for (let i = 0; i < formatStr.length; i++) {
429
- if (formatStr[i] === '{') {
430
- break
431
- } else {
432
- count++
433
- }
434
- }
435
- return formatStr.slice(0, count)
436
- },
437
135
  },
438
136
  created () {
439
137
  console.log('>>>> xreportdesign 渲染')
@@ -449,15 +147,13 @@ export default {
449
147
  this.activatedConfig = this.config
450
148
  this.render = true
451
149
  }
452
- if (this.activatedConfig.designMode !== 'json') {
453
- this.activatedConfig.columns.forEach(row => {
454
- if (row[0] && row[0].type && row[0].type === 'list' && row[0].listLength === 1) {
455
- row.forEach(cell => {
456
- cell.listLength = this.activatedConfig.data[cell.dataIndex].length
457
- })
458
- }
459
- })
460
- }
150
+ this.activatedConfig.columns.forEach(row => {
151
+ if (row[0] && row[0].type && row[0].type === 'list' && row[0].listLength === 1) {
152
+ row.forEach(cell => {
153
+ cell.listLength = this.activatedConfig.data[cell.dataIndex].length
154
+ })
155
+ }
156
+ })
461
157
  },
462
158
  mounted () {
463
159
  },
@@ -477,11 +173,12 @@ export default {
477
173
  </script>
478
174
 
479
175
  <style lang="less" scoped>
480
- .img{
176
+ .img {
481
177
  width: 95%;
482
178
  height: 180px;
483
179
  object-fit: cover;
484
180
  }
181
+
485
182
  .reportMain {
486
183
  text-align: center;
487
184
  margin: 0 auto;
@@ -507,11 +204,13 @@ export default {
507
204
  .inputsDiv {
508
205
  display: flex;
509
206
  justify-content: space-between;
207
+
510
208
  .inputsDivItem {
511
209
  display: flex;
512
210
  align-items: center;
513
211
  padding: 0 4px;
514
212
  white-space: nowrap;
213
+
515
214
  .inputsDivItemLabel {
516
215
  padding: 0 4px;
517
216
  }
@@ -521,10 +220,11 @@ export default {
521
220
  .reportTable {
522
221
  width: 100%;
523
222
  border-collapse: collapse;
524
- table-layout:fixed;
525
- word-break:break-all;
223
+ table-layout: fixed;
224
+ word-break: break-all;
526
225
  }
527
226
  }
227
+
528
228
  .reportMainForDisplay {
529
229
  text-align: center;
530
230
  margin: 10% auto;
@@ -549,11 +249,13 @@ export default {
549
249
  .inputsDiv {
550
250
  display: flex;
551
251
  justify-content: space-around;
252
+
552
253
  .inputsDivItem {
553
254
  display: flex;
554
255
  align-items: center;
555
256
  padding: 0 4px;
556
257
  white-space: nowrap;
258
+
557
259
  .inputsDivItemLabel {
558
260
  padding: 0 4px;
559
261
  }
@@ -563,10 +265,11 @@ export default {
563
265
  .reportTable {
564
266
  width: 100%;
565
267
  border-collapse: collapse;
566
- table-layout:fixed;
567
- word-break:break-all;
268
+ table-layout: fixed;
269
+ word-break: break-all;
568
270
  }
569
271
  }
272
+
570
273
  .reportMainNoPadding {
571
274
  // text-align: center;
572
275
  margin: 0 auto;
@@ -575,7 +278,7 @@ export default {
575
278
  // background-color: #fff;
576
279
  border-radius: 8px;
577
280
  height: auto;
578
- min-height : 20vh;
281
+ min-height: 20vh;
579
282
  overflow-y: auto;
580
283
  overflow-x: hidden;
581
284
 
@@ -595,11 +298,13 @@ export default {
595
298
  .inputsDiv {
596
299
  display: flex;
597
300
  justify-content: space-between;
301
+
598
302
  .inputsDivItem {
599
303
  display: flex;
600
304
  align-items: center;
601
305
  padding: 0 4px;
602
306
  white-space: nowrap;
307
+
603
308
  .inputsDivItemLabel {
604
309
  padding: 0 4px;
605
310
  }
@@ -609,17 +314,19 @@ export default {
609
314
  .reportTable {
610
315
  width: 100%;
611
316
  border-collapse: collapse;
612
- table-layout:fixed;
613
- word-break:break-all;
317
+ table-layout: fixed;
318
+ word-break: break-all;
614
319
  }
615
320
  }
616
- .tools{
321
+
322
+ .tools {
617
323
  position: fixed;
618
324
  right: 2%;
619
325
  text-align: right;
620
326
  width: 60%;
621
327
  cursor: pointer;
622
- .toolsItem{
328
+
329
+ .toolsItem {
623
330
  width: 15%;
624
331
  margin-right: 3%;
625
332
  display: inline-block;