优化“知识库模块“--基本完善

This commit is contained in:
Cheng Zhou
2025-12-26 14:07:28 +08:00
parent a1a4964cd2
commit 7c9befc3c9
23 changed files with 1345 additions and 110 deletions
+59 -11
View File
@@ -1,12 +1,17 @@
<template>
<el-table :data="items" v-loading="loading" style="width: 100%">
<el-table-column prop="question" label="问题" min-width="200" />
<el-table :data="items" v-loading="loading" style="width: 100%" @row-click="onRowClick">
<el-table-column prop="question" label="问题" min-width="200">
<template #default="scope">
<el-link type="primary" :underline="false" class="question-link">
{{ scope.row.question }}
</el-link>
</template>
</el-table-column>
<el-table-column prop="category_id" label="分类" width="140">
<template #default="scope">
{{ categoryMap[scope.row.category_id] || scope.row.category_id }}
</template>
</el-table-column>
<el-table-column prop="version" label="版本" width="80" />
<el-table-column prop="is_active" label="启用" width="80">
<template #default="scope">
<el-tag :type="scope.row.is_active ? 'success' : 'info'">{{ scope.row.is_active ? "是" : "否" }}</el-tag>
@@ -15,12 +20,16 @@
<el-table-column prop="updated_at" label="更新时间" width="180">
<template #default="scope">{{ displayDateTime(scope.row.updated_at) }}</template>
</el-table-column>
<el-table-column prop="status" label="状态" width="120">
<template #default="scope">
<el-tag :type="statusTagType(scope.row.status)" size="small">{{ statusLabel(scope.row.status) }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="scope">
<el-button type="text" size="small" @click="view(scope.row)">查看</el-button>
<PermissionAction v-if="canEdit" action="faq.edit">
<el-button type="text" size="small" @click="edit(scope.row)">编辑</el-button>
</PermissionAction>
<el-button v-if="canDelete(scope.row)" type="text" size="small" class="danger" @click="remove(scope.row)">
删除
</el-button>
<PermissionAction v-if="canEdit" action="faq.edit">
<el-button
type="text"
@@ -40,10 +49,11 @@
import { ElMessage, ElMessageBox } from "element-plus";
import { computed } from "vue";
import { useRouter } from "vue-router";
import { updateFaqItem } from "../api/faqs";
import { deleteFaqItem, updateFaqItem } from "../api/faqs";
import type { FaqItem, FaqCategory } from "../api/faqs";
import PermissionAction from "./PermissionAction.vue";
import { displayDateTime } from "../utils/display";
import { useAuthStore } from "../store/auth";
const props = defineProps<{
items: FaqItem[];
@@ -51,9 +61,10 @@ const props = defineProps<{
loading: boolean;
canEdit: boolean;
}>();
const emit = defineEmits(["refresh", "edit"]);
const emit = defineEmits(["refresh"]);
const router = useRouter();
const auth = useAuthStore();
const categoryMap = computed(() =>
props.categories.reduce<Record<string, string>>((acc, cur) => {
@@ -66,10 +77,26 @@ const view = (row: FaqItem) => {
router.push(`/study/faq/${row.id}`);
};
const edit = (row: FaqItem) => {
emit("edit", row);
const onRowClick = (row: FaqItem, column: any, event: MouseEvent) => {
if (column?.property !== "question") return;
view(row);
};
const statusLabel = (status?: string) => {
if (status === "RESOLVED") return "已解决";
if (status === "PROCESSING") return "处理中";
return "待回答";
};
const statusTagType = (status?: string) => {
if (status === "RESOLVED") return "success";
if (status === "PROCESSING") return "warning";
return "info";
};
const canDelete = (row: FaqItem) => props.canEdit || row.created_by === auth.user?.id;
const toggle = async (row: FaqItem) => {
const target = !row.is_active;
const ok = await ElMessageBox.confirm(`确认${target ? "启用" : "停用"}此 FAQ?`, "提示").catch(() => null);
@@ -82,4 +109,25 @@ const toggle = async (row: FaqItem) => {
ElMessage.error(e?.response?.data?.message || "操作失败");
}
};
const remove = async (row: FaqItem) => {
const ok = await ElMessageBox.confirm(`确认删除 FAQ「${row.question}」?`, "提示").catch(() => null);
if (!ok) return;
try {
await deleteFaqItem(row.id);
ElMessage.success("问题已删除");
emit("refresh");
} catch (e: any) {
ElMessage.error(e?.response?.data?.message || "删除失败");
}
};
</script>
<style scoped>
.danger {
color: #f56c6c;
}
.question-link {
cursor: pointer;
}
</style>