feat(knowledge): 优化知识库页面结构和样式

-调整了知识库页面的布局结构
- 优化了任务轨迹页面的样式
- 改进了上传任务详情的展示方式
- 统一了代码格式和风格
This commit is contained in:
陈昱达
2025-04-10 16:19:25 +08:00
parent 66fd48b999
commit 318f5ec806
3 changed files with 208 additions and 196 deletions

View File

@@ -1,48 +1,48 @@
import layout from "@/views/app/layout/index.vue"; import layout from '@/views/app/layout/index.vue'
import redirect from "@/views/app/redirect/index.vue"; import redirect from '@/views/app/redirect/index.vue'
export default [ export default [
{ {
path: "/knowledge", path: '/knowledge',
name: "home", name: 'home',
component: layout, component: layout,
redirect: "/knowledge/list", redirect: '/knowledge/list',
meta: { meta: {
title: "AI知识库", title: 'AI知识库',
icon: "el-icon-s-home", icon: 'el-icon-s-home',
affix: true affix: true
}, },
children: [ children: [
{ {
path: "/knowledge/list", path: '/knowledge/list',
name: "home", name: 'home',
component: redirect, component: redirect,
redirect: "/knowledge/list", redirect: '/knowledge/list',
meta: { meta: {
title: "知识库", title: '知识库',
icon: "el-icon-s-home", icon: 'el-icon-s-home',
affix: true affix: true
}, },
children: [ children: [
{ {
path: "/knowledge/list", path: '/knowledge/list',
name: "home", name: 'home',
component: () => import("@/views/knowledge/index.vue"), component: () => import('@/views/knowledge/index.vue'),
meta: { meta: {
breadcrumb: false, breadcrumb: false,
title: "知识库", title: '知识库',
icon: "el-icon-s-home" icon: 'el-icon-s-home'
} }
}, },
{ {
path: "/knowledge/detail", path: '/knowledge/detail',
name: "detail", name: 'detail',
component: redirect, component: redirect,
redirect: "/knowledge/detail", redirect: '/knowledge/detail',
hidden: true, hidden: true,
meta: { meta: {
title: "知识库详情", title: '知识库详情',
icon: "el-icon-s-home" icon: 'el-icon-s-home'
}, },
children: [ children: [
{ {
@@ -52,45 +52,56 @@ export default [
meta: { meta: {
breadcrumb: false, breadcrumb: false,
title: '知识库详情', title: '知识库详情',
icon: 'el-icon-s-home'
}
},
{
path: '/knowledge/detail',
name: 'detail',
component: () => import('@/views/knowledge/detail/index.vue'),
meta: {
breadcrumb: false,
title: '知识库详情',
icon: 'el-icon-s-home'
}
},
{
path: '/knowledge/detail/create',
name: 'create',
component: () => import('@/views/knowledge/detail/create.vue'),
meta: {
title: '知识库新增',
icon: 'el-icon-s-home'
}
}
]
}
]
},
{
path: '/knowledge/track',
name: 'question',
component: redirect,
redirect: '/knowledge/track',
meta: {
title: '任务轨迹',
icon: 'el-icon-s-home', icon: 'el-icon-s-home',
affix: true
}, },
}, children: [
{ {
path: "/knowledge/detail", path: '/knowledge/track',
name: "detail", name: 'track',
component: () => import("@/views/knowledge/detail/index.vue"), component: () => import('@/views/knowledge/track/Index.vue'),
meta: { meta: {
breadcrumb: false, breadcrumb: false,
title: "知识库详情", title: '任务轨迹',
icon: "el-icon-s-home" icon: 'el-icon-s-home'
}
},
{
path: "/knowledge/detail/create",
name: "create",
component: () => import("@/views/knowledge/detail/create.vue"),
meta: {
title: "知识库新增",
icon: "el-icon-s-home"
}
}
]
},
{
path: "/knowledge/track",
name: "track",
component: () => import("@/views/knowledge/track/Index.vue"),
meta: {
breadcrumb: false,
title: "任务轨迹",
icon: "el-icon-s-home"
} }
} }
] ]
} }
] ]
} }
]; ]

View File

@@ -1,6 +1,6 @@
<script> <script>
import { getDocByPage } from "@/api/knowledge/task-page"; import { getDocByPage } from '@/api/knowledge/task-page'
import KnowledgeInfo from "@/views/knowledge/track/views/knowledge-info/Index.vue"; import KnowledgeInfo from '@/views/knowledge/track/views/knowledge-info/Index.vue'
export default { export default {
components: { components: {
@@ -13,13 +13,13 @@ export default {
tabList: [], tabList: [],
currentPage: 1, currentPage: 1,
form: { form: {
knowledge: "", knowledge: '',
knowledgeName: "", knowledgeName: '',
uploadUser: "", uploadUser: '',
taskStatus: "", taskStatus: '',
taskTime: "" taskTime: ''
}
} }
};
}, },
computed: {}, computed: {},
methods: { methods: {
@@ -27,66 +27,68 @@ export default {
const payload = { const payload = {
page: this.currentPage, page: this.currentPage,
pageSize: 10, pageSize: 10,
docId: "" docId: ''
}; }
getDocByPage(payload).then(res => { getDocByPage(payload).then(res => {
this.tabList = res.content.content.list ? res.content.content.list : []; this.tabList = res.content.content.list ? res.content.content.list : []
console.log(res.content.content.list ? res.content.content.list : []); console.log(res.content.content.list ? res.content.content.list : [])
}); })
}, },
handleActiveInfo(scope) { handleActiveInfo(scope) {
this.infoDialogVisible = true; this.infoDialogVisible = true
console.log(scope.row); console.log(scope.row)
this.activeForm = scope.row; this.activeForm = scope.row
} }
}, },
beforeMount() { beforeMount() {
console.log(`onMounted`); console.log(`onMounted`)
this.getTableData(); this.getTableData()
}
} }
};
</script> </script>
<template> <template>
<div> <div class="container">
<el-card> <el-card shadow="hover">
<!-- 知识库信息 --> <!-- 知识库信息 -->
<div> <div>
<el-form> <el-form label-width="120px">
<el-row> <el-row>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="知识库"> <el-form-item label="知识库">
<el-select v-model="form.knowledge"> <el-select v-model="form.knowledge"> </el-select>
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="知识文件名称"> <el-form-item label="知识文件名称">
<el-select v-model="form.knowledgeName"> <el-select v-model="form.knowledgeName"> </el-select>
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="上传用户"> <el-form-item label="上传用户">
<el-select v-model="form.uploadUser"> <el-select v-model="form.uploadUser"> </el-select>
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="任务状态"> <el-form-item label="任务状态">
<el-select v-model="form.taskStatus"> <el-select v-model="form.taskStatus"> </el-select>
</el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="任务时间"> <el-form-item label="任务时间">
<el-date-picker v-model="form.taskTime" type="daterange" unlink-panels <el-date-picker
range-separator="" start-placeholder="开始日期" end-placeholder="结束日期"> v-model="form.taskTime"
type="daterange"
unlink-panels
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-col> </el-col>
@@ -97,18 +99,12 @@ export default {
<!-- 任务列表 --> <!-- 任务列表 -->
<div> <div>
<el-table :data="tabList" style="width: 100%"> <el-table :data="tabList" style="width: 100%">
<el-table-column prop="taskCode" label="任务号" width="180"> <el-table-column prop="taskCode" label="任务号" width="180"> </el-table-column>
</el-table-column> <el-table-column prop="docTypeName" label="知识库" width="180"> </el-table-column>
<el-table-column prop="docTypeName" label="知识库" width="180"> <el-table-column prop="fileName" label="知识文件名称"> </el-table-column>
</el-table-column> <el-table-column prop="processStatus" label="上传状态"> </el-table-column>
<el-table-column prop="fileName" label="知识文件名称"> <el-table-column prop="createdUser" label="上传用户"> </el-table-column>
</el-table-column> <el-table-column prop="uploadDate" label="上传时间"> </el-table-column>
<el-table-column prop="processStatus" label="上传状态">
</el-table-column>
<el-table-column prop="createdUser" label="上传用户">
</el-table-column>
<el-table-column prop="uploadDate" label="上传时间">
</el-table-column>
<el-table-column prop="processStatus" label="操作"> <el-table-column prop="processStatus" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleActiveInfo(scope)">查看详情</el-button> <el-button type="primary" size="mini" @click="handleActiveInfo(scope)">查看详情</el-button>
@@ -116,8 +112,7 @@ export default {
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 弹出提示框 里面是各种详情内容 --> <!-- 弹出提示框 里面是各种详情内容 -->
<el-dialog title="提示" :visible.sync="infoDialogVisible" width="60%" <el-dialog title="上传任务详情" :visible.sync="infoDialogVisible" width="60%" :before-close="() => (infoDialogVisible = false)">
:before-close="() => infoDialogVisible = false">
<knowledge-info :form="activeForm"></knowledge-info> <knowledge-info :form="activeForm"></knowledge-info>
</el-dialog> </el-dialog>
</div> </div>

View File

@@ -2,8 +2,7 @@
export default { export default {
name: 'index', name: 'index',
data() { data() {
return { return {}
}
}, },
props: { props: {
form: { form: {
@@ -27,10 +26,10 @@ export default {
<template> <template>
<div> <div>
<el-card class="box-card"> <!-- <el-card class="box-card" shadow="hover">-->
<div slot="header" class="clearfix"> <!-- <div slot="header" class="clearfix">-->
<span>上传任务详情</span> <!-- <span>上传任务详情</span>-->
</div> <!-- </div>-->
<div class="card-body"> <div class="card-body">
<el-form ref="form" :model="form" label-width="80px"> <el-form ref="form" :model="form" label-width="80px">
<el-row> <el-row>
@@ -84,9 +83,16 @@ export default {
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="3">
<el-button type="primary" size="small" <el-button
@click="() => { form.processStatus = form.processStatus === 1 ? 2 : 1 }">switch type="primary"
status</el-button> size="small"
@click="
() => {
form.processStatus = form.processStatus === 1 ? 2 : 1
}
"
>switch status</el-button
>
</el-col> </el-col>
</el-row> </el-row>
@@ -115,7 +121,7 @@ export default {
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
</el-card> <!-- </el-card>-->
</div> </div>
</template> </template>