报告模版

frontend/src/api/device/interface/report.ts

@@ -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;//基础模板文件路径
+    baseFile?:string;//基础模板文件路径
-    detailPath:string;//检测项模版文件路径
+    detailFile?:string;//检测项模版文件路径
-    desc:string;//描述信息
+    description:string;//描述信息
-    enable:number;//状态:8-删除 1-激活 2-未激活
+    state:number;//状态:8-删除 1-正常
     createBy?: string| null; //创建用户
     createTime?: string| null; //创建时间
     updateBy?: string| null; //更新用户

frontend/src/api/device/report/index.ts

@@ -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}`)
+}
+

frontend/src/api/plan/interface/index.ts

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

frontend/src/views/plan/planList/components/planPopup.vue

@@ -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 {getPqReportAllName,getPqReportAllVersion} from '@/api/device/report/index.ts'
-import { truncate } from 'lodash';
-
-
-
   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' }],
+const baseRules: Record<string, Array<FormItemRule>> = {
-    sourceIds: [{ required: true, message: '检测源必选！', trigger: 'blur' }],
+  name: [{ required: true, message: '检测计划名称必填！', trigger: 'blur' }],
-    datasourceIds: [{ required: true, message: '数据源必选！', trigger: 'blur' }],
+    sourceIds: [{ required: true, message: '检测源必选！', trigger: 'change' }],
-    scriptId: [{ required: true, message: '检测脚本必选！', trigger: 'blur' }],
+    datasourceIds: [{ required: true, message: '数据源必选！', trigger: 'change' }],
-    errorSysId: [{ required: true, message: '误差体系必选！', trigger: 'blur' }],
+    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 })

frontend/src/views/system/template/components/reportPopup.vue

@@ -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>

frontend/src/views/system/template/index.vue

@@ -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'/>
+    <ReportPopup :refresh-table='proTable?.getTableList' ref='reportPopup'/>
-    <ImportExcel ref='deviceImportExcel'/>
+
   </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 {getPqReportList,deletePqReport} from '@/api/device/report/index.ts'
-  import {ElMessageBox} from 'element-plus'
+  import {reactive, ref} from 'vue'
-  import {onBeforeMount, reactive, ref} from 'vue'
-  import {useAppSceneStore, useModeStore} from '@/stores/modules/mode'
 
-  // 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))
+     let newParams = JSON.parse(JSON.stringify(params))
-    // const patternId = dictStore.getDictData('Pattern').find(item => item.name === modeStore.currentMode)?.id//获取数据字典中对应的id
+     return  getPqReportList(newParams)
-    // newParams.pattern = patternId
-    // return getPqDevList(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>