mirror of
http://112.124.100.131/ebiz-ai/ebiz-ai-knowledge-manage.git
synced 2025-12-11 20:06:52 +08:00
feat(knowledge): 实现知识库文件上传自定义功能
- 新增 datasetsExPages 和 uploadFileByCustom 接口 - 实现文件上传功能，支持自定义文件和通用知识文件模板 - 添加预处理结果预览功能 - 优化文件上传组件，支持拖拽上传和进度显示
This commit is contained in:
陈昱达
@@ -1,89 +1,71 @@
|
||||
<template>
|
||||
<div id='preprocessing-container ' class='mt20'>
|
||||
<el-form label-width='150px' :model='form' ref='processForm'>
|
||||
<el-form-item label='数据来源：' required prop='radio'>
|
||||
<el-radio-group v-model='form.radio' size='medium'>
|
||||
<el-radio-button label='1' size='medium'>使用本地文件</el-radio-button>
|
||||
<el-radio-button label='2' size='medium'>使用通用知识文件模板</el-radio-button>
|
||||
<div id="preprocessing-container " class="mt20">
|
||||
<el-form label-width="150px" :model="form" ref="processForm">
|
||||
<el-form-item label="数据来源：" required prop="radio">
|
||||
<el-radio-group v-model="form.radio" size="medium">
|
||||
<el-radio-button label="1" size="medium">使用本地文件</el-radio-button>
|
||||
<el-radio-button label="2" size="medium">使用通用知识文件模板</el-radio-button>
|
||||
</el-radio-group>
|
||||
|
||||
<div class='mt10' v-if='form.radio==="2"'>
|
||||
<el-button type='primary' size='medium' class='fs14' >下载知识文件模板</el-button>
|
||||
<div class="mt10" v-if="form.radio === '2'">
|
||||
<el-button type="primary" size="medium" class="fs14">下载知识文件模板</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 文件上传-->
|
||||
<el-form-item label='' required prop='file'>
|
||||
<el-upload drag :action='actionUrl' :headers='headers'
|
||||
class='upload-demo' :on-success="handleUploadSuccess"
|
||||
:before-upload="handleBeforeUpload">
|
||||
<el-empty>
|
||||
<template #description>
|
||||
<p>点击或将文件拖拽到这里上传</p>
|
||||
<p>支持扩展名：.xlsx .doc .docx .pdf .txt...</p>
|
||||
</template>
|
||||
</el-empty>
|
||||
<el-form-item label="" required prop="file">
|
||||
<el-upload drag :action="actionUrl" :headers="headers" class="upload-demo" :on-success="handleUploadSuccess" :show-file-list="false" :data="form">
|
||||
<el-empty>
|
||||
<template #description>
|
||||
<p>点击或将文件拖拽到这里上传</p>
|
||||
<p>支持扩展名：.xlsx .doc .docx .pdf .txt...</p>
|
||||
</template>
|
||||
</el-empty>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 本地文件 -->
|
||||
<div v-if='form.radio==="1"'>
|
||||
<el-form-item label='是否进行预处理：' required prop='preprocessing'>
|
||||
<el-radio-group v-model='form.preprocessing' size='medium'>
|
||||
<el-radio label='1' size='medium'>是</el-radio>
|
||||
<el-radio label='2' size='medium'>否</el-radio>
|
||||
<div v-if="form.radio === '1'">
|
||||
<el-form-item label="是否进行预处理：" required prop="beMinerU">
|
||||
<el-radio-group v-model="form.beMinerU" size="medium">
|
||||
<el-radio :label="true" size="medium">是</el-radio>
|
||||
<el-radio :label="false" size="medium">否</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label='是否ocr协助处理：' required prop='ocr'>
|
||||
<el-radio-group v-model='form.ocr' size='medium'>
|
||||
<el-radio label='1' size='medium'>是</el-radio>
|
||||
<el-radio label='2' size='medium'>否</el-radio>
|
||||
<el-form-item label="是否ocr协助处理：" required prop="beOcr">
|
||||
<el-radio-group v-model="form.beOcr" size="medium">
|
||||
<el-radio :label="true" size="medium">是</el-radio>
|
||||
<el-radio :label="false" size="medium">否</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<!-- 添加预处理结果预览对话框 -->
|
||||
<el-dialog
|
||||
title="预处理结果预览"
|
||||
:visible.sync="previewDialogVisible"
|
||||
width="80%"
|
||||
:before-close="handleClose">
|
||||
<div class="preview-container">
|
||||
<div class="preview-left">
|
||||
<div class="preview-title">原文件</div>
|
||||
<div class="preview-content">
|
||||
<!-- 原文件内容区域 -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="preview-right">
|
||||
<div class="preview-title">Markdown</div>
|
||||
<div class="preview-content">
|
||||
<!-- Markdown内容区域 -->
|
||||
</div>
|
||||
</div>
|
||||
<el-drawer :visible.sync="previewDialogVisible" size="80%" title="预处理结果预览" :before-close="handleClose">
|
||||
<div style="height:calc(100% - 55px);">
|
||||
<r-miner-u :documentId="documentId"></r-miner-u>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button size="medium" type="primary" @click="previewDialogVisible = false">保存并处理</el-button>
|
||||
<el-button size="medium" @click="previewDialogVisible = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { uploadFileByCustom } from '@/api/generatedApi/index'
|
||||
export default {
|
||||
name: 'preprocessing',
|
||||
data() {
|
||||
return {
|
||||
actionUrl:'',
|
||||
headers:{},
|
||||
form:{
|
||||
radio:'1',
|
||||
fileList:[],
|
||||
preprocessing:'1',
|
||||
ocr:'1',
|
||||
actionUrl: uploadFileByCustom(),
|
||||
|
||||
headers: {},
|
||||
form: {
|
||||
radio: '1',
|
||||
beMinerU: false,
|
||||
beOcr: false,
|
||||
datasetId: this.$route.query.datasetId
|
||||
},
|
||||
previewDialogVisible: false // 添加对话框显示控制变量
|
||||
previewDialogVisible: false, // 添加对话框显示控制变量
|
||||
documentId: null
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
@@ -111,60 +93,77 @@ export default {
|
||||
console.log(file)
|
||||
},
|
||||
emitForm() {
|
||||
this.$emit('getForm', this.$refs.processForm,this.form)
|
||||
this.$emit('getForm', this.$refs.processForm, this.form)
|
||||
},
|
||||
handleUploadSuccess(response, file, fileList) {
|
||||
console.log(response)
|
||||
if (response.content.result === '0') {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '上传成功'
|
||||
})
|
||||
// 如果是预处理
|
||||
if (this.form.beMinerU) {
|
||||
this.previewDialogVisible = true
|
||||
}
|
||||
this.documentId = response.content.content.id
|
||||
// 向上导入documentId
|
||||
this.$emit('getDocumentId', this.documentId)
|
||||
this.$emit('getUploadDetail', response.content.content)
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: response.content.resultMessage
|
||||
})
|
||||
}
|
||||
// 显示预处理结果预览对话框
|
||||
this.previewDialogVisible = true;
|
||||
// this.previewDialogVisible = true
|
||||
},
|
||||
handleClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
done()
|
||||
})
|
||||
.catch(_ => {});
|
||||
.catch(_ => {})
|
||||
},
|
||||
handleBeforeUpload(file) {
|
||||
// 这里可以添加文件上传前的处理逻辑
|
||||
console.log('开始上传文件:', file);
|
||||
this.previewDialogVisible = true;
|
||||
console.log('开始上传文件:', file)
|
||||
this.previewDialogVisible = true
|
||||
// 可以在这里进行文件类型、大小等验证
|
||||
|
||||
// 返回 true 继续上传，返回 false 停止上传
|
||||
return true;
|
||||
return true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
computed: {}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.upload-demo{
|
||||
<style scoped lang="scss">
|
||||
.upload-demo {
|
||||
//dashed 间隔大一点
|
||||
border-radius: 6px;
|
||||
border-style: dashed;
|
||||
border-width: 2px;
|
||||
border-color: #d9d9d9;
|
||||
height: 330px;
|
||||
width:50%;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
&:hover{
|
||||
border-color: #409EFF;
|
||||
&:hover {
|
||||
border-color: #409eff;
|
||||
}
|
||||
|
||||
/deep/ .el-upload{
|
||||
width:100%;
|
||||
height: 100%;
|
||||
/deep/ .el-upload {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
& .el-upload-dragger{
|
||||
width:100%;
|
||||
border:unset;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
& .el-upload-dragger {
|
||||
width: 100%;
|
||||
border: unset;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
#preprocessing-container {
|
||||
@@ -175,7 +174,8 @@ export default {
|
||||
height: 500px;
|
||||
border: 1px solid #dcdfe6;
|
||||
|
||||
.preview-left, .preview-right {
|
||||
.preview-left,
|
||||
.preview-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -199,7 +199,7 @@ export default {
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
.dialog-footer{
|
||||
.dialog-footer {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user