github/dootask
1
0
Fork 0
mirror of https://github.com/kuaifan/dootask.git synced 2025-12-15 05:12:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

perf: 优化聊天窗口滚动

Browse Source
This commit is contained in:
kuaifan 2022-03-31 21:48:23 +08:00
parent 3796a3dbde
commit 3c8642f30f
2 changed files with 50 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
resources/assets/js/pages/manage/components/DialogWrapper.vue
View File

@ -28,6 +28,7 @@
<ScrollerY
ref="scroller"
class="dialog-scroller overlay-y"
:style="{opacity: visible ? 1 : 0}"
:auto-bottom="isAutoBottom"
@on-scroll="chatScroll"
static>
@ -129,6 +130,7 @@ export default {
data() {
return {
visible: true,
autoBottom: true,
autoInterval: null,
@ -243,10 +245,13 @@ export default {
dialogId: {
handler(id) {
if (id) {
this.autoBottom = true;
this.msgNew = 0;
this.topId = -1;
this.$store.dispatch("getDialogMsgs", id);
this.visible = false;
this.$store.dispatch("getDialogMsgs", id).then(_ => {
this.onToBottom();
this.visible = true;
});
}
},
immediate: true

79
resources/assets/js/store/actions.js vendored
View File

@ -2025,45 +2025,52 @@ export default {
* @param state
* @param dispatch
* @param dialog_id
* @returns {Promise<unknown>}
*/
getDialogMsgs({state, dispatch}, dialog_id) {
if (!dialog_id) {
return;
}
let dialog = state.cacheDialogs.find(({id}) => id == dialog_id);
if (!dialog) {
dialog = {
id: dialog_id,
};
state.cacheDialogs.push(dialog);
}
if (dialog.loading) {
return;
}
dialog.loading = true;
dialog.currentPage = 1;
dialog.hasMorePages = false;
//
dispatch("call", {
url: 'dialog/msg/lists',
data: {
dialog_id: dialog_id,
page: dialog.currentPage
},
}).then(result => {
dialog.loading = false;
dialog.currentPage = result.data.current_page;
dialog.hasMorePages = !!result.data.next_page_url;
dispatch("saveDialog", dialog);
return new Promise(resolve => {
if (!dialog_id) {
resolve()
return;
}
let dialog = state.cacheDialogs.find(({id}) => id == dialog_id);
if (!dialog) {
dialog = {
id: dialog_id,
};
state.cacheDialogs.push(dialog);
}
if (dialog.loading) {
resolve()
return;
}
dialog.loading = true;
dialog.currentPage = 1;
dialog.hasMorePages = false;
//
const ids = result.data.data.map(({id}) => id)
state.dialogMsgs = state.dialogMsgs.filter((item) => item.dialog_id != dialog_id || ids.includes(item.id));
//
dispatch("saveDialog", result.data.dialog);
dispatch("saveDialogMsg", result.data.data);
}).catch(e => {
console.warn(e);
dialog.loading = false;
dispatch("call", {
url: 'dialog/msg/lists',
data: {
dialog_id: dialog_id,
page: dialog.currentPage
},
}).then(result => {
dialog.loading = false;
dialog.currentPage = result.data.current_page;
dialog.hasMorePages = !!result.data.next_page_url;
dispatch("saveDialog", dialog);
//
const ids = result.data.data.map(({id}) => id)
state.dialogMsgs = state.dialogMsgs.filter((item) => item.dialog_id != dialog_id || ids.includes(item.id));
//
dispatch("saveDialog", result.data.dialog);
dispatch("saveDialogMsg", result.data.data);
resolve()
}).catch(e => {
console.warn(e);
dialog.loading = false;
resolve()
});
});
},