|
@@ -185,55 +185,89 @@
|
|
|
title="📑 文档分段"
|
|
|
v-model="chunkDialogVisible"
|
|
|
width="90%"
|
|
|
- class="content-dialog"
|
|
|
+ class="content-dialog chunk-dialog"
|
|
|
:destroy-on-close="true"
|
|
|
>
|
|
|
- <div class="chunk-content">
|
|
|
- <el-table
|
|
|
- v-if="chunkDialogVisible && chunkList.length > 0"
|
|
|
- :data="chunkList"
|
|
|
- style="width: 100%"
|
|
|
- class="chunk-table"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- prop="chunk_id"
|
|
|
- label="分段ID"
|
|
|
- width="100"
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="summary"
|
|
|
- label="内容摘要"
|
|
|
- width="300"
|
|
|
- header-align="center"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="text"
|
|
|
- label="完整内容"
|
|
|
- header-align="center"
|
|
|
- show-overflow-tooltip
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="statusDesc"
|
|
|
- label="状态"
|
|
|
- width="100"
|
|
|
- header-align="center"
|
|
|
- align="center"
|
|
|
+ <div class="chunk-container">
|
|
|
+ <div class="chunk-header">
|
|
|
+ <div class="chunk-stats">
|
|
|
+ <span class="stat-item">共 {{ chunkTotal }} 个分段</span>
|
|
|
+ <span class="stat-item">当前显示 {{ chunkList.length }} 个</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="chunk-content">
|
|
|
+ <el-table
|
|
|
+ v-if="chunkDialogVisible && chunkList.length > 0"
|
|
|
+ :data="chunkList"
|
|
|
+ style="width: 100%"
|
|
|
+ class="chunk-table"
|
|
|
+ :scrollbar-always-on="true"
|
|
|
>
|
|
|
- <template #default="scope">
|
|
|
- <span :class="scope.row.statusDesc === '可用' ? 'status-available' : 'status-unavailable'">
|
|
|
- {{ scope.row.statusDesc }}
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
- <div v-else class="empty-chunks">
|
|
|
- <div class="empty-icon">📝</div>
|
|
|
- <h3>暂无分段内容</h3>
|
|
|
- <p>该文档没有分块或分块内容为空</p>
|
|
|
+ <el-table-column
|
|
|
+ prop="chunk_id"
|
|
|
+ label="分段ID"
|
|
|
+ width="100"
|
|
|
+ header-align="center"
|
|
|
+ align="center"
|
|
|
+ fixed="left"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <span class="chunk-id">#{{ scope.row.chunk_id }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ prop="summary"
|
|
|
+ label="内容摘要"
|
|
|
+ width="300"
|
|
|
+ header-align="center"
|
|
|
+ min-width="300"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="summary-content" :title="scope.row.summary">
|
|
|
+ {{ scope.row.summary || '无摘要' }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ prop="text"
|
|
|
+ label="完整内容"
|
|
|
+ header-align="center"
|
|
|
+ min-width="500"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="full-content" :title="scope.row.text">
|
|
|
+ {{ scope.row.text }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ prop="statusDesc"
|
|
|
+ label="状态"
|
|
|
+ width="120"
|
|
|
+ header-align="center"
|
|
|
+ align="center"
|
|
|
+ fixed="right"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag
|
|
|
+ :type="scope.row.statusDesc === '可用' ? 'success' : 'danger'"
|
|
|
+ class="status-tag"
|
|
|
+ >
|
|
|
+ {{ scope.row.statusDesc }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div v-else class="empty-chunks">
|
|
|
+ <div class="empty-icon">📝</div>
|
|
|
+ <h3>暂无分段内容</h3>
|
|
|
+ <p>该文档没有分块或分块内容为空</p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 分页器 -->
|
|
@@ -242,7 +276,9 @@
|
|
|
v-model:current-page="chunkPage"
|
|
|
:page-size="chunkPageSize"
|
|
|
:total="chunkTotal"
|
|
|
- layout="prev, pager, next"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
@current-change="fetchChunks"
|
|
|
/>
|
|
|
</div>
|