From 44600789dcf3824ccad4bac3e7fc7a6fa2b7eedf Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Sun, 26 Feb 2017 15:42:19 +0800
Subject: [PATCH 01/10] badge css done

---
 components.json                    |  4 +-
 docs/examples-docs/badge.md        | 14 ++++++
 package.json                       |  7 ++-
 packages/badge-group/index.js      |  3 ++
 packages/badge/CHANGELOG.md        |  8 ++++
 packages/badge/README.md           | 26 +++++++++++
 packages/badge/index.js            |  3 ++
 packages/badge/package.json        | 10 +++++
 packages/badge/src/badge-group.vue | 11 +++++
 packages/badge/src/badge.vue       | 23 ++++++++++
 packages/zanui-css/src/badge.css   | 71 ++++++++++++++++++++++++++++++
 packages/zanui-css/src/index.css   |  1 +
 src/index.js                       |  8 +++-
 13 files changed, 185 insertions(+), 4 deletions(-)
 create mode 100644 docs/examples-docs/badge.md
 create mode 100644 packages/badge-group/index.js
 create mode 100644 packages/badge/CHANGELOG.md
 create mode 100644 packages/badge/README.md
 create mode 100644 packages/badge/index.js
 create mode 100644 packages/badge/package.json
 create mode 100644 packages/badge/src/badge-group.vue
 create mode 100644 packages/badge/src/badge.vue
 create mode 100644 packages/zanui-css/src/badge.css

diff --git a/components.json b/components.json
index 579038825..85636467e 100644
--- a/components.json
+++ b/components.json
@@ -10,5 +10,7 @@
   "dialog": "./packages/dialog/index.js",
   "picker": "./packages/picker/index.js",
   "radio-group": "./packages/radio-group/index.js",
-  "loading": "./packages/loading/index.js"
+  "loading": "./packages/loading/index.js",
+  "badge": "./packages/badge/index.js",
+  "badge-group": "./packages/badge-group/index.js"
 }
diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
new file mode 100644
index 000000000..c73d6a8e5
--- /dev/null
+++ b/docs/examples-docs/badge.md
@@ -0,0 +1,14 @@
+## Badge 组件
+
+### 基础用法
+
+:::demo 样例代码
+```html
+<z-badge-group>
+  <z-badge is-selected value="热销榜" info="8"></z-badge>
+  <z-badge value="花式寿司" info="99"></z-badge>
+  <z-badge value="火炽寿司"></z-badge>
+  <z-badge value="手握寿司" info="199"></z-badge>
+</z-badge-group>
+```
+:::
\ No newline at end of file
diff --git a/package.json b/package.json
index 98b435cd3..81ced6a56 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 bootstrap && npm run build:file && webpack-dev-server --inline --hot --config build/webpack.config.js",
+    "dev": "npm run bootstrap && npm run build:file && webpack-dev-server --port 8282 --inline --hot --config build/webpack.config.js",
     "build:file": "node build/bin/build-entry.js",
     "build:zanui-css": "gulp build --gulpfile packages/zanui-css/gulpfile.js && cp-cli packages/zanui-css/lib lib/zanui-css",
     "build:zanui": "webpack --progress --hide-modules --config  build/webpack.build.js && webpack --progress --hide-modules --config  build/webpack.build.min.js",
@@ -38,6 +38,7 @@
     "vue": "^2.1.8"
   },
   "devDependencies": {
+    "autoprefixer": "^6.7.5",
     "babel-cli": "^6.14.0",
     "babel-core": "^6.17.0",
     "babel-eslint": "^6.1.2",
@@ -49,6 +50,7 @@
     "babel-plugin-transform-vue-jsx": "^3.3.0",
     "babel-preset-es2015": "^6.16.0",
     "babel-runtime": "^6.11.0",
+    "cheerio": "^0.22.0",
     "copy-webpack-plugin": "^4.0.1",
     "cp-cli": "^1.0.2",
     "cross-env": "^3.1.3",
@@ -67,6 +69,7 @@
     "gulp": "^3.9.1",
     "gulp-cssmin": "^0.1.7",
     "gulp-postcss": "^6.1.1",
+    "gulp-util": "^3.0.8",
     "highlight.js": "^9.8.0",
     "html-loader": "^0.4.3",
     "html-webpack-plugin": "^2.22.0",
@@ -119,4 +122,4 @@
     "webpack-node-externals": "^1.5.4",
     "webpack-vendor-chunk-plugin": "^1.0.0"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/badge-group/index.js b/packages/badge-group/index.js
new file mode 100644
index 000000000..2bff2f50d
--- /dev/null
+++ b/packages/badge-group/index.js
@@ -0,0 +1,3 @@
+import BadgeGroup from '../badge/src/badge-group';
+
+export default BadgeGroup;
diff --git a/packages/badge/CHANGELOG.md b/packages/badge/CHANGELOG.md
new file mode 100644
index 000000000..e88c472b3
--- /dev/null
+++ b/packages/badge/CHANGELOG.md
@@ -0,0 +1,8 @@
+## 0.0.2 (2017-01-20)
+
+* 改了bug A
+* 加了功能B
+
+## 0.0.1 (2017-01-10)
+
+* 第一版
diff --git a/packages/badge/README.md b/packages/badge/README.md
new file mode 100644
index 000000000..4c6172563
--- /dev/null
+++ b/packages/badge/README.md
@@ -0,0 +1,26 @@
+# @youzan/<%= name %>
+
+!!! 请在此处填写你的文档最简单描述 !!!
+
+[![version][version-image]][download-url]
+[![download][download-image]][download-url]
+
+[version-image]: http://npm.qima-inc.com/badge/v/@youzan/<%= name %>.svg?style=flat-square
+[download-image]: http://npm.qima-inc.com/badge/d/@youzan/<%= name %>.svg?style=flat-square
+[download-url]: http://npm.qima-inc.com/package/@youzan/<%= name %>
+
+## Demo
+
+## Usage
+
+## API
+
+| 参数       | 说明      | 类型       | 默认值       | 可选值       |
+|-----------|-----------|-----------|-------------|-------------|
+| className | 自定义额外类名 | string  | ''          | ''          |
+
+
+
+
+## License
+[MIT](https://opensource.org/licenses/MIT)
diff --git a/packages/badge/index.js b/packages/badge/index.js
new file mode 100644
index 000000000..dc8381205
--- /dev/null
+++ b/packages/badge/index.js
@@ -0,0 +1,3 @@
+import Badge from './src/badge';
+
+export default Badge;
diff --git a/packages/badge/package.json b/packages/badge/package.json
new file mode 100644
index 000000000..7dbfa2900
--- /dev/null
+++ b/packages/badge/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "<%= name %>",
+  "version": "<%= version %>",
+  "description": "<%= description %>",
+  "main": "./lib/index.js",
+  "author": "<%= author %>",
+  "license": "<%= license %>",
+  "devDependencies": {},
+  "dependencies": {}
+}
diff --git a/packages/badge/src/badge-group.vue b/packages/badge/src/badge-group.vue
new file mode 100644
index 000000000..1b928e828
--- /dev/null
+++ b/packages/badge/src/badge-group.vue
@@ -0,0 +1,11 @@
+<template>
+  <div class="z-badge-group">
+    <slot></slot>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'z-badge-group'
+};
+</script>
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
new file mode 100644
index 000000000..e8df950ab
--- /dev/null
+++ b/packages/badge/src/badge.vue
@@ -0,0 +1,23 @@
+<template>
+    <a class="z-badge" :class="{ 'is-select' : isSelected }" :href="url" @click="handleClick">
+      <div class="z-badge__active"></div>
+      <div v-if="info" class="z-badge__info">{{info}}</div>
+      {{value}}
+    </a>
+</template>
+<script>
+export default {
+  name: 'z-badge',
+  props: {
+    url: String,
+    value: String,
+    info: String,
+    isSelected: Boolean
+  },
+  methods: {
+    handleClick() {
+      this.$emit('click');
+    }
+  }
+};
+</script>
\ No newline at end of file
diff --git a/packages/zanui-css/src/badge.css b/packages/zanui-css/src/badge.css
new file mode 100644
index 000000000..5e1d816ed
--- /dev/null
+++ b/packages/zanui-css/src/badge.css
@@ -0,0 +1,71 @@
+@import "./common/var.pcss";
+@import "./mixins/border_retina.pcss";
+
+@component-namespace z {
+    @b badge-group {
+        position: relative;
+        width: 85px;
+        &::after {
+          @mixin border-retina (top);
+        }
+    }
+    @b badge {
+        display: block;
+        overflow: hidden;
+        position: relative;
+        padding: 20px 15px;
+        box-sizing: border-box;
+        line-height: 14px;
+        background-color: $c-background;
+        color: $c-gray-darker;
+        font-size: 14px;
+        text-decoration: none;
+        white-space: nowrap;
+        @e active {
+            display: none;
+            position: absolute;
+            left: 0;
+            top: 0;
+            width: 3px;
+            height: 100%;
+            background-color: #FF4444;
+        }
+        @e info {
+            position: absolute;
+            top: 2px;
+            right: 2px;
+            font-size: 10px;
+            transform:scale(0.8);
+            text-align: center;
+            box-sizing: border-box;
+            padding: 0 6px;
+            min-width: 18px;
+            height: 18px;
+            line-height: 18px;
+            border-radius: 9px;
+            background-color: #FF4444;
+            color: $c-white;
+        }
+        @when select {
+            font-weight: bold;
+            color: $c-black;
+            background-color: $c-white;
+            .z-badge__active {
+                display: block;
+            }
+            &::after {
+                @mixin border-retina (top);
+                @mixin border-retina (right);
+                @mixin border-retina (left);
+            }
+        }
+        &::after {
+          @mixin border-retina (bottom);
+        }
+        &:last-child {
+          &::after {
+            border-bottom: 0;
+          }
+        }
+    }
+}
\ No newline at end of file
diff --git a/packages/zanui-css/src/index.css b/packages/zanui-css/src/index.css
index 50bad75d3..faf3315a5 100644
--- a/packages/zanui-css/src/index.css
+++ b/packages/zanui-css/src/index.css
@@ -12,3 +12,4 @@
 @import './popup.css';
 @import './radio.css';
 @import './switch.css';
+@import './badge.css';
diff --git a/src/index.js b/src/index.js
index d591aba7e..1ef347b6e 100644
--- a/src/index.js
+++ b/src/index.js
@@ -10,6 +10,8 @@ import Dialog from '../packages/dialog/index.js';
 import Picker from '../packages/picker/index.js';
 import RadioGroup from '../packages/radio-group/index.js';
 import Loading from '../packages/loading/index.js';
+import Badge from '../packages/badge/index.js';
+import BadgeGroup from '../packages/badge-group/index.js';
 
 const install = function(Vue) {
   if (install.installed) return;
@@ -25,6 +27,8 @@ const install = function(Vue) {
   Vue.component(Picker.name, Picker);
   Vue.component(RadioGroup.name, RadioGroup);
   Vue.component(Loading.name, Loading);
+  Vue.component(Badge.name, Badge);
+  Vue.component(BadgeGroup.name, BadgeGroup);
 };
 
 // auto install
@@ -46,5 +50,7 @@ module.exports = {
   Dialog,
   Picker,
   RadioGroup,
-  Loading
+  Loading,
+  Badge,
+  BadgeGroup
 };

From c78fe7117709114463c9984412ce3b3a299a3311 Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Tue, 28 Feb 2017 10:24:33 +0800
Subject: [PATCH 02/10] done

---
 components.json                   |  3 ++-
 docs/examples-docs/search.md      | 10 +++++++++
 packages/search/CHANGELOG.md      |  8 +++++++
 packages/search/README.md         | 26 +++++++++++++++++++++++
 packages/search/index.js          |  3 +++
 packages/search/package.json      | 10 +++++++++
 packages/search/src/search.vue    | 31 +++++++++++++++++++++++++++
 packages/zanui-css/src/index.css  |  2 ++
 packages/zanui-css/src/search.css | 35 +++++++++++++++++++++++++++++++
 src/index.js                      |  5 ++++-
 10 files changed, 131 insertions(+), 2 deletions(-)
 create mode 100644 docs/examples-docs/search.md
 create mode 100644 packages/search/CHANGELOG.md
 create mode 100644 packages/search/README.md
 create mode 100644 packages/search/index.js
 create mode 100644 packages/search/package.json
 create mode 100644 packages/search/src/search.vue
 create mode 100644 packages/zanui-css/src/search.css

diff --git a/components.json b/components.json
index 85636467e..f75b5c7af 100644
--- a/components.json
+++ b/components.json
@@ -12,5 +12,6 @@
   "radio-group": "./packages/radio-group/index.js",
   "loading": "./packages/loading/index.js",
   "badge": "./packages/badge/index.js",
-  "badge-group": "./packages/badge-group/index.js"
+  "badge-group": "./packages/badge-group/index.js",
+  "search": "./packages/search/index.js"
 }
diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
new file mode 100644
index 000000000..76f9156d0
--- /dev/null
+++ b/docs/examples-docs/search.md
@@ -0,0 +1,10 @@
+## Search 组件
+
+### 基础用法
+
+:::demo 样例代码
+```html
+<z-search placeholder="商品名称">
+</z-search>
+```
+:::
\ No newline at end of file
diff --git a/packages/search/CHANGELOG.md b/packages/search/CHANGELOG.md
new file mode 100644
index 000000000..e88c472b3
--- /dev/null
+++ b/packages/search/CHANGELOG.md
@@ -0,0 +1,8 @@
+## 0.0.2 (2017-01-20)
+
+* 改了bug A
+* 加了功能B
+
+## 0.0.1 (2017-01-10)
+
+* 第一版
diff --git a/packages/search/README.md b/packages/search/README.md
new file mode 100644
index 000000000..4c6172563
--- /dev/null
+++ b/packages/search/README.md
@@ -0,0 +1,26 @@
+# @youzan/<%= name %>
+
+!!! 请在此处填写你的文档最简单描述 !!!
+
+[![version][version-image]][download-url]
+[![download][download-image]][download-url]
+
+[version-image]: http://npm.qima-inc.com/badge/v/@youzan/<%= name %>.svg?style=flat-square
+[download-image]: http://npm.qima-inc.com/badge/d/@youzan/<%= name %>.svg?style=flat-square
+[download-url]: http://npm.qima-inc.com/package/@youzan/<%= name %>
+
+## Demo
+
+## Usage
+
+## API
+
+| 参数       | 说明      | 类型       | 默认值       | 可选值       |
+|-----------|-----------|-----------|-------------|-------------|
+| className | 自定义额外类名 | string  | ''          | ''          |
+
+
+
+
+## License
+[MIT](https://opensource.org/licenses/MIT)
diff --git a/packages/search/index.js b/packages/search/index.js
new file mode 100644
index 000000000..716a43c6e
--- /dev/null
+++ b/packages/search/index.js
@@ -0,0 +1,3 @@
+import Search from './src/search';
+
+export default Search;
diff --git a/packages/search/package.json b/packages/search/package.json
new file mode 100644
index 000000000..7dbfa2900
--- /dev/null
+++ b/packages/search/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "<%= name %>",
+  "version": "<%= version %>",
+  "description": "<%= description %>",
+  "main": "./lib/index.js",
+  "author": "<%= author %>",
+  "license": "<%= license %>",
+  "devDependencies": {},
+  "dependencies": {}
+}
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
new file mode 100644
index 000000000..9bca8a53f
--- /dev/null
+++ b/packages/search/src/search.vue
@@ -0,0 +1,31 @@
+<template>
+  <div class="z-search">
+    <div class="z-search__input-wrap"  :class="{ 'is-focus' : isFocus }">
+      <input type="text" :value="value" :placeholder="placeholder" @focus="handleFocus" @blur="handleBlur">
+      <span class="zui-icon zui-icon-close"></span>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'z-search',
+    props: {
+      placeholder: String
+    },
+    data() {
+      return {
+        value: '',
+        isFocus: false
+      };
+    },
+    methods: {
+      handleFocus() {
+        this.isFocus = true;
+      },
+      handleBlur() {
+        this.isFocus = false;
+      }
+    }
+  };
+</script>
diff --git a/packages/zanui-css/src/index.css b/packages/zanui-css/src/index.css
index faf3315a5..d1e71a237 100644
--- a/packages/zanui-css/src/index.css
+++ b/packages/zanui-css/src/index.css
@@ -13,3 +13,5 @@
 @import './radio.css';
 @import './switch.css';
 @import './badge.css';
+@import './search.css';
+
diff --git a/packages/zanui-css/src/search.css b/packages/zanui-css/src/search.css
new file mode 100644
index 000000000..0411986e9
--- /dev/null
+++ b/packages/zanui-css/src/search.css
@@ -0,0 +1,35 @@
+@import "./common/var.pcss";
+@component-namespace z {
+    @b search {
+        padding: 4px 15px;
+        background-color: #F2F2F2;
+        @e input-wrap {
+            position: relative;
+            width: 92%;
+            padding: 8px 24px 8px 35px;
+            border: 1px solid $c-gray-light;
+            border-radius: 4px;
+            background-color: $c-white;
+            span {
+                display: none;
+                position: absolute;
+                right: 5px;
+                top: 8px;
+            }
+            @when focus {
+                width: 82%;
+                span {
+                    display: inline-block;
+                }
+            }
+            input {
+                width: 100%;
+                height: 14px;
+                font-size: 14px;
+                color: $c-gray-dark;
+                border: none;
+                outline: none;
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 1ef347b6e..84fcb72b3 100644
--- a/src/index.js
+++ b/src/index.js
@@ -12,6 +12,7 @@ import RadioGroup from '../packages/radio-group/index.js';
 import Loading from '../packages/loading/index.js';
 import Badge from '../packages/badge/index.js';
 import BadgeGroup from '../packages/badge-group/index.js';
+import Search from '../packages/search/index.js';
 
 const install = function(Vue) {
   if (install.installed) return;
@@ -29,6 +30,7 @@ const install = function(Vue) {
   Vue.component(Loading.name, Loading);
   Vue.component(Badge.name, Badge);
   Vue.component(BadgeGroup.name, BadgeGroup);
+  Vue.component(Search.name, Search);
 };
 
 // auto install
@@ -52,5 +54,6 @@ module.exports = {
   RadioGroup,
   Loading,
   Badge,
-  BadgeGroup
+  BadgeGroup,
+  Search
 };

From 04712433c039782af75d6eaa6b3f27d58477aacf Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Tue, 28 Feb 2017 15:10:20 +0800
Subject: [PATCH 03/10] done

---
 docs/examples-docs/search.md      |  4 +++-
 packages/search/src/search.vue    | 25 ++++++++++++++++++++-----
 packages/zanui-css/src/search.css | 31 ++++++++++++++++++++++++-------
 3 files changed, 47 insertions(+), 13 deletions(-)

diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
index 76f9156d0..f14d83b54 100644
--- a/docs/examples-docs/search.md
+++ b/docs/examples-docs/search.md
@@ -4,7 +4,9 @@
 
 :::demo 样例代码
 ```html
-<z-search placeholder="商品名称">
+<z-search 
+    placeholder="商品名称"
+>
 </z-search>
 ```
 :::
\ No newline at end of file
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
index 9bca8a53f..eb4bcb33b 100644
--- a/packages/search/src/search.vue
+++ b/packages/search/src/search.vue
@@ -1,9 +1,10 @@
 <template>
-  <div class="z-search">
-    <div class="z-search__input-wrap"  :class="{ 'is-focus' : isFocus }">
-      <input type="text" :value="value" :placeholder="placeholder" @focus="handleFocus" @blur="handleBlur">
-      <span class="zui-icon zui-icon-close"></span>
+  <div class="z-search" :class="{ 'is-focus' : isFocus }">
+    <div class="z-search__input-wrap">
+      <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus">
+      <span class="zui-icon zui-icon-close" @click="handleClean"></span>
     </div>
+    <div class="z-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
   </div>
 </template>
 
@@ -16,14 +17,28 @@
     data() {
       return {
         value: '',
+        focusStatus: false,
         isFocus: false
       };
     },
+    directives: {
+      refocus: {
+        update: function(el, state) {
+          if (state.value) { el.focus(); }
+        }
+      }
+    },
     methods: {
       handleFocus() {
         this.isFocus = true;
       },
-      handleBlur() {
+      handleClean() {
+        this.value = '';
+        this.focusStatus = true;
+      },
+      handleBack() {
+        this.value = '';
+        this.focusStatus = false;
         this.isFocus = false;
       }
     }
diff --git a/packages/zanui-css/src/search.css b/packages/zanui-css/src/search.css
index 0411986e9..d82b83492 100644
--- a/packages/zanui-css/src/search.css
+++ b/packages/zanui-css/src/search.css
@@ -1,11 +1,25 @@
 @import "./common/var.pcss";
 @component-namespace z {
     @b search {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-around;
+        align-items: center;
+        position: relative;
+        box-sizing: border-box;
         padding: 4px 15px;
         background-color: #F2F2F2;
+        @when focus {
+            .z-search__input-wrap {
+                width: 82%;   
+            }
+            span {
+                display: inline-block;
+            }
+        }
         @e input-wrap {
             position: relative;
-            width: 92%;
+            width: 90%;
             padding: 8px 24px 8px 35px;
             border: 1px solid $c-gray-light;
             border-radius: 4px;
@@ -16,12 +30,6 @@
                 right: 5px;
                 top: 8px;
             }
-            @when focus {
-                width: 82%;
-                span {
-                    display: inline-block;
-                }
-            }
             input {
                 width: 100%;
                 height: 14px;
@@ -31,5 +39,14 @@
                 outline: none;
             }
         }
+        @e cancel {
+            display: none;
+            color: #44BB00;
+            font-size: 14px;
+            white-space: nowrap;
+            @when focus {
+               display: block;
+            }
+        }
     }
 }
\ No newline at end of file

From ba405b723b61f784c4bc7ea4155175795b0a89a1 Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Tue, 28 Feb 2017 17:41:30 +0800
Subject: [PATCH 04/10] done

---
 docs/examples-docs/badge.md        |  8 +++----
 packages/badge/mixin/emitter.js    | 34 ++++++++++++++++++++++++++++++
 packages/badge/src/badge-group.vue |  7 +++++-
 packages/badge/src/badge.vue       | 29 ++++++++++++++++++++-----
 4 files changed, 68 insertions(+), 10 deletions(-)
 create mode 100644 packages/badge/mixin/emitter.js

diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index c73d6a8e5..fee5fda1e 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -5,10 +5,10 @@
 :::demo 样例代码
 ```html
 <z-badge-group>
-  <z-badge is-selected value="热销榜" info="8"></z-badge>
-  <z-badge value="花式寿司" info="99"></z-badge>
-  <z-badge value="火炽寿司"></z-badge>
-  <z-badge value="手握寿司" info="199"></z-badge>
+  <z-badge badge-key="0" title="热销榜" info="8"></z-badge>
+  <z-badge badge-key="1" title="花式寿司" info="99"></z-badge>
+  <z-badge badge-key="2" title="火炽寿司"></z-badge>
+  <z-badge badge-key="3" title="手握寿司" info="199"></z-badge>
 </z-badge-group>
 ```
 :::
\ No newline at end of file
diff --git a/packages/badge/mixin/emitter.js b/packages/badge/mixin/emitter.js
new file mode 100644
index 000000000..2e25c831f
--- /dev/null
+++ b/packages/badge/mixin/emitter.js
@@ -0,0 +1,34 @@
+function broadcast(componentName, eventName, ...params) {
+  this.$children.forEach(child => {
+    var name = child.$options.componentName;
+
+    if (name === componentName) {
+      child.$emit.apply(child, [eventName].concat(params));
+    } else {
+      broadcast.apply(child, [componentName, eventName].concat(params));
+    }
+  });
+}
+export default {
+  methods: {
+    $dispatch(componentName, eventName, ...params) {
+
+      var parent = this.$parent || this.$root;
+      var name = parent.$options.componentName;
+
+      while (parent && (!name || name !== componentName)) {
+        parent = parent.$parent;
+
+        if (parent) {
+          name = parent.$options.componentName;
+        }
+      }
+      if (parent) {
+        parent.$emit.apply(parent, [eventName].concat(params));
+      }
+    },
+    $broadcast(componentName, eventName, ...params) {
+      broadcast.call(this, componentName, eventName, ...params);
+    }
+  }
+};
diff --git a/packages/badge/src/badge-group.vue b/packages/badge/src/badge-group.vue
index 1b928e828..231a60f9c 100644
--- a/packages/badge/src/badge-group.vue
+++ b/packages/badge/src/badge-group.vue
@@ -6,6 +6,11 @@
 
 <script>
 export default {
-  name: 'z-badge-group'
+  name: 'z-badge-group',
+  data () {
+    return {
+      activeKey: '0'
+    }
+  }
 };
 </script>
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
index e8df950ab..a21163aff 100644
--- a/packages/badge/src/badge.vue
+++ b/packages/badge/src/badge.vue
@@ -1,22 +1,41 @@
 <template>
-    <a class="z-badge" :class="{ 'is-select' : isSelected }" :href="url" @click="handleClick">
+    <a class="z-badge" :class="classNames" :href="url" @click="handleClick">
       <div class="z-badge__active"></div>
       <div v-if="info" class="z-badge__info">{{info}}</div>
-      {{value}}
+      {{title}}
     </a>
 </template>
 <script>
 export default {
   name: 'z-badge',
   props: {
+    badgeKey: {
+      type: [Number, String],
+      required: true
+    },
+    title: {
+      type: String,
+      required: true
+    },
     url: String,
     value: String,
-    info: String,
-    isSelected: Boolean
+    info: String
+  },
+  data () {
+    return {
+      isSelected: false
+    }
   },
   methods: {
     handleClick() {
-      this.$emit('click');
+      this.$parent.activeKey = this.badgeKey;
+    }
+  },
+  computed: {
+    classNames () {
+      return {
+        'is-select': this.badgeKey == this.$parent.activeKey ? true : false
+      }
     }
   }
 };

From 0abb184056e5405c4aa5c189b2a4684f369ec90c Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Wed, 1 Mar 2017 14:28:10 +0800
Subject: [PATCH 05/10] done

---
 docs/examples-docs/badge.md        | 27 ++++++++++++++++++------
 packages/badge/mixin/emitter.js    | 34 ------------------------------
 packages/badge/src/badge-group.vue |  9 +++++++-
 packages/badge/src/badge.vue       | 12 +++--------
 4 files changed, 32 insertions(+), 50 deletions(-)
 delete mode 100644 packages/badge/mixin/emitter.js

diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index fee5fda1e..e08f6d46b 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -4,11 +4,26 @@
 
 :::demo 样例代码
 ```html
-<z-badge-group>
-  <z-badge badge-key="0" title="热销榜" info="8"></z-badge>
-  <z-badge badge-key="1" title="花式寿司" info="99"></z-badge>
-  <z-badge badge-key="2" title="火炽寿司"></z-badge>
-  <z-badge badge-key="3" title="手握寿司" info="199"></z-badge>
+<z-badge-group active-key="2">
+  <z-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></z-badge>
+  <z-badge mark="1" title="花式寿司" info="99"></z-badge>
+  <z-badge mark="2" title="火炽寿司"></z-badge>
+  <z-badge mark="3" title="手握寿司" info="199"></z-badge>
 </z-badge-group>
 ```
-:::
\ No newline at end of file
+:::
+
+### z-badge-group API
+
+| 参数       | 说明      | 类型       | 默认值       | 必须型       |
+|-----------|-----------|-----------|-------------|-------------|
+| active-key | 激活的badge的索引 | string  | '0'但必须子badge里的mark是有0位索引 |           |
+
+
+### z-badge API
+| 参数       | 说明      | 类型       | 默认值       | 可选值       |
+|-----------|-----------|-----------|-------------|-------------|
+| mark | badge的唯一key值 | string  | ''          | required         |
+| title | badge的文案标题 | string  | ''          | required          |
+| info | 当前badge的提示消息数量 | string  | ''          |           |
+| url | 跳转链接 | string  | 全连接直接跳转或者hash          |           |
diff --git a/packages/badge/mixin/emitter.js b/packages/badge/mixin/emitter.js
deleted file mode 100644
index 2e25c831f..000000000
--- a/packages/badge/mixin/emitter.js
+++ /dev/null
@@ -1,34 +0,0 @@
-function broadcast(componentName, eventName, ...params) {
-  this.$children.forEach(child => {
-    var name = child.$options.componentName;
-
-    if (name === componentName) {
-      child.$emit.apply(child, [eventName].concat(params));
-    } else {
-      broadcast.apply(child, [componentName, eventName].concat(params));
-    }
-  });
-}
-export default {
-  methods: {
-    $dispatch(componentName, eventName, ...params) {
-
-      var parent = this.$parent || this.$root;
-      var name = parent.$options.componentName;
-
-      while (parent && (!name || name !== componentName)) {
-        parent = parent.$parent;
-
-        if (parent) {
-          name = parent.$options.componentName;
-        }
-      }
-      if (parent) {
-        parent.$emit.apply(parent, [eventName].concat(params));
-      }
-    },
-    $broadcast(componentName, eventName, ...params) {
-      broadcast.call(this, componentName, eventName, ...params);
-    }
-  }
-};
diff --git a/packages/badge/src/badge-group.vue b/packages/badge/src/badge-group.vue
index 231a60f9c..1339100fb 100644
--- a/packages/badge/src/badge-group.vue
+++ b/packages/badge/src/badge-group.vue
@@ -7,9 +7,16 @@
 <script>
 export default {
   name: 'z-badge-group',
+  props: {
+    // 当前激活 tab 面板的 key
+    activeKey: {
+      type: [Number, String],
+      default: 0
+    }
+  },
   data () {
     return {
-      activeKey: '0'
+      computedActiveKey: this.activeKey
     }
   }
 };
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
index a21163aff..780652bc2 100644
--- a/packages/badge/src/badge.vue
+++ b/packages/badge/src/badge.vue
@@ -9,7 +9,7 @@
 export default {
   name: 'z-badge',
   props: {
-    badgeKey: {
+    mark: {
       type: [Number, String],
       required: true
     },
@@ -18,23 +18,17 @@ export default {
       required: true
     },
     url: String,
-    value: String,
     info: String
   },
-  data () {
-    return {
-      isSelected: false
-    }
-  },
   methods: {
     handleClick() {
-      this.$parent.activeKey = this.badgeKey;
+      this.$parent.computedActiveKey = this.mark;
     }
   },
   computed: {
     classNames () {
       return {
-        'is-select': this.badgeKey == this.$parent.activeKey ? true : false
+        'is-select': this.mark == this.$parent.computedActiveKey ? true : false
       }
     }
   }

From 6808b06372eb75bbe3ad8addb243d7ef6a6e26a6 Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Wed, 1 Mar 2017 14:51:27 +0800
Subject: [PATCH 06/10] done

---
 docs/examples-docs/badge.md    |  4 ++--
 docs/examples-docs/search.md   | 29 ++++++++++++++++++++++++++++-
 packages/badge/src/badge.vue   |  8 ++++++--
 packages/search/src/search.vue | 18 ++++++++++++++++--
 4 files changed, 52 insertions(+), 7 deletions(-)

diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index e08f6d46b..03db05c8f 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -15,13 +15,13 @@
 
 ### z-badge-group API
 
-| 参数       | 说明      | 类型       | 默认值       | 必须型       |
+| 参数       | 说明      | 类型       | 默认值       | 必须      |
 |-----------|-----------|-----------|-------------|-------------|
 | active-key | 激活的badge的索引 | string  | '0'但必须子badge里的mark是有0位索引 |           |
 
 
 ### z-badge API
-| 参数       | 说明      | 类型       | 默认值       | 可选值       |
+| 参数       | 说明      | 类型       | 默认值       | 必须       |
 |-----------|-----------|-----------|-------------|-------------|
 | mark | badge的唯一key值 | string  | ''          | required         |
 | title | badge的文案标题 | string  | ''          | required          |
diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
index f14d83b54..9147e3a29 100644
--- a/docs/examples-docs/search.md
+++ b/docs/examples-docs/search.md
@@ -1,3 +1,12 @@
+<script>
+export default {
+  methods: {
+    goSearch(value) {
+      alert(value)
+    }
+  }
+};
+</script>
 ## Search 组件
 
 ### 基础用法
@@ -6,7 +15,25 @@
 ```html
 <z-search 
     placeholder="商品名称"
+    :on-search="goSearch"
 >
 </z-search>
 ```
-:::
\ No newline at end of file
+
+```javascript
+export default {
+  methods: {
+    goSearch(value) {
+      alert(value)
+    }
+  }
+};
+```
+:::
+
+### API
+
+| 参数       | 说明      | 类型       | 默认值       | 必须       |
+|-----------|-----------|-----------|-------------|-------------|
+| placeholder | input的placeholder文案 | string  |           | required    |
+| on-search | 点击回车后出发搜索回调 | function  | function() {}  |   |
\ No newline at end of file
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
index 780652bc2..ce3dc80f0 100644
--- a/packages/badge/src/badge.vue
+++ b/packages/badge/src/badge.vue
@@ -17,8 +17,12 @@ export default {
       type: String,
       required: true
     },
-    url: String,
-    info: String
+    url: {
+      type: String
+    },
+    info: {
+      type: String
+    }
   },
   methods: {
     handleClick() {
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
index eb4bcb33b..e3bebe781 100644
--- a/packages/search/src/search.vue
+++ b/packages/search/src/search.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="z-search" :class="{ 'is-focus' : isFocus }">
     <div class="z-search__input-wrap">
-      <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus">
+      <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus" @keyup.enter="handleSearch">
       <span class="zui-icon zui-icon-close" @click="handleClean"></span>
     </div>
     <div class="z-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
@@ -12,7 +12,14 @@
   export default {
     name: 'z-search',
     props: {
-      placeholder: String
+      placeholder: {
+        type: String,
+        required: true
+      },
+      onSearch: {
+        type: Function,
+        default: function() {}
+      }
     },
     data() {
       return {
@@ -30,16 +37,23 @@
     },
     methods: {
       handleFocus() {
+        // 进入input焦点，出现close和取消
         this.isFocus = true;
       },
       handleClean() {
+        // 点击close后清空vlaue后，再聚焦input框
         this.value = '';
         this.focusStatus = true;
       },
       handleBack() {
+        // 点击取消后，清空所有回复最初状态
         this.value = '';
         this.focusStatus = false;
         this.isFocus = false;
+      },
+      handleSearch(ev) {
+        // input输入回车后，发送回调
+        this.onSearch(ev.target.value)
       }
     }
   };

From abc876b254d8dd6dd3b2383648abcd373e3f42df Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Wed, 1 Mar 2017 15:10:03 +0800
Subject: [PATCH 07/10] adjust

---
 docs/examples-docs/badge.md        | 12 ++++++------
 docs/examples-docs/search.md       |  4 ++--
 packages/badge/src/badge-group.vue |  4 ++--
 packages/badge/src/badge.vue       |  8 ++++----
 packages/search/src/search.vue     |  8 ++++----
 packages/zanui-css/src/badge.css   |  4 ++--
 packages/zanui-css/src/search.css  |  4 ++--
 src/index.js                       | 10 ----------
 8 files changed, 22 insertions(+), 32 deletions(-)

diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index 03db05c8f..4bdbbeb9a 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -4,12 +4,12 @@
 
 :::demo 样例代码
 ```html
-<z-badge-group active-key="2">
-  <z-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></z-badge>
-  <z-badge mark="1" title="花式寿司" info="99"></z-badge>
-  <z-badge mark="2" title="火炽寿司"></z-badge>
-  <z-badge mark="3" title="手握寿司" info="199"></z-badge>
-</z-badge-group>
+<zan-badge-group active-key="2">
+  <zan-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></zan-badge>
+  <zan-badge mark="1" title="花式寿司" info="99"></zan-badge>
+  <zan-badge mark="2" title="火炽寿司"></zan-badge>
+  <zan-badge mark="3" title="手握寿司" info="199"></zan-badge>
+</zan-badge-group>
 ```
 :::
 
diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
index 9147e3a29..3d4109f5a 100644
--- a/docs/examples-docs/search.md
+++ b/docs/examples-docs/search.md
@@ -13,11 +13,11 @@ export default {
 
 :::demo 样例代码
 ```html
-<z-search 
+<zan-search 
     placeholder="商品名称"
     :on-search="goSearch"
 >
-</z-search>
+</zan-search>
 ```
 
 ```javascript
diff --git a/packages/badge/src/badge-group.vue b/packages/badge/src/badge-group.vue
index 1339100fb..1c34b3de3 100644
--- a/packages/badge/src/badge-group.vue
+++ b/packages/badge/src/badge-group.vue
@@ -1,12 +1,12 @@
 <template>
-  <div class="z-badge-group">
+  <div class="zan-badge-group">
     <slot></slot>
   </div>
 </template>
 
 <script>
 export default {
-  name: 'z-badge-group',
+  name: 'zan-badge-group',
   props: {
     // 当前激活 tab 面板的 key
     activeKey: {
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
index ce3dc80f0..f8940c1a9 100644
--- a/packages/badge/src/badge.vue
+++ b/packages/badge/src/badge.vue
@@ -1,13 +1,13 @@
 <template>
-    <a class="z-badge" :class="classNames" :href="url" @click="handleClick">
-      <div class="z-badge__active"></div>
-      <div v-if="info" class="z-badge__info">{{info}}</div>
+    <a class="zan-badge" :class="classNames" :href="url" @click="handleClick">
+      <div class="zan-badge__active"></div>
+      <div v-if="info" class="zan-badge__info">{{info}}</div>
       {{title}}
     </a>
 </template>
 <script>
 export default {
-  name: 'z-badge',
+  name: 'zan-badge',
   props: {
     mark: {
       type: [Number, String],
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
index e3bebe781..cbcc8a464 100644
--- a/packages/search/src/search.vue
+++ b/packages/search/src/search.vue
@@ -1,16 +1,16 @@
 <template>
-  <div class="z-search" :class="{ 'is-focus' : isFocus }">
-    <div class="z-search__input-wrap">
+  <div class="zan-search" :class="{ 'is-focus' : isFocus }">
+    <div class="zan-search__input-wrap">
       <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus" @keyup.enter="handleSearch">
       <span class="zui-icon zui-icon-close" @click="handleClean"></span>
     </div>
-    <div class="z-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
+    <div class="zan-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
   </div>
 </template>
 
 <script>
   export default {
-    name: 'z-search',
+    name: 'zan-search',
     props: {
       placeholder: {
         type: String,
diff --git a/packages/zanui-css/src/badge.css b/packages/zanui-css/src/badge.css
index 5e1d816ed..7442fe368 100644
--- a/packages/zanui-css/src/badge.css
+++ b/packages/zanui-css/src/badge.css
@@ -1,7 +1,7 @@
 @import "./common/var.pcss";
 @import "./mixins/border_retina.pcss";
 
-@component-namespace z {
+@component-namespace zan {
     @b badge-group {
         position: relative;
         width: 85px;
@@ -50,7 +50,7 @@
             font-weight: bold;
             color: $c-black;
             background-color: $c-white;
-            .z-badge__active {
+            .zan-badge__active {
                 display: block;
             }
             &::after {
diff --git a/packages/zanui-css/src/search.css b/packages/zanui-css/src/search.css
index d82b83492..e39f895ab 100644
--- a/packages/zanui-css/src/search.css
+++ b/packages/zanui-css/src/search.css
@@ -1,5 +1,5 @@
 @import "./common/var.pcss";
-@component-namespace z {
+@component-namespace zan {
     @b search {
         display: flex;
         flex-direction: row;
@@ -10,7 +10,7 @@
         padding: 4px 15px;
         background-color: #F2F2F2;
         @when focus {
-            .z-search__input-wrap {
+            .zan-search__input-wrap {
                 width: 82%;   
             }
             span {
diff --git a/src/index.js b/src/index.js
index 0ff0e21d3..b124b77fc 100644
--- a/src/index.js
+++ b/src/index.js
@@ -11,9 +11,6 @@ import Picker from '../packages/picker/index.js';
 import RadioGroup from '../packages/radio-group/index.js';
 import Waterfall from '../packages/waterfall/index.js';
 import Loading from '../packages/loading/index.js';
-import Badge from '../packages/badge/index.js';
-import BadgeGroup from '../packages/badge-group/index.js';
-import Search from '../packages/search/index.js';
 import Panel from '../packages/panel/index.js';
 import Card from '../packages/card/index.js';
 import Steps from '../packages/steps/index.js';
@@ -35,9 +32,6 @@ const install = function(Vue) {
   Vue.component(Picker.name, Picker);
   Vue.component(RadioGroup.name, RadioGroup);
   Vue.component(Loading.name, Loading);
-  Vue.component(Badge.name, Badge);
-  Vue.component(BadgeGroup.name, BadgeGroup);
-  Vue.component(Search.name, Search);
   Vue.component(Panel.name, Panel);
   Vue.component(Card.name, Card);
   Vue.component(Steps.name, Steps);
@@ -65,10 +59,6 @@ module.exports = {
   Dialog,
   Picker,
   RadioGroup,
-  Loading,
-  Badge,
-  BadgeGroup,
-  Search,
   Waterfall,
   Loading,
   Panel,

From 7a3785c31be46a92541a495bf15bff83047a1f03 Mon Sep 17 00:00:00 2001
From: cookfront <cookfront@gmail.com>
Date: Wed, 1 Mar 2017 15:21:31 +0800
Subject: [PATCH 08/10] fix css

---
 packages/zanui-css/src/badge.css  | 4 ++--
 packages/zanui-css/src/search.css | 3 ++-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/zanui-css/src/badge.css b/packages/zanui-css/src/badge.css
index 7442fe368..57b8eb99e 100644
--- a/packages/zanui-css/src/badge.css
+++ b/packages/zanui-css/src/badge.css
@@ -1,5 +1,5 @@
-@import "./common/var.pcss";
-@import "./mixins/border_retina.pcss";
+@import "./common/var.css";
+@import "./mixins/border_retina.css";
 
 @component-namespace zan {
     @b badge-group {
diff --git a/packages/zanui-css/src/search.css b/packages/zanui-css/src/search.css
index e39f895ab..2d8bafd04 100644
--- a/packages/zanui-css/src/search.css
+++ b/packages/zanui-css/src/search.css
@@ -1,4 +1,5 @@
-@import "./common/var.pcss";
+@import "./common/var.css";
+
 @component-namespace zan {
     @b search {
         display: flex;

From dc2d685a347ae72b2a5d46436b3121ce16d0e99d Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Wed, 1 Mar 2017 15:40:08 +0800
Subject: [PATCH 09/10] done

---
 components.json                |  5 ++++-
 docs/examples-docs/badge.md    |  2 --
 docs/examples-docs/search.md   | 17 +++--------------
 docs/examples/badge.vue        | 18 ++++++++++++++++++
 docs/examples/search.vue       | 23 +++++++++++++++++++++++
 packages/search/src/search.vue | 13 ++++---------
 src/index.js                   | 11 ++++++++++-
 7 files changed, 62 insertions(+), 27 deletions(-)
 create mode 100644 docs/examples/badge.vue
 create mode 100644 docs/examples/search.vue

diff --git a/components.json b/components.json
index 5827ed020..eded4963f 100644
--- a/components.json
+++ b/components.json
@@ -17,5 +17,8 @@
   "steps": "./packages/steps/index.js",
   "tag": "./packages/tag/index.js",
   "checkbox": "./packages/checkbox/index.js",
-  "checkbox-group": "./packages/checkbox-group/index.js"
+  "checkbox-group": "./packages/checkbox-group/index.js",
+  "badge-group": "./packages/badge-group/index.js",
+  "badge": "./packages/badge/index.js",
+  "search": "./packages/search/index.js"
 }
diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index 4bdbbeb9a..b8e450bee 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -2,7 +2,6 @@
 
 ### 基础用法
 
-:::demo 样例代码
 ```html
 <zan-badge-group active-key="2">
   <zan-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></zan-badge>
@@ -11,7 +10,6 @@
   <zan-badge mark="3" title="手握寿司" info="199"></zan-badge>
 </zan-badge-group>
 ```
-:::
 
 ### z-badge-group API
 
diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
index 3d4109f5a..644bfb416 100644
--- a/docs/examples-docs/search.md
+++ b/docs/examples-docs/search.md
@@ -1,21 +1,12 @@
-<script>
-export default {
-  methods: {
-    goSearch(value) {
-      alert(value)
-    }
-  }
-};
-</script>
 ## Search 组件
 
 ### 基础用法
 
-:::demo 样例代码
+
 ```html
 <zan-search 
     placeholder="商品名称"
-    :on-search="goSearch"
+    @search="goSearch"
 >
 </zan-search>
 ```
@@ -29,11 +20,9 @@ export default {
   }
 };
 ```
-:::
 
 ### API
 
 | 参数       | 说明      | 类型       | 默认值       | 必须       |
 |-----------|-----------|-----------|-------------|-------------|
-| placeholder | input的placeholder文案 | string  |           | required    |
-| on-search | 点击回车后出发搜索回调 | function  | function() {}  |   |
\ No newline at end of file
+| placeholder | input的placeholder文案 | string  |           |     |
\ No newline at end of file
diff --git a/docs/examples/badge.vue b/docs/examples/badge.vue
new file mode 100644
index 000000000..27b6f12b1
--- /dev/null
+++ b/docs/examples/badge.vue
@@ -0,0 +1,18 @@
+<template>
+  <div class="page-badge">
+    <h1 class="page-title">Badge</h1>
+    
+    <h2 class="page-sub-title">基础用法</h2>
+    <zan-badge-group active-key="2">
+      <zan-badge mark="0" title="热销榜" info="8" url="http://baidu.com"></zan-badge>
+      <zan-badge mark="1" title="花式寿司" info="99"></zan-badge>
+      <zan-badge mark="2" title="火炽寿司"></zan-badge>
+      <zan-badge mark="3" title="手握寿司" info="199"></zan-badge>
+    </zan-badge-group>
+  </div>
+</template>
+<style>
+  .page-badge {
+    padding: 0 15px;
+  }
+</style>
\ No newline at end of file
diff --git a/docs/examples/search.vue b/docs/examples/search.vue
new file mode 100644
index 000000000..41391b5ae
--- /dev/null
+++ b/docs/examples/search.vue
@@ -0,0 +1,23 @@
+<script>
+export default {
+  methods: {
+    goSearch(value) {
+      alert(value)
+    }
+  }
+};
+</script>
+<template>
+  <div class="page-search">
+    <h1 class="page-title">Search</h1>
+    
+    <h2 class="page-sub-title">基础用法</h2>
+    <zan-search  placeholder="商品名称" @search="goSearch">
+    </zan-search>
+  </div>
+</template>
+<style>
+  .page-badge {
+    padding: 0 15px;
+  }
+</style>
\ No newline at end of file
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
index cbcc8a464..7f398d114 100644
--- a/packages/search/src/search.vue
+++ b/packages/search/src/search.vue
@@ -2,7 +2,7 @@
   <div class="zan-search" :class="{ 'is-focus' : isFocus }">
     <div class="zan-search__input-wrap">
       <input type="text" :placeholder="placeholder" v-model="value" v-refocus="focusStatus"  @focus="handleFocus" @keyup.enter="handleSearch">
-      <span class="zui-icon zui-icon-close" @click="handleClean"></span>
+      <span class="zan-icon zan-icon-close" @click="handleClean"></span>
     </div>
     <div class="zan-search__cancel" :class="{ 'is-focus' : isFocus }" @click="handleBack">取消</div>
   </div>
@@ -13,12 +13,7 @@
     name: 'zan-search',
     props: {
       placeholder: {
-        type: String,
-        required: true
-      },
-      onSearch: {
-        type: Function,
-        default: function() {}
+        type: String
       }
     },
     data() {
@@ -51,9 +46,9 @@
         this.focusStatus = false;
         this.isFocus = false;
       },
-      handleSearch(ev) {
+      handleSearch() {
         // input输入回车后，发送回调
-        this.onSearch(ev.target.value)
+        this.$emit('search', this.value)
       }
     }
   };
diff --git a/src/index.js b/src/index.js
index b124b77fc..4455a8cb0 100644
--- a/src/index.js
+++ b/src/index.js
@@ -17,6 +17,9 @@ import Steps from '../packages/steps/index.js';
 import Tag from '../packages/tag/index.js';
 import Checkbox from '../packages/checkbox/index.js';
 import CheckboxGroup from '../packages/checkbox-group/index.js';
+import BadgeGroup from '../packages/badge-group/index.js';
+import Badge from '../packages/badge/index.js';
+import Search from '../packages/search/index.js';
 
 const install = function(Vue) {
   if (install.installed) return;
@@ -38,6 +41,9 @@ const install = function(Vue) {
   Vue.component(Tag.name, Tag);
   Vue.component(Checkbox.name, Checkbox);
   Vue.component(CheckboxGroup.name, CheckboxGroup);
+  Vue.component(BadgeGroup.name, BadgeGroup);
+  Vue.component(Badge.name, Badge);
+  Vue.component(Search.name, Search);
 };
 
 // auto install
@@ -66,5 +72,8 @@ module.exports = {
   Steps,
   Tag,
   Checkbox,
-  CheckboxGroup
+  CheckboxGroup,
+  BadgeGroup,
+  Badge,
+  Search
 };

From a9b4b6a27be608a88b618b81c5fd3b4865c0a843 Mon Sep 17 00:00:00 2001
From: zhuxiang <zhuxiang@qima-inc.com>
Date: Wed, 1 Mar 2017 15:51:31 +0800
Subject: [PATCH 10/10] done

---
 package.json                       |  2 +-
 packages/badge/src/badge-group.vue | 30 ++++++++++++++++--------------
 packages/badge/src/badge.vue       |  6 +++---
 packages/radio/src/radio.vue       |  2 +-
 packages/search/src/search.vue     |  2 +-
 5 files changed, 22 insertions(+), 20 deletions(-)

diff --git a/package.json b/package.json
index 8701d27f1..16273447c 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 bootstrap && npm run build:file && webpack-dev-server --port 8282 --inline --hot --config build/webpack.config.js",
+    "dev": "npm run build:file && webpack-dev-server --port 8282 --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/badge/src/badge-group.vue b/packages/badge/src/badge-group.vue
index 1c34b3de3..e6998998e 100644
--- a/packages/badge/src/badge-group.vue
+++ b/packages/badge/src/badge-group.vue
@@ -5,19 +5,21 @@
 </template>
 
 <script>
-export default {
-  name: 'zan-badge-group',
-  props: {
-    // 当前激活 tab 面板的 key
-    activeKey: {
-      type: [Number, String],
-      default: 0
+  export default {
+    name: 'zan-badge-group',
+
+    props: {
+      // 当前激活 tab 面板的 key
+      activeKey: {
+        type: [Number, String],
+        default: 0
+      }
+    },
+
+    data() {
+      return {
+        computedActiveKey: this.activeKey
+      };
     }
-  },
-  data () {
-    return {
-      computedActiveKey: this.activeKey
-    }
-  }
-};
+  };
 </script>
diff --git a/packages/badge/src/badge.vue b/packages/badge/src/badge.vue
index f8940c1a9..919324666 100644
--- a/packages/badge/src/badge.vue
+++ b/packages/badge/src/badge.vue
@@ -30,10 +30,10 @@ export default {
     }
   },
   computed: {
-    classNames () {
+    classNames() {
       return {
-        'is-select': this.mark == this.$parent.computedActiveKey ? true : false
-      }
+        'is-select': this.mark === this.$parent.computedActiveKey
+      };
     }
   }
 };
diff --git a/packages/radio/src/radio.vue b/packages/radio/src/radio.vue
index ad7d3e3a6..80118093a 100644
--- a/packages/radio/src/radio.vue
+++ b/packages/radio/src/radio.vue
@@ -49,7 +49,7 @@ export default {
 
       set(val) {
         if (this.isGroup && this.parentGroup) {
-           this.parentGroup.$emit('input', val);
+          this.parentGroup.$emit('input', val);
         } else {
           this.$emit('input', val);
         }
diff --git a/packages/search/src/search.vue b/packages/search/src/search.vue
index 7f398d114..e88c67ec9 100644
--- a/packages/search/src/search.vue
+++ b/packages/search/src/search.vue
@@ -48,7 +48,7 @@
       },
       handleSearch() {
         // input输入回车后，发送回调
-        this.$emit('search', this.value)
+        this.$emit('search', this.value);
       }
     }
   };