Steps 步骤条

<template>
  <PreviewBlock title="基础">
    <DuSteps
      :steps="basicSteps"
      status="success"
      :active-index="0"
      type="default"
    />
  </PreviewBlock>
  <PreviewBlock title="进行中">
    <DuSteps
      :steps="basicSteps"
      status="process"
      :active-index="1"
      type="default"
    />
  </PreviewBlock>
  <PreviewBlock title="深色">
    <div class="bg-black w-full py-16px rounded-8px">
      <DuSteps
        :steps="basicSteps"
        status="success"
        :active-index="2"
        type="ghost"
      />
    </div>
  </PreviewBlock>
  <PreviewBlock title="深色进行中">
    <div class="bg-black w-full py-16px rounded-8px">
      <DuSteps
        :steps="basicSteps"
        status="process"
        :active-index="3"
        type="ghost"
      />
    </div>
  </PreviewBlock>
</template>

<script setup lang="ts">
import { DuSteps } from 'dangoui'

const basicSteps = [
  { title: '等待支付' },
  { title: '等待卖家发货' },
  { title: '已发货' },
  { title: '送货中' },
  { title: '已到货' },
]
</script>