| | |
| | | /> |
| | | <span class="search_title ml10">知识类型:</span> |
| | | <el-select v-model="searchForm.type" clearable @change="handleQuery" style="width: 240px"> |
| | | <el-option label="合同特批" :value="'contract'" /> |
| | | <el-option label="审批案例" :value="'approval'" /> |
| | | <el-option label="解决方案" :value="'solution'" /> |
| | | <el-option label="经验总结" :value="'experience'" /> |
| | | <el-option label="操作指南" :value="'guide'" /> |
| | | <el-option |
| | | v-for="item in knowledgeTypeOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | <el-button type="primary" @click="handleQuery" style="margin-left: 10px"> |
| | | 搜索 |
| | | </el-button> |
| | | </div> |
| | | <div> |
| | | <el-button @click="handleExport" style="margin-right: 10px">导出</el-button> |
| | | <el-button type="primary" @click="openForm('add')">新增知识</el-button> |
| | | <el-button type="danger" plain @click="handleDelete">删除</el-button> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | <div class="table_list"> |
| | | <PIMTable |
| | | rowKey="id" |
| | |
| | | <el-col :span="12"> |
| | | <el-form-item label="知识类型" prop="type"> |
| | | <el-select v-model="form.type" placeholder="请选择知识类型" style="width: 100%"> |
| | | <el-option label="合同特批" value="contract" /> |
| | | <el-option label="审批案例" value="approval" /> |
| | | <el-option label="解决方案" value="solution" /> |
| | | <el-option label="经验总结" value="experience" /> |
| | | <el-option label="操作指南" value="guide" /> |
| | | <el-option |
| | | v-for="item in knowledgeTypeOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <span class="dialog-footer"> |
| | | <el-button @click="viewDialogVisible = false">关闭</el-button> |
| | | <el-button type="primary" @click="copyKnowledge">复制知识</el-button> |
| | | <el-button type="success" @click="markAsFavorite">收藏</el-button> |
| | | <!-- <el-button type="success" @click="markAsFavorite">收藏@</el-button> --> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | |
| | | <script setup> |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { onMounted, ref, reactive, toRefs } from "vue"; |
| | | import { onMounted, ref, reactive, toRefs, getCurrentInstance, computed } from "vue"; |
| | | import { ElMessage, ElMessageBox } from "element-plus"; |
| | | import PIMTable from "@/components/PIMTable/PIMTable.vue"; |
| | | import { listKnowledgeBase, delKnowledgeBaseBatch,addKnowledgeBase,updateKnowledgeBase } from "@/api/collaborativeApproval/knowledgeBase.js"; |
| | | import { listKnowledgeBase, delKnowledgeBase,addKnowledgeBase,updateKnowledgeBase } from "@/api/collaborativeApproval/knowledgeBase.js"; |
| | | |
| | | // 表单验证规则 |
| | | const rules = { |
| | |
| | | currentKnowledge: {} |
| | | }); |
| | | |
| | | const { |
| | | searchForm, |
| | | tableLoading, |
| | | page, |
| | | tableData, |
| | | const { |
| | | searchForm, |
| | | tableLoading, |
| | | page, |
| | | tableData, |
| | | selectedIds, |
| | | form, |
| | | dialogVisible, |
| | |
| | | prop: "type", |
| | | dataType: "tag", |
| | | formatData: (params) => { |
| | | const typeMap = { |
| | | contract: "合同特批", |
| | | approval: "审批案例", |
| | | solution: "解决方案", |
| | | experience: "经验总结", |
| | | guide: "操作指南" |
| | | }; |
| | | return typeMap[params] || params; |
| | | return getKnowledgeTypeLabel(params); |
| | | }, |
| | | formatType: (params) => { |
| | | const typeMap = { |
| | | contract: "success", |
| | | approval: "warning", |
| | | solution: "primary", |
| | | experience: "info", |
| | | guide: "danger" |
| | | }; |
| | | return typeMap[params] || "info"; |
| | | return getKnowledgeTypeTagType(params); |
| | | } |
| | | }, |
| | | { |
| | |
| | | } |
| | | ]); |
| | | |
| | | // 模拟数据 |
| | | // let mockData = [ |
| | | // { |
| | | // id: "1", |
| | | // title: "特殊合同审批流程优化方案", |
| | | // type: "contract", |
| | | // scenario: "大额合同快速审批", |
| | | // efficiency: "high", |
| | | // problem: "大额合同审批流程复杂,审批时间长,影响业务进展", |
| | | // solution: "建立绿色通道,对符合条件的合同采用简化审批流程,由部门负责人直接审批,平均审批时间从3天缩短至1天", |
| | | // keyPoints: "绿色通道条件,简化流程,审批权限,时间控制", |
| | | // creator: "张经理", |
| | | // usageCount: 15, |
| | | // createTime: "2024-01-15 10:30:00" |
| | | // }, |
| | | // { |
| | | // id: "2", |
| | | // title: "跨部门协作审批经验总结", |
| | | // type: "experience", |
| | | // scenario: "多部门协作项目", |
| | | // efficiency: "medium", |
| | | // problem: "跨部门项目审批时,各部门意见不统一,审批进度缓慢", |
| | | // solution: "建立项目协调机制,指定项目负责人,定期召开协调会议,统一各方意见后再进行审批", |
| | | // keyPoints: "项目协调,定期会议,统一意见,负责人制度", |
| | | // creator: "李主管", |
| | | // usageCount: 8, |
| | | // createTime: "2024-01-14 15:20:00" |
| | | // }, |
| | | // { |
| | | // id: "3", |
| | | // title: "紧急采购审批操作指南", |
| | | // type: "guide", |
| | | // scenario: "紧急采购需求", |
| | | // efficiency: "high", |
| | | // problem: "紧急采购时审批流程复杂,无法满足紧急需求", |
| | | // solution: "制定紧急采购审批标准,明确紧急程度分级,不同级别采用不同审批流程,确保紧急需求得到及时处理", |
| | | // keyPoints: "紧急分级,标准制定,流程简化,及时处理", |
| | | // creator: "王专员", |
| | | // usageCount: 12, |
| | | // createTime: "2024-01-13 09:15:00" |
| | | // } |
| | | // ]; |
| | | |
| | | // 知识标题模板 |
| | | const titleTemplates = [ |
| | | "{type}审批流程优化方案", |
| | | "{scenario}处理经验总结", |
| | | "{type}特殊情况处理指南", |
| | | "{scenario}快速审批方案", |
| | | "{type}标准化操作流程", |
| | | "{scenario}问题解决方案", |
| | | "{type}最佳实践总结", |
| | | "{scenario}效率提升方案" |
| | | ]; |
| | | |
| | | // 知识类型配置 |
| | | const knowledgeTypes = [ |
| | | { type: "contract", label: "合同特批", efficiency: "high" }, |
| | | { type: "approval", label: "审批案例", efficiency: "medium" }, |
| | | { type: "solution", label: "解决方案", efficiency: "high" }, |
| | | { type: "experience", label: "经验总结", efficiency: "medium" }, |
| | | { type: "guide", label: "操作指南", efficiency: "low" } |
| | | ]; |
| | | |
| | | // 场景列表 |
| | | const scenarios = ["大额合同审批", "跨部门协作", "紧急采购", "特殊申请", "流程优化", "问题处理", "标准化建设", "效率提升"]; |
| | | |
| | | // 自动生成新数据 |
| | | const generateNewData = () => { |
| | | const newId = (mockData.length + 1).toString(); |
| | | const now = new Date(); |
| | | const randomType = knowledgeTypes[Math.floor(Math.random() * knowledgeTypes.length)]; |
| | | const randomScenario = scenarios[Math.floor(Math.random() * scenarios.length)]; |
| | | |
| | | // 生成随机标题 |
| | | let title = titleTemplates[Math.floor(Math.random() * titleTemplates.length)]; |
| | | title = title |
| | | .replace('{type}', randomType.label) |
| | | .replace('{scenario}', randomScenario); |
| | | |
| | | const newKnowledge = { |
| | | id: newId, |
| | | title: title, |
| | | type: randomType.type, |
| | | scenario: randomScenario, |
| | | efficiency: randomType.efficiency, |
| | | problem: `在${randomScenario}过程中遇到的问题描述...`, |
| | | solution: `针对${randomScenario}的解决方案和操作步骤...`, |
| | | keyPoints: "关键要点1,关键要点2,关键要点3,关键要点4", |
| | | creator: ["张经理", "李主管", "王专员", "刘总监"][Math.floor(Math.random() * 4)], |
| | | usageCount: Math.floor(Math.random() * 20) + 1, |
| | | createTime: now.toLocaleString() |
| | | }; |
| | | |
| | | // 添加到数据开头 |
| | | mockData.unshift(newKnowledge); |
| | | |
| | | // 保持数据量在合理范围内(最多保留30条) |
| | | if (mockData.length > 30) { |
| | | mockData = mockData.slice(0, 30); |
| | | } |
| | | |
| | | console.log(`[${new Date().toLocaleString()}] 自动生成新知识: ${title}`); |
| | | }; |
| | | |
| | | // 生命周期 |
| | | onMounted(() => { |
| | | getList(); |
| | |
| | | // 开始自动刷新 |
| | | const startAutoRefresh = () => { |
| | | setInterval(() => { |
| | | generateNewData(); |
| | | getList(); |
| | | }, 600000); // 10分钟刷新一次 (10 * 60 * 1000 = 600000ms) |
| | | }; |
| | |
| | | |
| | | // 获取类型标签文本 |
| | | const getTypeLabel = (type) => { |
| | | const typeMap = { |
| | | contract: "合同特批", |
| | | approval: "审批案例", |
| | | solution: "解决方案", |
| | | experience: "经验总结", |
| | | guide: "操作指南" |
| | | }; |
| | | return typeMap[type] || type; |
| | | return getKnowledgeTypeLabel(type); |
| | | }; |
| | | |
| | | // 获取效率标签类型 |
| | |
| | | // 复制知识 |
| | | const copyKnowledge = () => { |
| | | const knowledgeText = ` |
| | | 知识标题:${currentKnowledge.value.title} |
| | | 知识类型:${getTypeLabel(currentKnowledge.value.type)} |
| | | 适用场景:${currentKnowledge.value.scenario} |
| | | 问题描述:${currentKnowledge.value.problem} |
| | | 解决方案:${currentKnowledge.value.solution} |
| | | 关键要点:${currentKnowledge.value.keyPoints} |
| | | 创建人:${currentKnowledge.value.creator} |
| | | 知识标题:${currentKnowledge.value.title} |
| | | 知识类型:${getTypeLabel(currentKnowledge.value.type)} |
| | | 适用场景:${currentKnowledge.value.scenario} |
| | | 问题描述:${currentKnowledge.value.problem} |
| | | 解决方案:${currentKnowledge.value.solution} |
| | | 关键要点:${currentKnowledge.value.keyPoints} |
| | | 创建人:${currentKnowledge.value.creator} |
| | | `.trim(); |
| | | |
| | | |
| | | // 复制到剪贴板 |
| | | navigator.clipboard.writeText(knowledgeText).then(() => { |
| | | ElMessage.success("知识内容已复制到剪贴板"); |
| | |
| | | }); |
| | | }; |
| | | |
| | | // 收藏知识 |
| | | const markAsFavorite = () => { |
| | | // 增加使用次数 |
| | | const index = mockData.findIndex(item => item.id === currentKnowledge.value.id); |
| | | if (index !== -1) { |
| | | mockData[index].usageCount += 1; |
| | | currentKnowledge.value.usageCount += 1; |
| | | } |
| | | |
| | | ElMessage.success("已收藏,使用次数+1"); |
| | | }; |
| | | |
| | | // 提交知识表单 |
| | | const submitForm = async () => { |
| | | try { |
| | | await formRef.value.validate(); |
| | | await formRef.value.validate(); |
| | | if (dialogType.value === "add") { |
| | | // 新增知识 |
| | | addKnowledgeBase({...form.value}).then(res => { |
| | |
| | | ElMessage.warning("请选择要删除的知识"); |
| | | return; |
| | | } |
| | | |
| | | |
| | | ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }).then(() => { |
| | | // 从mockData中删除选中的项 |
| | | selectedIds.value.forEach(id => { |
| | | const index = mockData.findIndex(item => item.id === id); |
| | | if (index !== -1) { |
| | | mockData.splice(index, 1); |
| | | // console.log(selectedIds.value); |
| | | delKnowledgeBase(selectedIds.value).then(res => { |
| | | if(res.code == 200){ |
| | | ElMessage.success("删除成功"); |
| | | selectedIds.value = []; |
| | | getList(); |
| | | } |
| | | }); |
| | | |
| | | ElMessage.success("删除成功"); |
| | | selectedIds.value = []; |
| | | getList(); |
| | | }) |
| | | }).catch(() => { |
| | | // 用户取消 |
| | | }); |
| | | }; |
| | | |
| | | // 导出 |
| | | const { proxy } = getCurrentInstance() |
| | | const { knowledge_type } = proxy.useDict("knowledge_type") |
| | | |
| | | // 字典工具 |
| | | const knowledgeTypeOptions = computed(() => knowledge_type?.value || []) |
| | | const getKnowledgeTypeLabel = (val) => { |
| | | const item = knowledgeTypeOptions.value.find(i => String(i.value) === String(val)) |
| | | return item ? item.label : val |
| | | } |
| | | const getKnowledgeTypeTagType = (val) => { |
| | | const item = knowledgeTypeOptions.value.find(i => String(i.value) === String(val)) |
| | | return item?.elTagType || "info" |
| | | } |
| | | const handleExport = () => { |
| | | proxy.download('/knowledgeBase/export', { ...searchForm.value }, '知识库.xlsx') |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |