perf: 优化消息列表

This commit is contained in:
kuaifan 2022-07-17 11:33:35 +08:00
parent b4085fd1d3
commit bfd2917043
2 changed files with 51 additions and 61 deletions

View File

@ -498,7 +498,7 @@ export default {
todoViewLoad: false, todoViewLoad: false,
todoViewShow: false, todoViewShow: false,
todoViewTmp: {}, todoViewData: {},
todoViewMid: 0, todoViewMid: 0,
todoViewId: 0, todoViewId: 0,
@ -720,17 +720,17 @@ export default {
}, },
replyItem() { replyItem() {
return this.replyId ? this.dialogMsgs.find(({id}) => id === this.replyId) : null return this.replyId ? this.allMsgs.find(({id}) => id === this.replyId) : null
}, },
todoViewMsg() { todoViewMsg() {
if (this.todoViewMid) { if (this.todoViewMid) {
const msg = this.dialogMsgs.find(item => item.id == this.todoViewMid) const msg = this.allMsgs.find(item => item.id == this.todoViewMid)
if (msg) { if (msg) {
return msg return msg
} }
if (this.todoViewTmp.id === this.todoViewMid) { if (this.todoViewData.id === this.todoViewMid) {
return this.todoViewTmp return this.todoViewData
} }
} }
return null return null
@ -741,7 +741,6 @@ export default {
dialogId: { dialogId: {
handler(dialog_id) { handler(dialog_id) {
if (dialog_id) { if (dialog_id) {
this.tempMsgs = []
this.msgNew = 0 this.msgNew = 0
// //
if (this.allMsgList.length > 0) { if (this.allMsgList.length > 0) {
@ -751,7 +750,8 @@ export default {
this.msgType = ''; this.msgType = '';
this.$store.dispatch("getDialogMsgs", { this.$store.dispatch("getDialogMsgs", {
dialog_id, dialog_id,
msg_id: this.msgId msg_id: this.msgId,
msg_type: this.msgType,
}).then(_ => { }).then(_ => {
this.openId = dialog_id; this.openId = dialog_id;
setTimeout(this.onSearchMsgId, 100) setTimeout(this.onSearchMsgId, 100)
@ -770,28 +770,13 @@ export default {
immediate: true immediate: true
}, },
msgType(msg_type) { msgType() {
if (msg_type) { this.$store.dispatch("getDialogMsgs", {
this.$store.dispatch("getDialogMsgs", { dialog_id: this.dialogId,
dialog_id: this.dialogId, msg_id: this.msgId,
msg_id: this.msgId, msg_type: this.msgType,
msg_type, clear_before: true
save_cancel: true, }).catch(_ => {})
}).then(({data}) => {
if (data.list.length > 0) {
const ids = this.tempMsgs.map(item => item.id)
const list = data.list.filter(item => !ids.includes(item.id))
if (list.length > 0) {
this.tempMsgs.push(...list.map(item => Object.assign(item, {
isMsgType: true
})))
}
}
}).catch(_ => {});
} else {
this.tempMsgs = this.tempMsgs.filter(({isMsgType}) => isMsgType !== true)
}
requestAnimationFrame(this.onToBottom)
}, },
dialogSearchMsgId() { dialogSearchMsgId() {
@ -817,12 +802,13 @@ export default {
}, },
wsOpenNum(num) { wsOpenNum(num) {
if (num <= 1 || this.msgType) { if (num <= 1) {
return return
} }
this.$store.dispatch("getDialogMsgs", { this.$store.dispatch("getDialogMsgs", {
dialog_id: this.dialogId, dialog_id: this.dialogId,
msg_id: this.msgId, msg_id: this.msgId,
msg_type: this.msgType,
}).catch(_ => {}); }).catch(_ => {});
}, },
@ -1080,6 +1066,7 @@ export default {
this.$store.dispatch("getDialogMsgs", { this.$store.dispatch("getDialogMsgs", {
dialog_id: this.dialogId, dialog_id: this.dialogId,
msg_id: this.msgId, msg_id: this.msgId,
msg_type: this.msgType,
position_id position_id
}).finally(_ => { }).finally(_ => {
const index = this.allMsgs.findIndex(item => item.id === position_id) const index = this.allMsgs.findIndex(item => item.id === position_id)
@ -1112,7 +1099,7 @@ export default {
msg_id: this.todoViewMid msg_id: this.todoViewMid
}, },
}).then(({data}) => { }).then(({data}) => {
this.todoViewTmp = data this.todoViewData = data
}) })
} }
}, },
@ -1120,7 +1107,7 @@ export default {
onCloseTodo() { onCloseTodo() {
this.todoViewLoad = false this.todoViewLoad = false
this.todoViewShow = false this.todoViewShow = false
this.todoViewTmp = {} this.todoViewData = {}
this.todoViewMid = 0 this.todoViewMid = 0
this.todoViewId = 0 this.todoViewId = 0
}, },
@ -1308,7 +1295,7 @@ export default {
data: { data: {
dialog_id: this.dialogId, dialog_id: this.dialogId,
}, },
spinner: 300, spinner: 600,
}).then(({data}) => { }).then(({data}) => {
if (data.tel) { if (data.tel) {
$A.eeuiAppSendMessage({ $A.eeuiAppSendMessage({
@ -1564,7 +1551,11 @@ export default {
break; break;
default: default:
this.msgType = type if (this.loadMsg) {
$A.messageWarning("正在加载,请稍后再试...")
} else {
this.msgType = type
}
break; break;
} }
}, },
@ -1781,17 +1772,13 @@ export default {
}, },
onViewPicture(currentUrl) { onViewPicture(currentUrl) {
const data = $A.cloneJSON(this.dialogMsgs.filter(item => { const data = this.allMsgs.filter(item => {
if (item.dialog_id === this.dialogId) { if (item.type === 'file') {
if (item.type === 'file') { return ['jpg', 'jpeg', 'gif', 'png'].includes(item.msg.ext);
return ['jpg', 'jpeg', 'gif', 'png'].includes(item.msg.ext); } else if (item.type === 'text') {
} else if (item.type === 'text') { return item.msg.text.match(/<img\s+class="browse"[^>]*?>/);
return item.msg.text.match(/<img\s+class="browse"[^>]*?>/);
}
} }
return false; return false;
})).sort((a, b) => {
return a.id - b.id;
}); });
// //
const list = []; const list = [];
@ -1860,8 +1847,8 @@ export default {
const index = this.dialogMsgs.findIndex(item => item.id == data.id) const index = this.dialogMsgs.findIndex(item => item.id == data.id)
if (index > -1) { if (index > -1) {
this.$store.dispatch("saveDialogMsg", data); this.$store.dispatch("saveDialogMsg", data);
} else if (this.todoViewTmp.id === data.id) { } else if (this.todoViewData.id === data.id) {
this.todoViewTmp = Object.assign({}, this.todoViewTmp, data) this.todoViewData = Object.assign(this.todoViewData, data)
} }
}).catch(({msg}) => { }).catch(({msg}) => {
$A.messageError(msg); $A.messageError(msg);

View File

@ -2270,15 +2270,15 @@ export default {
* @param state * @param state
* @param dispatch * @param dispatch
* @param getters * @param getters
* @param data {dialog_id, msg_id, ?msg_type, ?position_id, ?prev_id, ?next_id, ?save_before, ?save_cancel} * @param data {dialog_id, msg_id, ?msg_type, ?position_id, ?prev_id, ?next_id, ?save_before, ?clear_before}
* @returns {Promise<unknown>} * @returns {Promise<unknown>}
*/ */
getDialogMsgs({state, dispatch, getters}, data) { getDialogMsgs({state, dispatch, getters}, data) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const saveBefore = typeof data.save_before === "function" ? data.save_before : _ => {} const saveBefore = typeof data.save_before === "function" ? data.save_before : _ => {}
const saveCancel = typeof data.save_cancel === "boolean" ? data.save_cancel : false const clearBefore = typeof data.clear_before === "boolean" ? data.clear_before : false
if (typeof data.save_before !== "undefined") delete data.save_before if (typeof data.save_before !== "undefined") delete data.save_before
if (typeof data.save_cancel !== "undefined") delete data.save_cancel if (typeof data.clear_before !== "undefined") delete data.clear_before
// //
const loadKey = `msg::${data.dialog_id}-${data.msg_id}-${data.msg_type || ''}` const loadKey = `msg::${data.dialog_id}-${data.msg_id}-${data.msg_type || ''}`
if (getters.isLoad(loadKey)) { if (getters.isLoad(loadKey)) {
@ -2287,27 +2287,30 @@ export default {
} }
dispatch("setLoad", loadKey) dispatch("setLoad", loadKey)
// //
if (clearBefore) {
state.dialogMsgs = state.dialogMsgs.filter(({dialog_id}) => dialog_id !== data.dialog_id)
}
//
dispatch("call", { dispatch("call", {
url: 'dialog/msg/list', url: 'dialog/msg/list',
data, data,
spinner: 3000,
complete: _ => dispatch("cancelLoad", loadKey) complete: _ => dispatch("cancelLoad", loadKey)
}).then(result => { }).then(result => {
saveBefore() saveBefore()
if (!saveCancel) { const resData = result.data;
const resData = result.data; if ($A.isJson(resData.dialog)) {
if ($A.isJson(resData.dialog)) { dispatch("saveDialog", resData.dialog);
dispatch("saveDialog", resData.dialog);
//
const ids = resData.list.map(({id}) => id)
state.dialogMsgs = state.dialogMsgs.filter(item => item.dialog_id != data.dialog_id || ids.includes(item.id));
}
if ($A.isArray(resData.todo)) {
state.dialogTodos = state.dialogTodos.filter(item => item.dialog_id != data.dialog_id)
dispatch("saveDialogTodo", resData.todo)
}
// //
dispatch("saveDialogMsg", resData.list) const ids = resData.list.map(({id}) => id)
state.dialogMsgs = state.dialogMsgs.filter(item => item.dialog_id != data.dialog_id || ids.includes(item.id));
} }
if ($A.isArray(resData.todo)) {
state.dialogTodos = state.dialogTodos.filter(item => item.dialog_id != data.dialog_id)
dispatch("saveDialogTodo", resData.todo)
}
//
dispatch("saveDialogMsg", resData.list)
resolve(result) resolve(result)
}).catch(e => { }).catch(e => {
console.warn(e); console.warn(e);