diff --git a/resources/assets/js/components/ScrollerY.vue b/resources/assets/js/components/ScrollerY.vue index e09ad6bb0..a67742008 100644 --- a/resources/assets/js/components/ScrollerY.vue +++ b/resources/assets/js/components/ScrollerY.vue @@ -123,15 +123,11 @@ export default { }, autoToBottom() { - if (this.autoBottom && this.$refs.bottom) { - try { - this.$refs.bottom.scrollIntoView(false); - } catch (e) { - scrollIntoView(this.$refs.bottom, { - behavior: 'instant', - inline: 'end', - }) - } + if (this.autoBottom) { + $A.scrollToView(this.$refs.bottom, { + behavior: 'instant', + inline: 'end', + }) } }, diff --git a/resources/assets/js/functions/common.js b/resources/assets/js/functions/common.js index 8e756935a..02c8c524c 100755 --- a/resources/assets/js/functions/common.js +++ b/resources/assets/js/functions/common.js @@ -967,6 +967,28 @@ let domain = (weburl + "").match(urlReg); return ((domain != null && domain.length > 0) ? domain[2] : ""); }, + + /** + * 滚动到View + * @param element + * @param options + */ + scrollToView(element, options) { + if (!element) { + return; + } + if (typeof options.scrollMode !== "undefined" && typeof window.scrollIntoView === "function") { + window.scrollIntoView(element, options) + return; + } + try { + element.scrollIntoView(options); + } catch (e) { + if (typeof window.scrollIntoView === "function") { + window.scrollIntoView(element, options) + } + } + } }); /** diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue index f6c4ef704..7427125a4 100644 --- a/resources/assets/js/pages/manage/components/DialogWrapper.vue +++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue @@ -60,7 +60,7 @@
-
{{$L('有' + msgNew + '条新消息')}}
+
{{$L('有' + msgNew + '条新消息')}}
= 1) { this.msgNew = 0; this.autoBottom = true; } @@ -434,7 +434,8 @@ export default { this.$emit("on-active"); }, - autoToBottom() { + onToBottom() { + this.autoBottom = true; this.$refs.scroller && this.$refs.scroller.autoToBottom(); }, @@ -457,24 +458,17 @@ export default { this.$store.dispatch('getDialogMoreMsgs', this.dialogId).then(() => { this.$nextTick(() => { this.topId = topId; - let dom = document.getElementById("view_" + topId); - if (dom) { - try { - dom.scrollIntoView(true); - } catch (e) { - scrollIntoView(dom, { - behavior: 'instant', - inline: 'start', - }) - } - } + $A.scrollToView(document.getElementById("view_" + topId), { + behavior: 'instant', + inline: 'start', + }) }); }).catch(() => {}) }, addDialogMsg() { if (this.isAutoBottom) { - this.$nextTick(this.autoToBottom); + this.$nextTick(this.onToBottom); } else { this.$nextTick(() => { if (this.$refs.scroller && this.$refs.scroller.scrollInfo().scrollE > 10) { diff --git a/resources/assets/js/pages/manage/dashboard.vue b/resources/assets/js/pages/manage/dashboard.vue index b71a0dc69..084d55c82 100644 --- a/resources/assets/js/pages/manage/dashboard.vue +++ b/resources/assets/js/pages/manage/dashboard.vue @@ -156,17 +156,10 @@ export default { }, scrollTo(type) { - try { - this.$refs[`type_${type}`][0].scrollIntoView({ - behavior: 'instant', - inline: 'end', - }); - } catch (e) { - scrollIntoView(this.$refs[`type_${type}`][0], { - behavior: 'instant', - inline: 'end', - }) - } + $A.scrollToView(this.$refs[`type_${type}`][0], { + behavior: 'smooth', + inline: 'end', + }); }, openTask(task) { diff --git a/resources/assets/js/pages/manage/messenger.vue b/resources/assets/js/pages/manage/messenger.vue index 622442f6a..c9565331e 100644 --- a/resources/assets/js/pages/manage/messenger.vue +++ b/resources/assets/js/pages/manage/messenger.vue @@ -277,14 +277,10 @@ export default { // 再次点击滚动到未读条目 const dialog = this.dialogList.find(({unread}) => unread > 0) if (dialog) { - try { - this.$refs[`dialog_${dialog.id}`][0].scrollIntoView(); - } catch (e) { - scrollIntoView(this.$refs[`dialog_${dialog.id}`][0], { - behavior: 'instant', - inline: 'end', - }) - } + $A.scrollToView(this.$refs[`dialog_${dialog.id}`][0], { + behavior: 'instant', + inline: 'end', + }) } } this.dialogActive = type @@ -426,7 +422,7 @@ export default { if (this.$refs.list) { let active = this.$refs.list.querySelector(".active") if (active) { - scrollIntoView(active, { + $A.scrollToView(active, { behavior: smooth === true ? 'smooth' : 'instant', scrollMode: 'if-needed', }); @@ -437,7 +433,7 @@ export default { this.$nextTick(() => { let active = this.$refs.list.querySelector(".active") if (active) { - scrollIntoView(active, { + $A.scrollToView(active, { behavior: smooth === true ? 'smooth' : 'instant', scrollMode: 'if-needed', }); diff --git a/resources/assets/js/store/actions.js b/resources/assets/js/store/actions.js index a18683757..74158e829 100644 --- a/resources/assets/js/store/actions.js +++ b/resources/assets/js/store/actions.js @@ -2056,6 +2056,7 @@ export default { let dialog = state.cacheDialogs.find(({id}) => id == data.dialog_id); if (dialog && dialog.unread > 0) { dialog.unread-- + dispatch("saveDialog", dialog) } // state.wsReadWaitList.push(data.id); @@ -2170,7 +2171,10 @@ export default { dialog_id: data.dialog_id }).then(result => { dialog.unread = result.data.unread + dispatch("saveDialog", dialog) }).catch(() => {}); + } else { + dispatch("saveDialog", dialog) } } break; @@ -2188,6 +2192,7 @@ export default { // 新增未读数 state.cacheUnreads[data.id] = true; dialog.unread++; + dispatch("saveDialog", dialog) } Store.set('dialogMsgPush', data); }