2022-07-10

1. https://blog.csdn.net/SharaSwift/article/details/98217074?spm=1001.2101.3001.6650.2&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-2-98217074-blog-116084583.pc_relevant_multi_platform_whitelistv1&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-2-98217074-blog-116084583.pc_relevant_multi_platform_whitelistv1&utm_relevant_index=5

2. https://blog.csdn.net/weixin_49296016/article/details/116084583

<div id="chat">
            <div class="chatBox">
                <div class="chatBox-top">
                    <div class="chatBox-top-imgBox">
                        <van-image round width="2.5rem" height="2.5rem" src="https://img01.yzcdn.cn/vant/cat.jpeg" />
                    </div>
                    <div class="chatBox-top-text"><span>小巴客服正在为您服务</span></div>
                </div>
                <div class="chatBox-middle">
                    <div class="chatInfo" id="chatInfo">
                        <div class="chatUser-box" v-for="(item,index) in infoList"  :key="index" :class="[current==item.id?'chatUser-box1':'chatUser-box']">
                            <div class="chatUser-box-img">
                                <van-image round width="2.5rem" height="2.5rem"
                                    :src="item.images" />
                            </div>
                            <div class="chatUser-info">
                                <div class="chatUser-info-name" :class="[current==item.id?'chatUser-info-name1':'chatUser-info-name']"><span>{{item.name}}</span><span class="nowDate">{{item.time}}</span>
                                </div>
                                <div class="chatUser-info-text" :class="[current==item.id?'chatUser-info-text1':'chatUser-info-text']">
                                    <span>{{item.message}}</span>
                                </div>
                            </div>
                        </div>
                        
                    </div>
                </div>
                <div class="chatBox-infoDesk">
                    <div class="chatBox-textarea">
                        <van-field v-model="messages" rows="4" type="textarea" placeholder="请输入咨询信息" />
                    </div>
                    <div class="chatBox-sendOut">
                        <van-button class="sendOut" type="primary" @click="getSends">客户</van-button>
                        <van-button class="sendOut" type="primary" @click="getSend">用户</van-button>
                    </div>
                </div>
            </div>
        </div>