From 12bee09773264d5b50796021fe61c07d11bb068c Mon Sep 17 00:00:00 2001
From: "851673013@qq.com" <851673013@qq.com>
Date: Wed, 10 Aug 2022 10:32:50 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B9=BF=E5=9C=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../capacitySquare/components/algorithm.vue   | 71 +++++++++++--------
 .../views/capacitySquare/components/layer.vue | 70 ++++++++++--------
 2 files changed, 81 insertions(+), 60 deletions(-)

diff --git a/front/src/views/capacitySquare/components/algorithm.vue b/front/src/views/capacitySquare/components/algorithm.vue
index 77ffb53f..0bc63925 100644
--- a/front/src/views/capacitySquare/components/algorithm.vue
+++ b/front/src/views/capacitySquare/components/algorithm.vue
@@ -28,7 +28,7 @@
 </template>
 <script setup>
   import { pageWithAttrs } from '@/api/abilityStatistics'
-  import { ref, onMounted } from 'vue'
+  import { ref, onMounted, onBeforeUnmount } from 'vue'
   const dataList = ref([])
   const params = {
     deptIds: [],
@@ -40,6 +40,7 @@
     pageSize: 9,
     type: '组件服务',
   }
+  let algorithmclass = null
   const imgSrc = ref(require('@/assets/capacitySquare/algorithm-photo.jpg'))
   const dataLength = ref(true)
   const isNoMore = ref(false)
@@ -55,44 +56,54 @@
   pageWithAttrsFunction()
   //图片显示
   const algorithmCardPhoto = (List) => {
-    List.map((item) => {
-      if (item.attrType === '图层缩略图') {
-        url.value = item.attrValue
-      }
-    })
+    let obj = List.filter((item) => item.attrType === '图层缩略图')[0]
+    if (obj) {
+      List.map((item) => {
+        if (item.attrType === '图层缩略图') {
+          url.value = item.attrValue
+        }
+      })
+    } else {
+      url.value = '@/assets/capacitySquare/algorithm-photo2.jpg'
+    }
     return url.value
   }
   //跳转详情页
   const detailFunction = (id) => {
     window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`)
   }
-  onMounted(() => {
-    const algorithmclass = document.querySelector('.algorithm-class')
-    if (dataLength.value) {
-      //监听滚动事件
-      algorithmclass.addEventListener('scroll', (e) => {
-        var scrollTop = e.currentTarget.scrollTop
-        var windowHeight = e.currentTarget.clientHeight
-        var scrollHeight = e.currentTarget.scrollHeight
-        console.log(scrollTop, windowHeight, scrollHeight, '123')
-        if (
-          scrollTop + windowHeight <= scrollHeight + 1 &&
-          scrollTop + windowHeight >= scrollHeight - 1
-        ) {
-          // 当前滚动条已经触底
-          isNoMore.value = true
-          params.pageNum++
-          pageWithAttrs(params).then((res) => {
-            dataList.value.push(...res.data.data.records)
-            if (res.data.data.records.length < 9) {
-              dataLength.value = false
-            }
-          })
-        } else {
-          isNoMore.value = false
+  const algorithmFunction = (e) => {
+    var scrollTop = e.currentTarget.scrollTop
+    var windowHeight = e.currentTarget.clientHeight
+    var scrollHeight = e.currentTarget.scrollHeight
+    console.log(scrollTop, windowHeight, scrollHeight, '123')
+    if (
+      scrollTop + windowHeight <= scrollHeight + 1 &&
+      scrollTop + windowHeight >= scrollHeight - 1
+    ) {
+      // 当前滚动条已经触底
+      isNoMore.value = true
+      params.pageNum++
+      pageWithAttrs(params).then((res) => {
+        dataList.value.push(...res.data.data.records)
+        if (res.data.data.records.length < 9) {
+          dataLength.value = false
         }
       })
+    } else {
+      isNoMore.value = false
     }
+  }
+
+  onMounted(() => {
+    algorithmclass = document.querySelector('.algorithm-class')
+    if (dataLength.value) {
+      //监听滚动事件
+      algorithmclass.addEventListener('scroll', algorithmFunction, true)
+    }
+  })
+  onBeforeUnmount(() => {
+    algorithmclass.removeEventListener('scroll', algorithmFunction, true)
   })
 </script>
 
diff --git a/front/src/views/capacitySquare/components/layer.vue b/front/src/views/capacitySquare/components/layer.vue
index 72feebc6..17c2d629 100644
--- a/front/src/views/capacitySquare/components/layer.vue
+++ b/front/src/views/capacitySquare/components/layer.vue
@@ -28,8 +28,9 @@
 </template>
 <script setup>
   import { pageWithAttrs } from '@/api/abilityStatistics'
-  import { ref, onMounted } from 'vue'
+  import { ref, onMounted, onBeforeUnmount } from 'vue'
   const dataList = ref([])
+  let algorithmclass = null
   const params = {
     deptIds: [],
     districtId: '',
@@ -55,44 +56,53 @@
   pageWithAttrsFunction()
   //图片显示
   const algorithmCardPhoto = (List) => {
-    List.map((item) => {
-      if (item.attrType === '图层缩略图') {
-        url.value = item.attrValue
-      }
-    })
+    let obj = List.filter((item) => item.attrType === '图层缩略图')[0]
+    if (obj) {
+      List.map((item) => {
+        if (item.attrType === '图层缩略图') {
+          url.value = item.attrValue
+        }
+      })
+    } else {
+      url.value = '@/assets/capacitySquare/algorithm-photo2.jpg'
+    }
     return url.value
   }
   //跳转详情页
   const detailFunction = (id) => {
     window.open(window.SITE_CONFIG.previewUrl + `#/details?id=${id}`)
   }
-  onMounted(() => {
-    const algorithmclass = document.querySelector('.algorithm-class')
-    if (dataLength.value) {
-      //监听滚动事件
-      algorithmclass.addEventListener('scroll', (e) => {
-        var scrollTop = e.currentTarget.scrollTop
-        var windowHeight = e.currentTarget.clientHeight
-        var scrollHeight = e.currentTarget.scrollHeight
-        console.log(scrollTop, windowHeight, scrollHeight, '123')
-        if (
-          scrollTop + windowHeight <= scrollHeight + 1 &&
-          scrollTop + windowHeight >= scrollHeight - 1
-        ) {
-          // 当前滚动条已经触底
-          isNoMore.value = true
-          params.pageNum++
-          pageWithAttrs(params).then((res) => {
-            dataList.value.push(...res.data.data.records)
-            if (res.data.data.records.length < 9) {
-              dataLength.value = false
-            }
-          })
-        } else {
-          isNoMore.value = false
+  const layerFunction = (e) => {
+    var scrollTop = e.currentTarget.scrollTop
+    var windowHeight = e.currentTarget.clientHeight
+    var scrollHeight = e.currentTarget.scrollHeight
+    console.log(scrollTop, windowHeight, scrollHeight, '123')
+    if (
+      scrollTop + windowHeight <= scrollHeight + 1 &&
+      scrollTop + windowHeight >= scrollHeight - 1
+    ) {
+      // 当前滚动条已经触底
+      isNoMore.value = true
+      params.pageNum++
+      pageWithAttrs(params).then((res) => {
+        dataList.value.push(...res.data.data.records)
+        if (res.data.data.records.length < 9) {
+          dataLength.value = false
         }
       })
+    } else {
+      isNoMore.value = false
     }
+  }
+  onMounted(() => {
+    algorithmclass = document.querySelector('.algorithm-class')
+    if (dataLength.value) {
+      //监听滚动事件
+      algorithmclass.addEventListener('scroll', layerFunction, true)
+    }
+  })
+  onBeforeUnmount(() => {
+    algorithmclass.removeEventListener('scroll', layerFunction, true)
   })
 </script>