feat: publicize doc implemetation

one/docs/demo/steps/default.vue

@@ -0,0 +1,117 @@
+<template>
+<article>
+  <section>
+    <h4>Current step</h4>
+    <veui-number-input
+      v-model="current"
+      :min="1"
+      :max="steps.length"
+      :step="1"
+    />
+  </section>
+  <section>
+    <h4>Size</h4>
+    <veui-radio
+      v-for="({ value, label }) in sizeList"
+      :key="value"
+      v-model="size"
+      :value="value"
+    >
+      {{ label }}
+    </veui-radio>
+  </section>
+  <section>
+    <h4>Direction</h4>
+    <veui-radio
+      v-for="({ value, label }) in directionList"
+      :key="value"
+      v-model="direction"
+      :value="value"
+    >
+      {{ label }}
+    </veui-radio>
+  </section>
+  <section>
+    <veui-steps
+      :ui="ui"
+      :steps="steps"
+      :current="current - 1"
+    />
+  </section>
+</article>
+</template>
+
+<script>
+import { Steps, NumberInput, Radio } from 'veui'
+
+export default {
+  components: {
+    'veui-steps': Steps,
+    'veui-number-input': NumberInput,
+    'veui-radio': Radio
+  },
+  data () {
+    return {
+      current: 1,
+      size: 'm',
+      direction: '',
+      vertical: false,
+      sizeList: [
+        {
+          label: 's',
+          value: 's'
+        },
+        {
+          label: 'm',
+          value: 'm'
+        }
+      ],
+      directionList: [
+        {
+          label: 'vertical',
+          value: 'vertical'
+        },
+        {
+          label: 'label-vertical',
+          value: 'label-vertical'
+        },
+        {
+          label: 'default',
+          value: ''
+        }
+      ],
+      steps: [
+        { label: 'Step 1', desc: '填写信息' },
+        { label: 'Step 2', desc: '验证身份' },
+        { label: 'Step 3', desc: '注册成功' }
+      ]
+    }
+  },
+  computed: {
+    ui () {
+      return [
+        this.size,
+        this.direction
+      ].join(' ')
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped docs>
+h4 {
+  margin: 0 0 10px;
+}
+
+section {
+  margin-bottom: 10px;
+}
+
+section + section {
+  margin-top: 20px;
+}
+
+.veui-radio {
+  margin-right: 20px;
+}
+</style>

one/docs/demo/steps/status.vue

@@ -0,0 +1,54 @@
+<template>
+<article>
+  <section>
+    <h4>Current step</h4>
+    <veui-number-input
+      v-model="current"
+      :min="1"
+      :max="steps.length"
+      :step="1"
+    />
+  </section>
+  <section>
+    <veui-steps
+      :steps="steps"
+      :current="current - 1"
+    />
+  </section>
+</article>
+</template>
+
+<script>
+import { Steps, NumberInput } from 'veui'
+
+export default {
+  components: {
+    'veui-steps': Steps,
+    'veui-number-input': NumberInput
+  },
+  data () {
+    return {
+      current: 2,
+      steps: [
+        { label: 'Step 1', desc: '填写信息' },
+        { label: 'Step 2', desc: '验证身份', status: 'error' },
+        { label: 'Step 3', desc: '注册成功' }
+      ]
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped docs>
+h4 {
+  margin: 0 0 10px;
+}
+
+section {
+  margin-bottom: 10px;
+}
+
+section + section {
+  margin-top: 20px;
+}
+</style>