报告

src/api/report.js

@@ -23,8 +23,24 @@ function delReport(data) {
         data
     })
 }
+function allReport(data){//获取报告
+    return request({
+        url:`/report/list`,
+        method:"get",
+        params:data,
+    })
+}
+function genderReport(data){//生成报告
+    return request({
+        url:`/report/make`,
+        method:"post",
+        data
+    })
+}
 export default {
     getReport,
     addReport,
-    delReport
+    delReport,
+    allReport,
+    genderReport,
 }

src/pages/mission/components/HaveMis.vue

@@ -8,8 +8,10 @@
         <img src="../../../assets/image/start_btn.png" alt="" style="cursor: pointer;" @click="startNow(lookingTask)" />
         <p class="nowModel" v-if="lookingTask.name">
           <span style="margin-right: 15px;">检测模型:</span>
-          <el-select v-model="currEditTaskModels" @change="relison"><el-option v-for="(item,index) in taskModels" :title="item.model_name" :key="index" :label="item.model_name" :value="item.sys_model_id"/></el-select>
-          <span style="margin: 10px;cursor: pointer;"><img src="../../../assets/icon/pencil.png" alt="编辑所选模型"  @click="editTaskModel"/></span>
+          <el-select v-model="currEditTaskModels" @change="relison"><el-option v-for="(item, index) in taskModels"
+              :title="item.model_name" :key="index" :label="item.model_name" :value="item.sys_model_id" /></el-select>
+          <span style="margin: 10px;cursor: pointer;"><img src="../../../assets/icon/pencil.png" alt="编辑所选模型"
+              @click="editTaskModel" /></span>
         </p>
       </div>
       <!-- 待检测任务 -->
@@ -19,24 +21,25 @@
         </div>
         <div style="display: flex;justify-content: flex-start;align-items: center;overflow-x: auto;"
           v-if="nowRunList.name || misList.length > 0">
-          <div :class="setImg(nowRunList)" v-if="nowRunList.name"  @click="startNow(nowRunList)">
+          <div :class="setImg(nowRunList)" v-if="nowRunList.name" @click="startNow(nowRunList)">
             <div class="intBoxOne">
               <p class="intOne">
                 <span style="font-size: 18px;color: white;">{{ nowRunList.name }}</span>
               </p>
               <p style="margin-left: 8px;">
-                <img style="width: 15px;height: 15px;float: left;padding-top:2px" src="../../../assets/icon/white_flash.png" alt="" />
+                <img style="width: 15px;height: 15px;float: left;padding-top:2px"
+                  src="../../../assets/icon/white_flash.png" alt="" />
                 <span style="font-size: 12px;color:white" class="commonSpan">{{ nowRunList.station_name }}</span>
               </p>
               <p style="margin-left: 8px;">
-                <img style="width: 15px;height: 15px;float: left;padding-top:2px" src="../../../assets/icon/white_clock.png" alt="" />
+                <img style="width: 15px;height: 15px;float: left;padding-top:2px"
+                  src="../../../assets/icon/white_clock.png" alt="" />
                 <span style="font-size: 12px;color:white" class="commonSpan">{{ nowRunList.ct }}</span>
               </p>
             </div>
             <!-- 点击检测 -->
             <div class="setNow">
-              <span style="font-size: 16px;color:white" class="setnowspan">检测中<em
-                  v-loading="emLoading"></em></span>
+              <span style="font-size: 16px;color:white" class="setnowspan">检测中<em v-loading="emLoading"></em></span>
             </div>
           </div>
           <div class="intBox" v-for="(item, index) in misList" :style="setImg(item, index)" @mouseover="intOver(index)"
@@ -82,7 +85,8 @@
         <div>
           <p class="norep">最近检测任务-已完成</p>
         </div>
-        <div style="display: flex;justify-content: flex-start;align-items: center;overflow-x: auto;width: calc(100vw - 100px);">
+        <div
+          style="display: flex;justify-content: flex-start;align-items: center;overflow-x: auto;width: calc(100vw - 100px);">
           <div class="intBox" v-for="(item, index) in passList" @mouseover="intOvers(index)" @mouseout="intOuts(index)">
             <div class="intBoxOne">
               <p class="intOne">
@@ -108,7 +112,7 @@
             <div class="setNow">
               <span class="setnowspan" @click="goNetStructPicture(item)">scd可视化</span>
               <span style="margin: 0 10px;" class="setnowspan">|</span>
-              <span class="setnowspan">检测结果</span>
+              <span class="setnowspan" @click="outcome(item, index)">检测结果</span>
             </div>
           </div>
         </div>
@@ -142,11 +146,11 @@ export default {
     function scdLink() {
       router.push("/home/scdMap");
     }
-    function startBefore(row,num){
+    function startBefore(row, num) {
       lookingTask.value = row
       taskModels.value = []
-      task.getTaskById({id:row.id}).then(res => {
-        if(res.code!=0){
+      task.getTaskById({ id: row.id }).then(res => {
+        if (res.code != 0) {
           ElMessage({
             message: res.msg,
             type: "error"
@@ -154,9 +158,9 @@ export default {
           return
         }
         let models = res.data.models
-        if(models === null || models.length === 0) return
+        if (models === null || models.length === 0) return
         taskModels.value = models
-        console.log(taskModels.value,'task');
+        console.log(taskModels.value, 'task');
       })
     }
     function startNow(row, num) {
@@ -171,16 +175,16 @@ export default {
       }
     }
 
-    function editTaskModel(){
+    function editTaskModel() {
       // 跳转到内置模型编辑组件
       let m1 = taskModels.value.filter(item => item.sys_model_id == currEditTaskModels.value)
-      if(m1.length === 0 ) return
+      if (m1.length === 0) return
       router.push({
         path: "/home/setting",
         query: {
           modelid: currEditTaskModels.value,
           modelname: m1[0].model_name,
-          isNow:1,
+          isNow: 1,
         },
       });
     }
@@ -191,12 +195,21 @@ export default {
         query: {
           id: row.scd_id,
           name: row.name,
-          parentData:JSON.stringify(row),
+          parentData: JSON.stringify(row),
           stationId: row.station_id,
           stationName: row.scd_name,
         },
       });
     }
+    // 生成报告和跳转页面
+    function outcome(row, num) {
+      router.push({
+        path: "/home/report/details",
+        query: {
+          reportId: row.id
+        }
+      })
+    }
     function getList() {
       const loading = ElLoading.service({
         lock: true,
@@ -238,7 +251,7 @@ export default {
       task.getTask({ pageno: 1, pagesize: 10, state: 1 }).then(res => {
         if (res.data == null) {
           nowRunList.value = {}
-          lookingTask.value ={}
+          lookingTask.value = {}
           return
         } else {
           nowRunList.value = res.data[0]
@@ -256,7 +269,7 @@ export default {
         return "intBox"
       }
     }
-    function relison(e){
+    function relison(e) {
       currEditTaskModels.value = e
     }
     function intOver(num) {
@@ -305,6 +318,7 @@ export default {
       isIndex,
       isIndexs,
       relison,//开始检测后选择模型change事件
+      outcome,//生成报告和跳转yemian
     };
   },
   components: {
@@ -407,7 +421,7 @@ p {
   box-shadow: inset 0px -3px 3px 0px #C8D4EC;
 }
 
-.intBox:hover {  
+.intBox:hover {
   background-color: #8BA6F0;
   color: white;
 }
@@ -481,5 +495,4 @@ p {
 
 :deep(.el-loading-spinner .path) {
   stroke: #ffffff;
-}
-</style>
+}</style>

src/pages/report/ReportVue.vue

@@ -2,85 +2,101 @@
     <div>
         <div class="bigBox">
             <div class="tableBox">
-                <el-table :data="reportList" height="250" style="width: 100%" :stripe="true">
+                <el-table :data="reportList" style="width: 100%;height: calc(100vh - 240px);position: relative;" :stripe="true">
                     <el-table-column label="序号" width="auto">
                         <template #default="{ $index }">{{ $index + 1 }}</template>
                     </el-table-column>
                     <el-table-column prop="name" label="任务名称" width="auto" />
                     <el-table-column prop="flash" label="变电站" width="auto" />
-                    <el-table-column prop="scd" label="SCD名称" width="auto" />
+                    <el-table-column prop="scd_name" label="SCD名称" width="auto" />
                     <el-table-column prop="date" label="检测日期" width="auto" />
                     <el-table-column fixed="right" label="操作" width="auto">
-                        <template #default>
-                            <el-button text type="primary" size="small" ><el-icon><View /></el-icon>查看</el-button>
-                            <el-button text type="primary" size="small"><el-icon><Download /></el-icon>下载</el-button>
+                        <template #default="scope">
+                            <el-button text type="primary" size="small" @click="lookReport(scope.row)"><el-icon>
+                                    <View />
+                                </el-icon>查看</el-button>
+                            <el-button text type="primary" size="small"><el-icon>
+                                    <Download />
+                                </el-icon>报告下载</el-button>
                         </template>
                     </el-table-column>
                 </el-table>
             </div>
             <!-- 分页组件 -->
             <div class="pageBox">
-                <Pagination :total="reportList.length"></Pagination>
+                <Pagination style="position: relative;" :total="reportList.length"></Pagination>
             </div>
         </div>
     </div>
 </template>
 
 <script>
-import { ref, onMounted } from 'vue'
+import { ref, onMounted, watch } from 'vue'
 import Pagination from './components/Pagination.vue'
+import report from "@/api/report"
+import { useRouter, useRoute } from "vue-router"
+import { ElMessage } from 'element-plus'
 export default {
     setup() {
+        let route = useRoute()//路由信息
+        let router = useRouter()//路由跳转api
         let reportList = ref([
-            {
-                name:"测试",
-                flash:"测试1",
-                scd:"sss.scd",
-                date:"2000-00-00"
-            },
-            {
-                name:"测试2",
-                flash:"测试2",
-                scd:"sss.scd",
-                date:"2000-00-00"
-            },
-            {
-                name:"测试3",
-                flash:"测试3",
-                scd:"sss.scd",
-                date:"2000-00-00"
-            },
-        ])
-
+        ])//报告列表
+        // 初始化组件
+        function reload() {
+            report.allReport({ pageno: 1, pagesize: 20 }).then(res => {// 获取所有报告
+                // console.log(res, 'res');
+                if (res.data != null) {
+                    reportList.value = res.data
+                } else {
+                    ElMessage({
+                        message: "暂无数据",
+                        type: "info"
+                    })
+                }
+            })
+        }
+        // 跳转到查看详情页面
+        function lookReport(row) {
+            console.log(row,'rows');
+            // router.push('/home/report/details')
+        }
+        onMounted(() => {
+            reload()
+        })
         return {
-            reportList,
+            reportList,//报告列表
+            reload,//初始化组件
+            lookReport,// 跳转到查看详情页面
         }
     },
-    components:{
+    components: {
         Pagination
     }
 }
 </script>
 
 <style scoped>
-.bigBox{
+.bigBox {
     width: 98%;
-    height: 100%;
+    height: calc(100vh - 240px);
     margin: 0 auto;
-    position: relative;
 }
-.tableBox{
+
+.tableBox {
     width: 100%;
-    height: 100%;
+    height: calc(100vh - 240px);
 }
-.pageBox{
+
+.pageBox {
     width: 420px;
     height: auto;
     position: absolute;
-    top: 65rem;
-    right: 2rem;
+    bottom: 20px;
+    right: 30px;
 }
-:deep(.el-scrollbar__view){
+
+:deep(.el-scrollbar__view) {
     width: 100%;
 }
 </style>

src/pages/report/components/Pagination.vue

@@ -1,5 +1,5 @@
 <template>
-    <div>
+    <div style="position: relative;">
         <el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 30, 40]"
             :small="small" :disabled="disabled" :background="background" layout="total, sizes, prev, pager, next, jumper"
             :total="realTotal" @size-change="handleSizeChange" @current-change="handleCurrentChange" />

src/pages/report/components/ReportDetails.vue

@@ -0,0 +1,35 @@
+<template>
+    <div>
+        <h1>4894655</h1>
+    </div>
+</template>
+
+<script>
+import { ref, watch, onMounted } from "vue"
+import { useRoute,useRouter } from "vue-router"
+import report from "@/api/report"
+export default {
+    setup() {
+        let route = useRoute()
+        let router = useRouter()
+        let reportId = ref('')//报告id
+        // 初始化组件
+        function reload(){
+            console.log(route,'route')
+            report.genderReport({task_id:route.query.reportId-0}).then(res=>{
+                console.log(res,'ressss');
+            })
+        }
+        onMounted(()=>{
+            reload()
+        })
+        return {
+            reload,//初始化组件
+        }
+    }
+}
+</script>
+
+<style scoped>
+
+</style>

src/router/index.js

@@ -22,8 +22,8 @@ const routes = [
         component: () => import("@/pages/mapLoad/FatherMap.vue")
     },
     {
-        path:"/draw",
-        component:()=>import("@/pages/components/draw/DrawDesigns.vue")
+        path: "/draw",
+        component: () => import("@/pages/components/draw/DrawDesigns.vue")
     },
     {
         path: "/home",
@@ -37,7 +37,7 @@ const routes = [
                 component: () => import("@/pages/report/ReportVue.vue"),
                 meta: {
                     name: "report"
-                }
+                },
             },
             {
                 path: "/home/mission",
@@ -61,25 +61,32 @@ const routes = [
                 }
             },
             {
-                path:"/home/setting",
-                component:()=>import("@/pages/system/SystemPage.vue"),
-                meta:{
-                    name:"setting"
+                path: "/home/setting",
+                component: () => import("@/pages/system/SystemPage.vue"),
+                meta: {
+                    name: "setting"
                 }
             },
             {
-                path:"/home/system",
-                component:()=>import("@/pages/setting/SettingPage.vue"),
-                meta:{
-                    name:"system"
+                path: "/home/system",
+                component: () => import("@/pages/setting/SettingPage.vue"),
+                meta: {
+                    name: "system"
                 }
             },
             {
-                
-                path:"/home/netStructPicture",
-                component:()=>import("@/pages/netStructPicture"),
-                meta:{
-                    name:"netStructPicture"
+
+                path: "/home/netStructPicture",
+                component: () => import("@/pages/netStructPicture"),
+                meta: {
+                    name: "netStructPicture"
+                }
+            },
+            {
+                path: "/home/report/details",
+                component: () => import("@/pages/report/components/ReportDetails.vue"),
+                meta: {
+                    name: "reportDetails"
                 }
             }
         ]