<template>
    <div class="chat">
        <div class="top-chat-list">
            <top-chat-box></top-chat-box>
        </div>
        <div id="chat-skin" class="chat-box">
            <chat-box></chat-box>
        </div>
    </div>
</template>

<script>
    import {mapGetters} from 'vuex'
    import topChatBox from './chat/topChat'
    import chatBox from './chat/chat'
    export default {
        components: {
            topChatBox,
            chatBox,
        },
        props: {
            isShowChat: {},
        },
        data(){
            return {
                
            }
        },
        computed: {
            ...mapGetters({
                'userInfo': 'userInfo',
                'channelInfo': 'channelInfo',
            }),
        },
    }
</script>

<style lang="less" scoped>
    .chat{
        position: relative;
        height: 100%;
        .top-chat-list{
            position: absolute;
            top: 0;
            left: 0;
            z-index: 90;
            width: 100%;
            background: #fff;
        }
        .chat-box{
            height: 100%;
            width: 100%;
            overflow-y: auto;
        }
    }
</style>