<template>
|
<div class="flex flex-col h100">
|
<div class="mb-[10px] flex flex-shrink-0 items-center">
|
<el-button style="margin-left: 8px; width: 40px" text @click="handleExitFlow">
|
<el-icon style="font-size: 24px !important">
|
<ArrowLeft />
|
</el-icon>
|
</el-button>
|
<span class="text-[24px] text-[#26244c] font-[700]">{{ state.knowledgeInfo.knowledge_title }}</span>
|
</div>
|
<div class="set-table-height">
|
<!-- 查询、重置、排序、增加表单 -->
|
<el-form :inline="true" :model="graphQueryParams">
|
<el-form-item label="名称" prop="title">
|
<el-input v-model="graphQueryParams.title" style="width: 226.4px" placeholder="文件名称" clearable></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="ele-Search" @click="handleQueryTable"> 查询 </el-button>
|
<el-button icon="ele-Refresh" @click="resetQuery">重置 </el-button>
|
<el-button icon="ele-Plus" @click="importData()" type="primary"> 导入数据 </el-button>
|
</el-form-item>
|
</el-form>
|
<div class="flex-auto flex-column h-full">
|
<el-table
|
ref="viewKnowledgeTableRef"
|
border
|
row-key="id"
|
class="flex-auto"
|
:header-cell-style="{ textAlign: 'center' }"
|
:data="displayTableData"
|
highlight-current-row
|
>
|
<el-table-column prop="name" label="文件名称" fixed="left" show-overflow-tooltip align="left" />
|
<el-table-column prop="type" width="120" label="文件类型" show-overflow-tooltip align="center" />
|
<el-table-column prop="time" label="上传时间" show-overflow-tooltip width="280" align="center"></el-table-column>
|
<el-table-column label="操作" width="80" fixed="right" show-overflow-tooltip align="center">
|
<template #default="scope">
|
<el-tooltip effect="dark" content="删除" placement="top">
|
<i
|
class="ywifont ywicon-shanchu !text-[17px] text-red-400 cursor-pointer"
|
@click="deleteKnowledgeFileData(scope.row)"
|
></i>
|
</el-tooltip>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ElMessage, ElMessageBox } from 'element-plus';
|
import { onMounted, reactive, ref } from 'vue';
|
import { useRoute, useRouter } from 'vue-router';
|
import { delete_docvector_file, get_docvector_file_list } from '/@/api/knowledge/docvector';
|
import { useQueryTable } from '/@/hooks/useQueryTable';
|
const viewKnowledgeTableRef = ref();
|
const router = useRouter();
|
const route = useRoute();
|
const knowledgeTableData = ref([]);
|
// 定义变量内容
|
const state = reactive({
|
knowledgeInfo: {
|
knowledge_title: '',
|
knowledge_id: '',
|
} as any,
|
showKnowledgeForm: false,
|
});
|
//返回
|
const handleExitFlow = () => {
|
//是否显示返回
|
router.back();
|
state.showKnowledgeForm = false;
|
};
|
//#region ====================== 搜索表格，对表格排序 ======================
|
const graphQueryParams = ref({
|
title: '',
|
});
|
const { resetQuery, handleQueryTable, displayTableData } = useQueryTable(knowledgeTableData, graphQueryParams, () => {
|
displayTableData.value = knowledgeTableData.value;
|
});
|
//#endregion
|
//#region ====================== 对知识库进行操作 ======================
|
const getKnowledgeFileData = async () => {
|
const res = await get_docvector_file_list({
|
knowlg_id: state.knowledgeInfo.knowledge_id,
|
});
|
if (res.json_ok) {
|
knowledgeTableData.value = res.values;
|
}
|
};
|
//删除知识库的文件列表
|
const deleteKnowledgeFileData = (row: any) => {
|
ElMessageBox.confirm(`确定删除文档列表：【${row.name}】?`, '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning',
|
}).then(async () => {
|
const res = await delete_docvector_file({
|
knowlg_id: state.knowledgeInfo.knowledge_id,
|
file_id: row.id,
|
});
|
|
if (res.json_ok) {
|
ElMessage.success('删除文档列表成功');
|
const index = knowledgeTableData.value.findIndex((d) => d.id === row.id);
|
knowledgeTableData.value.splice(index, 1);
|
} else {
|
ElMessage.error('删除文档列表失败' + (res?.json_msg ? `，${JSON.stringify(res.json_msg)}` : ''));
|
}
|
});
|
};
|
//#endregion
|
//#region ====================== 新建知识库的数据 ======================
|
//导入数据
|
const importData = () => {
|
// router.push({
|
// name: 'AddKnowledge',
|
// });
|
};
|
//#endregion
|
onMounted(() => {
|
const { knowledge_id, knowledge_title } = route.query;
|
state.knowledgeInfo.knowledge_title = knowledge_title;
|
state.knowledgeInfo.knowledge_id = knowledge_id;
|
getKnowledgeFileData();
|
});
|
</script>
|
<style scoped lang="scss">
|
.set-table-height {
|
background: #fff;
|
border-radius: 16px;
|
height: calc(100% - 80px);
|
margin-top: 12px;
|
overflow-y: auto;
|
padding: 20px 24px;
|
box-sizing: border-box;
|
}
|
</style>
|
