移除冗余代码，已经改到 ai 目录下实现
This commit is contained in:
YunaiV
parent
8ef39c76d6
commit
986d1cdfc2
@ -1,151 +0,0 @@
|
||||
<template>
|
||||
<div class="upload-container">
|
||||
<!-- 标题 -->
|
||||
<div class="title">
|
||||
<div>选择数据源</div>
|
||||
</div>
|
||||
|
||||
<!-- 数据源选择 -->
|
||||
<div class="resource-btn" >导入已有文本</div>
|
||||
|
||||
<!-- 上传文件区域 -->
|
||||
<el-form>
|
||||
<div class="upload-section">
|
||||
<div class="upload-label">上传文本文件</div>
|
||||
<el-upload
|
||||
class="upload-area"
|
||||
action="#"
|
||||
:file-list="fileList"
|
||||
:on-remove="handleRemove"
|
||||
:before-upload="beforeUpload"
|
||||
list-type="text"
|
||||
drag
|
||||
>
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text">拖拽文件至此，或者 <em>选择文件</em></div>
|
||||
<div class="el-upload__tip">
|
||||
已支持 TXT、MARKDOWN、PDF、HTML、XLSX、XLS、DOCX、CSV、EML、MSG、PPTX、PPT、XML、EPUB，每个文件不超过 15MB。
|
||||
</div>
|
||||
</el-upload>
|
||||
</div>
|
||||
|
||||
<!-- 下一步按钮 -->
|
||||
<div class="next-button">
|
||||
<el-button type="primary" :disabled="!fileList.length">下一步</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<!-- 知识库创建 -->
|
||||
<div class="create-knowledge">
|
||||
<el-link type="primary" underline>创建一个空知识库</el-link>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
const fileList = ref([])
|
||||
|
||||
const handleRemove = (file, fileList) => {
|
||||
console.log(file, fileList)
|
||||
}
|
||||
|
||||
const beforeUpload = (file) => {
|
||||
fileList.value.push(file)
|
||||
return false
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.upload-container {
|
||||
width: 600px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #ebebeb;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.resource-btn {
|
||||
margin-top: 20px;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
width: 150px;
|
||||
border: 1.5px solid #528bff;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
color: #101828;
|
||||
}
|
||||
|
||||
.upload-section {
|
||||
margin: 20px 0;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.upload-label {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.upload-area {
|
||||
margin-top: 10px;
|
||||
border: 1px dashed #d9d9d9;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
background-color: #f5f7fa;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.el-upload__text em {
|
||||
color: #409eff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.el-upload__tip {
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.next-button {
|
||||
text-align: left;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.create-knowledge {
|
||||
text-align: left;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.source-radio-group {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.el-radio-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 14px;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.el-radio-button .el-icon {
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
@ -1,168 +0,0 @@
|
||||
<template>
|
||||
<el-row>
|
||||
<!-- Left Section -->
|
||||
<el-col :span="12">
|
||||
<el-card>
|
||||
<!-- 分段设置 -->
|
||||
<el-form>
|
||||
<el-form-item label="分段设置">
|
||||
<el-radio-group v-model="segmentSetting">
|
||||
<el-radio label="自动分段与清洗">自动分段与清洗</el-radio>
|
||||
<el-radio label="自定义">自定义</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 索引方式 -->
|
||||
<el-form-item label="索引方式">
|
||||
<el-radio-group v-model="indexingMethod">
|
||||
<el-radio label="高质量">高质量</el-radio>
|
||||
<el-radio label="经济">经济</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- Embedding 模型 -->
|
||||
<el-form-item label="Embedding 模型">
|
||||
<el-select v-model="embeddingModel" placeholder="Select Embedding Model">
|
||||
<el-option label="text-embedding-3-large" value="text-embedding-3-large"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 检索设置 -->
|
||||
<el-form-item label="检索设置">
|
||||
<el-card style="width: 400px;">
|
||||
<div class="card-header">
|
||||
<span>向量检索</span>
|
||||
</div>
|
||||
<el-slider v-model="topK" :min="1" :max="10" label="Top K"/>
|
||||
<el-slider v-model="scoreThreshold" :min="0" :max="1" step="0.1" label="Score 阈值"/>
|
||||
</el-card>
|
||||
|
||||
<el-card style="width: 400px;">
|
||||
<div class="card-header">
|
||||
<span>全文检索</span>
|
||||
</div>
|
||||
<el-slider v-model="topK" :min="1" :max="10" label="Top K"/>
|
||||
<el-slider v-model="scoreThreshold" :min="0" :max="1" step="0.1" label="Score 阈值"/>
|
||||
</el-card>
|
||||
|
||||
<el-card style="width: 400px;">
|
||||
<div class="card-header">
|
||||
<span>混合检索</span>
|
||||
</div>
|
||||
<el-slider v-model="topK" :min="1" :max="10" label="Top K"/>
|
||||
<el-slider v-model="scoreThreshold" :min="0" :max="1" step="0.1" label="Score 阈值"/>
|
||||
</el-card>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<!-- Right Section: 分段预览 -->
|
||||
<el-col :span="9">
|
||||
<el-card shadow="never">
|
||||
<div class="previews-title">分段预览</div>
|
||||
<template v-for="(segment, index) in segmentPreviews" :key="index">
|
||||
<div class="segment-preview">
|
||||
<div class="title">
|
||||
<div class="left">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M4.74999 1.5L3.24999 10.5M8.74998 1.5L7.24998 10.5M10.25 4H1.75M9.75 8H1.25"
|
||||
stroke="#98A2B3" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
<span class="id">{{ segment.number }}</span>
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<svg width="12" height="12" viewBox="0 0 12 12" fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M4 3.5H8M6 3.5V8.5M3.9 10.5H8.1C8.94008 10.5 9.36012 10.5 9.68099 10.3365C9.96323 10.1927 10.1927 9.96323 10.3365 9.68099C10.5 9.36012 10.5 8.94008 10.5 8.1V3.9C10.5 3.05992 10.5 2.63988 10.3365 2.31901C10.1927 2.03677 9.96323 1.8073 9.68099 1.66349C9.36012 1.5 8.94008 1.5 8.1 1.5H3.9C3.05992 1.5 2.63988 1.5 2.31901 1.66349C2.03677 1.8073 1.8073 2.03677 1.66349 2.31901C1.5 2.63988 1.5 3.05992 1.5 3.9V8.1C1.5 8.94008 1.5 9.36012 1.66349 9.68099C1.8073 9.96323 2.03677 10.1927 2.31901 10.3365C2.63988 10.5 3.05992 10.5 3.9 10.5Z"
|
||||
stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
<span class="char-size">7777 字符</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="content">{{ segment.text }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ref} from 'vue';
|
||||
|
||||
// Reactive variables for form control
|
||||
const segmentSetting = ref('自动分段与清洗');
|
||||
const indexingMethod = ref('高质量');
|
||||
const embeddingModel = ref('text-embedding-3-large');
|
||||
const directionalSearch = ref(true);
|
||||
const topK = ref(3);
|
||||
const scoreThreshold = ref(0.5);
|
||||
|
||||
// Mock data for segment previews
|
||||
const segmentPreviews = ref([
|
||||
{number: '001', text: "同步obs模型...'UAE-large-V1'"},
|
||||
{number: '002', text: "同步obs模型...'plip'"},
|
||||
{number: '003', text: "同步obs模型...'phoBERT-base-v2'"},
|
||||
{number: '004', text: "同步obs模型...'lama3-bb-bnb-4bit'"},
|
||||
{number: '005', text: "同步obs模型...'t5-base-split-and-rephrase'"}
|
||||
]);
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
/* Add any custom styles here */
|
||||
|
||||
.previews-title {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.segment-preview {
|
||||
background-color: rgba(228, 228, 228, 0.38);
|
||||
border-radius: 10px;
|
||||
padding: 15px;
|
||||
margin-top: 15px;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.left {
|
||||
border-right: 5px;
|
||||
font-size: 13px;
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
color: #676767;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
|
||||
.id {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
||||
.char-size {
|
||||
margin-left: 5px;
|
||||
font-size: 13px;
|
||||
color: rgba(57, 57, 57, 0.66);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 10px;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,152 +0,0 @@
|
||||
<template>
|
||||
<div class="knowledge-base-container">
|
||||
<div class="card-container">
|
||||
<el-card class="create-card" shadow="hover">
|
||||
<div class="create-content">
|
||||
<el-icon class="create-icon"><Plus /></el-icon>
|
||||
<span class="create-text">创建知识库</span>
|
||||
</div>
|
||||
<div class="create-footer">
|
||||
导入您自己的文本数据或通过 Webhook 实时写入数据以增强 LLM 的上下文。
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
<el-card class="document-card" shadow="hover" v-for="index in 4" :key="index">
|
||||
<div class="document-header">
|
||||
<el-icon><Folder /></el-icon>
|
||||
<span>接口鉴权示例代码.md</span>
|
||||
</div>
|
||||
<div class="document-info">
|
||||
<el-tag size="small">1 文档</el-tag>
|
||||
<el-tag size="small" type="info">5 千字符</el-tag>
|
||||
<el-tag size="small" type="warning">0 关联应用</el-tag>
|
||||
</div>
|
||||
<p class="document-description">
|
||||
useful for when you want to answer queries about the 接口鉴权示例代码.md
|
||||
</p>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
<div class="pagination-container">
|
||||
<el-pagination
|
||||
v-model:current-page="currentPage"
|
||||
v-model:page-size="pageSize"
|
||||
:page-sizes="[10, 20, 30, 40]"
|
||||
:small="false"
|
||||
:disabled="false"
|
||||
:background="true"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { Folder, Plus } from '@element-plus/icons-vue'
|
||||
|
||||
const currentPage = ref(1)
|
||||
const pageSize = ref(10)
|
||||
const total = ref(100) // 假设总共有100条数据
|
||||
|
||||
const handleSizeChange = (val) => {
|
||||
console.log(`每页 ${val} 条`)
|
||||
}
|
||||
|
||||
const handleCurrentChange = (val) => {
|
||||
console.log(`当前页: ${val}`)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.knowledge-base-container {
|
||||
font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
|
||||
position: absolute;
|
||||
padding: 20px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
top: 0;
|
||||
bottom: 40px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap; /* Enable wrapping */
|
||||
gap: 20px;
|
||||
margin-bottom: auto; /* Pushes pagination to the bottom */
|
||||
}
|
||||
|
||||
.create-card, .document-card {
|
||||
flex: 1 1 360px; /* Allow cards to grow and shrink */
|
||||
min-width: 0;
|
||||
max-width: 400px;
|
||||
border-radius: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.create-card {
|
||||
background-color: rgba(168, 168, 168, 0.22);
|
||||
}
|
||||
.create-card:hover {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.create-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.create-icon {
|
||||
font-size: 24px;
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.create-text {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #303133;
|
||||
}
|
||||
|
||||
.create-footer {
|
||||
font-size: 14px;
|
||||
color: #909399;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.document-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.document-info {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.document-description {
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.pagination-container {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user