<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>
2022-07-10
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 昨天是一个收获特别大的一天,为什么要快速决定装修、空调和内部的家具整装,因为我们确定了预算没有太多要花费的时间了,...