<template>
  <div class='tuitui-step'>
    <div class='title'>示例</div>
    <BKStep v-bind='example'></BKStep>
  </div>
</template>
<script>
import BKStep from '@/components/BKStep'

export default {
  components: {
    BKStep
  },
  data () {
    return {
      example: {
        list: [
          {
            title: '成功',
            desc: '若征信情况非良好，产品和费用均可能发生变， 若征信情况非良好，产品和费用均可能发生变',
            icon: 'success'
          },
          {
            title: '失败',
            desc: '失败的描述',
            icon: 'failed'
          },
          {
            title: '跳过',
            desc: '跳过的描述',
            icon: 'ignore'
          },
          {
            title: '当前',
            desc: '表示当前正在进行',
            icon: 'ongoing'
          },
          {
            title: '当前',
            desc: '表示当前正在进行',
            icon: 'ongoing'
          },
          {
            title: '未发生',
            icon: 'undone'
          },
          {
            title: '未发生2',
            icon: 'undone'
          }
        ]
      }
    }
  },
  mounted () {
    wx.setNavigationBarTitle({
      title: 'BKStep 步骤条'
    })
  }
}
</script>
<style scoped>
.tuitui-step {
  padding: 0 40px;
}
.title {
  font-size: 26px;
  font-weight: 600;
  color: #ccc;
  margin-bottom: 20px;
  margin-top: 40px;
}
</style>
