You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

58 lines
1.1 KiB

<template>
<div>
<a-steps :current="current">
<a-step v-for="(step, i) of stepList" :title="step.label" />
</a-steps>
</div>
</template>
<script>
import { defineComponent } from 'vue';
export default defineComponent({
name: 'NsSteps',
props: {
current: {
type: Number,
default: 0,
},
stepList: {
type: Array,
default: () => [],
},
},
setup() {},
});
</script>
<style scoped>
:deep(.ant-steps-item-icon) {
width: 24px;
height: 24px;
line-height: 24px;
}
:deep(.ant-steps-item-title) {
line-height: 24px;
}
:deep(.ant-steps-item-title::after) {
position: absolute;
top: 12px;
left: 100%;
display: block;
width: 150px;
height: 1px;
background: #f0f0f0;
content: '';
max-width: 200px;
min-width: 32px;
}
:deep(.ant-steps) {
margin: 0 !important;
justify-content: center;
}
:deep(.ant-steps-item) {
flex: none;
flex-shrink: 1;
margin-right: 0px !important;
width: 200px;
}
:deep(.ant-steps-item-container) {
}
</style>