Skip to content

Commit 1900da8

Browse files
authored
feat(steps): Add wizard style step bar itemStyle differentiated configuration (#3594)
* fix: 去掉步骤条最大宽度限制 * fix: 增加向导型步骤条itemStyle差异化配置
1 parent 06a3dae commit 1900da8

File tree

4 files changed

+15
-6
lines changed

4 files changed

+15
-6
lines changed

examples/sites/demos/apis/steps.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -120,13 +120,13 @@ export default {
120120
type: 'Object',
121121
defaultValue: '{}',
122122
meta: {
123-
stable: '3.24.0'
123+
stable: '3.26.0'
124124
},
125125
desc: {
126126
'zh-CN':
127-
'自定义单链型步骤条块的内联样式,数据类型为{ [statusName: string]: styleObject },,不同状态可根据key值差异化配置, key值为status字段的值,value值为对应节点的样式对象',
127+
'步骤条块的内联样式,数据类型为{ [statusName: string]: styleObject },,不同状态可根据key值差异化配置, key值为status字段的值,value值为对应节点的样式对象',
128128
'en-US':
129-
'Customize the inline style of single chain step blocks, with data type {[statusName: string]: styleObject}. Different states can be configured differently based on key values, where the key value is the value of the status field and the value value is the style object of the corresponding node'
129+
'Customize the inline style of step blocks, with data type {[statusName: string]: styleObject}. Different states can be configured differently based on key values, where the key value is the value of the status field and the value value is the style object of the corresponding node'
130130
},
131131
mode: ['mobile-first']
132132
},

examples/sites/demos/mobile-first/app/steps/advanced-steps.vue

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
<template>
2-
<tiny-steps ref="steps" advanced :data="data" :active="advancedActive" @click="advancedClick"></tiny-steps>
2+
<tiny-steps
3+
ref="steps"
4+
advanced
5+
:item-style="{ disabled: { background: 'yellow', maxWidth: '360px' } }"
6+
:data="data"
7+
:active="advancedActive"
8+
@click="advancedClick"
9+
></tiny-steps>
310
</template>
411

512
<script>

packages/vue/src/steps/src/mobile-first/mobile-first-advanced.vue

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@
3131
<template #block="{ slotScoped: { node, index } }">
3232
<div
3333
data-tag="tiny-steps-block"
34+
:style="itemStyle[node.status]"
3435
:class="
3536
m(
3637
gcls('steps-block'),
@@ -201,7 +202,8 @@ export default defineComponent({
201202
'noArrow',
202203
'flex',
203204
'size',
204-
'contentCenter'
205+
'contentCenter',
206+
'itemStyle'
205207
],
206208
setup(props: any, context: any) {
207209
return setup({ props, context, renderless, api, classes })

packages/vue/src/steps/src/mobile-first/mobile-first-normal.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@
4545
<div
4646
data-tag="tiny-steps-block"
4747
v-for="(node, index) in data"
48-
:style="itemStyle[node.status || 'none']"
48+
:style="itemStyle[node.status]"
4949
v-show="isVisibleHandler(index) === 'visible'"
5050
:key="index"
5151
:class="

0 commit comments

Comments
 (0)