diff --git a/src/views/Department-entry/Drawer-Template.vue b/src/views/Department-entry/Drawer-Template.vue index 8e190a0..a136e0b 100644 --- a/src/views/Department-entry/Drawer-Template.vue +++ b/src/views/Department-entry/Drawer-Template.vue @@ -37,6 +37,11 @@ + + + + + 搜索 重置 @@ -46,20 +51,24 @@ - - - - - - + + + + + + + + ([]) // 列表的数据 +const treeTableData = ref([]) // 树形表格数据 const total = ref(0) // 列表的总页数 +const categoryOptions = ref([]) // 模板类别选项 const queryParams = reactive({ pageNo: 1, pageSize: 10, @@ -89,7 +100,8 @@ const queryParams = reactive({ status: undefined, content: undefined, orderNum: undefined, - contentName: undefined + contentName: undefined, + category: undefined }) const queryFormRef = ref() // 搜索的表单 const exportLoading = ref(false) // 导出的加载中 @@ -102,6 +114,8 @@ const getList = async () => { const data = await TemplateApi.getTemplatePage(queryParams) list.value = data.list total.value = data.total + // 转换为树形结构 + treeTableData.value = convertToTreeTableData(data.list) } finally { loading.value = false } @@ -145,23 +159,123 @@ watch(visible, (newVal) => { if (newVal) { Type.value = props.templateType getList() + getCategoryOptions() // 获取所有模板类别 } }) +/** 获取所有模板类别 */ +const getCategoryOptions = async () => { + try { + const categories = await TemplateApi.getAllCategories() + categoryOptions.value = categories.map(category => ({ + label: category, + value: category + })) + } catch (error) { + console.error('获取模板类别失败:', error) + } +} + // 关闭抽屉 const handleClose = (done) => { done() } +/** 转换列表数据为树形表格数据 */ +const convertToTreeTableData = (listData: TemplateVO[]) => { + const typeMap = new Map() + let uniqueId = 1000 // 用于生成唯一ID + + // 第一步:按类型分组 + listData.forEach(item => { + if (!typeMap.has(item.type)) { + typeMap.set(item.type, { + id: uniqueId++, + type: item.type, + category: '', + contentName: '', + content: '', + children: new Map(), + isLeaf: false + }) + } + + const typeNode = typeMap.get(item.type) + const categoryMap = typeNode.children + + // 第二步:按类别分组 + if (!categoryMap.has(item.category)) { + categoryMap.set(item.category, { + id: uniqueId++, + type: '', + category: item.category, + contentName: '', + content: '', + children: [], + isLeaf: false + }) + } + + // 第三步:添加模板数据 + categoryMap.get(item.category).children.push({ + id: item.id, + type: '', + category: '', + contentName: item.contentName, + content: item.content, + isLeaf: true, + // 保存原始数据用于选择模板 + originalData: item + }) + }) + + // 转换为树形结构 + const result: any[] = [] + typeMap.forEach(typeNode => { + const typeItem = { + id: typeNode.id, + type: typeNode.type, + category: typeNode.category, + contentName: typeNode.contentName, + content: typeNode.content, + isLeaf: typeNode.isLeaf, + children: [] as any[] + } + + typeNode.children.forEach(categoryNode => { + const categoryItem = { + id: categoryNode.id, + type: categoryNode.type, + category: categoryNode.category, + contentName: categoryNode.contentName, + content: categoryNode.content, + isLeaf: categoryNode.isLeaf, + children: categoryNode.children + } + + typeItem.children.push(categoryItem) + }) + + result.push(typeItem) + }) + + return result +} + // 选择模板 const handleRowClick = (template) => { + // 只处理叶子节点(实际模板) + if (!template.isLeaf) return + + const templateData = template.originalData || template + ElMessageBox.confirm('确认要使用该模板吗?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }) .then(() => { - emit('select-template', template.content) + emit('select-template', templateData.content) visible.value = false // 选择后自动关闭抽屉 ElMessage.success('模板应用成功') }) diff --git a/src/views/inspect/inspecttemplate/index.vue b/src/views/inspect/inspecttemplate/index.vue index 845aeb4..05a7c67 100644 --- a/src/views/inspect/inspecttemplate/index.vue +++ b/src/views/inspect/inspecttemplate/index.vue @@ -78,10 +78,12 @@ border default-expand-all :tree-props="{ children: 'children' }" + :header-cell-style="{ background: 'rgb(235, 241, 250)', height: '56px', color: '#333333' }" + :resizable="false" > - - + +