From 5838a4f5dffe578600eeafd66b801250cd09cfb3 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Thu, 9 May 2024 17:46:57 +0800
Subject: [PATCH 1/2] =?UTF-8?q?perf:=20=E5=88=86=E6=AE=B5=E9=A2=84?=
 =?UTF-8?q?=E8=A7=88=E6=87=92=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../dataset/component/ParagraphPreview.vue    | 42 ++++++++++++++++---
 ui/src/views/dataset/step/StepSecond.vue      |  1 +
 2 files changed, 37 insertions(+), 6 deletions(-)

diff --git a/ui/src/views/dataset/component/ParagraphPreview.vue b/ui/src/views/dataset/component/ParagraphPreview.vue
index b11d4eeac..4191c792f 100644
--- a/ui/src/views/dataset/component/ParagraphPreview.vue
+++ b/ui/src/views/dataset/component/ParagraphPreview.vue
@@ -8,14 +8,13 @@
             <span class="ml-4">{{ item?.name }}</span>
           </div>
         </template>
-        <el-scrollbar>
+        <el-scrollbar ref="scrollRef" :key="index">
           <div class="mb-16">
             <el-text type="info">{{ item.content.length }} 段落</el-text>
           </div>
-
-          <div class="paragraph-list">
+          <div class="paragraph-list" v-infinite-scroll="loadScroll">
             <el-card
-              v-for="(child, cIndex) in item.content"
+              v-for="(child, cIndex) in scrollData"
               :key="cIndex"
               shadow="never"
               class="card-never mb-16"
@@ -52,7 +51,7 @@
   />
 </template>
 <script setup lang="ts">
-import { ref, reactive, onMounted, watch } from 'vue'
+import { ref, reactive, onMounted, watch, nextTick } from 'vue'
 import { cloneDeep } from 'lodash'
 import type { TabsPaneContext } from 'element-plus'
 import EditParagraphDialog from './EditParagraphDialog.vue'
@@ -70,6 +69,7 @@ const props = defineProps({
 const emit = defineEmits(['update:data'])
 
 const EditParagraphDialogRef = ref()
+const scrollRef = ref()
 
 const activeName = ref(0)
 const currentPIndex = ref(null) as any
@@ -77,16 +77,41 @@ const currentCIndex = ref(null) as any
 
 const newData = ref<any[]>([])
 
+// 滚动加载数据
+const paginationConfig = reactive({
+  current_page: 1,
+  page_size: 20
+})
+
+const scrollData = ref<any[]>([])
+
 watch(
   () => props.data,
   (value) => {
     newData.value = value
+    paginationConfig.current_page = 1
+    nextTick(() => {
+      scrollRef.value?.[activeName.value]?.scrollTo(0, 0)
+    })
+    scrollData.value = newData.value[activeName.value]?.content.slice(0, paginationConfig.page_size)
   },
   {
     immediate: true
   }
 )
 
+function loadScroll() {
+  if (newData.value[activeName.value]?.content.length > scrollData.value.length) {
+    paginationConfig.current_page += 1
+    scrollData.value.push(
+      ...newData.value[activeName.value].content.slice(
+        (paginationConfig.current_page - 1) * paginationConfig.page_size,
+        paginationConfig.current_page * paginationConfig.page_size
+      )
+    )
+  }
+}
+
 function editHandle(item: any, index: number, cIndex: number) {
   currentPIndex.value = index
   currentCIndex.value = cIndex
@@ -100,6 +125,7 @@ function deleteHandle(item: any, index: number, cIndex: number) {
   })
     .then(() => {
       newData.value[index].content.splice(cIndex, 1)
+      scrollData.value.splice(cIndex, 1)
       emit('update:data', newData.value)
     })
     .catch(() => {})
@@ -107,10 +133,14 @@ function deleteHandle(item: any, index: number, cIndex: number) {
 
 function updateContent(data: any) {
   newData.value[currentPIndex.value].content[currentCIndex.value] = cloneDeep(data)
+  scrollData.value[currentCIndex.value] = cloneDeep(data)
   emit('update:data', newData.value)
 }
 
-const handleClick = (tab: TabsPaneContext, event: Event) => {}
+const handleClick = (tab: TabsPaneContext, event: Event) => {
+  paginationConfig.current_page = 1
+  scrollData.value = newData.value[Number(tab.index)]?.content.slice(0, paginationConfig.page_size)
+}
 
 onMounted(() => {})
 </script>
diff --git a/ui/src/views/dataset/step/StepSecond.vue b/ui/src/views/dataset/step/StepSecond.vue
index 3a400ca83..acef2dedf 100644
--- a/ui/src/views/dataset/step/StepSecond.vue
+++ b/ui/src/views/dataset/step/StepSecond.vue
@@ -95,6 +95,7 @@
       <el-col :span="14" class="p-24 border-l">
         <div v-loading="loading">
           <h4 class="title-decoration-1 mb-8">分段预览</h4>
+
           <ParagraphPreview v-model:data="paragraphList" :isConnect="checkedConnect" />
         </div>
       </el-col>

From 80383853f9092f6a9b767ae9e281ee65b96c6b38 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Thu, 9 May 2024 17:58:21 +0800
Subject: [PATCH 2/2] =?UTF-8?q?perf:=20=E8=B7=A8=E5=9F=9F=E5=9C=B0?=
 =?UTF-8?q?=E5=9D=80=E8=BF=87=E6=BB=A4=E7=A9=BA=E8=A1=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../application-overview/component/SettingAPIKeyDialog.vue    | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/ui/src/views/application-overview/component/SettingAPIKeyDialog.vue b/ui/src/views/application-overview/component/SettingAPIKeyDialog.vue
index 36d3b0c85..16fa3567d 100644
--- a/ui/src/views/application-overview/component/SettingAPIKeyDialog.vue
+++ b/ui/src/views/application-overview/component/SettingAPIKeyDialog.vue
@@ -75,7 +75,9 @@ const submit = async (formEl: FormInstance | undefined) => {
       const obj = {
         allow_cross_domain: form.value.allow_cross_domain,
         cross_domain_list: form.value.cross_domain_list
-          ? form.value.cross_domain_list.split('\n')
+          ? form.value.cross_domain_list.split('\n').filter(function (item: string) {
+              return item !== ''
+            })
           : []
       }
       overviewApi.putAPIKey(id as string, APIKeyId.value, obj, loading).then((res) => {