ClientApps/pqs-9100_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

报告模版

Browse Source
This commit is contained in:
sjl
2025-03-24 08:56:08 +08:00
parent 403ddbfb6e
commit 834230b26a
6 changed files with 441 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/api/device/interface/report.ts
View File

@@ -1,4 +1,5 @@
import type { ReqPage, ResPage } from '@/api/interface'
import type { UploadFile } from 'element-plus';
// 报告模版接口
export namespace PqReport {
@@ -19,10 +20,10 @@ export namespace PqReport {
id: string; //报告模板id
name: string;//报告模板名称
version:string;//版本号
basePath:string;//基础模板文件路径
detailPath:string;//检测项模版文件路径
desc:string;//描述信息
enable:number;//状态:8-删除 1-激活 2-未激活
baseFile?:string;//基础模板文件路径
detailFile?:string;//检测项模版文件路径
description:string;//描述信息
state:number;//状态:8-删除 1-正常
createBy?: string| null; //创建用户
createTime?: string| null; //创建时间
updateBy?: string| null; //更新用户

42
frontend/src/api/device/report/index.ts Normal file
View File

@@ -0,0 +1,42 @@
import type {PqReport} from '@/api/device/interface/report'
import http from '@/api'
/**
* @name 报告模版模块
*/
//获取报告模版
export const getPqReportList = (params: PqReport.ReqReportParams) => {
return http.post(`/report/list`, params)
}
//新增报告模版
export const addPqReport = (params: PqReport.ResReport) => {
return http.upload(`/report/add`, params)
}
//删除报告模版
export const deletePqReport = (params: string[]) => {
return http.post(`/report/delete`, params)
}
//查询报告模板详情
export const getPqReportById = (params: PqReport.ResReport) => {
return http.get(`/report/getById?id=${params.id}`)
}
//修改报告模板
export const updatePqReport = (params: PqReport.ResReport) => {
return http.upload(`/report/update`, params)
}
//查询所有报告模板名称
export const getPqReportAllName = () => {
return http.get(`/report/listAllName`)
}
//根据名称查询指定报告模板的所有版本
export const getPqReportAllVersion = (params:any) => {
return http.get(`/report/listAllVersion?name=${params.name}`)
}

4
frontend/src/api/plan/interface/index.ts
View File

@@ -22,6 +22,10 @@ export namespace Plan {
createTime?:string; //创建时间
updateBy?:string; //更新用户
updateTime?:string; //更新时间
associateReport:number;//是否关联报告模板 0否 1是
reportTemplateName:string;
reportTemplateVersion:string
}
// 检测计划 + 分页

103
frontend/src/views/plan/planList/components/planPopup.vue
View File

@@ -54,6 +54,32 @@
<el-radio :value="0">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关联报告模版" :label-width="100" prop='associateReport'>
<el-radio-group v-model="formContent.associateReport">
<el-radio :value="1">是</el-radio>
<el-radio :value="0">否</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="模版名称" prop="reportTemplateName" :label-width="100" v-if="formContent.associateReport === 1">
<el-select v-model="formContent.reportTemplateName" placeholder="请选择报告模版" autocomplete="off" :disabled="isSelectDisabled" @change="handleReportChange">
<el-option
v-for="(option, index) in pqReportName"
:key="index"
:label="option.name"
:value="option.name"
/>
</el-select>
</el-form-item>
<el-form-item label="模版版本号" prop="reportTemplateVersion" :label-width="100" v-if="formContent.associateReport === 1">
<el-select v-model="formContent.reportTemplateVersion" placeholder="请选择报告模版版本号" autocomplete="off" :disabled="isSelectDisabled">
<el-option
v-for="(option, index) in pqReportVersion"
:key="index"
:label="option.version"
:value="option.version"
/>
</el-select>
</el-form-item>
</el-form>
</el-col>
<el-col :span="12">
@@ -93,11 +119,7 @@
import { type TestScript } from '@/api/device/interface/testScript';
import { type ErrorSystem } from '@/api/device/interface/error';
import { type Device } from '@/api/device/interface/device';
import { Loading } from '@element-plus/icons-vue/dist/types';
import { truncate } from 'lodash';
import {getPqReportAllName,getPqReportAllVersion} from '@/api/device/report/index.ts'
const dictStore = useDictStore()
// 定义弹出组件元信息
const dialogFormRef = ref()
@@ -108,6 +130,9 @@ import { truncate } from 'lodash';
const pqErrSysList=ref<ErrorSystem.ErrorSystemList[]>([])//获取指定模式下所有检测源
const pqDevList=ref<Device.ResPqDev[]>([])//获取指定模式下所有检测源
const pqReportName = ref<{ name: string }[]>([])
const pqReportVersion = ref<{ version: string}[]>([])
const pqSourceArray = ref<{ label: string; value: string; }[]>()
const pqScriptArray = ref<{ label: string; value: string; }[]>()
const pqErrorArray = ref<{ label: string; value: string; }[]>()
@@ -164,6 +189,9 @@ const filterMethod = (query: string, item: { label?: string }) => {
devIds:[],
sourceIds:'',
datasourceIds:'',
associateReport:0,
reportTemplateName:'',
reportTemplateVersion:'',
})
return { dialogVisible, titleType, formContent }
}
@@ -194,6 +222,9 @@ const filterMethod = (query: string, item: { label?: string }) => {
devIds:[],
sourceIds:'',
datasourceIds:'',
associateReport:0,
reportTemplateName:'',
reportTemplateVersion:'',
}
)
@@ -204,14 +235,27 @@ const filterMethod = (query: string, item: { label?: string }) => {
})
// 定义规则
const formRuleRef = ref<FormInstance>()
const rules: Ref<Record<string, Array<FormItemRule>>> = ref({
name: [{ required: true, message: '检测计划名称必填！', trigger: 'blur' }],
sourceIds: [{ required: true, message: '检测源必选！', trigger: 'blur' }],
datasourceIds: [{ required: true, message: '数据源必选！', trigger: 'blur' }],
scriptId: [{ required: true, message: '检测脚本必选！', trigger: 'blur' }],
errorSysId: [{ required: true, message: '误差体系必选！', trigger: 'blur' }],
// 定义表单校验规则
const baseRules: Record<string, Array<FormItemRule>> = {
name: [{ required: true, message: '检测计划名称必填！', trigger: 'blur' }],
sourceIds: [{ required: true, message: '检测源必选！', trigger: 'change' }],
datasourceIds: [{ required: true, message: '数据源必选！', trigger: 'change' }],
scriptId: [{ required: true, message: '检测脚本必选！', trigger: 'change' }],
errorSysId: [{ required: true, message: '误差体系必选！', trigger: 'change' }],
};
// 使用计算属性根据 scene 动态生成规则
const rules = computed(() => {
const dynamicRules = { ...baseRules };
if (formContent.associateReport === 1){//只有关联报告模版时需要展示
dynamicRules.reportTemplateName= [{ required: true, message: '报告模版名称必选！', trigger: 'change' }];
dynamicRules.reportTemplateVersion= [{ required: true, message: '报告模版版本号必选！', trigger: 'change' }];
}
return dynamicRules;
});
// 关闭弹窗
@@ -306,13 +350,23 @@ const open = async (sign: string,
if(sign == 'add')
{
console.log('add',data)
const [pqSource_Result, PqScript_Result, PqErrSys_Result,pqDevList_Result] = await Promise.all([
const [pqSource_Result, PqScript_Result, PqErrSys_Result,pqDevList_Result,pqReportName_Result] = await Promise.all([
getTestSourceList(data),
getPqScriptList(data),
getPqErrSysList(),
getUnboundPqDevList(data)
getUnboundPqDevList(data),
getPqReportAllName(),
]);
if (Array.isArray(pqReportName_Result.data)) {
pqReportName.value = pqReportName_Result.data.map(item => ({ name: item }));
} else {
pqReportName.value = [];
console.error('pqReportName_Result.data is not an array:', pqReportName_Result.data);
}
pqSourceList.value = pqSource_Result.data as TestSource.ResTestSource[];
pqScriptList.value = PqScript_Result.data as TestScript.ResTestScript[];
pqErrSysList.value = PqErrSys_Result.data as unknown as ErrorSystem.ErrorSystemList[];
@@ -321,14 +375,22 @@ const open = async (sign: string,
unboundPqDevList.value = pqDevList.value
boundPqDevList.value = [];
}else{//编辑时先给表单赋值（这会没接收被检设备），需要手动再给被检设备复制后整体表单赋值
const [pqSource_Result, PqScript_Result, PqErrSys_Result,boundPqDevList_Result, unboundPqDevList_Result] = await Promise.all([
const [pqSource_Result, PqScript_Result, PqErrSys_Result,boundPqDevList_Result, unboundPqDevList_Result,pqReportName_Result] = await Promise.all([
getTestSourceList(data),
getPqScriptList(data),
getPqErrSysList(),
getBoundPqDevList({ 'planId': data.id }),
getUnboundPqDevList(data)
getUnboundPqDevList(data),
getPqReportAllName(),
]);
if (Array.isArray(pqReportName_Result.data)) {
pqReportName.value = pqReportName_Result.data.map(item => ({ name: item }));
} else {
pqReportName.value = [];
console.error('pqReportName_Result.data is not an array:', pqReportName_Result.data);
}
pqSourceList.value = pqSource_Result.data as TestSource.ResTestSource[];
pqScriptList.value = PqScript_Result.data as TestScript.ResTestScript[];
pqErrSysList.value = PqErrSys_Result.data as unknown as ErrorSystem.ErrorSystemList[];
@@ -400,9 +462,14 @@ const dataSourceType = computed(() => {
default:
return 'Datasource_Contrast'
}
})
})
const handleReportChange = async (value: string) => {
formContent.reportTemplateVersion = ''
const response = await getPqReportAllVersion({ name: value });
pqReportVersion.value = response.data.map((item: { version: string }) => ({ version: item }));
};
// 对外映射
defineExpose({ open })

280
frontend/src/views/system/template/components/reportPopup.vue
View File

@@ -0,0 +1,280 @@
<template>
<el-dialog :title="dialogTitle" v-model="dialogVisible" @close="close" v-bind="dialogSmall">
<el-form ref="dialogFormRef" :model="formContent" :rules="rules">
<el-form-item label="名称" prop="name">
<el-input v-model="formContent.name" placeholder="请输入报告名称" />
</el-form-item>
<el-form-item label="版本号" prop="version">
<el-input v-model="formContent.version" placeholder="请输入版本号" />
</el-form-item>
<el-form-item label="基础模板文件" prop="baseFile">
<el-upload
action="#"
:limit="1"
:on-change='BaseHandleChange'
:auto-upload="false"
:file-list="baseFileList"
:on-exceed="BaseHandleExceed"
:on-remove="BaseHandleRemove"
class="upload-container"
>
<el-button type="primary">选择文件</el-button>
</el-upload>
</el-form-item>
<el-form-item label="检测项模版文件" prop="detailFile">
<el-upload
action="#"
:limit="1"
:on-change='DataHandleChange'
:auto-upload="false"
:file-list="detailFileList"
:on-exceed="DataHandleExceed"
:on-remove="DataHandleRemove"
class="upload-container"
>
<el-button type="primary">选择文件</el-button>
</el-upload>
</el-form-item>
<el-form-item label="描述信息" prop="description">
<el-input v-model="formContent.description" type="textarea" placeholder="请输入描述信息" />
</el-form-item>
</el-form>
<template #footer>
<div>
<el-button @click="close()">取 消</el-button>
<el-button type="primary" @click="save()">保存</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { dialogSmall } from '@/utils/elementBind'
import { type PqReport } from '@/api/device/interface/report'
import { ElMessage, UploadFile } from 'element-plus'
import { updatePqReport, addPqReport, getPqReportById } from '@/api/device/report'
import { computed, reactive, ref } from 'vue'
// 定义弹出组件元信息
const dialogFormRef = ref()
let excelFormData = new FormData()
const baseFileName = ref('')
const baseFileUrl = ref('')
const detailFileName = ref('')
const detailFileUrl = ref('')
const baseFileList = computed(() => {
if (baseFileName.value && baseFileUrl.value) {
return [{ name: baseFileName.value, url: baseFileUrl.value }];
}
return [];
});
const detailFileList = computed(() => {
if (detailFileName.value && detailFileUrl.value) {
return [{ name: detailFileName.value, url: detailFileUrl.value }];
}
return [];
});
function useMetaInfo() {
const dialogVisible = ref(false)
const titleType = ref('add')
const formContent = ref<PqReport.ResReport>({
id: '',
name: '',
version: '', // 版本号
description: '', // 描述信息
detailFile:'',//检测项模版文件路径
baseFile:'',
state: 1,
})
return { dialogVisible, titleType, formContent }
}
const { dialogVisible, titleType, formContent } = useMetaInfo()
// 清空formContent
const resetFormContent = () => {
formContent.value = {
id: '',
name: '',
version: '', // 版本号
description: '', // 描述信息
detailFile:'',//检测项模版文件路径
baseFile:'',
state: 1,
}
}
let dialogTitle = computed(() => {
return titleType.value === 'add' ? '新增报告模版' : '编辑报告模版'
})
// 关闭弹窗
const close = () => {
excelFormData = new FormData()
dialogVisible.value = false
resetFormContent()
dialogFormRef.value?.resetFields()
}
// 表单验证规则
const rules = reactive({
name: [{ required: true, message: '请输入报告名称', trigger: 'blur' }],
version: [{ required: true, message: '请输入版本号', trigger: 'blur' }],
baseFile: [{ required: true, message: '请上传基础模板文件', trigger: 'change' }],
detailFile: [{ required: true, message: '请上传检测项模版文件', trigger: 'change' }],
})
// 保存数据
const save = () => {
try {
dialogFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
// 清空 excelFormData
excelFormData.delete('id')
excelFormData.delete('name')
excelFormData.delete('version')
excelFormData.delete('description')
excelFormData.append('name', formContent.value.name)
excelFormData.append('version', formContent.value.version)
excelFormData.append('description', formContent.value.description)
if (formContent.value.id) {
excelFormData.append('id', formContent.value.id)
await updatePqReport(excelFormData);
ElMessage.success({ message: `${dialogTitle.value}成功！` })
} else {
await addPqReport(excelFormData);
ElMessage.success({ message: `${dialogTitle.value}成功！` })
}
close()
// 刷新表格
await props.refreshTable!()
}
})
} catch (err) {
console.error('验证过程中出现错误', err)
}
}
// 打开弹窗，可能是新增，也可能是编辑
const open = async (sign: string, data?: PqReport.ResReport) => {
titleType.value = sign
dialogVisible.value = true
if (data?.id) {
await getPqReportById(data).then((res) => {
formContent.value.id = res.data.id
formContent.value.name = res.data.name
formContent.value.version = res.data.version
formContent.value.description = res.data.description
// 处理文件信息
if (res.data.baseFileVO) {
baseFileName.value= res.data.baseFileVO.name;
baseFileUrl.value= res.data.baseFileVO.url;
formContent.value.baseFile = res.data.baseFileVO.name
}
if (res.data.detailFileVO) {
detailFileName.value= res.data.detailFileVO.name;
detailFileUrl.value= res.data.detailFileVO.url;
formContent.value.detailFile = res.data.detailFileVO.name
}
})
} else {
baseFileName.value =''
baseFileUrl.value = ''
detailFileName.value = ''
detailFileUrl.value = ''
resetFormContent();
dialogFormRef.value?.resetFields()
// 清空 excelFormData
excelFormData = new FormData();
}
}
const DataHandleRemove = () => {
excelFormData.delete('detailFile');
formContent.value.detailFile = ''
};
const BaseHandleRemove = () => {
excelFormData.delete('baseFile');
formContent.value.baseFile = ''
};
const BaseHandleExceed = (files: File[]) => {
// 移除旧文件
excelFormData.delete('baseFile');
// 添加新文件
if (files.length > 0) {
const newFile = files[0] as unknown as UploadFile;
baseFileName.value = newFile.name;
excelFormData.append('baseFile', newFile as Blob, newFile.name);
formContent.value.detailFile = newFile.name
}
};
const DataHandleExceed = (files: File[]) => {
// 移除旧文件
excelFormData.delete('detailFile');
// 添加新文件
if (files.length > 0) {
const newFile = files[0] as UploadFile;
detailFileName.value = newFile.name;
excelFormData.append('detailFile', newFile as Blob, newFile.name);
formContent.value.detailFile = newFile.name
}
};
const BaseHandleChange = async(param : UploadFile) => {
baseFileName.value = param.name;
baseFileUrl.value = URL.createObjectURL(param.raw as Blob);
excelFormData.append('baseFile', param.raw as Blob, param.name);
formContent.value.baseFile = param.name;
};
const DataHandleChange = async(param: UploadFile) => {
detailFileName.value = param.name;
detailFileUrl.value = URL.createObjectURL(param.raw as Blob);
excelFormData.append('detailFile', param.raw as Blob, param.name);
formContent.value.detailFile = param.name;
};
// 对外映射
defineExpose({ open })
const props = defineProps<{
refreshTable: (() => Promise<void>) | undefined
}>()
</script>
<style scoped>
.upload-container {
display: flex;
align-items: center;
}
</style>

58
frontend/src/views/system/template/index.vue
View File

@@ -9,13 +9,6 @@
<!-- 表格 header 按钮 -->
<template #tableHeader='scope'>
<el-button v-auth.device="'add'" type='primary' :icon='CirclePlus' @click="openDialog('add')">新增</el-button>
<el-button v-auth.device="'export'" type='primary' :icon='Upload' plain @click='downloadFile()'>导出</el-button>
<el-button v-auth.device="'import'" type='primary' :icon='Download' plain @click="importFile('')"
v-if='modeStore.currentMode != "比对式"'>导入
</el-button>
<el-button v-auth.device="'import'" type='primary' :icon='Download' plain @click="importFile('比对式')"
v-if='modeStore.currentMode === "比对式"'>导入
</el-button>
<el-button v-auth.device="'delete'" type='danger' :icon='Delete' plain :disabled='!scope.isSelected'
@click='batchDelete(scope.selectedListIds)'>
删除
@@ -32,42 +25,29 @@
</ProTable>
</div>
<DevicePopup :refresh-table='proTable?.getTableList' ref='devicePopup'/>
<ImportExcel ref='deviceImportExcel'/>
<ReportPopup :refresh-table='proTable?.getTableList' ref='reportPopup'/>
</template>
<script setup lang='tsx' name='useRole'>
import TimeControl from '@/components/TimeControl/index.vue'
import {type PqReport} from '@/api/device/interface/report.ts'
import {useHandleData} from '@/hooks/useHandleData'
import {useDownload} from '@/hooks/useDownload'
import ProTable from '@/components/ProTable/index.vue'
import ImportExcel from '@/components/ImportExcel/index.vue'
import {type ColumnProps, type ProTableInstance} from '@/components/ProTable/interface'
import DevicePopup from '@/views/machine/device/components/devicePopup.vue'
import ReportPopup from '@/views/system/template/components/reportPopup.vue'
import {CirclePlus, Delete, Download, EditPen, Upload} from '@element-plus/icons-vue'
import {useDictStore} from '@/stores/modules/dict'
import {deletePqDev, downloadTemplate, exportPqDev, getPqDev, getPqDevList, importPqDev} from '@/api/device/device/index.ts'
import {ElMessageBox} from 'element-plus'
import {onBeforeMount, reactive, ref} from 'vue'
import {useAppSceneStore, useModeStore} from '@/stores/modules/mode'
import {getPqReportList,deletePqReport} from '@/api/device/report/index.ts'
import {reactive, ref} from 'vue'
// defineOptions({
// name: 'device',
// })
const modeStore = useModeStore()
const dictStore = useDictStore()
const appSceneStore = useAppSceneStore()
// ProTable 实例
const proTable = ref<ProTableInstance>()
const devicePopup = ref()
const reportPopup = ref()
const getTableList = async (params: any) => {
// let newParams = JSON.parse(JSON.stringify(params))
// const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id//获取数据字典中对应的id
// newParams.pattern = patternId
// return getPqDevList(newParams)
let newParams = JSON.parse(JSON.stringify(params))
return getPqReportList(newParams)
}
@@ -89,16 +69,20 @@
},
{
prop: 'basePath',
prop: 'baseFile',
label: '基础模板文件路径',
minWidth: 150,
render: scope => {
return scope.row.baseFileVO.url
}
},
{
prop: 'detailPath',
prop: 'detailFile',
label: '检测项模版文件路径',
minWidth: 150,
render: scope => {
return scope.row.detailFileVO.url
}
},
{
prop: 'createTime',
@@ -123,24 +107,26 @@
])
// 打开 drawer(新增、编辑)
const openDialog = (titleType: string, row: Partial<PqReport.ResReport> = {}) => {
reportPopup.value.open(titleType, row)
}
// 批量删除报告模版
const batchDelete = async (id: string[]) => {
await useHandleData(deletePqReport, id, '删除所选报告模版')
proTable.value?.clearSelection()
proTable.value?.getTableList()
}
// 删除报告模版
const handleDelete = async (params:PqReport.ResReport) => {
await useHandleData(deletePqReport, [params.id], `删除【${params.name}】报告模版`)
proTable.value?.getTableList()
}
</script>