天蛙tw-mobile-component

说明: 天蛙移动端组件库，包括IM聊天组件、图片压缩、echarts、文件上传等等，为了整合现有各个系统的通用功能，也为了方便管理统一的版本，提供了NPM包

安装:

npm install tw-mobile-component

使用:

import { chat } from 'tw-mobile-component'

demo:

  <template>
    <div style="height: 100vh; width: 100%;">
      <div style="height: 50%; width:100%;background-color: blue;">其他部分</div>
      <im-chat style="height: 50%; width:100%;"
        :userType="option.userType"
        :userName="option.userName"
        :userId="option.userId"
        :token="option.token"
        :roomId="option.roomId"
        :providerUrl="option.providerUrl"
        @change="roomChange"
        @close="chatClose"
        >
      </im-chat>
    </div>
  </template>
  <script>
  import { Chat } from 'tw-mobile-component'
  export default {
    components: {
      ImChat:Chat
    },
    data() {
      return {
        option: {
          userType: '3',// 用户类型 1:主讲人,2:听众,3:游客 ，非空
          userName: '用户名',// 用户名或昵称，可空
          userId: '6310a3b02494e96d44b7352f7ec7829d',// userId和token目前是一样的，非空
          token: '6310a3b02494e96d44b7352f7ec7829d',// userId和token目前是一样的，非空
          roomId: '27B658A5FE85895ABE348956498EC5AB',// 群聊的房间Id，非空
          // socketUrl: 'ws://192.168.31.18:9901/terminal/123' // socket 连接地址，socketUrl地址优先，socketUrl空时使用“providerUrl”获取socketUrl
          providerUrl: 'http://110.90.118.100:7901/base/socketServer/getConnectUri' // 非空，固定值，用于获取socket 连接地址
          // 开发/测试环境：http://110.90.118.100:7901/base/socketServer/getConnectUri
          // 正式环境：https://socket.tianwayun.com/base/socketServer/getConnectUri
        }
      }
    },
    created() {},
    methods: {
      roomChange(obj){
        // obj：{ message:true,handsup:true,thumbsup:true,gift:true,online:0,streamFinish:false,streamStart:false }
        // message:禁言状态,false代表禁言，true代表正常
        // handsup:举手状态,false代表禁止举手，true代表正常
        // thumbsup:点赞状态,false代表禁止点赞，true代表正常
        // gift:送礼物状态,false代表禁止送礼物，true代表正常
        // online:在线人数
        // streamFinish:直播结束状态,false代表直播未结束，true代表直播已结束
        // streamStart:直播开始状态,false代表直播未开始，true代表直播已开始
      },
      chatClose(){
        // 当有相同token又加入时，之前进入直播间的人将被提出，触发此回调
      }
    }
  }
  </script>