From e44564d6a6c86b924f6979e15e71785f5e0c76ab Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Wed, 25 Jun 2025 17:03:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.js                             | 18 +++++++++++++++++
 src/utils/request.js                    |  2 +-
 src/views/resource/components/addLr.vue | 27 ++++++++++++++++++-------
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/src/main.js b/src/main.js
index facb2ce..aa8601c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -108,6 +108,24 @@ import Sortable from 'sortablejs';
 //   } = require('../mock')
 //   mockXHR()
 // }
+
+Vue.directive("loadmore", {
+  bind(el, binding) {
+    // 获取element-ui定义好的scroll盒子
+    const SELECTWRAP_DOM = el.querySelector(
+      ".el-select-dropdown .el-select-dropdown__wrap"
+    );
+    SELECTWRAP_DOM.addEventListener("scroll", function() {
+      const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight;
+      if (CONDITION) {
+        binding.value();
+      }
+    });
+  }
+});
+
+
+
 
 new Vue({
   el: '#app',
diff --git a/src/utils/request.js b/src/utils/request.js
index 7503673..0bf72fc 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -20,7 +20,7 @@ let loading ;
 const service = axios.create({
   baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
   // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 5000, // request timeout
+  timeout: 15000, // request timeout
   isLoading:true
 })
 
diff --git a/src/views/resource/components/addLr.vue b/src/views/resource/components/addLr.vue
index 5db89ae..02a78f9 100644
--- a/src/views/resource/components/addLr.vue
+++ b/src/views/resource/components/addLr.vue
@@ -116,10 +116,12 @@
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>PN：
           </div>
           <div class="xy-table-item-content">
-            <el-select style="width:100%" filterable v-model="form.product_numbers" multiple collapse-tags
+            <el-select v-loadmore="loadMore" style="width:100%" filterable v-model="form.product_numbers" multiple collapse-tags
               placeholder="Please Select">
               <el-option v-for="item in productList" :key="item.id" :label="item.number" :value="item.id">
-              </el-option>
+              </el-option>
+              <div v-if="productPage>lastPage" style="text-align: center;">There is no more data</div>
+              <div v-else style="text-align: center;">Loading More</div>
             </el-select>
           </div>
         </div>
@@ -195,7 +197,9 @@
         table_name: 'literature_references',
         isShow: false,
         id: '',
-        type: 'add',
+        type: 'add',
+        productPage:1,
+        lastPage:0,
         productList: [],
         categoryList: [],
         applicationList: [],
@@ -294,10 +298,19 @@
 
       async getProductList() {
         const res = await getProduct({
-          page_size: 9999,
-          page: 1
-        })
-        this.productList = res.data
+          page_size: 100,
+          page: this.productPage
+        })
+        this.lastPage = res.last_page
+        this.productList.push(...res.data)
+      },
+      loadMore() {
+        // 这里写入要触发的方法
+        this.productPage += 1;
+        if(this.productPage>this.lastPage){
+          return
+        }
+        this.getProductList();
       },
 
       submit() {