<!-- 聊天记录 -->
<template>
    <div class="imChat-wrapper">
        <main class="imChat-main">
            <!-- 聊天框区域 -->
            <common-chat ref="common_chat" :chatInfoEn="storeSelectedChatEn" :oprRoleName="'server'" @sendMsg="sendMsg"></common-chat>
        </main>
    </div>
</template>

<script>
import { formatTime } from '../../../libs/ali-oss'
import commonChat from '../common/common_chat.vue'
export default {
  props: {
    storeSelectedChatEn: Object
  },
  components: {
    commonChat: commonChat
  },
  data () {
    return {
      // storeSelectedChatEn: {},
      storeHaveNewMsgDelegate: null,
      storeServerChatEn: {},
      socket: '',
      path: 'ws://172.22.16.30:8090/mallcustomer/websocket',
      content: '',
      selectData: [],
      group: {}
    }
  },
  watch: {
    storeSelectedChatEn (value) {
      this.$refs.common_chat.goEnd()
    },
    storeHaveNewMsgDelegate (value) {
      this.$refs.common_chat.goEnd()
    }
  },
  methods: {
    /**
         * 发送消息
         * @param {Object} rs 回调对象
         */
    sendMsg (rs) {
      this.$emit('send', rs)
    },

    goEnd: function () {
      this.$refs.common_chat.goEnd()
    },

    /**
         * 获取chat的访问时间
         * @param {Date} accessTime 问时间
         */
    getAccessTimeStr: function (accessTime) {
      return formatTime(accessTime)
    }
  },
  mounted () {
    console.log(this.storeSelectedChatEn)
  }
}
</script>
<style lang="less">
.imChat-wrapper {
    .imChat-header {
        display: flex;
        align-items: center;
        width: 100%;
        height: 50px;
        padding-left: 10px;
        border-bottom: 1px solid #e6e6e6;
        font-size: 16px;
        span {
            margin-right: 20px;
        }
        .on-line {
            color: #70ed3a;
        }
        .off-line {
            color: #bbbbbb;
        }
    }
    .imChat-main {
        height: calc(~'100% - 0px');
    }
}
</style>
