bri-components 1.2.56 → 1.2.58

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.
Files changed (41) hide show
  1. package/package.json +2 -2
  2. package/src/components/controls/base/BriUpload/BriUpload.vue +1 -1
  3. package/src/components/controls/base/DshCascader/DshCascader.vue +49 -203
  4. package/src/components/controls/base/DshCascader/{cascaderModal.vue → components/cascaderModal.vue} +24 -32
  5. package/src/components/controls/base/DshCascader/{cascaderPicker.vue → components/cascaderPicker.vue} +25 -21
  6. package/src/components/controls/base/DshCascader/components/cascaderSimple.vue +141 -0
  7. package/src/components/controls/base/DshCoordinates.vue +1 -1
  8. package/src/components/controls/base/DshDate/DshDate.vue +1 -1
  9. package/src/components/controls/base/DshDate/DshDaterange.vue +1 -1
  10. package/src/components/controls/base/DshDivider.vue +1 -1
  11. package/src/components/controls/base/DshEditor.vue +1 -1
  12. package/src/components/controls/base/DshInput/BriInputs.vue +1 -1
  13. package/src/components/controls/base/DshInput/DshInput.vue +1 -1
  14. package/src/components/controls/base/DshNumber/DshNumber.vue +1 -1
  15. package/src/components/controls/base/DshNumber/DshNumberange.vue +1 -1
  16. package/src/components/controls/base/DshSelect/DshCheckbox.vue +1 -1
  17. package/src/components/controls/base/DshSelect/DshSelect.vue +1 -1
  18. package/src/components/controls/base/DshSwitch/switchMixin.js +1 -1
  19. package/src/components/controls/extra/themeColor.vue +1 -1
  20. package/src/components/controls/extra/themeIcon.vue +1 -1
  21. package/src/components/controls/{base/DshCascader → mixins}/cascaderMixin.js +19 -34
  22. package/src/components/controls/{base/DshCascader → mixins}/cascaderPickerMixin.js +52 -44
  23. package/src/components/controls/{base/DshSelect → mixins}/selectMixin.js +1 -1
  24. package/src/components/controls/senior/BriLabels.vue +1 -1
  25. package/src/components/controls/senior/DshPackage.vue +1 -1
  26. package/src/components/controls/senior/cascaderTable.vue +1 -1
  27. package/src/components/controls/senior/flatTable.vue +11 -6
  28. package/src/components/controls/senior/flatTableImportModal.vue +7 -36
  29. package/src/components/controls/senior/selectDepartments.vue +1 -1
  30. package/src/components/controls/senior/selectUsers/selectUsers.vue +1 -1
  31. package/src/components/controls/special/DshBack.vue +1 -1
  32. package/src/components/controls/special/DshUndeveloped.vue +1 -1
  33. package/src/components/form/DshAdvSearch.vue +1 -1
  34. package/src/components/list/DshBox/DshCard.vue +153 -38
  35. package/src/components/list/DshBox/DshPanel.vue +260 -93
  36. package/src/components/small/BriTooltip.vue +2 -2
  37. package/src/components/unit/DshFormUnit.vue +6 -18
  38. package/src/styles/components/index.less +0 -2
  39. package/src/styles/components/list/DshBox/DshCard.less +0 -59
  40. package/src/styles/components/list/DshBox/DshPanel.less +0 -107
  41. /package/src/components/controls/{controlMixin.js → mixins/controlMixin.js} +0 -0
@@ -7,29 +7,31 @@
7
7
  >
8
8
  <!-- 组 标头 -->
9
9
  <div
10
- class="DshPanel-group-title"
10
+ class="DshPanel-group-header"
11
11
  :style="{
12
12
  backgroundColor: getBgColor(groupItem),
13
13
  color: '#ffffff'
14
14
  }"
15
15
  >
16
- <span class="DshPanel-group-title-name">
17
- <bri-tooltip
18
- class="unit-label"
19
- placement="top"
20
- :transfer="true"
21
- :content="groupItem.name"
22
- >
23
- <span class="dsh-ellipsis">{{ groupItem.name }} &nbsp;</span>
24
- </bri-tooltip>
25
- </span>
16
+ <!-- 左 -->
17
+ <bri-tooltip
18
+ class="DshPanel-group-header-left"
19
+ :content="groupItem.name"
20
+ placement="top"
21
+ :transfer="true"
22
+ >
23
+ <span class="DshPanel-group-header-left-name">
24
+ {{ groupItem.name }}
25
+ </span>
26
+ </bri-tooltip>
27
+
28
+ <!-- 右 -->
26
29
  <span>
27
- <span class="DshPanel-group-title-number">
30
+ <span class="DshPanel-group-header-right">
28
31
  {{ groupItem.total }}
29
32
  </span>
30
-
33
+ 条(已加载{{ groupItem.list.length }}条)
31
34
  </span>
32
- <span>(已加载{{ groupItem.list.length }}条)</span>
33
35
  </div>
34
36
 
35
37
  <!-- 组 数据列 -->
@@ -39,91 +41,112 @@
39
41
  backgroundColor: $getColor(getBgColor(groupItem))
40
42
  }"
41
43
  >
42
- <!-- 无数据 -->
43
- <div
44
- v-if="!groupItem.list.length"
45
- class="dsh-tip"
46
- :style="{color: getBgColor(groupItem)}"
47
- >
48
- {{ noDataText }}
49
- </div>
50
-
51
- <!-- 拖拽 -->
52
- <dsh-draggable
53
- v-model="groupItem.list"
54
- group="panel"
55
- animation="300"
56
- class="list-drag"
57
- :disabled="!dragOperationObj"
58
- @update="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
59
- @add="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
60
- >
61
- <transition-group
62
- :id="groupItem._key"
63
- class="list-drag-transition"
64
- @scroll.native="groupScroll(groupItem, groupIndex, $event)"
44
+ <!-- 有数据 -->
45
+ <template v-if="groupItem.list.length">
46
+ <dsh-draggable
47
+ v-model="groupItem.list"
48
+ group="panel"
49
+ animation="300"
50
+ class="list-drag"
51
+ :disabled="!dragOperationObj"
52
+ @update="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
53
+ @add="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
65
54
  >
66
- <div
67
- v-for="(dataItem, dataIndex) in groupItem.list"
68
- :key="dataItem._id"
69
- :id="dataItem._id"
70
- class="row-item"
71
- @click="clickRow(dataItem, dataIndex)"
55
+ <transition-group
56
+ :id="groupItem._key"
57
+ class="list-drag-transition"
58
+ @scroll.native="groupScroll(groupItem, groupIndex, $event)"
72
59
  >
73
- <!-- 下拉操作 -->
74
- <dsh-dropdown
75
- class="row-item-dropdown"
76
- :dropdownObj="dropdownObj"
77
- :list="operationList"
78
- @click="$dshEmit($event, dataItem, dataIndex)"
79
- @click.native.stop="0"
80
- ></dsh-dropdown>
81
-
82
- <!-- 标题 -->
83
- <div class="row-item-title dsh-ellipsis">{{ dataItem[titleField] }}</div>
84
-
85
- <!-- 显示字段 -->
86
60
  <div
87
- class="row-item-cols unit"
88
- v-for="colItem in selfColumns"
89
- :key="colItem._key"
61
+ v-for="(dataItem, dataIndex) in groupItem.list"
62
+ :key="dataItem._id"
63
+ :id="dataItem._id"
64
+ class="row-item"
65
+ @click="clickRow(dataItem, dataIndex)"
90
66
  >
91
- <!-- label -->
92
- <bri-tooltip
93
- class="unit-label"
94
- placement="top"
95
- :transfer="true"
96
- maxWidth="200"
97
- :content="colItem._name"
98
- >
99
- <span class="dsh-ellipsis">{{ colItem._name }}</span>
100
- </bri-tooltip>
101
- <span class="unit-colon">:</span>
102
-
103
- <!-- val -->
104
- <div class="unit-value dsh-ellipsis">
105
- <dsh-list-render
106
- v-if="colItem.renderBodyCell"
107
- :row="dataItem"
108
- :column="colItem"
109
- :index="0"
110
- :render="colItem.renderBodyCell"
111
- ></dsh-list-render>
67
+ <!-- 下拉操作 -->
68
+ <dsh-dropdown
69
+ v-if="operationList.length"
70
+ class="row-item-dropdown"
71
+ :dropdownObj="dropdownObj"
72
+ :list="operationList"
73
+ @click="$dshEmit($event, dataItem, dataIndex)"
74
+ @click.native.stop="0"
75
+ ></dsh-dropdown>
76
+
77
+ <!-- 内容 -->
78
+ <div class="row-item-info">
79
+ <!-- 标题 -->
80
+ <bri-tooltip
81
+ class="title"
82
+ :content="dataItem[propsObj.titleField]"
83
+ placement="top"
84
+ :transfer="true"
85
+ >
86
+ <div class="title-name">
87
+ {{ dataItem[propsObj.titleField] }}
88
+ </div>
89
+ </bri-tooltip>
112
90
 
91
+ <!-- 显示字段 -->
113
92
  <div
114
- v-else-if="colItem.formatter"
115
- v-html="colItem.formatter(dataItem, 0)"
116
- ></div>
117
-
118
- <span
119
- v-else
120
- class="unit-value-text"
121
- >{{ dataItem[colItem._key] }}</span>
93
+ v-for="colItem in selfColumns"
94
+ :key="colItem._key"
95
+ class="unit"
96
+ >
97
+ <!-- 左 label -->
98
+ <bri-tooltip
99
+ class="unit-label"
100
+ :content="colItem._name"
101
+ :transfer="true"
102
+ >
103
+ <span class="unit-label-name">
104
+ {{ colItem._name }}
105
+ </span>
106
+ <span class="unit-label-colon">
107
+
108
+ </span>
109
+ </bri-tooltip>
110
+
111
+ <!-- 右 val -->
112
+ <div class="unit-control">
113
+ <dsh-list-render
114
+ v-if="colItem.renderBodyCell"
115
+ :row="dataItem"
116
+ :column="colItem"
117
+ :index="0"
118
+ :render="colItem.renderBodyCell"
119
+ ></dsh-list-render>
120
+
121
+ <div
122
+ v-else-if="colItem.formatter"
123
+ v-html="colItem.formatter(dataItem, 0)"
124
+ ></div>
125
+
126
+ <span
127
+ v-else
128
+ class="unit-control-text"
129
+ >
130
+ {{ dataItem[colItem._key] }}
131
+ </span>
132
+ </div>
133
+ </div>
122
134
  </div>
123
135
  </div>
124
- </div>
125
- </transition-group>
126
- </dsh-draggable>
136
+ </transition-group>
137
+ </dsh-draggable>
138
+ </template>
139
+
140
+ <!-- 无数据 -->
141
+ <div
142
+ v-else
143
+ class="dsh-tip"
144
+ :style="{
145
+ color: getBgColor(groupItem)
146
+ }"
147
+ >
148
+ {{ noDataText }}
149
+ </div>
127
150
 
128
151
  <!-- 组 操作按钮(添加) -->
129
152
  <dsh-buttons
@@ -202,11 +225,14 @@
202
225
  return this.propsObj.groupField;
203
226
  },
204
227
  groupFieldObj () {
205
- return this.propsObj.groupFieldObj || {};
228
+ return this.columns.find(colItem => colItem._key === this.groupField) || {};
206
229
  },
207
230
  titleField () {
208
231
  return this.propsObj.titleField;
209
232
  },
233
+ // titleFieldObj () {
234
+ // return this.columns.find(colItem => colItem._key === this.titleField) || {};
235
+ // },
210
236
  selfColumns () {
211
237
  return this.columns
212
238
  .filter(colItem => ![this.groupField, this.titleField].includes(colItem._key))
@@ -215,7 +241,7 @@
215
241
  titleAlign: "left",
216
242
  columnAlign: "left"
217
243
  }))
218
- .slice(0, 1);
244
+ .slice(0, 2);
219
245
  },
220
246
 
221
247
  groupBtnOperationList () {
@@ -279,3 +305,144 @@
279
305
  }
280
306
  };
281
307
  </script>
308
+
309
+ <style lang="less">
310
+ .DshPanel {
311
+ min-width: 100%;
312
+ height: 100%;
313
+ display: flex;
314
+ flex-direction: row;
315
+
316
+ &-group {
317
+ width: 300px;
318
+ min-width: 300px;
319
+ max-width: 300px;
320
+ height: 100%;
321
+ padding: 10px;
322
+ overflow: hidden;
323
+ display: flex;
324
+ flex-direction: column;
325
+
326
+ &-header {
327
+ width: 100%;
328
+ height: 50px;
329
+ padding: 15px 10px;
330
+ border-radius: 10px 10px 0px 0px;
331
+ font-size: 14px;
332
+ display: flex;
333
+ justify-content: space-between;
334
+
335
+ &-left {
336
+ flex: 1;
337
+ min-width: 0px;
338
+
339
+ &-name {
340
+ .dsh-ellipsis();
341
+ }
342
+ }
343
+
344
+ &-right {
345
+ margin-left: 5px;
346
+ font-weight: bold;
347
+ }
348
+ }
349
+
350
+ &-list {
351
+ width: 100%;
352
+ flex: 1;
353
+ min-height: 0px;
354
+ border: 1px dashed #cccccc;
355
+ border-top: none;
356
+ display: flex;
357
+ flex-direction: column;
358
+ justify-content: space-between;
359
+
360
+ .list-drag {
361
+ width: 100%;
362
+ flex: 1;
363
+ min-height: 0px;
364
+
365
+ &-transition {
366
+ display: block;
367
+ width: 100%;
368
+ height: 100%;
369
+ padding: 10px;
370
+ overflow: auto;
371
+
372
+ .row-item {
373
+ min-height: 60px;
374
+ margin-bottom: 10px;
375
+ border: 1px solid rgba(102, 110, 126, 0.1);
376
+ border-radius: 4px;
377
+ background: #FFFFFF;
378
+ cursor: pointer;
379
+ position: relative;
380
+
381
+ &-dropdown {
382
+ position: absolute;
383
+ top: 5px;
384
+ right: 5px;
385
+ }
386
+
387
+ &-info {
388
+ padding: 8px 10px;
389
+ background: #ffffff;
390
+ overflow: hidden;
391
+
392
+ .title {
393
+ height: 24px;
394
+ padding-right: 6px;
395
+ font-size: 14px;
396
+ font-weight: 600;
397
+
398
+ &-name {
399
+ .dsh-ellipsis();
400
+ }
401
+ }
402
+
403
+ .unit {
404
+ height: 24px;
405
+ display: flex;
406
+ flex-direction: row;
407
+
408
+ &-label {
409
+ font-weight: 400;
410
+ color: #515A6E;
411
+
412
+ &-name {
413
+ min-width: 70px;
414
+ max-width: 70px;
415
+ .dsh-ellipsis();
416
+ display: inline-block;
417
+ }
418
+
419
+ &-colon {
420
+
421
+ }
422
+ }
423
+
424
+ &-control {
425
+ flex: 1;
426
+ min-width: 0px;
427
+ overflow: hidden;
428
+
429
+ &-text {
430
+
431
+ }
432
+ }
433
+ }
434
+ }
435
+ }
436
+ }
437
+ }
438
+
439
+ .list-btns {
440
+ width: 100%;
441
+ height: 40px;
442
+ padding: 0px 10px;
443
+ text-align: center;
444
+ }
445
+ }
446
+ }
447
+ }
448
+ </style>
@@ -1,7 +1,6 @@
1
1
  <template>
2
2
  <Tooltip
3
3
  class="BriTooltip"
4
- style="width: 100%;"
5
4
  :content="content"
6
5
  :disabled="toolTipDisabled"
7
6
  :placement="placement"
@@ -28,7 +27,7 @@
28
27
  },
29
28
  maxWidth: {
30
29
  type: String,
31
- default: "200"
30
+ default: "300"
32
31
  },
33
32
  transfer: {
34
33
  type: Boolean,
@@ -82,6 +81,7 @@
82
81
 
83
82
  <style lang="less" scoped>
84
83
  .BriTooltip {
84
+ width: 100%;
85
85
  display: flex;
86
86
  }
87
87
  </style>
@@ -61,8 +61,8 @@
61
61
  <bri-tooltip
62
62
  v-if="formItem._description"
63
63
  :content="formItem._description"
64
+ maxWidth="400"
64
65
  transfer
65
- style="height: 14px;"
66
66
  >
67
67
  <span class="DshFormUnit-label-description">
68
68
  {{ `* ${formItem._description}` }}
@@ -220,23 +220,18 @@
220
220
 
221
221
  .DshFormUnit-label {
222
222
  max-width: 280px;
223
+ margin: 0px 8px 0px -10px; // fixedbug:line模式下显示必填
224
+ padding-left: 10px;
223
225
  font-size: @textSize;
224
226
  overflow: hidden;
225
- margin: 0px;
226
- margin-right: 8px;
227
-
228
- // fixedbug:line模式下显示必填
229
- margin-left: -10px;
230
- padding-left: 10px;
231
227
 
232
228
  &-left {
233
229
  flex: 1;
234
- min-width: 40px;
230
+ min-width: 100px;
235
231
  }
236
232
 
237
233
  &-right {
238
- flex: none;
239
- max-width: 50%;
234
+ max-width: 120px;
240
235
  min-width: 0px;
241
236
  text-align: right;
242
237
  }
@@ -244,14 +239,7 @@
244
239
 
245
240
  .DshFormUnit-control {
246
241
  flex: 1;
247
- min-width: 50px;
248
- display: flex;
249
- justify-content: flex-end;
250
- align-items: center;
251
-
252
- &-component {
253
- width: 100%;
254
- }
242
+ min-width: 100px;
255
243
  }
256
244
  }
257
245
 
@@ -2,8 +2,6 @@
2
2
  @import "./list/DshBox/DshBox.less";
3
3
  @import "./list/DshBox/DshTable.less";
4
4
  @import "./list/DshBox/DshCrossTable.less";
5
- @import "./list/DshBox/DshCard.less";
6
- @import "./list/DshBox/DshPanel.less";
7
5
  @import "./list/DshBox/DshSingleData.less";
8
6
  @import "./list/DshBox/DshList.less";
9
7
  @import "./list/BriTable.less";
@@ -1,59 +0,0 @@
1
- .DshCard {
2
- display: flex;
3
- flex-wrap: wrap;
4
- background-color: #ffffff;
5
- padding: 0 40px;
6
-
7
- &-item {
8
- width: 250px;
9
- height: 210px;
10
- box-sizing: border-box;
11
- margin: 10px 16px 30px;
12
- border-radius: 6px;
13
- overflow: hidden;
14
- box-shadow: 0px 4px 8px 0px rgba(222, 222, 222, 0.75);
15
- cursor: pointer;
16
- display: flex;
17
- flex-direction: column;
18
- position: relative;
19
-
20
- &-dropdown {
21
- position: absolute;
22
- top: 5px;
23
- right: 5px;
24
- }
25
- &-image {
26
- padding-top: 20px;
27
- height: 122px;
28
- }
29
- &-info {
30
- flex: 1;
31
- padding: 8px 15px;
32
- overflow: hidden;
33
- background: #F7FBFF;
34
- &-title {
35
- font-size: 14px;
36
- font-weight: 600;
37
- }
38
- &-col {
39
- height: 24px;
40
- }
41
-
42
- .unit {
43
- display: flex;
44
- flex-direction: row;
45
- &-label {
46
- max-width: 60px;
47
- font-weight: 400;
48
- color: #515A6E;
49
- }
50
- &-colon {
51
-
52
- }
53
- &-value {
54
- flex: 1;
55
- }
56
- }
57
- }
58
- }
59
- }
@@ -1,107 +0,0 @@
1
- .DshPanel {
2
- min-width: 100%;
3
- height: 100%;
4
- display: flex;
5
- flex-direction: row;
6
-
7
- &-group {
8
- width: 300px;
9
- min-width: 300px;
10
- max-width: 300px;
11
- height: 100%;
12
- padding: 10px;
13
- overflow: hidden;
14
- display: flex;
15
- flex-direction: column;
16
-
17
- &-title {
18
- width: 100%;
19
- height: 50px;
20
- padding: 15px 10px;
21
- display: flex;
22
- border-radius: 10px 10px 0px 0px;
23
- font-size: 14px;
24
-
25
- &-name {
26
- max-width: 120px;
27
- }
28
- &-number {
29
- font-weight: bold;
30
- }
31
- }
32
-
33
- &-list {
34
- width: 100%;
35
- flex: 1;
36
- min-height: 0px;
37
- border: 1px dashed #cccccc;
38
- border-top: none;
39
- display: flex;
40
- flex-direction: column;
41
-
42
- .list-drag {
43
- width: 100%;
44
- flex: 1;
45
- min-height: 0px;
46
-
47
- &-transition {
48
- display: block;
49
- width: 100%;
50
- height: 100%;
51
- padding: 10px;
52
- overflow: auto;
53
-
54
- .row-item {
55
- min-height: 60px;
56
- padding: 10px 17px;
57
- margin-bottom: 10px;
58
- border: 1px solid rgba(102, 110, 126, 0.1);
59
- border-radius: 4px;
60
- background: #FFFFFF;
61
- cursor: pointer;
62
- position: relative;
63
-
64
- &-dropdown {
65
- position: absolute;
66
- top: 5px;
67
- right: 5px;
68
- }
69
-
70
- &-title {
71
- width: calc(100% - 22px);
72
- margin-bottom: 2px;
73
- font-family: Source Han Sans CN;
74
- font-size: 14px;
75
- font-weight: 500;
76
- color: #515A6E;
77
- }
78
-
79
- &-cols {}
80
-
81
- .unit {
82
- display: flex;
83
- flex-direction: row;
84
- color: #515A6E;
85
- &-label {
86
- max-width: 60px;
87
- }
88
- &-colon {
89
-
90
- }
91
- &-value {
92
- flex: 1;
93
- }
94
- }
95
- }
96
- }
97
- }
98
-
99
- .list-btns {
100
- width: 100%;
101
- height: 40px;
102
- padding: 0px 10px;
103
- text-align: center;
104
- }
105
- }
106
- }
107
- }