diff --git a/resources/assets/js/App.vue b/resources/assets/js/App.vue index 3777f318a..4846bcd52 100755 --- a/resources/assets/js/App.vue +++ b/resources/assets/js/App.vue @@ -48,10 +48,12 @@ export default { setInterval(this.searchEnter, 1000); // window.addEventListener('resize', this.windowSizeListener); + window.addEventListener('scroll', this.windowScrollListener); }, beforeDestroy() { window.removeEventListener('resize', this.windowSizeListener); + window.removeEventListener('scroll', this.windowScrollListener); }, computed: { @@ -225,6 +227,10 @@ export default { this.$store.state.windowMax768 = window.innerWidth <= 768 }, + windowScrollListener() { + this.$store.state.windowScrollY = window.scrollY + }, + electronEvents() { if (!this.$Electron) { return; diff --git a/resources/assets/js/pages/manage/components/ChatInput/index.vue b/resources/assets/js/pages/manage/components/ChatInput/index.vue index d6c2f5f84..5371147ac 100755 --- a/resources/assets/js/pages/manage/components/ChatInput/index.vue +++ b/resources/assets/js/pages/manage/components/ChatInput/index.vue @@ -94,6 +94,7 @@ :data-transfer="true" class="chat-input-record-transfer" :class="{cancel: touchLimitY}" + :style="recordTransferStyle" @click="stopRecord">
{{recordFormatDuration}}
@@ -238,7 +239,7 @@ export default { } }, computed: { - ...mapState(['dialogInputCache', 'cacheProjects', 'cacheTasks', 'cacheUserBasic', 'userId']), + ...mapState(['dialogInputCache', 'cacheProjects', 'cacheTasks', 'cacheUserBasic', 'userId', 'windowScrollY']), editorStyle() { const {wrapperWidth, editorHeight} = this; @@ -253,6 +254,13 @@ export default { } }, + recordTransferStyle() { + const {windowScrollY} = this; + return windowScrollY > 0 ? { + marginTop: (windowScrollY / 2) + 'px' + } : null + }, + boxClass() { const array = []; if (this.recordState === 'ing') { diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue index fc7d1548d..a0a378ad7 100644 --- a/resources/assets/js/pages/manage/components/DialogWrapper.vue +++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue @@ -226,15 +226,11 @@ export default { }, mounted() { - if ($A.isIos()) { - window.addEventListener('scroll', this.onWindowScroll); - } + }, beforeDestroy() { - if ($A.isIos()) { - window.removeEventListener('scroll', this.onWindowScroll); - } + }, computed: { @@ -243,6 +239,7 @@ export default { 'cacheDialogs', 'dialogMsgs', 'wsOpenNum', + 'windowScrollY' ]), isReady() { @@ -387,6 +384,20 @@ export default { } }) }, + + windowScrollY(val) { + if ($A.isIos()) { + const {scrollE} = this.scrollInfo(); + this.wrapperStyle = { + top: val + 'px' + } + if (scrollE <= 10) { + this.$nextTick(_ => { + this.onToBottom(); + }) + } + } + } }, methods: { @@ -686,18 +697,6 @@ export default { this.msgNew = 0; } }, 100) - }, - - onWindowScroll() { - const {scrollE} = this.scrollInfo(); - this.wrapperStyle = { - top: window.scrollY + 'px' - } - if (scrollE <= 10) { - this.$nextTick(_ => { - this.onToBottom(); - }) - } } } } diff --git a/resources/assets/js/store/state.js b/resources/assets/js/store/state.js index 77ab604f6..aa920da55 100644 --- a/resources/assets/js/store/state.js +++ b/resources/assets/js/store/state.js @@ -1,7 +1,8 @@ const stateData = { - // 浏览器宽高 + // 浏览器尺寸信息 windowWidth: window.innerWidth, windowHeight: window.innerHeight, + windowScrollY: 0, // 浏览器宽度≤768返回true windowMax768: window.innerWidth <= 768, diff --git a/resources/assets/sass/pages/components/chat-input.scss b/resources/assets/sass/pages/components/chat-input.scss index c283c67d8..ff9e2665f 100755 --- a/resources/assets/sass/pages/components/chat-input.scss +++ b/resources/assets/sass/pages/components/chat-input.scss @@ -335,7 +335,7 @@ color: $primary-title-color; background-color: #ffffff; border-radius: 8px; - box-shadow: 0 0 12px 0 #c8c8c8; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); display: flex; flex-direction: column; align-items: center;