UPDATE

examples/App.vue

@@ -4,13 +4,19 @@
       <lemon-imui
         :user="user"
         ref="IMUI"
+        :hide-menu="hideMenu"
+        :hide-menu-avatar="hideMenuAvatar"
         @change-menu="handleChangeMenu"
         @change-contact="handleChangeContact"
         @pull-messages="handlePullMessages"
+        @message-click="handleMessageClick"
         @send="handleSend"
       >
         <template #cover>
-          <h1 style="text-indent:20px">自定义封面内容</h1>
+          <div class="cover">
+            <i class="lemon-icon-message"></i>
+            <p><b>Lemon</b> IMUI</p>
+          </div>
         </template>
         <!-- <template #contact-info="contact">
         <span style="color:blue">contact-info {{ contact }}</span>
@@ -25,11 +31,24 @@
           <span>{{ contact.displayName }}</span>
           <small class="more" @click="changeDrawer(contact)">&#8230;</small>
         </template>
+        <template #contact-info="contact">
+          自定义联系人信息 {{ contact.displayName }}
+        </template>
+        <template #message-sidebar>
+          <div class="bar">自定义消息顶部</div>
+        </template>
+        <template #contact-sidebar>
+          <div class="bar">自定义联系人顶部</div>
+        </template>
       </lemon-imui>
 
       <div class="action">
         <lemon-button @click="appendMessage">发送消息</lemon-button>
         <lemon-button @click="updateContact">修改联系人信息</lemon-button>
+        <lemon-button @click="changeMenuVisible">切换导航显示</lemon-button>
+        <lemon-button @click="changeMenuAvatarVisible"
+          >切换头像显示</lemon-button
+        >
       </div>
     </div>
   </div>
@@ -40,32 +59,33 @@ const getTime = () => {
   return new Date().getTime();
 };
 const generateRandId = () => {
-  return Number(
-    Math.random()
-      .toString()
-      .substr(3, length) + Date.now()
-  ).toString(36);
+  return Math.random()
+    .toString(36)
+    .substr(-8);
 };
 const generateRandWord = () => {
   return Math.random()
     .toString(36)
     .substr(2);
 };
-const generateMessage = () => {
+const generateMessage = (toContactId = "", fromUser) => {
+  if (!fromUser) {
+    fromUser = {
+      id: "system",
+      displayName: "系统测试",
+      avatar: "http://upload.qqbodys.com/allimg/1710/1035512943-0.jpg"
+    };
+  }
   return {
     id: generateRandId(),
     status: "succeed",
     type: "text",
     sendTime: getTime(),
     content: generateRandWord(),
-    toContactId: "123",
     //fileSize: 1231,
     //fileName: "asdasd.doc",
-    fromUser: {
-      id: "222",
-      displayName: "系统测试",
-      avatar: "http://upload.qqbodys.com/allimg/1710/1035512943-0.jpg"
-    }
+    toContactId,
+    fromUser
   };
 };
 
@@ -73,17 +93,19 @@ export default {
   name: "app",
   data() {
     return {
+      hideMenuAvatar: false,
+      hideMenu: false,
       user: {
         id: "superadmin",
-        displayName: "IMUI super",
+        displayName: "June",
         avatar:
-          "http://upload.qqbodys.com/img/weixin/20170804/ji5qxg1am5ztm.jpg"
+          "https://gss2.bdstatic.com/-fo3dSag_xI4khGkpoWK1HF6hhy/baike/w%3D268%3Bg%3D0/sign=69e1a1a4b78f8c54e3d3c22902124ac8/060828381f30e9247e29fb7b4f086e061c95f7ef.jpg"
       }
     };
   },
   mounted() {
     const contactData1 = {
-      id: "1",
+      id: "contact-1",
       displayName: "工作协作群",
       avatar: "http://upload.qqbodys.com/img/weixin/20170804/ji5qxg1am5ztm.jpg",
       type: "single",
@@ -93,11 +115,11 @@ export default {
       lastContent: "2"
     };
     const contactData2 = {
-      id: "2",
-      displayName: "狗蛋Li。",
+      id: "contact-2",
+      displayName: "自定义内容",
       avatar: "http://upload.qqbodys.com/img/weixin/20170807/jibfvfd00npin.jpg",
       type: "single",
-      index: "B",
+      //index: "Z",
       click(next) {
         next();
       },
@@ -109,7 +131,7 @@ export default {
       unread: 2
     };
     const contactData3 = {
-      id: "3",
+      id: "contact-3",
       displayName: "铁牛",
       avatar: "http://upload.qqbodys.com/img/weixin/20170803/jiq4nzrkrnd0e.jpg",
       type: "many",
@@ -121,33 +143,6 @@ export default {
 
     const { IMUI } = this.$refs;
 
-    setTimeout(() => {
-      //IMUI.openDrawer();
-      // IMUI.openDrawer(() => {
-      //   return [
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>,
-      //     <h1>123</h1>
-      //   ];
-      // });
-      // setTimeout(() => {
-      //   IMUI.openDrawer(() => {
-      //     return <h1>124563</h1>;
-      //   });
-      // }, 2000);
-    }, 2000);
-    //[contactData1, contactData2, contactData3]
     let data = [
       { ...contactData1 },
       { ...contactData2 },
@@ -164,13 +159,54 @@ export default {
         name: "contacts"
       },
       {
-        title: "自定义按钮",
+        name: "custom1",
+        title: "自定义按钮1",
+        unread: 0,
+        render: menu => {
+          return <i class="lemon-icon-attah" />;
+        },
+        renderContainer: () => {
+          return (
+            <div class="article">
+              <ul>
+                <li class="article-item">
+                  <h2>人民日报谈网红带货：产品真的值得买吗？</h2>
+                </li>
+                <li class="article-item">
+                  甘肃夏河县发生5.7级地震 暂未接到人员伤亡报告
+                </li>
+                <li class="article-item">
+                  北方多地风力仍强沙尘相伴,东北内蒙古等地迎雨雪
+                </li>
+                <li class="article-item">
+                  英货车案：越南警方采集疑死者家属DNA作比对
+                </li>
+                <li class="article-item">
+                  知名连锁咖啡店的蛋糕吃出活虫 曝光内幕太震惊
+                </li>
+              </ul>
+              <lemon-contact
+                props={{ contact: contactData1 }}
+                style="margin:20px"
+              />
+              <lemon-contact
+                props={{ contact: contactData3 }}
+                style="margin:20px"
+              />
+            </div>
+          );
+        },
+        isBottom: true
+      },
+      {
+        name: "custom2",
+        title: "自定义按钮2",
         unread: 0,
         click: () => {
-          alert("点击了自定义按钮");
+          alert("拦截导航点击事件");
         },
         render: menu => {
-          return <span>T</span>;
+          return <i class="lemon-icon-group" />;
         },
         isBottom: true
       }
@@ -463,6 +499,28 @@ export default {
     ]);
   },
   methods: {
+    handleMessageClick(e, key, message) {
+      const { IMUI } = this.$refs;
+
+      if (key == "status") {
+        IMUI.updateMessage(message.id, message.toContactId, {
+          status: "going",
+          content: "正在重新发送消息..."
+        });
+        setTimeout(() => {
+          IMUI.updateMessage(message.id, message.toContactId, {
+            status: "succeed",
+            content: "发送成功"
+          });
+        }, 2000);
+      }
+    },
+    changeMenuAvatarVisible() {
+      this.hideMenuAvatar = !this.hideMenuAvatar;
+    },
+    changeMenuVisible() {
+      this.hideMenu = !this.hideMenu;
+    },
     appendMessage() {
       const { IMUI } = this.$refs;
       const contact = IMUI.currentContact;
@@ -513,94 +571,33 @@ export default {
       }, 1000);
     },
     handlePullMessages(contact, next) {
+      const { IMUI } = this.$refs;
+      const otheruser = {
+        id: "hehe",
+        displayName: "I KNOEW",
+        avatar:
+          "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
+      };
       console.log("Event:pull-messages");
       const messages = [
+        generateMessage(IMUI.currentContactId, this.user),
+        generateMessage(IMUI.currentContactId, otheruser),
+        generateMessage(IMUI.currentContactId, this.user),
+        generateMessage(IMUI.currentContactId, otheruser),
+        generateMessage(IMUI.currentContactId, this.user),
+        generateMessage(IMUI.currentContactId, this.user),
+        generateMessage(IMUI.currentContactId, otheruser),
         {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "hehe",
-            displayName: "I KNOEW",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
-        },
-        {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "superadmin",
-            displayName: "超级飞机",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
-        },
-        {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "hehe",
-            displayName: "I KNOEW",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
-        },
-        {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "superadmin",
-            displayName: "超级飞机",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
-        },
-        {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "hehe",
-            displayName: "I KNOEW",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
-        },
-        {
-          id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-          type: "text",
-          status: "succeed",
-          sendTime: 1564926674646,
-          fromContactId: "superadmin",
-          fromUser: {
-            id: "superadmin",
-            displayName: "超级飞机",
-            avatar:
-              "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-          },
-          content: "测试消息哦..."
+          ...generateMessage(IMUI.currentContactId, this.user),
+          ...{ status: "failed" }
         }
       ];
-      next(messages);
+
+      console.log(messages);
+      let isEnd = false;
+      if (IMUI.getMessages(IMUI.currentContactId).length > 20) isEnd = true;
+
+      next(messages, isEnd);
     },
     handleChangeMenu() {
       console.log("Event:change-menu");
@@ -636,4 +633,32 @@ body
   color #999
   &:active
     color #000
+.bar
+  text-align center
+  line-height 30px
+  background #fff
+  margin 15px
+  color #666
+  user-select none
+  font-size 12px
+.cover
+  text-align center
+  user-select none
+  position absolute
+  top 50%
+  left 50%
+  transform translate(-50%,-50%)
+  i
+    font-size 84px
+    color #e6e6e6
+  p
+    font-size 18px
+    color #ddd
+    line-height 50px
+.article-item
+  line-height 34px
+  cursor pointer
+  &:hover
+    text-decoration underline
+    color #318efd
 </style>

examples/dist/css/index.2750e9e8.css

@@ -1 +0,0 @@
-body{background:#3d495c!important}.action{margin-top:30px}.action button{margin-right:10px}.imui-center{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.drawer-content{padding:15px}.more{font-size:32px;line-height:18px;height:32px;position:absolute;top:6px;right:14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:#999}.more:active{color:#000}.lemon-tabs{background:#f6f6f6}.lemon-tabs-content{padding:15px}.lemon-tabs-content,.lemon-tabs-content__pane{width:100%;height:100%}.lemon-tabs-nav{display:-webkit-box;display:-ms-flexbox;display:flex;background:#eee}.lemon-tabs-nav__item{line-height:38px;padding:0 15px;cursor:pointer;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1)}.lemon-tabs-nav__item--active{background:#f6f6f6}.lemon-popover{border:1px solid #eee;font-size:14px;font-variant:tabular-nums;line-height:1.5;color:rgba(0,0,0,.65);z-index:10;background-color:#fff;border-radius:4px;-webkit-box-shadow:0 2px 8px rgba(0,0,0,.15);box-shadow:0 2px 8px rgba(0,0,0,.15);position:absolute;-webkit-transform-origin:50% 150%;transform-origin:50% 150%}.lemon-popover__content{padding:15px;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;z-index:1}.lemon-popover__arrow{left:50%;-webkit-transform:translateX(-50%) rotate(45deg);transform:translateX(-50%) rotate(45deg);position:absolute;z-index:0;bottom:-4px;-webkit-box-shadow:3px 3px 7px rgba(0,0,0,.07);box-shadow:3px 3px 7px rgba(0,0,0,.07);width:8px;height:8px;background:#fff}.slide-top-enter-active,.slide-top-leave-active{-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1)}.slide-top-enter,.slide-top-leave-to{-webkit-transform:translateY(-10px) scale(.8);transform:translateY(-10px) scale(.8);opacity:0}.lemon-button{outline:none;line-height:1.499;display:inline-block;font-weight:400;text-align:center;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid #ddd;-webkit-box-sizing:border-box;box-sizing:border-box;white-space:nowrap;padding:0 15px;font-size:14px;border-radius:4px;height:32px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1);color:rgba(0,0,0,.65);background-color:#fff;-webkit-box-shadow:0 2px 0 rgba(0,0,0,.015);box-shadow:0 2px 0 rgba(0,0,0,.015);text-shadow:0 -1px 0 rgba(0,0,0,.12)}.lemon-button:hover:not([disabled]){border-color:#666;color:#333}.lemon-button:active{background-color:#ddd}.lemon-button[disabled]{cursor:not-allowed;color:#aaa;background:#eee}.lemon-badge{position:relative;display:inline-block}.lemon-badge__label{border-radius:10px;background:#f5222d;color:#fff;text-align:center;font-size:12px;font-weight:400;white-space:nowrap;-webkit-box-shadow:0 0 0 1px #fff;box-shadow:0 0 0 1px #fff;z-index:10;position:absolute;-webkit-transform:translateX(50%);transform:translateX(50%);-webkit-transform-origin:100%;transform-origin:100%;display:inline-block;padding:0 4px;height:18px;line-height:17px;min-width:10px;top:-4px;right:6px}.lemon-badge__label--dot{width:10px;height:10px;min-width:auto;padding:0;top:-3px;right:2px}.lemon-avatar{font-variant:tabular-nums;line-height:1.5;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;display:inline-block;text-align:center;background:#ccc;color:hsla(0,0%,100%,.7);white-space:nowrap;position:relative;overflow:hidden;vertical-align:middle;border-radius:4px}.lemon-avatar img{width:100%;height:100%;display:block}.lemon-contact{padding:10px 14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;background:#efefef}.lemon-contact p{margin:0}.lemon-contact--active{background:#bebdbd}.lemon-contact:hover:not(.lemon-contact--active){background:#e3e3e3}.lemon-contact:hover:not(.lemon-contact--active) .el-badge__content{border-color:#ddd}.lemon-contact__avatar{float:left;margin-right:10px}.lemon-contact__avatar img{display:block}.lemon-contact__avatar .ant-badge-count{display:inline-block;padding:0 4px;height:18px;line-height:18px;min-width:18px;top:-4px;right:7px}.lemon-contact__label{display:-webkit-box;display:-ms-flexbox;display:flex}.lemon-contact__time{font-size:12px;line-height:18px;padding-left:6px;color:#999;white-space:nowrap}.lemon-contact__name{display:block;width:100%}.lemon-contact__content,.lemon-contact__name{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.lemon-contact__content{font-size:12px;color:#999}.lemon-contact__content img{height:14px;display:inline-block;vertical-align:middle;margin:0 1px}.lemon-contact--name-center .lemon-contact__label{padding-bottom:0;line-height:38px}.lemon-editor{height:200Line truncated

examples/dist/css/index.e7f71477.css

@@ -0,0 +1 @@
+body{background:#3d495c!important}.action{margin-top:30px}.action button{margin-right:10px}.imui-center{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.drawer-content{padding:15px}.more{font-size:32px;line-height:18px;height:32px;position:absolute;top:6px;right:14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:#999}.more:active{color:#000}.bar{line-height:30px;background:#fff;margin:15px;color:#666;font-size:12px}.bar,.cover{text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cover{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.cover i{font-size:84px;color:#e6e6e6}.cover p{font-size:18px;color:#ddd;line-height:50px}.article-item{line-height:34px;cursor:pointer}.article-item:hover{text-decoration:underline;color:#318efd}.lemon-tabs{background:#f6f6f6}.lemon-tabs-content{padding:15px}.lemon-tabs-content,.lemon-tabs-content__pane{width:100%;height:100%}.lemon-tabs-nav{display:-webkit-box;display:-ms-flexbox;display:flex;background:#eee}.lemon-tabs-nav__item{line-height:38px;padding:0 15px;cursor:pointer;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1)}.lemon-tabs-nav__item--active{background:#f6f6f6}.lemon-popover{border:1px solid #eee;font-size:14px;font-variant:tabular-nums;line-height:1.5;color:rgba(0,0,0,.65);z-index:10;background-color:#fff;border-radius:4px;-webkit-box-shadow:0 2px 8px rgba(0,0,0,.15);box-shadow:0 2px 8px rgba(0,0,0,.15);position:absolute;-webkit-transform-origin:50% 150%;transform-origin:50% 150%}.lemon-popover__content{padding:15px;-webkit-box-sizing:border-box;box-sizing:border-box;position:relative;z-index:1}.lemon-popover__arrow{left:50%;-webkit-transform:translateX(-50%) rotate(45deg);transform:translateX(-50%) rotate(45deg);position:absolute;z-index:0;bottom:-4px;-webkit-box-shadow:3px 3px 7px rgba(0,0,0,.07);box-shadow:3px 3px 7px rgba(0,0,0,.07);width:8px;height:8px;background:#fff}.slide-top-enter-active,.slide-top-leave-active{-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1)}.slide-top-enter,.slide-top-leave-to{-webkit-transform:translateY(-10px) scale(.8);transform:translateY(-10px) scale(.8);opacity:0}.lemon-button{outline:none;line-height:1.499;display:inline-block;font-weight:400;text-align:center;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid #ddd;-webkit-box-sizing:border-box;box-sizing:border-box;white-space:nowrap;padding:0 15px;font-size:14px;border-radius:4px;height:32px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-transition:all .3s cubic-bezier(.645,.045,.355,1);transition:all .3s cubic-bezier(.645,.045,.355,1);color:rgba(0,0,0,.65);background-color:#fff;-webkit-box-shadow:0 2px 0 rgba(0,0,0,.015);box-shadow:0 2px 0 rgba(0,0,0,.015);text-shadow:0 -1px 0 rgba(0,0,0,.12)}.lemon-button:hover:not([disabled]){border-color:#666;color:#333}.lemon-button:active{background-color:#ddd}.lemon-button[disabled]{cursor:not-allowed;color:#aaa;background:#eee}.lemon-badge{position:relative;display:inline-block}.lemon-badge__label{border-radius:10px;background:#f5222d;color:#fff;text-align:center;font-size:12px;font-weight:400;white-space:nowrap;-webkit-box-shadow:0 0 0 1px #fff;box-shadow:0 0 0 1px #fff;z-index:10;position:absolute;-webkit-transform:translateX(50%);transform:translateX(50%);-webkit-transform-origin:100%;transform-origin:100%;display:inline-block;padding:0 4px;height:18px;line-height:17px;min-width:10px;top:-4px;right:6px}.lemon-badge__label--dot{width:10px;height:10px;min-width:auto;padding:0;top:-3px;right:2px}.lemon-avatar{font-variant:tabular-nums;line-height:1.5;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;display:inline-block;text-align:center;background:#ccc;color:hsla(0,0%,100%,.7);white-space:nowrap;position:relative;overflow:hidden;vertical-align:middle;border-radius:4px}.lemon-avatar img{width:100%;height:100%;display:block}.lemon-contact{padding:10px 14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;background:#efefef}.lemon-contact p{margin:0}.lemon-contact--active{background:#bebdbd}.lemon-contact:hover:not(.lemon-contact--active){background:#e3e3e3}.lemon-contact:hover:not(.lemon-contact--active) .el-badge__content{border-color:#ddd}.lemon-contact__avatar{float:left;margin-right:10px}.lemon-contact__avatar img{display:block}.lemon-contact__avatar .ant-badge-count{display:inline-block;padding:0 4px;height:18px;line-height:18px;min-width:18px;top:-4px;right:7px}.lemon-contact__label{display:-webkit-box;display:-ms-flexbox;display:flex}.lemLine truncated

examples/dist/index.html

@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><link rel=icon href=favicon.ico><title>Lemon-IMUI</title><link href=css/index.2750e9e8.css rel=preload as=style><link href=js/chunk-vendors.99d7e0a4.js rel=preload as=script><link href=js/index.e213c5da.js rel=preload as=script><link href=css/index.2750e9e8.css rel=stylesheet></head><body><noscript><strong>We're sorry but flat-im doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.99d7e0a4.js></script><script src=js/index.e213c5da.js></script></body></html>
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><link rel=icon href=favicon.ico><title>Lemon-IMUI</title><link href=css/index.e7f71477.css rel=preload as=style><link href=js/chunk-vendors.e4810482.js rel=preload as=script><link href=js/index.f29ec4b1.js rel=preload as=script><link href=css/index.e7f71477.css rel=stylesheet></head><body><noscript><strong>We're sorry but flat-im doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=js/chunk-vendors.e4810482.js></script><script src=js/index.f29ec4b1.js></script></body></html>

examples/dist/js/chunk-vendors.e4810482.js

@@ -4,4 +4,4 @@
  * (c) 2014-2019 Evan You
  * Released under the MIT License.
  */
-var n=Object.freeze({});function r(t){return void 0===t||null===t}function o(t){return void 0!==t&&null!==t}function i(t){return!0===t}function a(t){return!1===t}function c(t){return"string"===typeof t||"number"===typeof t||"symbol"===typeof t||"boolean"===typeof t}function s(t){return null!==t&&"object"===typeof t}var u=Object.prototype.toString;function f(t){return"[object Object]"===u.call(t)}function l(t){return"[object RegExp]"===u.call(t)}function p(t){var e=parseFloat(String(t));return e>=0&&Math.floor(e)===e&&isFinite(t)}function d(t){return o(t)&&"function"===typeof t.then&&"function"===typeof t.catch}function v(t){return null==t?"":Array.isArray(t)||f(t)&&t.toString===u?JSON.stringify(t,null,2):String(t)}function h(t){var e=parseFloat(t);return isNaN(e)?t:e}function y(t,e){for(var n=Object.create(null),r=t.split(","),o=0;o<r.length;o++)n[r[o]]=!0;return e?function(t){return n[t.toLowerCase()]}:function(t){return n[t]}}y("slot,component",!0);var m=y("key,ref,slot,slot-scope,is");function g(t,e){if(t.length){var n=t.indexOf(e);if(n>-1)return t.splice(n,1)}}var b=Object.prototype.hasOwnProperty;function _(t,e){return b.call(t,e)}function x(t){var e=Object.create(null);return function(n){var r=e[n];return r||(e[n]=t(n))}}var w=/-(\w)/g,O=x(function(t){return t.replace(w,function(t,e){return e?e.toUpperCase():""})}),A=x(function(t){return t.charAt(0).toUpperCase()+t.slice(1)}),S=/\B([A-Z])/g,C=x(function(t){return t.replace(S,"-$1").toLowerCase()});function k(t,e){function n(n){var r=arguments.length;return r?r>1?t.apply(e,arguments):t.call(e,n):t.call(e)}return n._length=t.length,n}function E(t,e){return t.bind(e)}var j=Function.prototype.bind?E:k;function $(t,e){e=e||0;var n=t.length-e,r=new Array(n);while(n--)r[n]=t[n+e];return r}function T(t,e){for(var n in e)t[n]=e[n];return t}function P(t){for(var e={},n=0;n<t.length;n++)t[n]&&T(e,t[n]);return e}function L(t,e,n){}var I=function(t,e,n){return!1},M=function(t){return t};function N(t,e){if(t===e)return!0;var n=s(t),r=s(e);if(!n||!r)return!n&&!r&&String(t)===String(e);try{var o=Array.isArray(t),i=Array.isArray(e);if(o&&i)return t.length===e.length&&t.every(function(t,n){return N(t,e[n])});if(t instanceof Date&&e instanceof Date)return t.getTime()===e.getTime();if(o||i)return!1;var a=Object.keys(t),c=Object.keys(e);return a.length===c.length&&a.every(function(n){return N(t[n],e[n])})}catch(u){return!1}}function F(t,e){for(var n=0;n<t.length;n++)if(N(t[n],e))return n;return-1}function D(t){var e=!1;return function(){e||(e=!0,t.apply(this,arguments))}}var R="data-server-rendered",V=["component","directive","filter"],U=["beforeCreate","created","beforeMount","mounted","beforeUpdate","updated","beforeDestroy","destroyed","activated","deactivated","errorCaptured","serverPrefetch"],G={optionMergeStrategies:Object.create(null),silent:!1,productionTip:!1,devtools:!1,performance:!1,errorHandler:null,warnHandler:null,ignoredElements:[],keyCodes:Object.create(null),isReservedTag:I,isReservedAttr:I,isUnknownElement:I,getTagNamespace:L,parsePlatformTagName:M,mustUseProp:I,async:!0,_lifecycleHooks:U},H=/a-zA-Z\u00B7\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u037D\u037F-\u1FFF\u200C-\u200D\u203F-\u2040\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD/;function B(t){var e=(t+"").charCodeAt(0);return 36===e||95===e}function z(t,e,n,r){Object.defineProperty(t,e,{value:n,enumerable:!!r,writable:!0,configurable:!0})}var W=new RegExp("[^"+H.source+".$_\\d]");function K(t){if(!W.test(t)){var e=t.split(".");return function(t){for(var n=0;n<e.length;n++){if(!t)return;t=t[e[n]]}return t}}}var q,X="__proto__"in{},Y="undefined"!==typeof window,J="undefined"!==typeof WXEnvironment&&!!WXEnvironment.platform,Z=J&&WXEnvironment.platform.toLowerCase(),Q=Y&&window.navigator.userAgent.toLowerCase(),tt=Q&&/msie|trident/.test(Q),et=Q&&Q.indexOf("msie 9.0")>0,nt=Q&&Q.indexOf("edge/")>0,rt=(Q&&Q.indexOf("android"),Q&&/iphone|ipad|ipod|ios/.test(Q)||"ios"===Z),ot=(Q&&/chrome\/\d+/.test(Q),Q&&/phantomjs/.test(Q),Q&&Q.match(/firefox\/(\d+)/)),it={}.watch,at=!1;if(Y)try{var ct={};Object.defineProperty(ct,"passive",{get:function(){at=!0}}),window.addEventListener("test-passive",null,ct)}catch(Oa){}var st=function(){return void 0===q&&(q=!Y&&!J&&"undefined"!==typeof t&&(t["process"]&&"server"===t["process"].env.VUE_ENV)),q},ut=Y&&window.__VUE_DEVTOOLS_GLOBAL_HOOK__;function ft(t){return"function"===typeof t&&/native code/.test(t.toString())}var lt,pt="undefined"!==typeof Symbol&&ft(Symbol)&&"undefined"!==typeof Reflect&&ft(Reflect.ownKeys);lt="undefined"!==typeof Set&&ft(Set)?Set:function(){function t(){this.set=Object.create(null)}return t.prototype.has=function(t){return!0===this.set[t]},t.prototype.add=function(t){this.set[t]=!0},t.prototype.clear=function(){this.set=Object.create(null)},t}();var dt=L,vt=0,ht=function(){this.id=vt++,this.subs=[]};ht.prototype.addSub=function(t){this.subs.push(t)},ht.prototype.removeSub=function(t){g(this.subs,t)},ht.prototype.depend=function(){ht.taLine truncated
+var n=Object.freeze({});function r(t){return void 0===t||null===t}function o(t){return void 0!==t&&null!==t}function i(t){return!0===t}function a(t){return!1===t}function c(t){return"string"===typeof t||"number"===typeof t||"symbol"===typeof t||"boolean"===typeof t}function s(t){return null!==t&&"object"===typeof t}var u=Object.prototype.toString;function f(t){return"[object Object]"===u.call(t)}function l(t){return"[object RegExp]"===u.call(t)}function p(t){var e=parseFloat(String(t));return e>=0&&Math.floor(e)===e&&isFinite(t)}function d(t){return o(t)&&"function"===typeof t.then&&"function"===typeof t.catch}function v(t){return null==t?"":Array.isArray(t)||f(t)&&t.toString===u?JSON.stringify(t,null,2):String(t)}function h(t){var e=parseFloat(t);return isNaN(e)?t:e}function y(t,e){for(var n=Object.create(null),r=t.split(","),o=0;o<r.length;o++)n[r[o]]=!0;return e?function(t){return n[t.toLowerCase()]}:function(t){return n[t]}}y("slot,component",!0);var m=y("key,ref,slot,slot-scope,is");function g(t,e){if(t.length){var n=t.indexOf(e);if(n>-1)return t.splice(n,1)}}var b=Object.prototype.hasOwnProperty;function _(t,e){return b.call(t,e)}function x(t){var e=Object.create(null);return function(n){var r=e[n];return r||(e[n]=t(n))}}var w=/-(\w)/g,O=x(function(t){return t.replace(w,function(t,e){return e?e.toUpperCase():""})}),A=x(function(t){return t.charAt(0).toUpperCase()+t.slice(1)}),S=/\B([A-Z])/g,C=x(function(t){return t.replace(S,"-$1").toLowerCase()});function k(t,e){function n(n){var r=arguments.length;return r?r>1?t.apply(e,arguments):t.call(e,n):t.call(e)}return n._length=t.length,n}function E(t,e){return t.bind(e)}var j=Function.prototype.bind?E:k;function $(t,e){e=e||0;var n=t.length-e,r=new Array(n);while(n--)r[n]=t[n+e];return r}function T(t,e){for(var n in e)t[n]=e[n];return t}function P(t){for(var e={},n=0;n<t.length;n++)t[n]&&T(e,t[n]);return e}function L(t,e,n){}var I=function(t,e,n){return!1},M=function(t){return t};function N(t,e){if(t===e)return!0;var n=s(t),r=s(e);if(!n||!r)return!n&&!r&&String(t)===String(e);try{var o=Array.isArray(t),i=Array.isArray(e);if(o&&i)return t.length===e.length&&t.every(function(t,n){return N(t,e[n])});if(t instanceof Date&&e instanceof Date)return t.getTime()===e.getTime();if(o||i)return!1;var a=Object.keys(t),c=Object.keys(e);return a.length===c.length&&a.every(function(n){return N(t[n],e[n])})}catch(u){return!1}}function F(t,e){for(var n=0;n<t.length;n++)if(N(t[n],e))return n;return-1}function D(t){var e=!1;return function(){e||(e=!0,t.apply(this,arguments))}}var R="data-server-rendered",V=["component","directive","filter"],U=["beforeCreate","created","beforeMount","mounted","beforeUpdate","updated","beforeDestroy","destroyed","activated","deactivated","errorCaptured","serverPrefetch"],G={optionMergeStrategies:Object.create(null),silent:!1,productionTip:!1,devtools:!1,performance:!1,errorHandler:null,warnHandler:null,ignoredElements:[],keyCodes:Object.create(null),isReservedTag:I,isReservedAttr:I,isUnknownElement:I,getTagNamespace:L,parsePlatformTagName:M,mustUseProp:I,async:!0,_lifecycleHooks:U},H=/a-zA-Z\u00B7\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u037D\u037F-\u1FFF\u200C-\u200D\u203F-\u2040\u2070-\u218F\u2C00-\u2FEF\u3001-\uD7FF\uF900-\uFDCF\uFDF0-\uFFFD/;function B(t){var e=(t+"").charCodeAt(0);return 36===e||95===e}function z(t,e,n,r){Object.defineProperty(t,e,{value:n,enumerable:!!r,writable:!0,configurable:!0})}var W=new RegExp("[^"+H.source+".$_\\d]");function K(t){if(!W.test(t)){var e=t.split(".");return function(t){for(var n=0;n<e.length;n++){if(!t)return;t=t[e[n]]}return t}}}var q,X="__proto__"in{},Y="undefined"!==typeof window,J="undefined"!==typeof WXEnvironment&&!!WXEnvironment.platform,Z=J&&WXEnvironment.platform.toLowerCase(),Q=Y&&window.navigator.userAgent.toLowerCase(),tt=Q&&/msie|trident/.test(Q),et=Q&&Q.indexOf("msie 9.0")>0,nt=Q&&Q.indexOf("edge/")>0,rt=(Q&&Q.indexOf("android"),Q&&/iphone|ipad|ipod|ios/.test(Q)||"ios"===Z),ot=(Q&&/chrome\/\d+/.test(Q),Q&&/phantomjs/.test(Q),Q&&Q.match(/firefox\/(\d+)/)),it={}.watch,at=!1;if(Y)try{var ct={};Object.defineProperty(ct,"passive",{get:function(){at=!0}}),window.addEventListener("test-passive",null,ct)}catch(Oa){}var st=function(){return void 0===q&&(q=!Y&&!J&&"undefined"!==typeof t&&(t["process"]&&"server"===t["process"].env.VUE_ENV)),q},ut=Y&&window.__VUE_DEVTOOLS_GLOBAL_HOOK__;function ft(t){return"function"===typeof t&&/native code/.test(t.toString())}var lt,pt="undefined"!==typeof Symbol&&ft(Symbol)&&"undefined"!==typeof Reflect&&ft(Reflect.ownKeys);lt="undefined"!==typeof Set&&ft(Set)?Set:function(){function t(){this.set=Object.create(null)}return t.prototype.has=function(t){return!0===this.set[t]},t.prototype.add=function(t){this.set[t]=!0},t.prototype.clear=function(){this.set=Object.create(null)},t}();var dt=L,vt=0,ht=function(){this.id=vt++,this.subs=[]};ht.prototype.addSub=function(t){this.subs.push(t)},ht.prototype.removeSub=function(t){g(this.subs,t)},ht.prototype.depend=function(){ht.taLine truncated

examples/dist/js/index.e213c5da.js

@@ -1 +0,0 @@
-(function(e){function t(t){for(var i,s,o=t[0],c=t[1],l=t[2],m=0,d=[];m<o.length;m++)s=o[m],a[s]&&d.push(a[s][0]),a[s]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);u&&u(t);while(d.length)d.shift()();return r.push.apply(r,l||[]),n()}function n(){for(var e,t=0;t<r.length;t++){for(var n=r[t],i=!0,o=1;o<n.length;o++){var c=n[o];0!==a[c]&&(i=!1)}i&&(r.splice(t--,1),e=s(s.s=n[0]))}return e}var i={},a={index:0},r=[];function s(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,s),n.l=!0,n.exports}s.m=e,s.c=i,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},s.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(s.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)s.d(n,i,function(t){return e[t]}.bind(null,i));return n},s.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="";var o=window["webpackJsonp"]=window["webpackJsonp"]||[],c=o.push.bind(o);o.push=t,o=o.slice();for(var l=0;l<o.length;l++)t(o[l]);var u=c;r.push([0,"chunk-vendors"]),n()})({0:function(e,t,n){e.exports=n("c31f")},"04f4":function(e,t,n){"use strict";var i=n("26f7"),a=n.n(i);a.a},"0af2":function(e,t,n){},"0e15":function(e,t,n){"use strict";var i=n("9768"),a=n.n(i);a.a},1021:function(e,t,n){},"107a":function(e,t,n){},"15cf":function(e,t,n){},1663:function(e,t,n){"use strict";var i=n("e86c"),a=n.n(i);a.a},"1e45":function(e,t,n){"use strict";var i=n("83d7"),a=n.n(i);a.a},"26f7":function(e,t,n){},"2ec9":function(e,t){},3423:function(e,t,n){"use strict";var i=n("107a"),a=n.n(i);a.a},"436f":function(e,t,n){"use strict";var i=n("0af2"),a=n.n(i);a.a},"49c2":function(e,t,n){"use strict";var i=n("acce"),a=n.n(i);a.a},"4d21":function(e,t,n){"use strict";var i=n("917b"),a=n.n(i);a.a},"6a2b":function(e,t,n){},"6da9":function(e,t,n){},7802:function(e,t,n){},"820e":function(e,t,n){},"83d7":function(e,t,n){},"909e":function(e,t,n){"use strict";var i=n("1021"),a=n.n(i);a.a},"917b":function(e,t,n){},9768:function(e,t,n){},9800:function(e,t,n){},"9b01":function(e,t,n){"use strict";var i=n("6da9"),a=n.n(i);a.a},"9c9b":function(e,t,n){"use strict";var i=n("9800"),a=n.n(i);a.a},a215:function(e,t,n){},acce:function(e,t,n){},c31f:function(e,t,n){"use strict";n.r(t);n("cadf"),n("551c"),n("f751"),n("097d");var i=n("2b0e"),a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{attrs:{id:"app"}},[n("div",{staticClass:"imui-center"},[n("lemon-imui",{ref:"IMUI",attrs:{user:e.user},on:{"change-menu":e.handleChangeMenu,"change-contact":e.handleChangeContact,"pull-messages":e.handlePullMessages,send:e.handleSend},scopedSlots:e._u([{key:"cover",fn:function(){return[n("h1",{staticStyle:{"text-indent":"20px"}},[e._v("自定义封面内容")])]},proxy:!0},{key:"contact-title",fn:function(t){return[n("span",[e._v(e._s(t.displayName))]),n("small",{staticClass:"more",on:{click:function(n){return e.changeDrawer(t)}}},[e._v("…")])]}}])}),n("div",{staticClass:"action"},[n("lemon-button",{on:{click:e.appendMessage}},[e._v("发送消息")]),n("lemon-button",{on:{click:e.updateContact}},[e._v("修改联系人信息")])],1)],1)])},r=[],s=(n("8e6e"),n("ac6a"),n("456d"),n("bd86"));n("c5f6"),n("6b54");function o(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,i)}return n}function c(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?o(n,!0).forEach(function(t){Object(s["a"])(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):o(n).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var l,u,m,d,f,p,h,g,v,b,x=function(){return(new Date).getTime()},y=function(){return Number(Math.random().toString().substr(3,length)+Date.now()).toString(36)},_=function(){return Math.random().toString(36).substr(2)},w=function(){return{id:y(),status:"succeed",type:"text",sendTime:x(),content:_(),toContactId:"123",fromUser:{id:"222",displayName:"系统测试",avatar:"http://upload.qqbodys.com/allimg/1710/1035512943-0.jpg"}}},j={name:"app",data:function(){return{user:{id:"superadmin",displayName:"IMUI super",avatar:"http://upload.qqbodys.com/img/weixin/20170804/ji5qxg1am5ztm.jpg"}}},mounted:function(){var e=this.$createElement,t={id:"1",displayName:"工作协作群",avatar:"http://upload.qqbodys.com/img/weixin/20170804/ji5qxg1am5ztm.jpg",type:"single",index:"A",unread:0,lastSendTime:156604786Line truncated

examples/dist/js/index.f29ec4b1.js

@@ -0,0 +1 @@
+(function(e){function t(t){for(var i,s,o=t[0],c=t[1],l=t[2],d=0,m=[];d<o.length;d++)s=o[d],a[s]&&m.push(a[s][0]),a[s]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);u&&u(t);while(m.length)m.shift()();return r.push.apply(r,l||[]),n()}function n(){for(var e,t=0;t<r.length;t++){for(var n=r[t],i=!0,o=1;o<n.length;o++){var c=n[o];0!==a[c]&&(i=!1)}i&&(r.splice(t--,1),e=s(s.s=n[0]))}return e}var i={},a={index:0},r=[];function s(t){if(i[t])return i[t].exports;var n=i[t]={i:t,l:!1,exports:{}};return e[t].call(n.exports,n,n.exports,s),n.l=!0,n.exports}s.m=e,s.c=i,s.d=function(e,t,n){s.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},s.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},s.t=function(e,t){if(1&t&&(e=s(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(s.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)s.d(n,i,function(t){return e[t]}.bind(null,i));return n},s.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return s.d(t,"a",t),t},s.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},s.p="";var o=window["webpackJsonp"]=window["webpackJsonp"]||[],c=o.push.bind(o);o.push=t,o=o.slice();for(var l=0;l<o.length;l++)t(o[l]);var u=c;r.push([0,"chunk-vendors"]),n()})({0:function(e,t,n){e.exports=n("c31f")},"04f4":function(e,t,n){"use strict";var i=n("26f7"),a=n.n(i);a.a},"0af2":function(e,t,n){},"0e15":function(e,t,n){"use strict";var i=n("9768"),a=n.n(i);a.a},1021:function(e,t,n){},"107a":function(e,t,n){},"15cf":function(e,t,n){},1663:function(e,t,n){"use strict";var i=n("e86c"),a=n.n(i);a.a},"1e45":function(e,t,n){"use strict";var i=n("83d7"),a=n.n(i);a.a},"26f7":function(e,t,n){},"2ec9":function(e,t){},3423:function(e,t,n){"use strict";var i=n("107a"),a=n.n(i);a.a},"436f":function(e,t,n){"use strict";var i=n("0af2"),a=n.n(i);a.a},"49c2":function(e,t,n){"use strict";var i=n("acce"),a=n.n(i);a.a},"4d21":function(e,t,n){"use strict";var i=n("917b"),a=n.n(i);a.a},"6a2b":function(e,t,n){},"6da9":function(e,t,n){},7802:function(e,t,n){},"820e":function(e,t,n){},"83d7":function(e,t,n){},"909e":function(e,t,n){"use strict";var i=n("1021"),a=n.n(i);a.a},"917b":function(e,t,n){},9768:function(e,t,n){},9800:function(e,t,n){},"9b01":function(e,t,n){"use strict";var i=n("6da9"),a=n.n(i);a.a},"9c9b":function(e,t,n){"use strict";var i=n("9800"),a=n.n(i);a.a},a215:function(e,t,n){},acce:function(e,t,n){},c31f:function(e,t,n){"use strict";n.r(t);n("cadf"),n("551c"),n("f751"),n("097d");var i=n("2b0e"),a=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{attrs:{id:"app"}},[n("div",{staticClass:"imui-center"},[n("lemon-imui",{ref:"IMUI",attrs:{user:e.user,"hide-menu":e.hideMenu,"hide-menu-avatar":e.hideMenuAvatar},on:{"change-menu":e.handleChangeMenu,"change-contact":e.handleChangeContact,"pull-messages":e.handlePullMessages,"message-click":e.handleMessageClick,send:e.handleSend},scopedSlots:e._u([{key:"cover",fn:function(){return[n("div",{staticClass:"cover"},[n("i",{staticClass:"lemon-icon-message"}),n("p",[n("b",[e._v("Lemon")]),e._v(" IMUI")])])]},proxy:!0},{key:"contact-title",fn:function(t){return[n("span",[e._v(e._s(t.displayName))]),n("small",{staticClass:"more",on:{click:function(n){return e.changeDrawer(t)}}},[e._v("…")])]}},{key:"contact-info",fn:function(t){return[e._v("\n        自定义联系人信息 "+e._s(t.displayName)+"\n      ")]}},{key:"message-sidebar",fn:function(){return[n("div",{staticClass:"bar"},[e._v("自定义消息顶部")])]},proxy:!0},{key:"contact-sidebar",fn:function(){return[n("div",{staticClass:"bar"},[e._v("自定义联系人顶部")])]},proxy:!0}])}),n("div",{staticClass:"action"},[n("lemon-button",{on:{click:e.appendMessage}},[e._v("发送消息")]),n("lemon-button",{on:{click:e.updateContact}},[e._v("修改联系人信息")]),n("lemon-button",{on:{click:e.changeMenuVisible}},[e._v("切换导航显示")]),n("lemon-button",{on:{click:e.changeMenuAvatarVisible}},[e._v("切换头像显示")])],1)],1)])},r=[],s=(n("8e6e"),n("ac6a"),n("456d"),n("2638")),o=n.n(s),c=n("bd86");n("6b54");function l(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,i)}return n}function u(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?l(n,!0).forEach(function(t){Object(c["a"])(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):l(n).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var d,m,f,h,p,g,v,b,x,_,y=function(){return(new Date).getTime()},w=function(){return Math.random().toString(36).substr(-8)},j=funLine truncated

packages/components/index.vue

@@ -50,6 +50,7 @@ export default {
      * 初始化时是否隐藏导航按钮上的头像
      */
     hideMenuAvatar: Boolean,
+    hideMenu: Boolean,
     user: {
       type: Object,
       default: () => {
@@ -198,37 +199,17 @@ export default {
         file
       );
     },
-    _handleReachTop(next) {
-      // const messages = {
-      //   id: "8ad7e98e-5225-4892-8131-4b2ee7797599",
-      //   type: "text",
-      //   status: "succeed",
-      //   sendTime: 1564926674646,
-      //   fromContactId: "superadmin",
-      //   fromUser: {
-      //     id: "hehe",
-      //     displayName: "I KNOEW",
-      //     avatar:
-      //       "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=4085009425,1005454674&fm=26&gp=0.jpg"
-      //   },
-      //   content: "测试消息哦..."
-      // };
+    _emitPullMessages(next) {
       this.$emit(
         "pull-messages",
         this.currentContact,
         (messages, isEnd = false) => {
-          this._addMessage(
-            Array(10).fill(messages[1]),
-            this.currentContactId,
-            0
-          );
+          this._addMessage(messages, this.currentContactId, 0);
           CacheMessageLoaded.set(this.currentContactId, isEnd);
+          if (isEnd == true) this.$refs.messages.loaded();
           next(isEnd);
         }
       );
-      // setTimeout(() => {
-      //   CacheMessageLoaded.set(this.currentContactId, isEnd);
-      // }, 2000);
     },
     clearCacheContainer(name) {
       CacheContactContainer.remove(name);
@@ -249,16 +230,17 @@ export default {
     _renderMenu() {
       const menuItem = this._renderMenuItem();
       return (
-        <div class="lemon-menu">
-          {this.hideMenuAvatar == false && (
+        <div class="lemon-menu" v-show={!this.hideMenu}>
+          {
             <lemon-avatar
+              v-show={!this.hideMenuAvatar}
               on-click={e => {
                 console.log("menu avatar click");
               }}
               class="lemon-menu__avatar"
-              src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=400062461,2874561526&fm=26&gp=0.jpg"
+              src={this.user.avatar}
             />
-          )}
+          }
           {menuItem.top}
           {this.$slots.menu}
           <div class="lemon-menu__bottom">
@@ -301,15 +283,18 @@ export default {
     },
     _renderSidebarMessage() {
       return this._renderSidebar(
-        this.lastMessages.map(contact => {
-          return this._renderContact(
-            {
-              contact,
-              timeFormat: this.contactTimeFormat
-            },
-            () => this.changeContact(contact.id)
-          );
-        }),
+        [
+          useScopedSlot(this.$scopedSlots["message-sidebar"]),
+          this.lastMessages.map(contact => {
+            return this._renderContact(
+              {
+                contact,
+                timeFormat: this.contactTimeFormat
+              },
+              () => this.changeContact(contact.id)
+            );
+          })
+        ],
         DEFAULT_MENU_LASTMESSAGES
       );
     },
@@ -342,23 +327,27 @@ export default {
     _renderSidebarContact() {
       let prevIndex;
       return this._renderSidebar(
-        this.contacts.map(contact => {
-          contact.index = contact.index.replace(/\[[0-9]*\]/, "");
-          const node = [
-            contact.index !== prevIndex && (
-              <p class="lemon-sidebar__label">{contact.index}</p>
-            ),
-            this._renderContact(
-              {
-                contact: contact,
-                simple: true
-              },
-              () => this.changeContact(contact.id)
-            )
-          ];
-          prevIndex = contact.index;
-          return node;
-        }),
+        [
+          useScopedSlot(this.$scopedSlots["contact-sidebar"]),
+          this.contacts.map(contact => {
+            if (!contact.index) return;
+            contact.index = contact.index.replace(/\[[0-9]*\]/, "");
+            const node = [
+              contact.index !== prevIndex && (
+                <p class="lemon-sidebar__label">{contact.index}</p>
+              ),
+              this._renderContact(
+                {
+                  contact: contact,
+                  simple: true
+                },
+                () => this.changeContact(contact.id)
+              )
+            ];
+            prevIndex = contact.index;
+            return node;
+          })
+        ],
         DEFAULT_MENU_CONTACTS
       );
     },
@@ -425,7 +414,7 @@ export default {
             ref="messages"
             time-format={this.messageTimeFormat}
             reverse-user-id={this.user.id}
-            on-reach-top={this._handleReachTop}
+            on-reach-top={this._emitPullMessages}
             messages={this.currentMessages}
           />
           <lemon-editor
@@ -436,7 +425,7 @@ export default {
         </div>
       );
       nodes.push(
-        <div class={cls} v-show={!curact.id}>
+        <div class={cls} v-show={!curact.id && this.currentIsDefSidebar}>
           {this.$slots.cover}
         </div>
       );
@@ -455,8 +444,7 @@ export default {
                   this.changeContact(curact.id, DEFAULT_MENU_LASTMESSAGES);
                 }}
               >
-                {" "}
-                发送消息{" "}
+                发送消息
               </lemon-button>
             </div>,
             curact
@@ -537,16 +525,11 @@ export default {
           this.$refs.messages.resetLoadState();
         }
         if (!messages[contactId]) {
-          this.$emit(
-            "pull-messages",
-            this.currentContact,
-            (messages, isEnd) => {
-              this._addMessage(messages, contactId, 0);
-              this.messageViewToBottom();
-            }
-          );
+          this._emitPullMessages(isEnd => this.messageViewToBottom());
         } else {
-          this.messageViewToBottom();
+          setTimeout(() => {
+            this.messageViewToBottom();
+          }, 0);
         }
       }
     },
@@ -570,10 +553,11 @@ export default {
     updateMessage(messageId, contactId, data) {
       const index = this.findMessageIndexById(messageId, contactId);
       if (index !== -1) {
-        messages[contactId][index] = {
-          ...messages[contactId][index],
-          ...data
-        };
+        messages[contactId][index] = Object.assign(
+          messages[contactId][index],
+          data
+        );
+        console.log('--------',messages[contactId][index]);
         this.forceUpdateMessage(messageId);
       }
     },
@@ -684,6 +668,7 @@ export default {
      */
     sortContacts() {
       this.contacts.sort((a, b) => {
+        if (!a.index) return;
         return a.index.localeCompare(b.index);
       });
     },
@@ -740,8 +725,8 @@ export default {
      * 返回所有消息
      * @return {Object<Contact.id,Message>}
      */
-    getMessages() {
-      return messages;
+    getMessages(contactId) {
+      return (contactId ? messages[contactId] : messages) || [];
     },
     // appendContact(data) {
     //   this._addContact(data, 0);

packages/components/message/basic.vue

@@ -1,6 +1,7 @@
 <script>
 export default {
   name: "lemonMessageBasic",
+  inject: ["IMUI"],
   props: {
     message: {
       type: Object,
@@ -35,16 +36,16 @@ export default {
             size={36}
             shape="square"
             src={fromUser.avatar}
-            on-click={() => {
-              console.log("message avatar click");
+            on-click={e => {
+              this._emitClick(e, "avatar");
             }}
           />
         </div>
         <div class="lemon-message__inner">
           <div class="lemon-message__title">
             <span
-              on-click={() => {
-                console.log("message displayname click");
+              on-click={e => {
+                this._emitClick(e, "displayName");
               }}
             >
               {fromUser.displayName}
@@ -53,13 +54,20 @@ export default {
           </div>
           <div
             class="lemon-message__content"
-            on-click={() => {
-              console.log("message content click");
+            on-click={e => {
+              this._emitClick(e, "content");
             }}
           >
             {this.useScopedSlots("content", this.message)}
           </div>
-          <div class="lemon-message__status">{this._renderStatue(status)}</div>
+          <div
+            class="lemon-message__status"
+            on-click={e => {
+              this._emitClick(e, "status");
+            }}
+          >
+            {this._renderStatue(status)}
+          </div>
         </div>
       </div>
     );
@@ -69,6 +77,9 @@ export default {
   computed: {},
   watch: {},
   methods: {
+    _emitClick(e, key) {
+      this.IMUI.$emit("message-click", e, key, this.message);
+    },
     _renderStatue(status) {
       if (status == "going") {
         return <i class="lemon-icon-loading lemonani-spin" />;

packages/components/message/text.vue

@@ -1,9 +1,8 @@
 <script>
-import IMUIProxy from "mixins/IMUIProxy";
 export default {
   name: "lemonMessageText",
   inheritAttrs: false,
-  mixins: [IMUIProxy],
+  inject: ["IMUI"],
   render() {
     return (
       <lemon-message-basic

packages/components/messages.vue

@@ -22,8 +22,8 @@ export default {
   },
   data() {
     return {
-      loading: false,
-      loadend: false
+      _loading: false,
+      _loadend: false
     };
   },
   render() {
@@ -32,10 +32,10 @@ export default {
         <div
           class={[
             "lemon-messages__load",
-            `lemon-messages__load--${this.loadend ? "end" : "ing"}`
+            `lemon-messages__load--${this._loadend ? "end" : "ing"}`
           ]}
         >
-          {this.loadend ? this._renderLoadEnd() : this._renderLoading()}
+          {this._loadend ? this._renderLoadEnd() : this._renderLoading()}
         </div>
         {this.messages.map((message, index) => {
           const node = [];
@@ -86,35 +86,40 @@ export default {
       return <i class="lemon-icon-loading lemonani-spin" />;
     },
     _renderLoadEnd() {
-      return <span>暂无消息</span>;
+      return <span>暂无更多消息</span>;
+    },
+    loaded() {
+      this._loadend = true;
     },
     resetLoadState() {
-      this.loading = false;
-      this.loadend = false;
+      this._loading = false;
+      this._loadend = false;
     },
     async _handleScroll(e) {
       const { target } = e;
       if (
         target.scrollTop == 0 &&
-        this.loading == false &&
-        this.loadend == false
+        this._loading == false &&
+        this._loadend == false
       ) {
-        this.loading = true;
+        this._loading = true;
         await this.$nextTick();
         const hst = target.scrollHeight;
 
         this.$emit("reach-top", async isEnd => {
           await this.$nextTick();
           target.scrollTop = target.scrollHeight - hst;
-          this.loading = false;
-          this.loadend = !!isEnd;
+          this._loading = false;
+          this._loadend = !!isEnd;
         });
       }
     },
     async scrollToBottom() {
       await this.$nextTick();
       const { wrap } = this.$refs;
-      if (wrap) wrap.scrollTop = wrap.scrollHeight;
+      if (wrap) {
+        wrap.scrollTop = wrap.scrollHeight;
+      }
     }
   },
   created() {},
@@ -133,6 +138,7 @@ export default {
     text-align center
     font-size 12px
   +e(load)
+    user-select none
     font-size 12px
     text-align center
     color #999

packages/mixins/IMUIProxy.js

@@ -1,4 +0,0 @@
-export default {
-  inject: ["IMUI"],
-  methods: {}
-};