bri-components 1.2.63 → 1.2.65
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.
- package/package.json +1 -1
- package/src/components/controls/base/DshCascader/DshCascader.vue +2 -2
- package/src/components/controls/base/DshCascader/components/cascaderModal.vue +0 -1
- package/src/components/controls/base/DshCascader/components/cascaderPicker.vue +3 -3
- package/src/components/controls/base/DshSelect/DshCheckbox.vue +1 -1
- package/src/components/controls/base/DshSelect/DshSelect.vue +1 -1
- package/src/components/controls/base/DshSwitch/DshSwitch.vue +1 -1
- package/src/components/controls/control.less +4 -0
- package/src/components/controls/mixins/controlMixin.js +4 -1
- package/src/components/list/DshBox/DshList.vue +3 -4
- package/src/components/list/DshBox/DshPanel.vue +212 -100
- package/src/components/small/DshDropdown.vue +70 -9
- package/src/components/unit/DshFormUnit.vue +9 -2
- package/src/styles/components/index.less +0 -1
- package/src/styles/reset-iview-other.less +7 -5
- package/src/styles/components/small/DshDropdown.less +0 -62
package/package.json
CHANGED
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
<template v-if="!$isEmptyData(curValList)">
|
|
33
33
|
<!-- 详情页查看 且单独占一行高度自由时 -->
|
|
34
34
|
<div
|
|
35
|
-
v-if="
|
|
35
|
+
v-if="isHeightAuto"
|
|
36
36
|
:class="{
|
|
37
37
|
...commonClass,
|
|
38
38
|
'DshCascader-show-auto': true
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
<template v-if="!$isEmptyData(curValList)">
|
|
98
98
|
<!-- 详情页查看 且单独占一行高度自由时 -->
|
|
99
99
|
<dsh-tags
|
|
100
|
-
v-if="
|
|
100
|
+
v-if="isHeightAuto"
|
|
101
101
|
:class="{
|
|
102
102
|
...commonClass,
|
|
103
103
|
'DshCascaders-show-auto': true
|
|
@@ -275,7 +275,7 @@
|
|
|
275
275
|
&.ivu-select-dropdown {
|
|
276
276
|
min-width: 400px;
|
|
277
277
|
max-width: 400px;
|
|
278
|
-
max-height:
|
|
278
|
+
max-height: 500px; // 必须有，压住iview的300px
|
|
279
279
|
border: 0.5px solid #e5e5e5;
|
|
280
280
|
box-shadow: 0 3px 14px 2px rgba(0,0,0,0.05), 0 8px 10px 1px rgba(0,0,0,0.06), 0 5px 5px -3px rgba(0,0,0,0.1);
|
|
281
281
|
}
|
|
@@ -353,8 +353,8 @@
|
|
|
353
353
|
|
|
354
354
|
&-list {
|
|
355
355
|
width: 100%;
|
|
356
|
-
min-height:
|
|
357
|
-
max-height:
|
|
356
|
+
min-height: 280px;
|
|
357
|
+
max-height: 340px;
|
|
358
358
|
padding: 5px 10px 10px;
|
|
359
359
|
overflow: auto;
|
|
360
360
|
|
|
@@ -143,7 +143,10 @@ export default {
|
|
|
143
143
|
},
|
|
144
144
|
// 控件内容高度 自由
|
|
145
145
|
isHeightAuto () {
|
|
146
|
-
return this.
|
|
146
|
+
return this.isInTable
|
|
147
|
+
? false
|
|
148
|
+
// ? this.isUnitShow
|
|
149
|
+
: this.isFullRow;
|
|
147
150
|
},
|
|
148
151
|
clearable () {
|
|
149
152
|
return this.commonDealPropsObj._clearable;
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
>
|
|
73
73
|
<CheckboxGroup
|
|
74
74
|
v-model="selectIds"
|
|
75
|
-
@on-change="
|
|
75
|
+
@on-change="selectRow"
|
|
76
76
|
>
|
|
77
77
|
<Checkbox
|
|
78
78
|
v-for="row in data"
|
|
@@ -161,7 +161,6 @@
|
|
|
161
161
|
</template>
|
|
162
162
|
|
|
163
163
|
<script>
|
|
164
|
-
|
|
165
164
|
export default {
|
|
166
165
|
name: "DshList",
|
|
167
166
|
components: {},
|
|
@@ -256,8 +255,8 @@
|
|
|
256
255
|
this.changeSelect();
|
|
257
256
|
},
|
|
258
257
|
// 切换选择
|
|
259
|
-
|
|
260
|
-
this.$emit("
|
|
258
|
+
selectRow (ids) {
|
|
259
|
+
this.$emit("selectRow", this.selectIds, this.selections, this.curRow.bool, this.curRow);
|
|
261
260
|
this.changeSelect();
|
|
262
261
|
},
|
|
263
262
|
// 改变选择项
|
|
@@ -13,21 +13,29 @@
|
|
|
13
13
|
color: '#ffffff'
|
|
14
14
|
}"
|
|
15
15
|
>
|
|
16
|
+
<!-- 左 -->
|
|
17
|
+
<Checkbox
|
|
18
|
+
v-if="multiple"
|
|
19
|
+
class="header-checkbox"
|
|
20
|
+
v-model="groupItem.isSelectAll"
|
|
21
|
+
@on-change="selectGroupAll(groupItem, $event)"
|
|
22
|
+
></Checkbox>
|
|
23
|
+
|
|
16
24
|
<!-- 左 -->
|
|
17
25
|
<bri-tooltip
|
|
18
|
-
class="
|
|
26
|
+
class="header-left"
|
|
19
27
|
:content="groupItem.name"
|
|
20
28
|
placement="top"
|
|
21
29
|
:transfer="true"
|
|
22
30
|
>
|
|
23
|
-
<span class="
|
|
31
|
+
<span class="header-left-name">
|
|
24
32
|
{{ groupItem.name }}
|
|
25
33
|
</span>
|
|
26
34
|
</bri-tooltip>
|
|
27
35
|
|
|
28
36
|
<!-- 右 -->
|
|
29
|
-
<span>
|
|
30
|
-
<span class="
|
|
37
|
+
<span class="header-right">
|
|
38
|
+
<span class="header-right-num">
|
|
31
39
|
{{ groupItem.total }}
|
|
32
40
|
</span>
|
|
33
41
|
条（已加载{{ groupItem.list.length }}条）
|
|
@@ -43,98 +51,114 @@
|
|
|
43
51
|
>
|
|
44
52
|
<!-- 有数据 -->
|
|
45
53
|
<template v-if="groupItem.list.length">
|
|
46
|
-
<
|
|
47
|
-
v-model="groupItem.list"
|
|
48
|
-
group="panel"
|
|
49
|
-
animation="300"
|
|
54
|
+
<CheckboxGroup
|
|
50
55
|
class="list-drag"
|
|
51
|
-
|
|
52
|
-
@
|
|
53
|
-
@add="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
|
|
56
|
+
v-model="groupItem.selectIds"
|
|
57
|
+
@on-change="selectRow(groupItem, $event)"
|
|
54
58
|
>
|
|
55
|
-
<
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
+
<dsh-draggable
|
|
60
|
+
class="list-drag-draggable"
|
|
61
|
+
v-model="groupItem.list"
|
|
62
|
+
group="panel"
|
|
63
|
+
animation="300"
|
|
64
|
+
:disabled="!dragOperationObj"
|
|
65
|
+
@update="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
|
|
66
|
+
@add="$dshEmit(dragOperationObj, $event, groupItem, data.find(item => item._key === $event.from.id), { [groupField]: groupItem._key })"
|
|
59
67
|
>
|
|
60
|
-
<
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
class="row-item"
|
|
65
|
-
@click="clickRow(dataItem, dataIndex)"
|
|
68
|
+
<transition-group
|
|
69
|
+
:id="groupItem._key"
|
|
70
|
+
class="list-drag-transition"
|
|
71
|
+
@scroll.native="groupScroll(groupItem, groupIndex, $event)"
|
|
66
72
|
>
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
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>
|
|
90
|
-
|
|
91
|
-
<!-- 显示字段 -->
|
|
92
|
-
<div
|
|
93
|
-
v-for="colItem in selfColumns"
|
|
94
|
-
:key="colItem._key"
|
|
95
|
-
class="unit"
|
|
73
|
+
<div
|
|
74
|
+
v-for="(dataItem, dataIndex) in groupItem.list"
|
|
75
|
+
:key="dataItem._id"
|
|
76
|
+
:id="dataItem._id"
|
|
77
|
+
class="row-item"
|
|
78
|
+
@click="clickRow(dataItem, dataIndex)"
|
|
79
|
+
>
|
|
80
|
+
<!-- 复选框 -->
|
|
81
|
+
<Checkbox
|
|
82
|
+
v-if="multiple"
|
|
83
|
+
class="row-item-checkbox"
|
|
84
|
+
:label="dataItem._id"
|
|
85
|
+
@click.native.stop="clickRowCheckbox(dataItem)"
|
|
96
86
|
>
|
|
97
|
-
|
|
87
|
+
{{ "" }}
|
|
88
|
+
</Checkbox>
|
|
89
|
+
|
|
90
|
+
<!-- 下拉操作 -->
|
|
91
|
+
<dsh-dropdown
|
|
92
|
+
v-if="operationList.length"
|
|
93
|
+
class="row-item-dropdown"
|
|
94
|
+
:dropdownObj="dropdownObj"
|
|
95
|
+
:list="operationList"
|
|
96
|
+
@click="$dshEmit($event, dataItem, dataIndex)"
|
|
97
|
+
@click.native.stop="0"
|
|
98
|
+
></dsh-dropdown>
|
|
99
|
+
|
|
100
|
+
<!-- 内容 -->
|
|
101
|
+
<div class="row-item-info">
|
|
102
|
+
<!-- 标题 -->
|
|
98
103
|
<bri-tooltip
|
|
99
|
-
class="
|
|
100
|
-
:content="
|
|
104
|
+
class="title"
|
|
105
|
+
:content="dataItem[titleField]"
|
|
106
|
+
placement="top"
|
|
101
107
|
:transfer="true"
|
|
102
108
|
>
|
|
103
|
-
<
|
|
104
|
-
{{
|
|
105
|
-
</
|
|
106
|
-
<span class="unit-label-colon">
|
|
107
|
-
：
|
|
108
|
-
</span>
|
|
109
|
+
<div class="title-name">
|
|
110
|
+
{{ dataItem[titleField] }}
|
|
111
|
+
</div>
|
|
109
112
|
</bri-tooltip>
|
|
110
113
|
|
|
111
|
-
<!--
|
|
112
|
-
<div
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
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"
|
|
114
|
+
<!-- 显示字段 -->
|
|
115
|
+
<div
|
|
116
|
+
v-for="colItem in selfColumns"
|
|
117
|
+
:key="colItem._key"
|
|
118
|
+
class="unit"
|
|
119
|
+
>
|
|
120
|
+
<!-- 左 label -->
|
|
121
|
+
<bri-tooltip
|
|
122
|
+
class="unit-label"
|
|
123
|
+
:content="colItem._name"
|
|
124
|
+
:transfer="true"
|
|
129
125
|
>
|
|
130
|
-
|
|
131
|
-
|
|
126
|
+
<span class="unit-label-name">
|
|
127
|
+
{{ colItem._name }}
|
|
128
|
+
</span>
|
|
129
|
+
<span class="unit-label-colon">
|
|
130
|
+
：
|
|
131
|
+
</span>
|
|
132
|
+
</bri-tooltip>
|
|
133
|
+
|
|
134
|
+
<!-- 右 val -->
|
|
135
|
+
<div class="unit-control">
|
|
136
|
+
<dsh-list-render
|
|
137
|
+
v-if="colItem.renderBodyCell"
|
|
138
|
+
:row="dataItem"
|
|
139
|
+
:column="colItem"
|
|
140
|
+
:index="0"
|
|
141
|
+
:render="colItem.renderBodyCell"
|
|
142
|
+
></dsh-list-render>
|
|
143
|
+
|
|
144
|
+
<div
|
|
145
|
+
v-else-if="colItem.formatter"
|
|
146
|
+
v-html="colItem.formatter(dataItem, 0)"
|
|
147
|
+
></div>
|
|
148
|
+
|
|
149
|
+
<span
|
|
150
|
+
v-else
|
|
151
|
+
class="unit-control-text"
|
|
152
|
+
>
|
|
153
|
+
{{ dataItem[colItem._key] }}
|
|
154
|
+
</span>
|
|
155
|
+
</div>
|
|
132
156
|
</div>
|
|
133
157
|
</div>
|
|
134
158
|
</div>
|
|
135
|
-
</
|
|
136
|
-
</
|
|
137
|
-
</
|
|
159
|
+
</transition-group>
|
|
160
|
+
</dsh-draggable>
|
|
161
|
+
</CheckboxGroup>
|
|
138
162
|
</template>
|
|
139
163
|
|
|
140
164
|
<!-- 无数据 -->
|
|
@@ -205,22 +229,33 @@
|
|
|
205
229
|
},
|
|
206
230
|
data () {
|
|
207
231
|
return {
|
|
232
|
+
selections: [],
|
|
233
|
+
// curRow: null // 可以不声明
|
|
234
|
+
|
|
208
235
|
// 下拉菜单的配置
|
|
209
236
|
dropdownObj: {
|
|
210
237
|
icon: "ios-more",
|
|
211
238
|
size: 22,
|
|
212
239
|
color: "#E9ECF4",
|
|
213
240
|
showDropdownItemIcon: false
|
|
214
|
-
},
|
|
215
|
-
|
|
216
|
-
getBgColor (groupItem) {
|
|
217
|
-
return this.groupFieldObj._useColor
|
|
218
|
-
? resourceData.colorMap[(this.groupFieldObj._data.find(item => item._key === groupItem._key) || { color: "color-default" }).color]
|
|
219
|
-
: resourceData.colorMap["color-default"];
|
|
220
241
|
}
|
|
221
242
|
};
|
|
222
243
|
},
|
|
223
244
|
computed: {
|
|
245
|
+
selectIds: {
|
|
246
|
+
get () {
|
|
247
|
+
return this.selections.map(item => item._id);
|
|
248
|
+
},
|
|
249
|
+
set (val) {
|
|
250
|
+
this.selections = this.data
|
|
251
|
+
.reduce((arr, groupItem) => [...arr, ...groupItem.list], [])
|
|
252
|
+
.filter(item => val.includes(item._id));
|
|
253
|
+
}
|
|
254
|
+
},
|
|
255
|
+
|
|
256
|
+
multiple () {
|
|
257
|
+
return !!this.propsObj.multiple;
|
|
258
|
+
},
|
|
224
259
|
groupField () {
|
|
225
260
|
return this.propsObj.groupField;
|
|
226
261
|
},
|
|
@@ -284,6 +319,7 @@
|
|
|
284
319
|
// 判断是否要滚动加载
|
|
285
320
|
groupLoad (groupItem, groupElement) {
|
|
286
321
|
if (
|
|
322
|
+
groupItem &&
|
|
287
323
|
groupItem.loading !== true &&
|
|
288
324
|
groupItem.finished !== true &&
|
|
289
325
|
groupElement.children.length === groupItem.list.length &&
|
|
@@ -296,11 +332,56 @@
|
|
|
296
332
|
// 点击某行
|
|
297
333
|
clickRow (row) {
|
|
298
334
|
this.$emit("clickRow", row);
|
|
335
|
+
},
|
|
336
|
+
// 点击某行的选择框
|
|
337
|
+
clickRowCheckbox (row) {
|
|
338
|
+
this.curRow = row;
|
|
339
|
+
this.curRow.bool = !this.selectIds.includes(row._id);
|
|
340
|
+
},
|
|
341
|
+
|
|
342
|
+
// 切换全选
|
|
343
|
+
selectGroupAll (groupItem, bool) {
|
|
344
|
+
const groupListIds = groupItem.list.map(item => item._id);
|
|
345
|
+
groupItem.selectIds = groupItem.isSelectAll === true
|
|
346
|
+
? groupListIds
|
|
347
|
+
: [];
|
|
348
|
+
this.selectIds = groupItem.isSelectAll === true
|
|
349
|
+
? [...new Set([...this.selectIds, ...groupListIds])]
|
|
350
|
+
: this.selectIds.filter(id => !groupListIds.includes(id));
|
|
351
|
+
|
|
352
|
+
this.$emit("selectAll", this.selectIds, this.selections, groupItem.isSelectAll);
|
|
353
|
+
this.changeSelect();
|
|
354
|
+
},
|
|
355
|
+
// 选择行
|
|
356
|
+
selectRow (groupItem, ids) {
|
|
357
|
+
const groupListIds = groupItem.list.map(item => item._id);
|
|
358
|
+
this.selectIds = [
|
|
359
|
+
...this.selectIds.filter(id => !groupListIds.includes(id)),
|
|
360
|
+
...groupItem.selectIds
|
|
361
|
+
];
|
|
362
|
+
groupItem.isSelectAll = groupListIds.length > 0 && groupItem.selectIds.length === groupListIds.length;
|
|
363
|
+
|
|
364
|
+
this.$emit("selectRow", this.selectIds, this.selections, this.curRow.bool, this.curRow);
|
|
365
|
+
this.changeSelect();
|
|
366
|
+
},
|
|
367
|
+
// 改变选择项
|
|
368
|
+
changeSelect () {
|
|
369
|
+
this.$emit("changeSelect", this.selectIds, this.selections);
|
|
370
|
+
},
|
|
371
|
+
|
|
372
|
+
/* -------- 方法 -------- */
|
|
373
|
+
getBgColor (groupItem) {
|
|
374
|
+
return this.groupFieldObj._useColor
|
|
375
|
+
? resourceData.colorMap[(this.groupFieldObj._data.find(item => item._key === groupItem._key) || { color: "color-default" }).color]
|
|
376
|
+
: resourceData.colorMap["color-default"];
|
|
299
377
|
}
|
|
300
378
|
},
|
|
301
379
|
watch: {
|
|
302
380
|
data () {
|
|
303
381
|
this.initGroupScroll();
|
|
382
|
+
this.data.forEach(groupItem => {
|
|
383
|
+
groupItem.isSelectAll = groupItem.list.length > 0 && groupItem.selectIds.length === groupItem.list.length;
|
|
384
|
+
});
|
|
304
385
|
}
|
|
305
386
|
}
|
|
306
387
|
};
|
|
@@ -332,18 +413,37 @@
|
|
|
332
413
|
display: flex;
|
|
333
414
|
justify-content: space-between;
|
|
334
415
|
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
416
|
+
.header {
|
|
417
|
+
&-checkbox {
|
|
418
|
+
.ivu-checkbox-inner {
|
|
419
|
+
border: 2px solid #ffffff;
|
|
420
|
+
background-color: transparent;
|
|
421
|
+
}
|
|
422
|
+
|
|
423
|
+
.ivu-checkbox-checked {
|
|
424
|
+
.ivu-checkbox-inner:after {
|
|
425
|
+
top: 1px;
|
|
426
|
+
left: 4px;
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
|
|
431
|
+
&-left {
|
|
432
|
+
flex: 1;
|
|
433
|
+
min-width: 0px;
|
|
338
434
|
|
|
339
|
-
|
|
340
|
-
|
|
435
|
+
&-name {
|
|
436
|
+
.dsh-ellipsis();
|
|
437
|
+
}
|
|
341
438
|
}
|
|
342
|
-
}
|
|
343
439
|
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
440
|
+
&-right {
|
|
441
|
+
margin-left: 5px;
|
|
442
|
+
|
|
443
|
+
&-num {
|
|
444
|
+
font-weight: bold;
|
|
445
|
+
}
|
|
446
|
+
}
|
|
347
447
|
}
|
|
348
448
|
}
|
|
349
449
|
|
|
@@ -362,6 +462,11 @@
|
|
|
362
462
|
flex: 1;
|
|
363
463
|
min-height: 0px;
|
|
364
464
|
|
|
465
|
+
&-draggable {
|
|
466
|
+
width: 100%;
|
|
467
|
+
height: 100%;
|
|
468
|
+
}
|
|
469
|
+
|
|
365
470
|
&-transition {
|
|
366
471
|
display: block;
|
|
367
472
|
width: 100%;
|
|
@@ -372,12 +477,19 @@
|
|
|
372
477
|
.row-item {
|
|
373
478
|
min-height: 60px;
|
|
374
479
|
margin-bottom: 10px;
|
|
480
|
+
padding: 8px 10px;
|
|
375
481
|
border: 1px solid rgba(102, 110, 126, 0.1);
|
|
376
|
-
border-radius: 4px;
|
|
482
|
+
// border-radius: 4px;
|
|
377
483
|
background: #FFFFFF;
|
|
378
484
|
cursor: pointer;
|
|
379
485
|
position: relative;
|
|
380
486
|
|
|
487
|
+
&-checkbox {
|
|
488
|
+
position: absolute;
|
|
489
|
+
top: -3px;
|
|
490
|
+
left: -1px;
|
|
491
|
+
}
|
|
492
|
+
|
|
381
493
|
&-dropdown {
|
|
382
494
|
position: absolute;
|
|
383
495
|
top: 5px;
|
|
@@ -385,13 +497,12 @@
|
|
|
385
497
|
}
|
|
386
498
|
|
|
387
499
|
&-info {
|
|
388
|
-
padding: 8px 10px;
|
|
389
500
|
background: #ffffff;
|
|
390
501
|
overflow: hidden;
|
|
391
502
|
|
|
392
503
|
.title {
|
|
393
504
|
height: 24px;
|
|
394
|
-
padding
|
|
505
|
+
padding: 0px 16px 0px 10px;
|
|
395
506
|
font-size: 14px;
|
|
396
507
|
font-weight: 600;
|
|
397
508
|
|
|
@@ -406,6 +517,7 @@
|
|
|
406
517
|
flex-direction: row;
|
|
407
518
|
|
|
408
519
|
&-label {
|
|
520
|
+
width: auto;
|
|
409
521
|
font-weight: 400;
|
|
410
522
|
color: #515A6E;
|
|
411
523
|
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
<div
|
|
40
40
|
class="DshDropdown-list-data"
|
|
41
41
|
:style="{
|
|
42
|
-
maxHeight: useSearch ? '
|
|
42
|
+
maxHeight: useSearch ? '320px' : '360px'
|
|
43
43
|
}"
|
|
44
44
|
>
|
|
45
45
|
<!-- 有数据 -->
|
|
@@ -66,16 +66,10 @@
|
|
|
66
66
|
>
|
|
67
67
|
<dsh-icons
|
|
68
68
|
v-if="dropdownItem.icon || dropdownItem.customIcon"
|
|
69
|
-
|
|
70
|
-
'list-item-icon': true,
|
|
71
|
-
'list-item-disabled': dropdownItem.disabled
|
|
72
|
-
}"
|
|
69
|
+
class="list-item-icon"
|
|
73
70
|
:list="[dropdownItem]"
|
|
74
71
|
/>
|
|
75
|
-
<span
|
|
76
|
-
'list-item-name': true,
|
|
77
|
-
'list-item-disabled': dropdownItem.disabled
|
|
78
|
-
}">
|
|
72
|
+
<span class="list-item-name">
|
|
79
73
|
{{ dropdownItem.name || dropdownItem._name }}
|
|
80
74
|
</span>
|
|
81
75
|
</slot>
|
|
@@ -158,3 +152,70 @@
|
|
|
158
152
|
}
|
|
159
153
|
};
|
|
160
154
|
</script>
|
|
155
|
+
|
|
156
|
+
<style lang="less">
|
|
157
|
+
.DshDropdown {
|
|
158
|
+
&-rel {
|
|
159
|
+
color: @contentColor;
|
|
160
|
+
cursor: pointer;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
&-list {
|
|
164
|
+
&-search {
|
|
165
|
+
width: 100%;
|
|
166
|
+
height: 40px;
|
|
167
|
+
padding: 0px 8px;
|
|
168
|
+
line-height: 40px;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
&-data {
|
|
172
|
+
width: 100%;
|
|
173
|
+
// max-height: 300px;
|
|
174
|
+
padding: 0 8px;
|
|
175
|
+
overflow: auto;
|
|
176
|
+
|
|
177
|
+
.list {
|
|
178
|
+
&-item {
|
|
179
|
+
padding: 10px 8px;
|
|
180
|
+
border-radius: @borderRadius;
|
|
181
|
+
line-height: 16px;
|
|
182
|
+
display: flex;
|
|
183
|
+
flex-direction: row;
|
|
184
|
+
align-items: center;
|
|
185
|
+
|
|
186
|
+
&-icon {
|
|
187
|
+
margin-right: 8px;
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
&-name {
|
|
191
|
+
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
&:hover {
|
|
195
|
+
background-color: @theme-focus;
|
|
196
|
+
color: @themeColor;
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
&-disabled {
|
|
200
|
+
color: @textColor-disabled;
|
|
201
|
+
}
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.ivu-dropdown-item-divided:before {
|
|
205
|
+
margin: 0px;
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
.nodata {
|
|
210
|
+
#dsh-nodata();
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
|
|
215
|
+
&.ivu-select-dropdown {
|
|
216
|
+
max-height: 500px;
|
|
217
|
+
border: 0.5px solid #e5e5e5;
|
|
218
|
+
box-shadow: 0 3px 14px 2px rgba(0,0,0,0.05), 0 8px 10px 1px rgba(0,0,0,0.06), 0 5px 5px -3px rgba(0,0,0,0.1);
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
</style>
|
|
@@ -288,8 +288,11 @@
|
|
|
288
288
|
}
|
|
289
289
|
|
|
290
290
|
&-control {
|
|
291
|
-
min-height: 32px;
|
|
292
291
|
overflow: hidden;
|
|
292
|
+
|
|
293
|
+
&-component {
|
|
294
|
+
|
|
295
|
+
}
|
|
293
296
|
}
|
|
294
297
|
|
|
295
298
|
&-line {
|
|
@@ -318,7 +321,11 @@
|
|
|
318
321
|
|
|
319
322
|
.DshFormUnit-control {
|
|
320
323
|
flex: 1;
|
|
321
|
-
min-width:
|
|
324
|
+
min-width: 0px;
|
|
325
|
+
|
|
326
|
+
&-component {
|
|
327
|
+
|
|
328
|
+
}
|
|
322
329
|
}
|
|
323
330
|
}
|
|
324
331
|
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
.ivu-tooltip {
|
|
2
|
+
&-rel {
|
|
3
|
+
|
|
4
|
+
}
|
|
5
|
+
|
|
2
6
|
&-arrow {
|
|
3
7
|
border-bottom-color: @textColor !important;
|
|
4
8
|
}
|
|
@@ -14,10 +18,6 @@
|
|
|
14
18
|
max-height: 350px;
|
|
15
19
|
overflow: auto;
|
|
16
20
|
}
|
|
17
|
-
|
|
18
|
-
&-rel {
|
|
19
|
-
width: 100%;
|
|
20
|
-
}
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
.ivu-tag {
|
|
@@ -36,6 +36,8 @@
|
|
|
36
36
|
}
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
+
// 下拉框
|
|
39
40
|
.ivu-select-dropdown {
|
|
40
|
-
max-width:
|
|
41
|
+
max-width: 420px;
|
|
42
|
+
max-height: 300px;
|
|
41
43
|
}
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
.DshDropdown {
|
|
2
|
-
&-rel {
|
|
3
|
-
color: @contentColor;
|
|
4
|
-
cursor: pointer;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
&-list {
|
|
8
|
-
&-search {
|
|
9
|
-
width: 100%;
|
|
10
|
-
height: 40px;
|
|
11
|
-
padding: 0px 8px;
|
|
12
|
-
line-height: 40px;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
&-data {
|
|
16
|
-
width: 100%;
|
|
17
|
-
// max-height: 300px;
|
|
18
|
-
overflow: auto;
|
|
19
|
-
|
|
20
|
-
.list {
|
|
21
|
-
.list-item {
|
|
22
|
-
display: flex;
|
|
23
|
-
flex-direction: row;
|
|
24
|
-
align-items: center;
|
|
25
|
-
border-radius: @borderRadius;
|
|
26
|
-
padding: 9px 8px;
|
|
27
|
-
margin: 0 8px;
|
|
28
|
-
line-height: 22px;
|
|
29
|
-
&:hover {
|
|
30
|
-
background-color: @theme-focus;
|
|
31
|
-
color: @themeColor;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
&-disabled {
|
|
35
|
-
color: @textColor-disabled
|
|
36
|
-
}
|
|
37
|
-
&-icon {
|
|
38
|
-
margin-right: 8px;
|
|
39
|
-
}
|
|
40
|
-
&-name {
|
|
41
|
-
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
.ivu-dropdown-item-divided:before {
|
|
46
|
-
margin: 0px;
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.nodata {
|
|
51
|
-
#dsh-nodata();
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
&.ivu-select-dropdown {
|
|
56
|
-
border: 0.5px solid #e5e5e5;
|
|
57
|
-
box-shadow: 0 3px 14px 2px rgba(0,0,0,0.05), 0 8px 10px 1px rgba(0,0,0,0.06), 0 5px 5px -3px rgba(0,0,0,0.1);
|
|
58
|
-
max-height: 500px;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
|