Merge branch 'master' of http://git.yoho.cn/fe/yoho-community-web

-import Buttons from './buttons';
+import Widgets from './widgets';
 import Images from './images';
 import Layouts from './layouts';
 import Products from './products';
@@ -6,7 +6,7 @@ import Comments from './comments';
 import YohoActionSheet from './action-sheet';
 
 export default [
-  ...Buttons,
+  ...Widgets,
   ...Images,
   ...Layouts,
   ...Products,

+<template>
+  <div class="avatar-list-wrap">
+    <ul v-if="avatarList" class="avatar-list">
+        <li v-for="(item, index) in avatarList" :key="index" :style="item.style">
+          <ImageFormat :src="item.src"></ImageFormat>
+        </li>
+        <li v-if="hasMore">
+          <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABUFBMVEXu7u7u7e7t7e3v7+/x8fHw8PDz8/Pr6+vg4ODe3t7k5eTy8vLi4uLh4eHl5eXf39/q6urDw8OYmJiJiYmIiIiOjo6srKzb29vT09Ojo6OLi4uKioqfn5/MzMyvr6+Pj4+Wlpa+vr7p6eno6OigoKB9fX2GhoaCgoKBgYHJycm4uLh+fn6EhISFhYV8fHyxsbHQ0NCHh4eXl5fj4+OoqKiMjIzX19fExMR6enqNjY16e3u9vb3d3d2AgIDs7OypqanIyMizs7PPz89/f3/s7e2qqqqlpaWDg4PW1tZ+f35/gIC6u7udnZ2np6fY2NjFxcW5ubnk5OTV1dXOzs6SkpLa2tqtra2QkJDn5+e2tra6urp5eXnS09J7e3vNzc2Tk5O7u7uAgYGbm5t/gH+ysrLt7u3Z2dmwsLCcnZykpKS8vLzHx8ecnJyurq7u7+////9BdulHAAAAAWJLR0RvVQhhgQAAAAd0SU1FB+MBHgIiD+UrRU8AAAImSURBVGje7ZVZW9NAFIbHM0tbBxBIYnFSFaVNI2ksVaNEaESi1B3BDXet4q7//9IU0iYtfXymF96d9/LLnPNmZjITQhAEQRAEQRAEQRAEQXQ4BgBjH/wjBzIZQBnjY6qAcMbImBySnE6kASIKxdJxxkaLQNKp0jQRoxpgbKZ0YlZQfQtwmJs3TOtkWY4UsYVTyrQrp/lwN5ClM2dNY/HceaZrAb5UrTm2bdTdC8MWvuw1bNv2LzbpUIFY8V3Dtlu1S5e1LfRKzVJJs8B2r+YsIK+thkGSK+v6Wj5n674ZHuTtaqQ5Ebni9Up6lkY1P8GZ0FCHD1SrmL0y8BtuWmDVNoTWVEDedAM7xcyagdhs9/Mw3hC3MrllpHlQv625XnSrowZFd2QmmbvblwT37mc5Kzv98cp/oLkn9OFAojqPcpLtTBKviUyy3sokFc09EY/jfjMj2OGDZnLXzZbrSSahS0/N1BK4Tam5J8/qabOw/Ty3xLQw7xw+UOaLveykgHzppbsSxgt6kqTo1esgUEqFDTXF85/wG88Me7n99l3+E+Z77+tWkgfhalP3nAChH+offafhLZaHaoBthp7v+HFr+JACm+7WOo7jfvoc0X09SWKRX75+637fnh15L5A7P6rdynJxZE2AFX5udX/93mUTXF5JNxZF9Oh9B1yQCMTRizMZG0VMTnbbJ6P/ENgfl1MyrtXB+El/KAiCIAiCIAiCIAiCIP+NvzEdRouqRtHcAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE5LTAxLTI5VDE4OjM0OjE1KzA4OjAwBpTw+AAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxOS0wMS0yOVQxODozNDoxNSswODowMHfJSEQAAAAASUVORK5CYII=">
+        </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'AvatarGroup',
+    props: {
+      avatars: Array,
+      option: {
+        type: Object,
+        default() {
+          return {
+            srcKey: 'src',
+            maxDisplayNum: 0
+          };
+        }
+      }
+    },
+    data() {
+      return {
+        hasMore: false
+      }
+    },
+    computed: {
+      avatarList() {
+        let list = [];
+        let length = this.avatars.length;
+
+        if (this.option.maxDisplayNum > 0 && this.avatars.length > this.option.maxDisplayNum) {
+          length = this.option.maxDisplayNum;
+          this.hasMore = true;
+        }
+
+        for (let i = 0; i < length; i++) {
+          let avt = this.avatars[i];
+          let src = avt;
+
+          if (this.option.srcKey && typeof avt !== 'string') {
+            src = avt[this.option.srcKey] || '';
+          }
+
+          list.push({
+            src: src,
+            style: `z-index: ${length - i};`
+          });
+        }
+
+        return list;
+      }
+    }
+  };
+</script>
+
+<style type="css">
+  .avatar-list-wrap {
+    display: inline-block;
+  }
+  .avatar-list {
+    display: flex;
+
+    li {
+      width: 60px;
+      height: 60px;
+      border: 1px solid #fff;
+      border-radius: 50%;
+      overflow: hidden;
+      margin-left: -18px;
+      position: relative;
+
+      &:first-child {
+        margin-left: 0;
+      }
+
+      img {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+</style>

+import AvatarGroup from './avatar-group';
 import ButtonFav from './button-fav';
 import ButtonLike from './button-like';
 import ButtonShare from './button-share';
@@ -5,6 +6,7 @@ import ButtonTopic from './button-topic';
 import ButtonAvatar from './button-avatar';
 
 export default [
+  AvatarGroup,
   ButtonFav,
   ButtonLike,
   ButtonShare,