Преглед на файлове

feat: 分页功能逻辑调整

Signed-off-by: tangshizhe <48740614+tangshizhe@users.noreply.github.com>
tangshizhe преди 1 година
родител
ревизия
b619d9077f
променени са 3 файла, в които са добавени 46 реда и са изтрити 1 реда
  1. 5 0
      jydocs-pc/src/assets/style/reset-ele.scss
  2. 39 0
      jydocs-pc/src/utils/globalFunctions.js
  3. 2 1
      jydocs-pc/src/views/Search.vue

+ 5 - 0
jydocs-pc/src/assets/style/reset-ele.scss

@@ -13,6 +13,11 @@
 //     background-color: $color-text--highlight;
 //   }
 // }
+.el-pagination {
+  .el-input__suffix {
+    display: unset!important;
+  }
+}
 .el-pagination.is-background .el-pager {
   li:not(.disabled).active,
   li:not(.disabled):hover {

+ 39 - 0
jydocs-pc/src/utils/globalFunctions.js

@@ -308,6 +308,45 @@ export function moneyUnit(m, type = 'string', lv = 0) {
   }
 }
 
+/**
+ * 应用场景:1.翻页后页面滚动到列表第一条的位置
+ * @param targetEvent 页面要滚动到的目标元素
+ */
+export function scrollTargetView (targetEvent) {
+  if (!targetEvent) return
+  let scrollWrapper
+  let targetTop
+  const inWorkSpace = location.href.indexOf('work-bench') > -1
+  if (inWorkSpace) {
+    // 工作桌面内(qiankun、iframe)
+    const offsetHeight = document.querySelector('.el-header')?.offsetHeight
+    const inApp = window.__POWERED_BY_QIANKUN__
+    if (inApp) {
+      // qiankun
+      const appNode = document.querySelector('#app-container > div').shadowRoot
+      targetTop = appNode?.querySelector(targetEvent)?.offsetTop
+      scrollWrapper = document.querySelector('.el-main')
+      scrollWrapper.scrollTop = targetTop - offsetHeight
+    } else {
+      // iframe
+      const iframeNode = document.querySelector('#work-bench-container iframe')?.contentDocument
+      targetTop = iframeNode.querySelector(targetEvent)?.offsetTop
+      scrollWrapper = iframeNode.body
+    }
+    // console.log(`工作桌面内${inApp ? 'qiankun' : 'iframe'}---滚动元素:${scrollWrapper.className}, 滚动距离:${targetTop}`)
+    scrollWrapper.scrollTop = targetTop - offsetHeight
+  } else {
+    // 非工作桌面
+    targetTop = document.querySelector(targetEvent)?.offsetTop
+    // 因浏览器及模式差异,页面滚动元素存在不同(标准模式:document.documentElement;兼容模式:body)
+    // scrollingElement可获取页面滚动元素
+    console.log(targetTop, 'targetTop');
+    scrollWrapper = document.scrollingElement
+    scrollWrapper.scrollTop = targetTop
+    // console.log(`非工作桌面---滚动元素:${scrollWrapper.className ? scrollWrapper.className : scrollWrapper.tagName}, 滚动距离:${targetTop}`)
+  }
+}
+
 
 // 时间戳转换 多少秒、多少分、多少小时前、多少天前  超出10天显示年月日
 // 传入一个时间戳

+ 2 - 1
jydocs-pc/src/views/Search.vue

@@ -74,7 +74,7 @@ import SearchInput from '@/components/Search'
 import DocCard from '@/components/doc-item-card/Card'
 import NoData from '@/components/NoData'
 import { getSearch } from '../api/modules/search'
-import { formatSize, dateFormatter } from '@/utils/'
+import { formatSize, dateFormatter, scrollTargetView } from '@/utils/'
 import { mixinBackground } from '@/utils/mixins'
 
 export default {
@@ -273,6 +273,7 @@ export default {
     onPageChange (p) {
       this.listState.pageNum = p
       this.getList()
+      scrollTargetView('.search-result-list')
     },
     onSizeChange (size) {
       this.listState.pageSize = size