fix:修改不能跳到最底下问题

feat-im-0607-ch
ch 3 years ago
parent a6881b775a
commit ad989779a2

@ -2,7 +2,7 @@
* @Author: xwk * @Author: xwk
* @Date: 2022-05-24 17:00:26 * @Date: 2022-05-24 17:00:26
* @LastEditors: ch * @LastEditors: ch
* @LastEditTime: 2022-06-11 18:41:23 * @LastEditTime: 2022-06-13 14:26:53
* @Description: file content * @Description: file content
*/ */
import request from '@/utils/request.js'; import request from '@/utils/request.js';

@ -2,7 +2,7 @@
* @Author: ch * @Author: ch
* @Date: 2022-06-07 15:41:05 * @Date: 2022-06-07 15:41:05
* @LastEditors: ch * @LastEditors: ch
* @LastEditTime: 2022-06-13 14:03:18 * @LastEditTime: 2022-06-13 14:32:42
* @Description: file content * @Description: file content
*/ */
import * as api from '@/api/chat'; import * as api from '@/api/chat';
@ -107,7 +107,7 @@ const getters = {
}; };
const mutations = { const mutations = {
SET_CUR_SERVICE(state, data) { SET_CUR_SERVICE(state, data) {
state.curCustomerService = data; state.curCustomerService = data || {};
}, },
SET_SESSION_DATA(state, data) { SET_SESSION_DATA(state, data) {
state.sessionData = data; state.sessionData = data;

@ -2,7 +2,7 @@
* @Author: ch * @Author: ch
* @Date: 2022-06-07 15:52:37 * @Date: 2022-06-07 15:52:37
* @LastEditors: ch * @LastEditors: ch
* @LastEditTime: 2022-06-13 14:14:26 * @LastEditTime: 2022-06-13 15:46:19
* @Description: file content * @Description: file content
*/ */
import * as api from '@/api/chat'; import * as api from '@/api/chat';
@ -15,7 +15,6 @@ const Im = new MsbIm({
}); });
const ImInit = (waiterId) => { const ImInit = (waiterId) => {
return new Promise((reslove, reject) => { return new Promise((reslove, reject) => {
console.log(waiterId, 'waiterId');
api.getCustomeServiceTicket().then(async (res) => { api.getCustomeServiceTicket().then(async (res) => {
console.log(res); console.log(res);
const par = FormatJsonSearch({ const par = FormatJsonSearch({

@ -2,7 +2,7 @@
* @Author: ch * @Author: ch
* @Date: 2022-05-18 14:54:47 * @Date: 2022-05-18 14:54:47
* @LastEditors: ch * @LastEditors: ch
* @LastEditTime: 2022-06-10 19:15:46 * @LastEditTime: 2022-06-13 15:16:50
* @Description: file content * @Description: file content
*/ */
import '@/utils/poto-req'; import '@/utils/poto-req';
@ -369,6 +369,8 @@ class MsbIm {
} }
// 点发送,立即把消息加入消息列表,标记为发送中状态 // 点发送,立即把消息加入消息列表,标记为发送中状态
curSession.messageList.push(msgCtx); curSession.messageList.push(msgCtx);
this.setSessionData(this.sessionData);
// 超过时间未返回视为发送失败 // 超过时间未返回视为发送失败
this.timerStatus(msgCtx); this.timerStatus(msgCtx);

@ -68,16 +68,11 @@
</div> </div>
</div> </div>
<el-scrollbar ref="refsMessageList" class="message-list"> <el-scrollbar ref="refsMessageList" class="message-list">
<el-button <el-button v-if="sessionMessageList.length" class="load" type="text" @click="handleLoadMore">
v-if="currentSession.messageList?.length"
class="load"
type="text"
@click="handleLoadMore"
>
加载更多 加载更多
</el-button> </el-button>
<message-item <message-item
v-for="(item, index) in currentSession.messageList" v-for="(item, index) in sessionMessageList"
:key="index" :key="index"
:message="item" :message="item"
:session="currentSession" :session="currentSession"
@ -151,15 +146,13 @@
const store = useStore(); const store = useStore();
store.dispatch('im/queryCurCustomerService'); store.dispatch('im/queryCurCustomerService');
const socketInit = () => { const socketInit = () => {
console.log('----', store.state.im.curCustomerService); if (!store.state.im.curCustomerService.waiterId) {
if (typeof store.state.im.curCustomerService !== 'string') {
setTimeout(() => { setTimeout(() => {
socketInit(); socketInit();
}, 1000); }, 1000);
return false; return false;
} }
console.log('++++', typeof store.state.im.curCustomerService); ImInit(store.state.im.curCustomerService.waiterId).then(() => {
ImInit(store.state.im.curCustomerService).then(() => {
Im.getSessionList(); Im.getSessionList();
}); });
}; };
@ -190,20 +183,24 @@
currentSessionId.value = id; currentSessionId.value = id;
// ID // ID
Im.setCurSessionId(id); Im.setCurSessionId(id);
// //
Im.setRead({ Im.setRead({
content: { content: {
sessionId: id, sessionId: id,
}, },
}); });
if (!sessionMessageList.length) { setTimeout(() => {
Im.getHistoryMsg(); if (!sessionMessageList.value.length) {
} Im.getHistoryMsg();
}
}, 100);
}; };
// //
const sessionMessageList = computed(() => { const sessionMessageList = ref([]);
return currentSession.messageList || []; watch(currentSession, () => {
sessionMessageList.value = currentSession.value.messageList || [];
}); });
const refsMessageList = ref(null); const refsMessageList = ref(null);
watch(sessionMessageList, (value, old) => { watch(sessionMessageList, (value, old) => {
@ -211,11 +208,11 @@
? refsMessageList.value.resize$.scrollHeight - refsMessageList.value.resize$.scrollTop ? refsMessageList.value.resize$.scrollHeight - refsMessageList.value.resize$.scrollTop
: 0; : 0;
nextTick(() => { nextTick(() => {
if (!old?.length || value.indexOf(old[0]) === 0) { // if (!old?.length || value.indexOf(old[0]) === 0) {
refsMessageList.value.setScrollTop(refsMessageList.value.resize$.scrollHeight); refsMessageList.value.setScrollTop(refsMessageList.value.resize$.scrollHeight);
} else { // } else {
refsMessageList.value.setScrollTop(refsMessageList.value.resize$.scrollHeight - offset); // refsMessageList.value.setScrollTop(refsMessageList.value.resize$.scrollHeight - offset);
} // }
}); });
}); });
const handleLoadMore = () => { const handleLoadMore = () => {
@ -230,6 +227,7 @@
Im.sendMsg({ Im.sendMsg({
fromId: curService.waiterId, fromId: curService.waiterId,
fromAvatar: curService.waiterAvatar, fromAvatar: curService.waiterAvatar,
fromNickname: curService.waiterNickname,
content: { content: {
toSessionId: currentSessionId.value, toSessionId: currentSessionId.value,
payload: { text: state.message }, payload: { text: state.message },
@ -324,10 +322,11 @@
const file = e.target.files[0]; const file = e.target.files[0];
e.target.value = null; e.target.value = null;
let url = await upload('mall-product', 'im/', file); let url = await upload('mall-product', 'im/', file);
// store.dispatch('chat/submitImage', { url }); const curService = store.state.im.curCustomerService;
Im.sendMsg({ Im.sendMsg({
fromId: 2, //userInfo.value.id, fromId: curService.waiterId,
fromAvatar: curService.waiterAvatar,
fromNickname: curService.waiterNickname,
content: { content: {
toSessionId: currentSessionId.value, toSessionId: currentSessionId.value,
payload: { url }, payload: { url },
@ -347,8 +346,11 @@
let url = await upload('mall-product', 'im/', file); let url = await upload('mall-product', 'im/', file);
// store.dispatch('chat/submitVideo', { url }); // store.dispatch('chat/submitVideo', { url });
const curService = store.state.im.curCustomerService;
Im.sendMsg({ Im.sendMsg({
fromId: 2, //userInfo.value.id, fromId: curService.waiterId,
fromAvatar: curService.waiterAvatar,
fromNickname: curService.waiterNickname,
content: { content: {
toSessionId: currentSessionId.value, toSessionId: currentSessionId.value,
payload: { url }, payload: { url },
@ -378,7 +380,6 @@
display: flex; display: flex;
border: 1px solid #ebeef5; border: 1px solid #ebeef5;
.aside { .aside {
width: 240px;
border-right: 1px solid #ebeef5; border-right: 1px solid #ebeef5;
.aside-header { .aside-header {
height: 60px; height: 60px;

Loading…
Cancel
Save