From 6f2b44bb4d2d8327146ec299f2fbd918669d25d9 Mon Sep 17 00:00:00 2001
From: cookfront <cookfront@gmail.com>
Date: Thu, 2 Mar 2017 11:29:01 +0800
Subject: [PATCH] step component

---
 build/bin/build-entry.js         |  6 +++---
 docs/examples-docs/steps.md      |  2 +-
 docs/examples/steps.vue          | 13 +++++++++++++
 package.json                     |  2 +-
 packages/steps/src/step.vue      |  6 +++++-
 packages/steps/src/steps.vue     | 28 ++++++++++++++++++++++++----
 packages/zanui-css/src/icon.css  |  2 +-
 packages/zanui-css/src/steps.css |  4 +++-
 src/index.js                     |  2 +-
 9 files changed, 52 insertions(+), 13 deletions(-)
 create mode 100644 docs/examples/steps.vue

diff --git a/build/bin/build-entry.js b/build/bin/build-entry.js
index 1eb734fc6..3cb84161a 100644
--- a/build/bin/build-entry.js
+++ b/build/bin/build-entry.js
@@ -16,9 +16,9 @@ const install = function(Vue) {
 };
 
 // auto install
-if (typeof window !== 'undefined' && window.Vue) {
-  install(window.Vue);
-}
+// if (typeof window !== 'undefined' && window.Vue) {
+//   install(window.Vue);
+// }
 
 module.exports = {
   install,
diff --git a/docs/examples-docs/steps.md b/docs/examples-docs/steps.md
index 42b0bef2f..bb6c3d1e8 100644
--- a/docs/examples-docs/steps.md
+++ b/docs/examples-docs/steps.md
@@ -1,4 +1,4 @@
 ## Steps 步骤条
 
-
+### 基础用法
 
diff --git a/docs/examples/steps.vue b/docs/examples/steps.vue
new file mode 100644
index 000000000..7ecf83336
--- /dev/null
+++ b/docs/examples/steps.vue
@@ -0,0 +1,13 @@
+<template>
+  <div class="page-steps">
+    <h1 class="page-title">Steps</h1>
+
+    <h2 class="page-sub-title">基础用法</h2>
+    <zan-steps icon="topay">
+    </zan-steps>
+  </div>
+</template>
+
+<script>
+
+</script>
diff --git a/package.json b/package.json
index 3994333fe..05ca0aeee 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
   ],
   "scripts": {
     "bootstrap": "npm i --registry=http://registry.npm.qima-inc.com",
-    "dev": "npm run build:file && webpack-dev-server --port 8282 --inline --hot --config build/webpack.config.js",
+    "dev": "npm run build:file && webpack-dev-server --inline --hot --config build/webpack.config.js",
     "build:file": "node build/bin/build-entry.js",
     "build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js",
     "build:zanui-css": "gulp build --gulpfile packages/zanui-css/gulpfile.js && cp-cli packages/zanui-css/lib lib/zanui-css",
diff --git a/packages/steps/src/step.vue b/packages/steps/src/step.vue
index 2adec5086..888e58d1a 100644
--- a/packages/steps/src/step.vue
+++ b/packages/steps/src/step.vue
@@ -6,6 +6,10 @@
 
 <script>
 export default {
-  name: 'zan-step'
+  name: 'zan-step',
+
+  props: {
+    title: String
+  }
 };
 </script>
diff --git a/packages/steps/src/steps.vue b/packages/steps/src/steps.vue
index 49616922c..cfe6f52a0 100644
--- a/packages/steps/src/steps.vue
+++ b/packages/steps/src/steps.vue
@@ -1,6 +1,8 @@
 <template>
   <div class="zan-steps">
-    <div class="zan-steps__desc"></div>
+    <div class="zan-steps__desc" v-if="icon">
+      <i class="zan-icon" :class="computedIconClass"></i>
+    </div>
     <div class="zan-steps__items">
       <slot></slot>
     </div>
@@ -8,7 +10,25 @@
 </template>
 
 <script>
-  export default {
-    name: 'zan-steps'
-  };
+export default {
+  name: 'zan-steps',
+
+  props: {
+    active: Number,
+    icon: String,
+    iconClass: String,
+    title: String,
+    description: String
+  },
+
+  computed: {
+    computedIconClass() {
+      let iconName = `zan-icon-${this.icon}`;
+      let result = (iconClass && iconClass.split(' ')) || [];
+      result.push(iconName);
+
+      return result;
+    }
+  }
+};
 </script>
diff --git a/packages/zanui-css/src/icon.css b/packages/zanui-css/src/icon.css
index 7d5daddb7..7847d21f5 100644
--- a/packages/zanui-css/src/icon.css
+++ b/packages/zanui-css/src/icon.css
@@ -63,4 +63,4 @@
 .zan-icon-sign:before { content: '\e80d'; } /* '' */
 .zan-icon-store:before { content: '\e80e'; } /* '' */
 .zan-icon-topay:before { content: '\e80f'; } /* '' */
-.zan-icon-tosend:before { content: '\e810'; } /* '' */
\ No newline at end of file
+.zan-icon-tosend:before { content: '\e810'; } /* '' */
diff --git a/packages/zanui-css/src/steps.css b/packages/zanui-css/src/steps.css
index 8ad4d1937..694c914b7 100644
--- a/packages/zanui-css/src/steps.css
+++ b/packages/zanui-css/src/steps.css
@@ -1,5 +1,7 @@
+@import "./common/var.css";
+
 @component-namespace zan {
   @b steps {
-    color: red;
+    padding: 15px 0;
   }
 }
diff --git a/src/index.js b/src/index.js
index bd9ebdc0c..41afa464d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -48,7 +48,7 @@ const install = function(Vue) {
   Vue.component(Step.name, Step);
 };
 
-// auto install
+auto install
 if (typeof window !== 'undefined' && window.Vue) {
   install(window.Vue);
 }