From 3cdc6622bedbae1bf3ec126174b8e8e9778c4acd Mon Sep 17 00:00:00 2001
From: pangxie1991 <chenyao1102@gmail.com>
Date: Fri, 30 Dec 2016 20:47:17 +0800
Subject: [PATCH] vsteps

---
 dist/vsteps/index.wxss    | 20 ++++++++--------
 example/vsteps/index.wxml | 48 ++++++++++++---------------------------
 2 files changed, 26 insertions(+), 42 deletions(-)

diff --git a/dist/vsteps/index.wxss b/dist/vsteps/index.wxss
index 04eb688c..cb964d29 100644
--- a/dist/vsteps/index.wxss
+++ b/dist/vsteps/index.wxss
@@ -10,7 +10,7 @@
   left: 42px;
 }
 
-.zui-vsteps--active {
+.zui-vsteps__step--done {
   color: #44BB00;
 }
 
@@ -23,7 +23,7 @@
   background-color: #e5e5e5;
 }
 
-.zui-vsteps__content {
+.zui-vsteps__title {
   padding-left: 27px;
 }
 
@@ -33,23 +33,25 @@
   top: 50%;
   transform: translate(-50%, -50%);
   z-index: 2;
-  font-size: 0;
-  line-height: 0;
   padding: 3px 0;
   background-color: #fff;
 }
 
-.zui-vsteps__icon {
-
-}
-
-.zui-vsteps__icon--normal {
+.zui-vsteps__circle {
   width: 5px;
   height: 5px;
   background-color: #cacaca;
   border-radius: 10px;
 }
 
+.zui-vsteps__step--done .zui-vsteps__circle {
+  width: 13px;
+  height: 13px;
+  color: #09bb07;
+  background-color: transparent;
+  border-radius:0;
+}
+
 .zui-vsteps__icon--active {
   width: 13px;
   height: 13px;
diff --git a/example/vsteps/index.wxml b/example/vsteps/index.wxml
index c0b8a587..fcbdc4e6 100644
--- a/example/vsteps/index.wxml
+++ b/example/vsteps/index.wxml
@@ -1,43 +1,25 @@
 <view class="container">
   <view class="zui-panel">
-    <view
-      class="zui-vsteps zui-vsteps--active zui-vsteps--first-child"
-    >
-      <view class="zui-vsteps__line"></view>
-      <view class="">
-        <view class="zui-vsteps__content zui-vsteps__title">
-          <view class="zui-vsteps__icons">
-            <icon type="success" size="13" class="zui-vsteps__icon zui-vsteps__icon--active" />
-          </view>
-          <text>卖家退款(2016-03-23  20:20:20)</text>
-        </view>
+    <view class="zui-vsteps zui-vsteps__step--done zui-vsteps--first-child">
+      <view class="zui-vsteps__title">卖家退款(2016-03-23  20:20:20)</view>
+      <view class="zui-vsteps__icons">
+        <view class="zui-vsteps__circle zui-icon zui-icon-checked"></view>
       </view>
+      <view class="zui-vsteps__line"></view>
     </view>
-    <view
-      class="zui-vsteps zui-vsteps--active"
-    >
-      <view class="zui-vsteps__line"></view>
-      <view class="">
-        <view class="zui-vsteps__content zui-vsteps__title">
-          <view class="zui-vsteps__icons">
-            <icon type="success" size="13" class="zui-vsteps__icon zui-vsteps__icon--active" />
-          </view>
-          <text>卖家退款(2016-03-23  20:20:20)</text>
-        </view>
+    <view class="zui-vsteps zui-vsteps__step--done zui-vsteps__step--cur">
+      <view class="zui-vsteps__title">卖家退款(2016-03-23  20:20:20)</view>
+      <view class="zui-vsteps__icons">
+        <view class="zui-vsteps__circle zui-icon zui-icon-checked"></view>
       </view>
+      <view class="zui-vsteps__line"></view>
     </view>
-    <view
-      class="zui-vsteps zui-vsteps--last-child"
-    >
-      <view class="zui-vsteps__line"></view>
-      <view class="">
-        <view class="zui-vsteps__content zui-vsteps__title">
-          <view class="zui-vsteps__icons">
-            <view class="zui-vsteps__icon zui-vsteps__icon--normal"></view>
-          </view>
-          <text>卖家退款(2016-03-23  20:20:20)</text>
-        </view>
+    <view class="zui-vsteps zui-vsteps--last-child">
+      <view class="zui-vsteps__title">卖家退款(2016-03-23  20:20:20)</view>
+      <view class="zui-vsteps__icons">
+        <view class="zui-vsteps__circle"></view>
       </view>
+      <view class="zui-vsteps__line"></view>
     </view>
   </view>
 </view>