From ebc5ce2b6e4cba0708d4f5efd20fd049fcd774e6 Mon Sep 17 00:00:00 2001
From: CD配唱片 <CD配唱片>
Date: 星期四, 08 五月 2025 13:22:25 +0800
Subject: [PATCH] 优化,用节流控制表格下拉加载更多分页数据避免请求过多数据
---
src/views/mainPlan/sheetMetalOrderManage/index.vue | 2
src/utils/throttle.js | 31 +++++++++++++++
src/main.js | 12 +++---
src/views/basicData/processRoute/index.vue | 32 +++++++++-------
4 files changed, 56 insertions(+), 21 deletions(-)
diff --git a/src/main.js b/src/main.js
index 5b16285..b7f19e8 100644
--- a/src/main.js
+++ b/src/main.js
@@ -2,10 +2,10 @@
import Cookies from 'js-cookie'
-import ElementPlus from 'element-plus'
+// import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import 'element-plus/theme-chalk/dark/css-vars.css'
-import locale from 'element-plus/es/locale/lang/zh-cn'
+// import locale from 'element-plus/es/locale/lang/zh-cn'
import '@/assets/styles/index.scss' // global css
@@ -82,10 +82,10 @@
directive(app)
// 浣跨敤element-plus 骞朵笖璁剧疆鍏ㄥ眬鐨勫ぇ灏�
-app.use(ElementPlus, {
- // 鏀寔 large銆乨efault銆乻mall
- size: Cookies.get('size') || 'default'
-})
+// app.use(ElementPlus, {
+// // 鏀寔 large銆乨efault銆乻mall
+// size: Cookies.get('size') || 'default'
+// })
app.use(VxeUIAll)
app.use(VxeUITable)
app.use(i18n)
diff --git a/src/utils/throttle.js b/src/utils/throttle.js
new file mode 100644
index 0000000..530320a
--- /dev/null
+++ b/src/utils/throttle.js
@@ -0,0 +1,31 @@
+export function throttle(func, delay) {
+ let lastTime = 0;
+
+ return function(...args) {
+ const now = Date.now();
+
+ if (now - lastTime >= delay) {
+ func.apply(this, args);
+ lastTime = now;
+ }
+ }
+ }
+
+export function debounceThrottle(func, wait, immediate) {
+ let timeout,
+ previous = 0;
+ return function (...args) {
+ const now = Date.now();
+ const later = () => {
+ timeout = null;
+ if (!immediate) func.apply(this, args);
+ };
+ const callNow = immediate && !timeout;
+ clearTimeout(timeout);
+ if (now - previous > wait) {
+ previous = now;
+ if (callNow) func.apply(this, args);
+ }
+ timeout = setTimeout(later, wait);
+ };
+}
diff --git a/src/views/basicData/processRoute/index.vue b/src/views/basicData/processRoute/index.vue
index 684cec3..ecc1327 100644
--- a/src/views/basicData/processRoute/index.vue
+++ b/src/views/basicData/processRoute/index.vue
@@ -203,6 +203,7 @@
processRouteTempList,
confirmProcessRoute,
} from "@/api/basicData/processRoute";
+import { throttle } from "@/utils/throttle";
import HxlhTable from "@/components/HxlhTable";
import { getToken } from "@/utils/auth";
import { ref } from "vue";
@@ -427,18 +428,17 @@
daterangeIntegrationDay.value[1];
}
- const response = await listProcessRoute(queryParams.value)
- // processRouteList.value = response.rows;
- if(processRouteList.value.length < queryParams.value.pageSize){
- hasMore.value = false;
- processRouteList.value = response.rows
- }else{
- processRouteList.value = [...processRouteList.value,...response.rows];
- }
-
- // total.value = response.total;
- loading.value = false;
-
+ const response = await listProcessRoute(queryParams.value);
+ // processRouteList.value = response.rows;
+ if (processRouteList.value.length < queryParams.value.pageSize) {
+ hasMore.value = false;
+ processRouteList.value = response.rows;
+ } else {
+ processRouteList.value = [...processRouteList.value, ...response.rows];
+ }
+
+ // total.value = response.total;
+ loading.value = false;
}
// async function loadData() {
// try {
@@ -453,9 +453,13 @@
// console.error('Error fetching data:', error);
// }
// }
-function handleAutoLoadMore(){
- getList();
+const throttledScroll = throttle(() => {
queryParams.value.pageNum++;
+ getList();
+ console.log("1111")
+}, 200);
+function handleAutoLoadMore() {
+ throttledScroll()
}
// 鍙栨秷鎸夐挳
function cancel() {
diff --git a/src/views/mainPlan/sheetMetalOrderManage/index.vue b/src/views/mainPlan/sheetMetalOrderManage/index.vue
index e2efa66..9279751 100644
--- a/src/views/mainPlan/sheetMetalOrderManage/index.vue
+++ b/src/views/mainPlan/sheetMetalOrderManage/index.vue
@@ -224,7 +224,7 @@
const shopList = ref([]);
const allShopList = ref([]);
const processList = ref([]);
-const height = ref(document.documentElement.clientHeight - 220 + "px;");
+const height = ref(document.documentElement.clientHeight - 270 + "px;");
// 琛ㄦ牸閰嶇疆-鍒楄〃
const columns = ref([]);
// 鍒嗛〉灞炴��
--
Gitblit v1.9.3