docs(steps): optimize demo (#1415)

examples/sites/demos/pc/app/steps/advanced-steps-composition-api.vue

@@ -23,6 +23,6 @@ const data = ref([
 const advancedClick = (index, node) => {
   advancedActive.value = index
 
-  Modal.message(`节点index: ${index}; 节点信息: ${JSON.stringify(node)}.`)
+  Modal.message({ message: `节点 index: ${index}; 节点信息: ${JSON.stringify(node)}`, status: 'info' })
 }
 </script>

examples/sites/demos/pc/app/steps/advanced-steps.vue

@@ -30,7 +30,7 @@ export default {
     advancedClick(index, node) {
       this.advancedActive = index
 
-      Modal.message(`节点index: ${index}; 节点信息: ${JSON.stringify(node)}.`)
+      Modal.message({ message: `节点 index: ${index}; 节点信息: ${JSON.stringify(node)}`, status: 'info' })
     }
   }
 }

examples/sites/demos/pc/app/steps/click-composition-api.vue

@@ -1,10 +1,6 @@
 <template>
   <div class="demo-steps-click">
     <tiny-steps :data="stepsData" :active="defaultActive" @click="normalClick"></tiny-steps>
-    <div v-if="currentNode">
-      <span>选中节点 index: {{ currentNode.index }} </span><br />
-      <span>选中节点 node: {{ currentNode.node }} </span>
-    </div>
   </div>
 </template>
 
@@ -35,14 +31,11 @@ const stepsData = ref([
   }
 ])
 const defaultActive = ref(1)
-const currentNode = ref(null)
 
 const normalClick = (index, node) => {
   defaultActive.value = index
-  currentNode.value = {
-    index,
-    node: JSON.stringify(node)
-  }
+
+  Modal.message({ message: `节点 index：${index}；节点信息： ${JSON.stringify(node)}`, status: 'info' })
 }
 </script>
 

examples/sites/demos/pc/app/steps/click.vue

@@ -1,16 +1,11 @@
 <template>
   <div class="demo-steps-click">
     <tiny-steps :data="stepsData" :active="defaultActive" @click="normalClick"></tiny-steps>
-    <div v-if="currentNode">
-      <span>选中节点 index: {{ currentNode.index }}</span
-      ><br />
-      <span>选中节点 node: {{ currentNode.node }} </span>
-    </div>
   </div>
 </template>
 
 <script>
-import { Steps } from '@opentiny/vue'
+import { Steps, Modal } from '@opentiny/vue'
 
 export default {
   components: {
@@ -40,17 +35,14 @@ export default {
           status: 'done'
         }
       ],
-      defaultActive: 1,
-      currentNode: null
+      defaultActive: 1
     }
   },
   methods: {
     normalClick(index, node) {
       this.defaultActive = index
-      this.currentNode = {
-        index,
-        node: JSON.stringify(node)
-      }
+
+      Modal.message({ message: `节点 index: ${index}; 节点信息: ${JSON.stringify(node)}`, status: 'info' })
     }
   }
 }

examples/sites/demos/pc/app/time-line/show-divider-composition-api.vue

@@ -13,6 +13,6 @@ const data = reactive([{ name: 'Basic Info' }, { name: 'BOQ Info' }, { name: 'In
 const normalClick = (index, node) => {
   normalActive.value = index
 
-  Modal.message(`节点index: ${index}; 节点信息: ${JSON.stringify(node)}.`)
+  Modal.message({ message: `节点 index: ${index}; 节点信息: ${JSON.stringify(node)}`, status: 'info' })
 }
 </script>

examples/sites/demos/pc/app/time-line/show-divider.vue

@@ -20,7 +20,7 @@ export default {
     normalClick(index, node) {
       this.normalActive = index
 
-      Modal.message(`节点index: ${index}; 节点信息: ${JSON.stringify(node)}.`)
+      Modal.message({ message: `节点 index: ${index}; 节点信息: ${JSON.stringify(node)}`, status: 'info' })
     }
   }
 }