mirror of
http://112.124.100.131/ebiz-ai/ebiz-ai-knowledge-manage.git
synced 2025-12-11 20:06:52 +08:00
feat:知识库新增
This commit is contained in:
du.meimei
142
src/views/knowledge/detail/components/CustomSplitDialog.vue
Normal file
142
src/views/knowledge/detail/components/CustomSplitDialog.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<el-dialog title="自定义拆分" :visible.sync="visible" width="80%">
|
||||
<el-form :model="form" label-width="100px">
|
||||
<!-- 表单内容 -->
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="知识名称">
|
||||
<el-input v-model="form.field1" size="medium" placeholder="知识名称"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-button type="primary" size="medium" @click="addRule" class="ml20">+ 新增规则</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 其他表单项 -->
|
||||
</el-form>
|
||||
<r-table :columns="columns" :data="list" :deletion="false"></r-table>
|
||||
<!-- <el-table :data="tableData" style="width: 100%">-->
|
||||
<!-- <el-table-column label="操作">-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- <el-button size="mini" @click="handlePreview(scope.row)">预览</el-button>-->
|
||||
<!-- <el-button size="mini" @click="handleEdit(scope.row)">修改</el-button>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
<!-- </el-table>-->
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button type="primary" @click="closeDialog">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'CustomSplitDialog',
|
||||
props: {
|
||||
visible: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
form: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
tableData: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [{}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handlePreview(row) {
|
||||
// 预览逻辑
|
||||
console.log('Preview', row)
|
||||
},
|
||||
handleEdit(row) {
|
||||
// 修改逻辑
|
||||
console.log('Edit', row)
|
||||
},
|
||||
closeDialog() {
|
||||
this.$emit('update:visible', false)
|
||||
},
|
||||
addRule(){
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
columns() {
|
||||
return [
|
||||
{
|
||||
type: 'selection',
|
||||
prop: 'knowledgeName',
|
||||
width: '200px',
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', [h('span', params.row.knowledgeName)])
|
||||
}
|
||||
},
|
||||
{
|
||||
key: '知识拆分规则名称',
|
||||
prop: 'knowledgeName',
|
||||
width: '200px',
|
||||
align: 'center',
|
||||
render: (h, params) => {
|
||||
return h('div', [h('span', params.row.knowledgeName)])
|
||||
}
|
||||
},
|
||||
{
|
||||
key: '规则内容',
|
||||
prop: 'knowledgeName',
|
||||
width: '200px',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
key: '备注',
|
||||
prop: 'knowledgeDesc'
|
||||
},
|
||||
{
|
||||
key: '操作',
|
||||
prop: 'knowledgeDesc',
|
||||
width: '200px',
|
||||
render: (h, params) => {
|
||||
return h('span', {}, [
|
||||
h(
|
||||
'el-button',
|
||||
{
|
||||
class: 'floatSpan',
|
||||
props: {
|
||||
type: 'primary',
|
||||
size: 'medium'
|
||||
}
|
||||
},
|
||||
'修改'
|
||||
),
|
||||
h(
|
||||
'el-button',
|
||||
{
|
||||
class: 'floatSpan',
|
||||
props: {
|
||||
type: 'primary',
|
||||
size: 'medium'
|
||||
}
|
||||
},
|
||||
'预览'
|
||||
)
|
||||
])
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
// 样式可以根据需要调整
|
||||
</style>
|
||||
94
src/views/knowledge/detail/components/SplitConfig.vue
Normal file
94
src/views/knowledge/detail/components/SplitConfig.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div class="splitConfig mt20">
|
||||
文件拆分规则
|
||||
<ul>
|
||||
<!-- 自动拆分 -->
|
||||
<li class="flex">
|
||||
<div>
|
||||
<i class="el-icon-setting" size="50"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>自动拆分</h3>
|
||||
使用系统默认的拆分方式，适合新手或紧急任务，直接使用系统优化后的算法处理文本。<br>
|
||||
提示：首次使用时建议先用自动拆分测试效果，再决定是否调整。
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- 自定义拆分 -->
|
||||
<li class="flex" @click="designSplit">
|
||||
<div>
|
||||
<i class="el-icon-medal" size="50"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>自定义拆分</h3>
|
||||
使用自定义拆分方式可以根据具体需求灵活调整文本分割逻辑，但需要权衡灵活性与复杂度，需要用户具备一定的规则定制经验。
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- 弹窗组件 -->
|
||||
<custom-split-dialog :visible.sync="dialogVisible" :form="form" :table-data="tableData"></custom-split-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CustomSplitDialog from './CustomSplitDialog.vue';
|
||||
|
||||
export default {
|
||||
name: 'splitConfig',
|
||||
components: {
|
||||
CustomSplitDialog
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
form: {
|
||||
// 表单数据
|
||||
},
|
||||
tableData: [
|
||||
// 表格数据示例
|
||||
{ id: 1, name: 'Item 1', selected: false },
|
||||
{ id: 2, name: 'Item 2', selected: false },
|
||||
{ id: 3, name: 'Item 3', selected: false }
|
||||
]
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
watch: {},
|
||||
filters: {},
|
||||
methods: {
|
||||
designSplit() {
|
||||
this.dialogVisible = true;
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
computed: {}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang='scss'>
|
||||
.splitConfig {
|
||||
ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #d9d9d9;
|
||||
padding: 15px;
|
||||
border-radius: 6px;
|
||||
list-style-type: none;
|
||||
|
||||
h3 {
|
||||
margin-bottom: 15px;
|
||||
font-size: 18px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 10px 0;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -26,7 +26,7 @@
|
||||
|
||||
<el-col :span='24' class='text-center'>
|
||||
<el-button type='primary' size='medium' @click='save'>创建</el-button>
|
||||
<el-button size='medium'>取消 </el-button>
|
||||
<el-button size='medium' @click='$router.go(-1)'>取消 </el-button>
|
||||
</el-col>
|
||||
|
||||
|
||||
@@ -67,7 +67,6 @@ export default {
|
||||
filters: {},
|
||||
methods: {
|
||||
save(){
|
||||
|
||||
// 配置进度条参数
|
||||
// NProgress.configure({
|
||||
// showSpinner: false, // 隐藏转圈圈
|
||||
@@ -78,16 +77,17 @@ export default {
|
||||
// NProgress.done();
|
||||
// },5000)
|
||||
|
||||
let loadingDom = document.getElementById('knowledgeFormDrawer').querySelector('.el-drawer')
|
||||
// let loadingDom = document.getElementById('knowledgeFormDrawer').querySelector('.el-drawer')
|
||||
|
||||
// console.log(loadingDom)
|
||||
// let loading = renderLoading.service({
|
||||
// target:loadingDom,
|
||||
// })
|
||||
|
||||
console.log(loadingDom)
|
||||
let loading = renderLoading.service({
|
||||
target:loadingDom,
|
||||
})
|
||||
|
||||
loading.close()
|
||||
// loading.close()
|
||||
|
||||
// 添加保存成功的提示
|
||||
this.$message.success('保存成功');
|
||||
},
|
||||
},
|
||||
created() {
|
||||
|
||||
@@ -13,7 +13,9 @@
|
||||
</el-form-item>
|
||||
<!-- 文件上传-->
|
||||
<el-form-item label='' required prop='file'>
|
||||
<el-upload drag :action='actionUrl' :headers='headers' class='upload-demo'>
|
||||
<el-upload drag :action='actionUrl' :headers='headers'
|
||||
class='upload-demo' :on-success="handleUploadSuccess"
|
||||
:before-upload="handleBeforeUpload">
|
||||
<el-empty>
|
||||
<template #description>
|
||||
<p>点击或将文件拖拽到这里上传</p>
|
||||
@@ -40,6 +42,32 @@
|
||||
</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>
|
||||
</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>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@@ -54,7 +82,8 @@ export default {
|
||||
fileList:[],
|
||||
preprocessing:'1',
|
||||
ocr:'1',
|
||||
}
|
||||
},
|
||||
previewDialogVisible: false // 添加对话框显示控制变量
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
@@ -84,7 +113,26 @@ export default {
|
||||
emitForm() {
|
||||
this.$emit('getForm', this.$refs.processForm,this.form)
|
||||
},
|
||||
handleUploadSuccess(response, file, fileList) {
|
||||
// 显示预处理结果预览对话框
|
||||
this.previewDialogVisible = true;
|
||||
},
|
||||
handleClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
})
|
||||
.catch(_ => {});
|
||||
},
|
||||
handleBeforeUpload(file) {
|
||||
// 这里可以添加文件上传前的处理逻辑
|
||||
console.log('开始上传文件:', file);
|
||||
this.previewDialogVisible = true;
|
||||
// 可以在这里进行文件类型、大小等验证
|
||||
|
||||
// 返回 true 继续上传，返回 false 停止上传
|
||||
return true;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
@@ -121,4 +169,37 @@ export default {
|
||||
}
|
||||
#preprocessing-container {
|
||||
}
|
||||
|
||||
.preview-container {
|
||||
display: flex;
|
||||
height: 500px;
|
||||
border: 1px solid #dcdfe6;
|
||||
|
||||
.preview-left, .preview-right {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-right: 1px solid #dcdfe6;
|
||||
|
||||
&:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
}
|
||||
|
||||
.preview-title {
|
||||
padding: 10px;
|
||||
background-color: #f5f7fa;
|
||||
border-bottom: 1px solid #dcdfe6;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.preview-content {
|
||||
flex: 1;
|
||||
padding: 15px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
.dialog-footer{
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
89
src/views/knowledge/detail/components/split/AddRule.vue
Normal file
89
src/views/knowledge/detail/components/split/AddRule.vue
Normal file
@@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 添加预处理结果预览对话框 -->
|
||||
<el-dialog
|
||||
title="添加知识拆分规则"
|
||||
:visible.sync="dialogVisible"
|
||||
width="80%"
|
||||
:before-close="handleClose">
|
||||
<el-form ref="ruleForm" :model="form" :rules="rules" label-width="100px">
|
||||
<el-form-item label="规则名称：" prop="ruleName">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入规则名称"></el-input>
|
||||
<el-button type="primary" size="mini" @click="queryExistingRules">查询并导入现有规则</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item label="样式：" prop="style">
|
||||
<el-input v-model="form.ruleName" placeholder="请输入标题级别"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="提示词：" prop="promptWord">
|
||||
<el-input type="textarea" v-model="form.promptWord" placeholder="请输入规则表达式"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注：" prop="remark">
|
||||
<el-input type="textarea" v-model="form.remark" placeholder="请输入规则备注"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="addSplitRule">+ 新增拆分规则</el-button>
|
||||
<el-button @click="deleteSplitRule">- 删除拆分规则</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AddRule',
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
form: {
|
||||
ruleName: '',
|
||||
style: '',
|
||||
promptWord: '',
|
||||
remark: ''
|
||||
},
|
||||
rules: {
|
||||
ruleName: [
|
||||
{ required: true, message: '请输入规则名称', trigger: 'blur' }
|
||||
],
|
||||
style: [
|
||||
{ required: true, message: '请选择样式', trigger: 'change' }
|
||||
],
|
||||
promptWord: [
|
||||
{ required: true, message: '请输入提示词', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
queryExistingRules() {
|
||||
// 查询并导入现有规则的逻辑
|
||||
},
|
||||
addSplitRule() {
|
||||
this.$refs.ruleForm.validate((valid) => {
|
||||
if (valid) {
|
||||
// 新增拆分规则的逻辑
|
||||
} else {
|
||||
console.log('表单验证失败');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
deleteSplitRule() {
|
||||
// 删除拆分规则的逻辑
|
||||
console.log('删除拆分规则');
|
||||
},
|
||||
handleClose(done) {
|
||||
this.$confirm('确认关闭？')
|
||||
.then(_ => {
|
||||
done();
|
||||
})
|
||||
.catch(_ => {});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang='scss'>
|
||||
|
||||
</style>
|
||||
@@ -14,6 +14,7 @@
|
||||
|
||||
<div class='components'>
|
||||
<step-preprocessing v-if='active===0' @getForm='getForm'></step-preprocessing>
|
||||
<split-config v-if='active===1'></split-config>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -30,6 +31,8 @@
|
||||
</template>
|
||||
<script>
|
||||
import StepPreprocessing from './components/preprocessing.vue'
|
||||
import SplitConfig from "@/views/knowledge/detail/components/SplitConfig.vue";
|
||||
// import StepC
|
||||
export default {
|
||||
name: 'create',
|
||||
data() {
|
||||
@@ -40,6 +43,7 @@ export default {
|
||||
props: {},
|
||||
watch: {},
|
||||
components: {
|
||||
SplitConfig,
|
||||
StepPreprocessing
|
||||
},
|
||||
filters: {},
|
||||
|
||||
Reference in New Issue
Block a user