fetch: 页面移植

知识库接口对接

src/views/knowledge/dataset.vue

@@ -10,20 +10,42 @@
           导入您自己的文本数据或通过 Webhook 实时写入数据以增强 LLM 的上下文。
         </div>
       </el-card>
-
+       <el-card class="document-card" v-if="loading">
-      <el-card
-v-for="item in tableData" :key="item.id" class="document-card" shadow="hover"
-               @click="toDataset(item.id)">
         <div class="document-header">
           <el-icon>
-            <Folder/>
+            <Folder />
+          </el-icon>
+          <el-skeleton animated :rows="1" />
+        </div>
+        <div class="document-info">
+          <el-skeleton animated :rows="1" />
+            
+        </div>
+        <p class="document-description">
+          <el-skeleton animated :rows="3" />
+        </p>
+       </el-card> 
+      <el-card
+        v-for="item in tableData"
+        :key="item.id"
+        class="document-card"
+        shadow="hover"
+        @click="toDataset(item.id)"
+      >
+        <div class="document-header">
+          <el-icon>
+            <Folder />
           </el-icon>
           <span>{{ item.name }}</span>
         </div>
         <div class="document-info">
           <el-tag size="small">{{ item.docsNum || 0 }} 文档</el-tag>
-          <el-tag size="small" type="info">{{ (Number(item.totalSize) / 1000000).toFixed(2) }} MB</el-tag>
+          <el-tag size="small" type="info"
-          <el-tag size="small" type="warning" v-if="item.embedStore">  {{ item.embedStore.name }}</el-tag>
+            >{{ (Number(item.totalSize) / 1000000).toFixed(2) }} MB</el-tag
+          >
+          <el-tag size="small" type="warning" v-if="item.embedStore">
+            {{ item.embedStore.name }}</el-tag
+          >
         </div>
         <p class="document-description">
           {{ item.des || '暂无描述' }}
@@ -45,15 +67,15 @@ v-for="item in tableData" :key="item.id" class="document-card" shadow="hover"
         @current-change="handleCurrentChange"
       />
     </div>
-    <create ref="createRef" @reload="loadData"/>
+    <create ref="createRef" @reload="loadData" />
   </div>
 </template>
 
 <script setup lang="ts">
-import {ref, onMounted} from 'vue'
+import { ref, onMounted } from 'vue'
-import {Plus, Folder} from '@element-plus/icons-vue'
+import { Plus, Folder } from '@element-plus/icons-vue'
-import {useRouter} from 'vue-router'
+import { useRouter } from 'vue-router'
-import {KnowledgeApi} from '@/api/new-ai/knowledge'
+import { KnowledgeApi } from '@/api/new-ai/knowledge'
 import Create from './components/create.vue'
 const router = useRouter()
 const currentPage = ref(1)
@@ -61,12 +83,14 @@ const pageSize = ref(10)
 const total = ref(0)
 const tableData = ref([])
 const createRef = ref()
+const loading = ref(false)
 const loadData = async () => {
   try {
+    loading.value = true
     const res = await KnowledgeApi.getKnowledgePage({
       pageNo: currentPage.value,
       pageSize: pageSize.value
-    })
+    }).finally(() => loading.value = false)
     tableData.value = res.list || []
     total.value = res.total || 0
   } catch (error) {
@@ -88,7 +112,6 @@ const toDataset = (id: string) => {
   router.push(`/ai/console/knowledge/${id}`)
 }
 
-
 const handleCreate = () => {
   createRef.value.open()
 }
@@ -99,7 +122,8 @@ onMounted(() => {
 
 <style scoped>
 .knowledge-base-container {
-  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
+  font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
+    '微软雅黑', Arial, sans-serif;
   padding: 20px;
 }