From 0a7829811f6df7a6eb4e32ba5ba53b1db9f10e9c Mon Sep 17 00:00:00 2001 From: zhouwx <1175765986@qq.com> Date: 星期三, 23 七月 2025 10:01:09 +0800 Subject: [PATCH] 修改 --- src/views/build/conpanyFunctionConsult/digitalFileDep/manageType/qualityManual/index.vue | 289 +++++++++++++++++++++++++++++++++++++++------------------ 1 files changed, 195 insertions(+), 94 deletions(-) diff --git a/src/views/build/conpanyFunctionConsult/digitalFileDep/manageType/qualityManual/index.vue b/src/views/build/conpanyFunctionConsult/digitalFileDep/manageType/qualityManual/index.vue index 68b04e6..53f2ae7 100644 --- a/src/views/build/conpanyFunctionConsult/digitalFileDep/manageType/qualityManual/index.vue +++ b/src/views/build/conpanyFunctionConsult/digitalFileDep/manageType/qualityManual/index.vue @@ -32,17 +32,28 @@ <el-table-column label="序号" type="index" align="center" width="80"/> <el-table-column label="质量手册" prop="fileName" align="center"> <template #default="scope"> - <el-button link type="primary" @click="initFile()">{{scope.row.qualityName + '.docx'}}</el-button> + <el-button link type="primary" @click="initFile(scope.row)">{{scope.row.companyName + scope.row.qualityName + '.docx'}}</el-button> </template> </el-table-column> - <el-table-column label="操作" align="center" class-name="small-padding fixed-width" > + <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template #default="scope"> -<!-- <el-button link type="primary" @click="openDialog('edit',scope.row)">编辑</el-button>--> + <el-button link type="primary" @click="initFile(scope.row)">下载</el-button> + <el-button link type="primary" @click="openDialog('add',scope.row)">上传</el-button> <el-button link type="danger" @click="handleDelete(scope.row)">删除</el-button> </template> </el-table-column> </el-table> + <div class="orgTreeBox" id="org-tree-container"> + <vue3-tree-org + :data="deptList" + :horizontal="false" + :props="treeProps" + :toolBar="tools" + :label-style="labelStyle" + center + /> + </div> <pagination v-show="total > 0" :total="total" @@ -50,7 +61,6 @@ v-model:limit="queryParams.pageSize" @pagination="getList" /> - <edit-dialog ref="dialogRef" @getList=getList></edit-dialog> </div> </template> @@ -59,17 +69,10 @@ import {getCurrentInstance, onMounted, onUnmounted, reactive, ref, toRefs} from "vue"; import {ElMessage, ElMessageBox} from "element-plus"; import {delCompany, getCompany} from "@/api/onlineEducation/company"; -import {delUser, getUser} from "@/api/onlineEducation/user"; -import Cookies from "js-cookie"; -import editDialog from './components/editDialog.vue' import {generateWordDocument} from './components/exportDoc.js' - - -import { - addIndustryTemp, - delIndustryTemp, - getIndustryTemp, -} from "@/api/staffManage/staff"; +import editDialog from './components/editDialog.vue' +import html2canvas from 'html2canvas' +import { saveAs } from 'file-saver' import useUserStore from "@/store/modules/user"; import { addStandardQuality, @@ -77,8 +80,7 @@ getStandardDetail, getStandardQuality } from "@/api/standardSys/standardSys"; -import {getBasic} from "@/api/companyInfo/basicInfo"; -import {getCom} from "@/api/companyInfo/overview"; +import {getDepart, getDistribution, getFunctionalRemarkList, getSysClause} from "@/api/orgStructure/depart"; const userStore = useUserStore() const { proxy } = getCurrentInstance(); @@ -92,43 +94,32 @@ }, total: 0, dataList: [], + deptList: { + id: 0, + deptName: "", + children:[] + }, + treeProps: { + label: 'deptName' + }, + tools: { + scale: false, restore: false, expand: false, zoom: false, fullscreen: false + }, + labelStyle: { + border: '1px solid #ccc', + background: 'rgba(0,0,0,0)' + }, companyList: [], isAdmin: false, - companyInfo: { - summaries: '', - policies: '', - deptList: [], - duties: [], - temps: [] - }, - caluseList: [ - {clauseNum: '4', content: '组织环境'}, - {clauseNum: '4.1', content: '理解组织及其环境',manage: true,represent: false}, - {clauseNum: '4.2', content: '理解相关方的需求和期望',manage: true,represent: false}, - {clauseNum: '4.3', content: '确定质量管理体系的范围',manage: false,represent: true}, - {clauseNum: '4.4', content: '质量管理体系及其过程',manage: false,represent: true}, - {clauseNum: '5', content: '领导作用'}, - {clauseNum: '5.1', content: '领导作用和承诺',manage: true,represent: false}, - {clauseNum: '5.2', content: '方针',manage: true,represent: false}, - {clauseNum: '5.3', content: '组织内的角色、职责和权限',manage: true,represent: false}, - {clauseNum: '6', content: ''}, - {clauseNum: '6.1', content: '应对风险和机遇的措施',manage: true,represent: false}, - {clauseNum: '6.2', content: '质量目标及其实现的策划',manage: false,represent: true}, - {clauseNum: '6.3', content: '变更的策划',manage: false,represent: true}, - {clauseNum: '7', content: '支持'}, - {clauseNum: '7.1', content: '资源',manage: true,represent: false}, - {clauseNum: '7.1.1', content: '总则',manage: true,represent: false}, - {clauseNum: '7.1.2', content: '人员',manage: true,represent: false}, - {clauseNum: '7.1.3', content: '基础设施',manage: false,represent: true}, - {clauseNum: '7.1.4', content: '过程运行环境',manage: false,represent: true}, - {clauseNum: '7.1.5', content: '监视和测量资源',manage: false,represent: true}, - {clauseNum: '7.1.6', content: '组织的知识',manage: false,represent: true} - ] + companyInfo: {}, + caluseList: [], + originDeptList: [] }); -const { queryParams, total, dataList,companyList, isAdmin } = toRefs(data); +const { queryParams, total, dataList,deptList,treeProps,tools,labelStyle,companyList, isAdmin, companyInfo, caluseList } = toRefs(data); const userInfo = ref() onMounted(async ()=>{ + await getSysClauseList() if(userStore.roles.includes('admin')){ data.isAdmin = true await getCompanyList() @@ -143,6 +134,20 @@ }) +const getSysClauseList = async ()=> { + const res = await getSysClause() + if(res.code == 200){ + data.caluseList = res.data.map(i=>{ + return { + clauseNum: i.clauseNum, + content: i.name + } + }) + }else{ + ElMessage.warning(res.message) + } +} + const getList = async () => { loading.value = true const res = await getStandardQuality(data.queryParams) @@ -155,6 +160,36 @@ loading.value = false } +const getDeptData = async (val) => { + await getDeptList(val) + const res = await getDistribution({companyId: val.companyId}) + if(res.code == 200){ + for(let item of data.caluseList){ + const sameNum = data.companyInfo.duties.filter(i=>i.clauseNum == item.clauseNum).map(j=> { + return { + deptId: j.deptId, + chooseLab: j.chooseLab + } + } + ) + for(let i of sameNum){ + item[i.deptId] = i.chooseLab? (i.chooseLab==1?'●':'○'):'○' + } + } + }else{ + ElMessage.warning(res.message) + } +} +const getDeptList = async (val) => { + const res = await getDepart({responsType: 1, companyId: val.companyId}) + if(res.code == 200){ + data.originDeptList = JSON.parse(JSON.stringify(res.data)) + data.deptList.deptName = val.companyName + data.deptList.children = proxy.handleTree(res.data, "deptId") + }else{ + ElMessage.warning(res.message) + } +} const addFile = async ()=>{ let params={} if(data.queryParams.companyId){ @@ -189,76 +224,132 @@ } } -const getInfo = async () => { - loading.value = true; - if(!data.queryParams.companyId){ - ElMessage.warning('请选择企业') - } - const res = await getStandardDetail({companyId: data.queryParams.companyId}); +const getInfo = async (val) => { + const res = await getStandardDetail({companyId: val.companyId}); if(res.code === 200){ - data.companyInfo.summaries = res.data.companySummaries[0].companySummary - data.companyInfo.policies = res.data.companyQualityPolicies[0].policy - data.companyInfo.deptList = res.data.treeSelects - data.companyInfo.duties = transformDuties(res.data.sysFunctionalDistributions) + if(!res.data || (res.data.companyIndustryTemplates.length == 0 && res.data.companyQualityPolicies.length == 0 && res.data.companySummaries.length == 0 && res.data.sysFunctionalDistributions + .length == 0 && res.data.treeSelects.length == 0)){ + loading.value = false + return Promise.reject(new Error('该企业暂无质量数据')) + } + data.companyInfo.summaries = res.data.companySummaries ? res.data.companySummaries[0]?.companySummary : [] + data.companyInfo.policies = res.data.companyQualityPolicies ? res.data.companyQualityPolicies[0]?.policy : [] + const duties = transToTableData(res.data.sysFunctionalDistributions,data.originDeptList) + data.companyInfo.allDepts = duties.allDepts + console.log(data.companyInfo.allDepts,'all') + data.companyInfo.clauses = duties.clauses data.companyInfo.temps = res.data.companyIndustryTemplates?.map((item,index)=>{ return { index: index + 1, templateName: item.templateName } - }) + }) || [] }else{ ElMessage.warning(res.message) } - loading.value = false; - } -const transformDuties=(duties)=>{ - let tableData = [] - for(let item of duties){ - const index = tableData.findIndex(i=>i.deptId == item.deptId) - if(index == -1){ - const obj = { - deptName: item.deptName, - deptId: item.deptId +const getRemarksList = async (companyId)=> { + const res = await getFunctionalRemarkList({companyId: companyId}) + if(res.code == 200){ + const originRemark = res.data + for(let item of originRemark){ + const foundObj = data.caluseList.find(i=>i.clauseNum == item.clauseNum) + if(foundObj){ + foundObj.remark = item.remark } - obj[item.clauseNum] = item.chooseLab==1?'●':'○' - tableData.push(obj) - }else{ - tableData[index][item.clauseNum] = item.chooseLab==1?'●':'○' } + data.companyInfo.remarks = originRemark.map(i=>{ + return `${i.clauseNum}:${i.remark}` + }).join(';') + }else{ + ElMessage.warning(res.message) } - console.log(tableData,'table1') - tableData = tableData.map(j=>{ - for(let i of data.caluseList){ - if(!j.hasOwnProperty(i.clauseNum)){ - j[i.clauseNum] = '○' +} + +const transToTableData=(duties,deptList)=>{ + // 步骤1:获取所有唯一的部门和条款编号 + // const allDeptNames = [...new Set(duties.map(item => item.deptName))]; + const allDepts = deptList + const allClauseNums = [...new Set([ + ...data.caluseList.map(c => c.clauseNum), + ...duties.map(d => d.clauseNum) + ])]; + +// 步骤2:为每个条款生成完整的部门数据(缺失数据默认 chooseLab: 0) + const mergeValues = ['7.1','8.2','8.3','8.4','8.5','9.1'] + const processedClauses = allClauseNums.map(clauseNum => { + const clauseContent = data.caluseList.find(c => c.clauseNum === clauseNum)?.content || ""; + // 为当前条款生成所有部门的数据(确保每个部门都有值) + const deptValues = allDepts.map(dept => { + const matchedDept = duties.find( + item => item.clauseNum === clauseNum && item.deptId === dept.deptId + ) + if(dept.deptType == '0'){ + return matchedDept ? (matchedDept.chooseLab==1?'●':'○' ): '○' + }else{ + return matchedDept ? (matchedDept.chooseLab==1?'▲':'○' ): '○' } + }); + return { + clauseNum, + content: clauseContent, + deptValues: !mergeValues.includes(clauseNum)? deptValues : deptValues.map(i=> '') } - return j }) - console.log(tableData,'table2') - return tableData +// 最终数据结构 + return { + clauses: processedClauses, + allDepts // 用于生成表头 + }; } -const initFile = async () => { - await getInfo() - const templatePath = '/qualityFile.docx' - try { - await generateWordDocument( - templatePath, - data.companyInfo, - '质量手册.docx' - ); - ElMessage.success('文档生成成功!'); - } catch (error) { - console.error('导出失败:', error); - ElMessage.warning('文档生成失败'); +const initFile = async (val) => { + data.companyInfo = {} + loading.value = true + if(val.filePath !== ''){ + window.open(import.meta.env.VITE_APP_BASE_API + '/' + val.filePath) + }else{ + try { + await getDeptList(val) + await getInfo(val) + await getRemarksList(val.companyId) + // 2. 等待DOM更新完成 + await nextTick(); + + // 3. 捕获组织结构图图片 + const orgChartImage = await captureElementToImage('org-tree-container'); + data.companyInfo.orgChart = orgChartImage + data.companyInfo.companyName = val.companyName + const templatePath = '/qualityFile.docx' + await generateWordDocument( + templatePath, + data.companyInfo, + val.companyName+'质量手册.docx' + ); + loading.value = false + } catch (error) { + console.error('操作失败:', error); + ElMessage.warning(error.message || '操作失败'); + } } +} + +const captureElementToImage = async (elementId) => { + const html2canvas = (await import('html2canvas')).default; + const element = document.getElementById(elementId); + if (!element) throw new Error('找不到组织结构图容器'); + + return await html2canvas(element, { + scale: 4, + useCORS: true, + allowTaint: true, + backgroundColor: 'rgba(0,0,0,0)' // 确保背景是白色 + }).then(canvas => canvas.toDataURL('image/png')); } const openDialog = (type, value) => { - dialogRef.value.openDialog(type, value, data.queryParams.companyId, data.isAdmin, data.companyList); + dialogRef.value.openDialog(type, value); } /** 重置新增的表单以及其他数据 */ @@ -292,3 +383,13 @@ } </script> +<style lang="scss"> + .orgTreeBox{ + width: 700px; + height: 700px; + position: absolute; /* 或 fixed */ + left: -9999px; /* 移出可视区域 */ + pointer-events: none; /* 禁止交互 */ + z-index: -1; + } +</style> -- Gitblit v1.9.2