Przeglądaj źródła

工时、工分增加防抖动

ouyj 4 miesięcy temu
rodzic
commit
ed723ee95d
2 zmienionych plików z 214 dodań i 21 usunięć
  1. 96 10
      pages/score/index.uvue
  2. 118 11
      pages/worktime/index.uvue

+ 96 - 10
pages/score/index.uvue

@@ -137,7 +137,7 @@
                 <text v-if="getPropertyValue(item, 'score') !== ''" class="score-text">{{ formatNumber(parseFloat(getPropertyValue(item, 'score'))) }}</text>
                 <!-- <text class="status-text">{{ getOrderStatusText(getPropertyValue(item, 'scoreStatus')) }}</text> -->
               </view>
-            </view>
+			</view>
 			<view class="info-row">
 			  <view class="info-label">
 			    <text class="text-gray">工作结束时间: {{ formatDate(getPropertyValue(item, 'realEndTime')) }}</text>
@@ -188,7 +188,7 @@
 </template>
 
 <script setup lang="uts">
-    import { ref, computed, onMounted } from 'vue'
+    import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
     import { listOrderScores, getOrderScoreStatistics, listMobileOrderScores } from '@/api/score/index'
     import { getDictDataByType } from '@/api/dict/index'
     import type { SysDictData } from '@/types/dict'
@@ -209,6 +209,12 @@
     const totalRankingUsers = ref<number | null>(null)
     const customDate = ref<string>('')
 
+    // 防止重复请求的标志位
+    const isSearching = ref<boolean>(false)
+    
+    // 添加防抖定时器
+    let searchTimer: number | null = null
+
     // 弹窗显示状态
     const showDatePickerPopup = ref<boolean>(false)
     const showDatePicker = ref<boolean>(false)
@@ -509,6 +515,11 @@
 
     // 方法
     function loadData(isRefresh: boolean) {
+      // 防止重复请求
+      if (loading.value && !isRefresh) {
+        return
+      }
+
       const shouldRefresh = isRefresh
 
       if (loading.value && !shouldRefresh) {
@@ -576,25 +587,91 @@
     }
 
     function handleSearch() {
-      loadData(true)
+      // 添加防抖和防止重复请求
+      if (isSearching.value) {
+        return
+      }
+      
+      const timer = searchTimer
+      if (timer != null) {
+        clearTimeout(timer)
+        searchTimer = null
+      }
+      
+      searchTimer = setTimeout(() => {
+        isSearching.value = true
+        loadData(true)
+        // 延迟重置标志位,确保请求发送后才允许下一次搜索
+        setTimeout(() => {
+          isSearching.value = false
+        }, 100)
+      }, 300)
     }
 
     function clearSearch() {
+      // 添加防抖和防止重复请求
+      if (isSearching.value) {
+        return
+      }
+      
+      const timer = searchTimer
+      if (timer != null) {
+        clearTimeout(timer)
+        searchTimer = null
+      }
+      
       searchKeyword.value = ""
-      loadData(true)
+      searchTimer = setTimeout(() => {
+        isSearching.value = true
+        loadData(true)
+        // 延迟重置标志位,确保请求发送后才允许下一次搜索
+        setTimeout(() => {
+          isSearching.value = false
+        }, 100)
+      }, 300)
     }
 
     function filterByStatus(status: string) {
+      // 添加防止重复请求
+      if (isSearching.value) {
+        return
+      }
+      
+      const timer = searchTimer
+      if (timer != null) {
+        clearTimeout(timer)
+        searchTimer = null
+      }
+      
       statusFilter.value = status
-      loadData(true)
-      getStatistics()
+      searchTimer = setTimeout(() => {
+        isSearching.value = true
+        loadData(true)
+        getStatistics()
+        // 延迟重置标志位,确保请求发送后才允许下一次搜索
+        setTimeout(() => {
+          isSearching.value = false
+        }, 100)
+      }, 300)
     }
 
-    function changeMonth(month: string) {
+	function changeMonth(month: string) {
+	  // 添加防止重复请求
+	  if (isSearching.value) {
+	    return
+	  }
+	  
+      const timer = searchTimer
+      if (timer != null) {
+        clearTimeout(timer)
+        searchTimer = null
+      }
+      
       selectedMonth.value = month
-      //loadData(true)
-      getStatistics()
-    }
+      searchTimer = setTimeout(() => {
+        getStatistics()
+      }, 300)
+	}
 
     function loadMore() {
       if (!hasMore.value || loading.value) return
@@ -656,6 +733,15 @@
       getStatistics()
       dictLoaded.value = true
     })
+    
+    // 组件销毁时清除定时器
+    onBeforeUnmount(() => {
+      const timer = searchTimer
+      if (timer != null) {
+        clearTimeout(timer)
+        searchTimer = null
+      }
+    })
 </script>
 
 <style lang="scss">

+ 118 - 11
pages/worktime/index.uvue

@@ -193,7 +193,7 @@
 </template>
 
 <script setup lang="uts">
-import { ref, computed, onMounted } from 'vue'
+import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
 import { listOrderHours, getOrderHourStatistics } from '@/api/worktime/index'
 import { getDictDataByType } from '@/api/dict/index'
 import type { SysDictData } from '@/types/dict'
@@ -213,6 +213,12 @@ const repairHours = ref<number>(0)
 const rank = ref<number | null>(null)
 const totalRankingUsers = ref<number | null>(null)
 
+// 防止重复请求的标志位
+const isSearching = ref<boolean>(false)
+
+// 添加防抖定时器
+let searchTimer: number | null = null
+
 // 弹窗显示状态
 const showDatePickerPopup = ref<boolean>(false)
 const showStartDatePicker = ref<boolean>(false)
@@ -491,26 +497,98 @@ function loadData(isRefresh: boolean) {
 }
 
 function handleSearch() {
-  loadData(true)
-  //getStatistics()
+  // 添加防抖和防止重复请求
+  if (isSearching.value) {
+    return
+  }
+  
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
+  
+  searchTimer = setTimeout(() => {
+    isSearching.value = true
+    loadData(true)
+    getStatistics()
+    // 延迟重置标志位,确保请求发送后才允许下一次搜索
+    setTimeout(() => {
+      isSearching.value = false
+    }, 100)
+  }, 300)
 }
 
 function clearSearch() {
+  // 添加防抖和防止重复请求
+  if (isSearching.value) {
+    return
+  }
+  
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
+  
   searchKeyword.value = ""
-  loadData(true)
-  //getStatistics()
+  searchTimer = setTimeout(() => {
+    isSearching.value = true
+    loadData(true)
+    getStatistics()
+    // 延迟重置标志位,确保请求发送后才允许下一次搜索
+    setTimeout(() => {
+      isSearching.value = false
+    }, 100)
+  }, 300)
 }
 
 function filterByOrderType(type: string) {
+  // 添加防止重复请求
+  if (isSearching.value) {
+    return
+  }
+  
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
+  
   orderTypeFilter.value = type
-  loadData(true)
-  getStatistics()
+  searchTimer = setTimeout(() => {
+    isSearching.value = true
+    loadData(true)
+    getStatistics()
+    // 延迟重置标志位,确保请求发送后才允许下一次搜索
+    setTimeout(() => {
+      isSearching.value = false
+    }, 100)
+  }, 300)
 }
 
 function changeTimeRange(range: string) {
+  // 添加防止重复请求
+  if (isSearching.value) {
+    return
+  }
+  
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
+  
   timeRange.value = range
-  loadData(true)
-  getStatistics()
+  searchTimer = setTimeout(() => {
+    isSearching.value = true
+    loadData(true)
+    getStatistics()
+    // 延迟重置标志位,确保请求发送后才允许下一次搜索
+    setTimeout(() => {
+      isSearching.value = false
+    }, 100)
+  }, 300)
 }
 
 function loadMore() {
@@ -563,8 +641,27 @@ function confirmCustomDate() {
 
   closeDatePicker()
   timeRange.value = 'custom'
-  loadData(true)
-  getStatistics()
+  
+  // 添加防止重复请求
+  if (isSearching.value) {
+    return
+  }
+  
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
+  
+  searchTimer = setTimeout(() => {
+    isSearching.value = true
+    loadData(true)
+    getStatistics()
+    // 延迟重置标志位,确保请求发送后才允许下一次搜索
+    setTimeout(() => {
+      isSearching.value = false
+    }, 100)
+  }, 300)
 }
 
 // 打开开始日期选择器
@@ -687,6 +784,16 @@ onMounted(() => {
   loadMaintenanceTypeDictList()
   loadData(false)
   getStatistics()
+  dictLoaded.value = true
+})
+
+// 组件销毁时清除定时器
+onBeforeUnmount(() => {
+  const timer = searchTimer
+  if (timer != null) {
+    clearTimeout(timer)
+    searchTimer = null
+  }
 })
 </script>