fix-update-profile-likes-status (#1272)

* Draft MR

* fix-update-profile-likes-status

---------

Co-authored-by: jiuling <[email protected]>

Author: ice201508

frontend/src/components/shared/ProfileRepoList.vue

@@ -114,7 +114,8 @@
 </template>
 
 <script setup>
-  import { computed, ref, onMounted } from "vue"
+  import { computed, ref, onMounted, watch, onUnmounted } from "vue"
+  import { useRoute } from 'vue-router'
   import RepoItem from "./RepoItem.vue"
   import CollectionCards from "../collections/CollectionCards.vue"
   import ApplicationSpaceItem from "../application_spaces/ApplicationSpaceItem.vue"
@@ -128,6 +129,7 @@
     initiator: String
   })
 
+  const route = useRoute()
   const collections = ref({})
   const models = ref({})
   const datasets = ref({})
@@ -161,23 +163,43 @@
   const prefixPath =
     document.location.pathname.split("/")[1] === "organizations" ? "organization" : "user"
 
+  const isLoading = ref(false)
+  const lastFetchTime = ref(0)
+  const FETCH_DEBOUNCE_TIME = 1000
+
   const getProfileRepoData = async () => {
-    const collectionsUrl = reposUrl("collections")
-    const modelsUrl = reposUrl("models")
-    const datasetsUrl = reposUrl("datasets")
-    const spacesUrl = reposUrl("spaces")
-    const codesUrl = reposUrl("codes")
-    const mcpsUrl = reposUrl("mcps")
-
-    const promises = [
-      fetchData(collectionsUrl, collections, INITIAL_PER_PAGE, 1),
-      fetchData(modelsUrl, models, INITIAL_PER_PAGE, 1),
-      fetchData(datasetsUrl, datasets, INITIAL_PER_PAGE, 1),
-      fetchData(spacesUrl, spaces, INITIAL_PER_PAGE, 1),
-      fetchData(codesUrl, codes, INITIAL_PER_PAGE, 1),
-      fetchData(mcpsUrl, mcps, INITIAL_PER_PAGE, 1),
-    ]
-    await Promise.all(promises)
+    // 防止重复请求
+    if (isLoading.value) {
+      return
+    }
+    
+    isLoading.value = true
+    lastFetchTime.value = Date.now()
+    
+    try {
+      const collectionsUrl = reposUrl("collections")
+      const modelsUrl = reposUrl("models")
+      const datasetsUrl = reposUrl("datasets")
+      const spacesUrl = reposUrl("spaces")
+      const codesUrl = reposUrl("codes")
+      const promptsUrl = reposUrl("prompts")
+      const mcpsUrl = reposUrl("mcps")
+
+      const promises = [
+        fetchData(collectionsUrl, collections, INITIAL_PER_PAGE, 1),
+        fetchData(modelsUrl, models, INITIAL_PER_PAGE, 1),
+        fetchData(datasetsUrl, datasets, INITIAL_PER_PAGE, 1),
+        fetchData(spacesUrl, spaces, INITIAL_PER_PAGE, 1),
+        fetchData(codesUrl, codes, INITIAL_PER_PAGE, 1),
+        fetchData(mcpsUrl, mcps, INITIAL_PER_PAGE, 1),
+      ]
+      if (props.initiator === "profile") {
+        promises.push(fetchData(promptsUrl, prompts, INITIAL_PER_PAGE, 1))
+      }
+      await Promise.all(promises)
+    } finally {
+      isLoading.value = false
+    }
   }
 
   const viewMoreTargets = async (target) => {
@@ -304,5 +326,27 @@
 
   onMounted(() => {
     getProfileRepoData()
+    
+    document.addEventListener('visibilitychange', handleVisibilityChange)
   })
+
+  onUnmounted(() => {
+    document.removeEventListener('visibilitychange', handleVisibilityChange)
+  })
+
+  const handleVisibilityChange = () => {
+    if (!document.hidden) {
+      if (isLoading.value) {
+        return
+      }
+      
+      const now = Date.now()
+      if (now - lastFetchTime.value < FETCH_DEBOUNCE_TIME) {
+        return
+      }
+      
+      // 重新获取数据
+      getProfileRepoData()
+    }
+  }
 </script>

frontend/src/components/shared/RepoDetail.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script setup>
-  import { onMounted, computed, provide, ref, watch } from 'vue'
+  import { onMounted, computed, provide, ref, watch, onUnmounted } from 'vue'
   import RepoHeader from '../shared/RepoHeader.vue'
   import RepoTabs from '../shared/RepoTabs.vue'
   import useRepoDetailStore from '../../stores/RepoDetailStore'
@@ -67,6 +67,11 @@
   const { isInitialized } = storeToRefs(repoDetailStore)
   const lastCommit = ref({})
 
+  // 添加防抖相关状态
+  const isLoading = ref(false)
+  const lastFetchTime = ref(0)
+  const FETCH_DEBOUNCE_TIME = 1000 // 1秒防抖
+
   // const repo = ref({})
   // const tags = ref({
   //   task_tags: [],
@@ -101,6 +106,14 @@
   })
 
   const fetchRepoDetail = async () => {
+    // 防止重复请求
+    if (isLoading.value) {
+      return
+    }
+    
+    isLoading.value = true
+    lastFetchTime.value = Date.now()
+    
     const url = `/${props.repoType}s/${props.namespace}/${props.repoName}`
 
     try {
@@ -124,6 +137,8 @@
       // ownerUrl.value = getOwnerUrl(repoData)
     } catch (error) {
       console.error('Failed to fetch repo detail:', error)
+    } finally {
+      isLoading.value = false
     }
   }
 
@@ -169,11 +184,28 @@
     }
   }
 
+  const handleVisibilityChange = () => {
+    if (!document.hidden) {
+      // 检查是否正在加载
+      if (isLoading.value) {
+        return
+      }
+      
+      // 检查距离上次请求的时间
+      const now = Date.now()
+      if (now - lastFetchTime.value < FETCH_DEBOUNCE_TIME) {
+        return
+      }
+      
+      // 重新获取数据
+      fetchRepoDetail()
+      fetchLastCommit()
+    }
+  }
+
   onMounted(() => {
-    // 1. 从URL参数获取状态
     const urlParams = getUrlParams()
     
-    // 2. 初始化store，优先使用URL参数
     const initialData = {
       repoType: props.repoType,
       namespace: props.namespace,
@@ -186,9 +218,14 @@
     
     setRepoTab(initialData)
     
-    // 3. 获取数据
     fetchRepoDetail()
     fetchLastCommit()
+    
+    document.addEventListener('visibilitychange', handleVisibilityChange)
+  })
+
+  onUnmounted(() => {
+    document.removeEventListener('visibilitychange', handleVisibilityChange)
   })
 
   provide('fetchRepoDetail', fetchRepoDetail)