bkui-vue 2.0.2-beta.79 → 2.0.2-beta.80
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/dist/cli.css +1 -1
- package/dist/index.cjs.js +2 -2
- package/dist/index.esm.js +7 -12
- package/dist/index.umd.js +2 -2
- package/dist/style.variable.css +1 -1
- package/lib/index.js +1 -1
- package/lib/steps/index.js +11 -12
- package/lib/steps/steps.css +24 -11
- package/lib/steps/steps.less +28 -10
- package/lib/steps/steps.variable.css +24 -11
- package/package.json +1 -1
package/lib/index.js
CHANGED
package/lib/steps/index.js
CHANGED
|
@@ -589,13 +589,14 @@ var stepsProps = {
|
|
|
589
589
|
if (typeof step === 'string') {
|
|
590
590
|
defaults.push(step);
|
|
591
591
|
} else {
|
|
592
|
-
var _step$border;
|
|
592
|
+
var _step$border, _step$disabled;
|
|
593
593
|
defaults.push({
|
|
594
594
|
title: step.title,
|
|
595
595
|
icon: step.icon,
|
|
596
596
|
description: step.description,
|
|
597
597
|
status: step.status,
|
|
598
|
-
border: (_step$border = step.border) !== null && _step$border !== void 0 ? _step$border : true
|
|
598
|
+
border: (_step$border = step.border) !== null && _step$border !== void 0 ? _step$border : true,
|
|
599
|
+
disabled: (_step$disabled = step.disabled) !== null && _step$disabled !== void 0 ? _step$disabled : false
|
|
599
600
|
});
|
|
600
601
|
}
|
|
601
602
|
});
|
|
@@ -763,24 +764,22 @@ var stepsProps = {
|
|
|
763
764
|
}, [this.defaultSteps.map(function (step, index) {
|
|
764
765
|
var _this$$slots, _this$$slots2, _this$$slots3;
|
|
765
766
|
return (0,external_vue_namespaceObject.createVNode)("div", {
|
|
766
|
-
"class": [_this.resolveClassName('step'), !step.title ? _this.resolveClassName('step-no-content') : '', isDone(index) ? 'done' : '', isCurrent(index) ? 'current' : '', isCurrent(index) && _this.status === 'error' ? 'is-error' : '', step.status && isCurrent(index) ? ["".concat(_this.resolveClassName("step-".concat(step.status)))] : '']
|
|
767
|
+
"class": [_this.resolveClassName('step'), !step.title ? _this.resolveClassName('step-no-content') : '', isDone(index) ? 'done' : '', isCurrent(index) ? 'current' : '', isCurrent(index) && _this.status === 'error' ? 'is-error' : '', step.status && isCurrent(index) ? ["".concat(_this.resolveClassName("step-".concat(step.status)))] : '', step.disabled ? 'is-disabled' : '', _this.controllable && !step.disabled ? 'is-controllable' : '']
|
|
767
768
|
}, [(0,external_vue_namespaceObject.createVNode)("span", {
|
|
768
|
-
"
|
|
769
|
-
cursor: _this.controllable ? 'pointer' : ''
|
|
770
|
-
},
|
|
771
|
-
"class": ["".concat(_this.resolveClassName('step-indicator')), "".concat(_this.resolveClassName("step-".concat(iconType(step) ? 'icon' : 'number'))), "".concat(_this.resolveClassName("step-icon".concat(step.status)))],
|
|
769
|
+
"class": ["".concat(_this.resolveClassName('step-indicator')), "".concat(_this.resolveClassName("step-".concat(iconType(step) ? 'icon' : 'number'))), "".concat(step.status ? _this.resolveClassName("step-icon".concat(step.status)) : '')],
|
|
772
770
|
"onClick": function onClick() {
|
|
773
|
-
|
|
771
|
+
if (!step.disabled) {
|
|
772
|
+
_this.jumpTo(index + 1);
|
|
773
|
+
}
|
|
774
774
|
}
|
|
775
775
|
}, [(_this$$slots = (_this$$slots2 = (_this$$slots3 = _this.$slots)[index + 1]) === null || _this$$slots2 === void 0 ? void 0 : _this$$slots2.call(_this$$slots3)) !== null && _this$$slots !== void 0 ? _this$$slots : renderIcon(index, step)]), step.title ? (0,external_vue_namespaceObject.createVNode)("div", {
|
|
776
776
|
"class": "".concat(_this.resolveClassName('step-content'))
|
|
777
777
|
}, [(0,external_vue_namespaceObject.createVNode)("div", {
|
|
778
|
-
"style": {
|
|
779
|
-
cursor: _this.controllable ? 'pointer' : ''
|
|
780
|
-
},
|
|
781
778
|
"class": "".concat(_this.resolveClassName('step-title')),
|
|
782
779
|
"onClick": function onClick() {
|
|
783
|
-
|
|
780
|
+
if (!step.disabled) {
|
|
781
|
+
_this.jumpTo(index + 1);
|
|
782
|
+
}
|
|
784
783
|
}
|
|
785
784
|
}, [step.title]), step.description && (0,external_vue_namespaceObject.createVNode)("div", {
|
|
786
785
|
"class": "".concat(_this.resolveClassName('step-description')),
|
package/lib/steps/steps.css
CHANGED
|
@@ -32,15 +32,31 @@
|
|
|
32
32
|
}
|
|
33
33
|
.bk-steps .bk-step {
|
|
34
34
|
position: relative;
|
|
35
|
+
flex: 1;
|
|
35
36
|
margin-right: 16px;
|
|
36
37
|
overflow: hidden;
|
|
37
38
|
text-align: left;
|
|
38
39
|
white-space: nowrap;
|
|
39
|
-
|
|
40
|
+
}
|
|
41
|
+
.bk-steps .bk-step.is-controllable {
|
|
42
|
+
cursor: pointer;
|
|
43
|
+
}
|
|
44
|
+
.bk-steps .bk-step.is-disabled {
|
|
45
|
+
cursor: not-allowed;
|
|
46
|
+
}
|
|
47
|
+
.bk-steps .bk-step.is-disabled .bk-step-indicator {
|
|
48
|
+
color: #dcdee5;
|
|
49
|
+
border-color: #dcdee5;
|
|
50
|
+
}
|
|
51
|
+
.bk-steps .bk-step.is-disabled .bk-step-title {
|
|
52
|
+
color: #dcdee5;
|
|
40
53
|
}
|
|
41
54
|
.bk-steps .bk-step .bk-step-indicator {
|
|
42
55
|
z-index: 1;
|
|
56
|
+
box-sizing: border-box;
|
|
43
57
|
display: inline-flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
justify-content: center;
|
|
44
60
|
width: 24px;
|
|
45
61
|
height: 24px;
|
|
46
62
|
padding: 0;
|
|
@@ -52,9 +68,6 @@
|
|
|
52
68
|
background-color: #fff;
|
|
53
69
|
border: 1px solid #979ba5;
|
|
54
70
|
border-radius: 50%;
|
|
55
|
-
box-sizing: border-box;
|
|
56
|
-
align-items: center;
|
|
57
|
-
justify-content: center;
|
|
58
71
|
}
|
|
59
72
|
.bk-steps .bk-step .bk-step-number {
|
|
60
73
|
font-family: arial;
|
|
@@ -79,8 +92,8 @@
|
|
|
79
92
|
left: 100%;
|
|
80
93
|
width: 99999px;
|
|
81
94
|
height: 1px;
|
|
82
|
-
background-color: transparent;
|
|
83
95
|
content: '';
|
|
96
|
+
background-color: transparent;
|
|
84
97
|
}
|
|
85
98
|
.bk-steps .bk-step .bk-step-description {
|
|
86
99
|
max-width: 140px;
|
|
@@ -97,16 +110,16 @@
|
|
|
97
110
|
left: 100%;
|
|
98
111
|
width: 99999px;
|
|
99
112
|
height: 1px;
|
|
100
|
-
background-color: transparent;
|
|
101
113
|
content: '';
|
|
114
|
+
background-color: transparent;
|
|
102
115
|
}
|
|
103
116
|
.bk-steps .bk-step.bk-step-no-content .bk-step-indicator::after {
|
|
104
117
|
top: 10px;
|
|
105
118
|
left: 32px;
|
|
106
119
|
}
|
|
107
120
|
.bk-steps .bk-step:last-child {
|
|
108
|
-
margin-right: 0;
|
|
109
121
|
flex: none;
|
|
122
|
+
margin-right: 0;
|
|
110
123
|
}
|
|
111
124
|
.bk-steps .bk-step:last-child .bk-step-title {
|
|
112
125
|
padding-right: 0;
|
|
@@ -240,8 +253,8 @@
|
|
|
240
253
|
.bk-steps-dashed .bk-step .bk-step-title::after,
|
|
241
254
|
.bk-steps-dashed .bk-step .bk-step-indicator::after {
|
|
242
255
|
background-image: linear-gradient(to right, #c4c6cc 50%, transparent 0%);
|
|
243
|
-
background-position: bottom;
|
|
244
256
|
background-repeat: repeat-x;
|
|
257
|
+
background-position: bottom;
|
|
245
258
|
background-size: 6px 1px;
|
|
246
259
|
}
|
|
247
260
|
.bk-steps-solid .bk-step .bk-step-title::after,
|
|
@@ -266,11 +279,11 @@
|
|
|
266
279
|
left: 12px;
|
|
267
280
|
width: 1px;
|
|
268
281
|
height: 100%;
|
|
282
|
+
content: '';
|
|
269
283
|
background-image: linear-gradient(#c4c6cc 50%, transparent 0%);
|
|
270
|
-
background-position: right;
|
|
271
284
|
background-repeat: repeat-y;
|
|
285
|
+
background-position: right;
|
|
272
286
|
background-size: 1px 6px;
|
|
273
|
-
content: '';
|
|
274
287
|
}
|
|
275
288
|
.bk-steps-vertical .bk-step.done:has(+ .current.is-error)::after,
|
|
276
289
|
.bk-steps-vertical .bk-step.done:has( + .current.bk-step-error)::after {
|
|
@@ -278,10 +291,10 @@
|
|
|
278
291
|
}
|
|
279
292
|
.bk-steps-vertical .bk-step .bk-step-title {
|
|
280
293
|
display: flex;
|
|
294
|
+
align-items: center;
|
|
281
295
|
height: 100%;
|
|
282
296
|
margin-top: 0;
|
|
283
297
|
text-align: left;
|
|
284
|
-
align-items: center;
|
|
285
298
|
}
|
|
286
299
|
.bk-steps-small .bk-step .bk-step-indicator {
|
|
287
300
|
width: 20px;
|
package/lib/steps/steps.less
CHANGED
|
@@ -14,8 +14,8 @@
|
|
|
14
14
|
left: 100%;
|
|
15
15
|
width: 99999px;
|
|
16
16
|
height: 1px;
|
|
17
|
-
background-color: transparent;
|
|
18
17
|
content: '';
|
|
18
|
+
background-color: transparent;
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
|
|
@@ -54,15 +54,36 @@
|
|
|
54
54
|
|
|
55
55
|
.@{bk-prefix}-step {
|
|
56
56
|
position: relative;
|
|
57
|
+
flex: 1;
|
|
57
58
|
margin-right: 16px;
|
|
58
59
|
overflow: hidden;
|
|
59
60
|
text-align: left;
|
|
60
61
|
white-space: nowrap;
|
|
61
|
-
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
&.is-controllable {
|
|
65
|
+
cursor: pointer;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
&.is-disabled {
|
|
69
|
+
cursor: not-allowed;
|
|
70
|
+
.@{bk-prefix}-step-indicator {
|
|
71
|
+
color: #dcdee5;
|
|
72
|
+
border-color: #dcdee5;
|
|
73
|
+
}
|
|
74
|
+
.@{bk-prefix}-step-title {
|
|
75
|
+
color: #dcdee5;
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
}
|
|
79
|
+
}
|
|
62
80
|
|
|
63
81
|
.@{bk-prefix}-step-indicator {
|
|
64
82
|
z-index: 1;
|
|
83
|
+
box-sizing: border-box;
|
|
65
84
|
display: inline-flex;
|
|
85
|
+
align-items: center;
|
|
86
|
+
justify-content: center;
|
|
66
87
|
width: 24px;
|
|
67
88
|
height: 24px;
|
|
68
89
|
padding: 0;
|
|
@@ -74,9 +95,6 @@
|
|
|
74
95
|
background-color: #fff;
|
|
75
96
|
border: 1px solid #979ba5;
|
|
76
97
|
border-radius: 50%;
|
|
77
|
-
box-sizing: border-box;
|
|
78
|
-
align-items: center;
|
|
79
|
-
justify-content: center;
|
|
80
98
|
|
|
81
99
|
// .@{bk-prefix}-steps-icon {
|
|
82
100
|
// color: @white-color;
|
|
@@ -126,8 +144,8 @@
|
|
|
126
144
|
}
|
|
127
145
|
|
|
128
146
|
&:last-child {
|
|
129
|
-
margin-right: 0;
|
|
130
147
|
flex: none;
|
|
148
|
+
margin-right: 0;
|
|
131
149
|
|
|
132
150
|
.@{bk-prefix}-step-title {
|
|
133
151
|
padding-right: 0;
|
|
@@ -253,8 +271,8 @@
|
|
|
253
271
|
.@{bk-prefix}-step-indicator {
|
|
254
272
|
&::after {
|
|
255
273
|
background-image: linear-gradient(to right, @light-gray 50%, transparent 0%);
|
|
256
|
-
background-position: bottom;
|
|
257
274
|
background-repeat: repeat-x;
|
|
275
|
+
background-position: bottom;
|
|
258
276
|
background-size: 6px 1px;
|
|
259
277
|
}
|
|
260
278
|
}
|
|
@@ -293,11 +311,11 @@
|
|
|
293
311
|
left: 12px;
|
|
294
312
|
width: 1px;
|
|
295
313
|
height: 100%;
|
|
314
|
+
content: '';
|
|
296
315
|
background-image: linear-gradient(@light-gray 50%, transparent 0%);
|
|
297
|
-
background-position: right;
|
|
298
316
|
background-repeat: repeat-y;
|
|
317
|
+
background-position: right;
|
|
299
318
|
background-size: 1px 6px;
|
|
300
|
-
content: '';
|
|
301
319
|
}
|
|
302
320
|
|
|
303
321
|
&.done {
|
|
@@ -311,10 +329,10 @@
|
|
|
311
329
|
|
|
312
330
|
.@{bk-prefix}-step-title {
|
|
313
331
|
display: flex;
|
|
332
|
+
align-items: center;
|
|
314
333
|
height: 100%;
|
|
315
334
|
margin-top: 0;
|
|
316
335
|
text-align: left;
|
|
317
|
-
align-items: center;
|
|
318
336
|
}
|
|
319
337
|
}
|
|
320
338
|
}
|
|
@@ -163,15 +163,31 @@
|
|
|
163
163
|
}
|
|
164
164
|
.bk-steps .bk-step {
|
|
165
165
|
position: relative;
|
|
166
|
+
flex: 1;
|
|
166
167
|
margin-right: 16px;
|
|
167
168
|
overflow: hidden;
|
|
168
169
|
text-align: left;
|
|
169
170
|
white-space: nowrap;
|
|
170
|
-
|
|
171
|
+
}
|
|
172
|
+
.bk-steps .bk-step.is-controllable {
|
|
173
|
+
cursor: pointer;
|
|
174
|
+
}
|
|
175
|
+
.bk-steps .bk-step.is-disabled {
|
|
176
|
+
cursor: not-allowed;
|
|
177
|
+
}
|
|
178
|
+
.bk-steps .bk-step.is-disabled .bk-step-indicator {
|
|
179
|
+
color: #dcdee5;
|
|
180
|
+
border-color: #dcdee5;
|
|
181
|
+
}
|
|
182
|
+
.bk-steps .bk-step.is-disabled .bk-step-title {
|
|
183
|
+
color: #dcdee5;
|
|
171
184
|
}
|
|
172
185
|
.bk-steps .bk-step .bk-step-indicator {
|
|
173
186
|
z-index: 1;
|
|
187
|
+
box-sizing: border-box;
|
|
174
188
|
display: inline-flex;
|
|
189
|
+
align-items: center;
|
|
190
|
+
justify-content: center;
|
|
175
191
|
width: 24px;
|
|
176
192
|
height: 24px;
|
|
177
193
|
padding: 0;
|
|
@@ -183,9 +199,6 @@
|
|
|
183
199
|
background-color: #fff;
|
|
184
200
|
border: 1px solid #979ba5;
|
|
185
201
|
border-radius: 50%;
|
|
186
|
-
box-sizing: border-box;
|
|
187
|
-
align-items: center;
|
|
188
|
-
justify-content: center;
|
|
189
202
|
}
|
|
190
203
|
.bk-steps .bk-step .bk-step-number {
|
|
191
204
|
font-family: arial;
|
|
@@ -210,8 +223,8 @@
|
|
|
210
223
|
left: 100%;
|
|
211
224
|
width: 99999px;
|
|
212
225
|
height: 1px;
|
|
213
|
-
background-color: transparent;
|
|
214
226
|
content: '';
|
|
227
|
+
background-color: transparent;
|
|
215
228
|
}
|
|
216
229
|
.bk-steps .bk-step .bk-step-description {
|
|
217
230
|
max-width: 140px;
|
|
@@ -228,16 +241,16 @@
|
|
|
228
241
|
left: 100%;
|
|
229
242
|
width: 99999px;
|
|
230
243
|
height: 1px;
|
|
231
|
-
background-color: transparent;
|
|
232
244
|
content: '';
|
|
245
|
+
background-color: transparent;
|
|
233
246
|
}
|
|
234
247
|
.bk-steps .bk-step.bk-step-no-content .bk-step-indicator::after {
|
|
235
248
|
top: 10px;
|
|
236
249
|
left: 32px;
|
|
237
250
|
}
|
|
238
251
|
.bk-steps .bk-step:last-child {
|
|
239
|
-
margin-right: 0;
|
|
240
252
|
flex: none;
|
|
253
|
+
margin-right: 0;
|
|
241
254
|
}
|
|
242
255
|
.bk-steps .bk-step:last-child .bk-step-title {
|
|
243
256
|
padding-right: 0;
|
|
@@ -371,8 +384,8 @@
|
|
|
371
384
|
.bk-steps-dashed .bk-step .bk-step-title::after,
|
|
372
385
|
.bk-steps-dashed .bk-step .bk-step-indicator::after {
|
|
373
386
|
background-image: linear-gradient(to right, var(--light-gray) 50%, transparent 0%);
|
|
374
|
-
background-position: bottom;
|
|
375
387
|
background-repeat: repeat-x;
|
|
388
|
+
background-position: bottom;
|
|
376
389
|
background-size: 6px 1px;
|
|
377
390
|
}
|
|
378
391
|
.bk-steps-solid .bk-step .bk-step-title::after,
|
|
@@ -397,11 +410,11 @@
|
|
|
397
410
|
left: 12px;
|
|
398
411
|
width: 1px;
|
|
399
412
|
height: 100%;
|
|
413
|
+
content: '';
|
|
400
414
|
background-image: linear-gradient(var(--light-gray) 50%, transparent 0%);
|
|
401
|
-
background-position: right;
|
|
402
415
|
background-repeat: repeat-y;
|
|
416
|
+
background-position: right;
|
|
403
417
|
background-size: 1px 6px;
|
|
404
|
-
content: '';
|
|
405
418
|
}
|
|
406
419
|
.bk-steps-vertical .bk-step.done:has(+ .current.is-error)::after,
|
|
407
420
|
.bk-steps-vertical .bk-step.done:has( + .current.bk-step-error)::after {
|
|
@@ -409,10 +422,10 @@
|
|
|
409
422
|
}
|
|
410
423
|
.bk-steps-vertical .bk-step .bk-step-title {
|
|
411
424
|
display: flex;
|
|
425
|
+
align-items: center;
|
|
412
426
|
height: 100%;
|
|
413
427
|
margin-top: 0;
|
|
414
428
|
text-align: left;
|
|
415
|
-
align-items: center;
|
|
416
429
|
}
|
|
417
430
|
.bk-steps-small .bk-step .bk-step-indicator {
|
|
418
431
|
width: 20px;
|