客服记录加载更多

This commit is contained in:
龙运模 2024-11-18 23:56:12 +08:00
parent 539e8479ad
commit 3862c13a77
3 changed files with 50 additions and 13 deletions

View File

@ -58,6 +58,7 @@ export default {
return{
customerShow:false,
params:{
client:2,
type:"",
to_user_id:"",
to_message:"",

View File

@ -22,7 +22,7 @@
<div class="textCom textComNoneBack" v-if="item.send_message_type === 2">
<div v-for="(em,ind) in item.to_message_list" :key="ind">
<span v-if="em.extension === 'png' || em.extension === 'jpg' || em.extension === 'gif' || em.extension === 'jpeg'">
<el-image style="max-width: 140px;max-height: 140px;border-radius: 4px;" fit="cover" :src="em.file?em.file:em" preview-teleported :preview-src-list="[em.file?em.file:em]"></el-image>
<el-image style="max-width: 140px;max-height: 140px;border-radius: 4px;" fit="cover" lazy :src="em.file?em.file:em" preview-teleported :preview-src-list="[em.file?em.file:em]"></el-image>
</span>
<span class="fileView" v-else>
<fileType size="30px" :fileType="em.extension" />

View File

@ -15,7 +15,11 @@
</div>
<div class="viewRight">
<div class="title">{{item.from_user && item.from_user.name==""?'匿名':item.from_user && item.from_user.name}}</div>
<div class="msg">{{item.to_message}}</div>
<div class="msg" v-if="item.to_message.send_message_type === 1">{{item.to_message.to_message}}</div>
<div class="msg" v-if="item.to_message.send_message_type === 2">
未命名
<!-- {{item.to_message_list[0].client_file_name?item.to_message_list[0].client_file_name:'未命名'}}-->
</div>
</div>
</div>
</div>
@ -47,8 +51,8 @@
</div>
<div class="textCom textComNoneBack" v-if="item.send_message_type === 2">
<div :class="user_id != item.to_user_id?'fileRightItem':''" v-for="(em,ind) in item.to_message_list" :key="ind">
<span v-if="em.extension === 'png' || em.extension === 'jpg' || em.extension === 'gif' || em.extension === 'jpeg'">
<el-image style="max-width: 280px;max-height: 240px;" fit="cover" :src="em.file?em.file:em" preview-teleported :preview-src-list="[em.file?em.file:em]"></el-image>
<span v-if="['png','jpg','gif','jpeg'].indexOf(em.file_type || em.extension) !=-1">
<el-image style="max-width: 280px;max-height: 240px;" fit="cover" lazy :src="em.file?em.file:em" preview-teleported :preview-src-list="[em.file?em.file:em]"></el-image>
</span>
<span class="fileView" v-else @click="linkFile(em)">
<fileType size="26px" :fileType="em.extension || em.file_type" />
@ -135,8 +139,11 @@ export default {
msgList:[],
user_id:0,
to_user_id:0,
page:1,
pageSize:1,
params:{
client:1, // 1 2
to_user_id:"",
to_message:"",
},
@ -154,9 +161,10 @@ export default {
const userInfo = this.$TOOL.data.get("USER_INFO");
this.user_id = userInfo.id;
setTimeout(()=>{
this.getContactList();
},1000)
//
eventBus.$on('sockBack', this.getWsResult);
@ -171,12 +179,23 @@ export default {
item.to_message_list = JSON.parse(item.to_message);
}
})
this.msgList = res.data.rows;
this.msgList = res.data.rows.concat(this.msgList);
this.page = res.data.page;
this.pageSize = res.data.pageSize;
setTimeout(()=>{
if(res.data.page === res.data.pageSize){
this.scrollDown();
}
},500);
break;
case 38:
if(res.data.contact_list && res.data.contact_list.length>0){
res.data.contact_list.forEach(item=>{
if(item.send_message_type ==2){
item.to_message_list = JSON.parse(item.to_message);
}
})
}
this.contactsList = res.data.contact_list;
if(res.data.contact_list.length>0){
if(this.mesList){
@ -188,6 +207,9 @@ export default {
this.mesList = false;
}
}
break;
case 12:
break;
default:
break;
@ -201,11 +223,22 @@ export default {
this.contactsInfo = item;
this.to_user_id = item.from_user.id;
this.params.to_user_id = item.from_user.id;
this.getCustomerMsgList();
this.msgList = [];
this.getCustomerMsgList(false);
},
async getCustomerMsgList() {
let params = {
to_user_id:this.to_user_id
async getCustomerMsgList(isPage=false) {
let params = {}
if(!isPage){
params = {
to_user_id:this.to_user_id,
pageSize:30
}
}else{
params = {
to_user_id:this.to_user_id,
page:this.page,
pageSize:30
}
}
await this.$API.customer.list.post(params);
},
@ -271,8 +304,10 @@ export default {
handleScroll(event){
const { scrollTop } = event;
if(scrollTop === 0){
console.log(scrollTop)
if(scrollTop === 0 && this.msgList.length>0 && this.page >1){
this.page = this.page -1;
console.log('执行接口数据获取')
this.getCustomerMsgList(true)
}
},
scrollDown() {
@ -418,6 +453,7 @@ export default {
padding: 10px;
border-radius: 4px;
background: #f8f6f6;
margin-bottom: 5px;
}
}
.el-image{