|
@@ -1,35 +1,346 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <h1>4894655</h1>
|
|
|
+ <div class="bigBoxs">
|
|
|
+ <div class="topBox">
|
|
|
+ <div class="cilBox">
|
|
|
+ <p style="font-size: 18px;font-weight: 400;">{{ stationNames }}-{{ relathing }}</p>
|
|
|
+ </div>
|
|
|
+ <div class="createReport">
|
|
|
+ <img src="../../../assets/image/board_file.png" alt="">
|
|
|
+ <p>{{ btnType?'还未生成报告':"报告已生成" }}</p>
|
|
|
+ <el-button :type="btnType ? 'primary' : 'info'" plain @click="nowGet" :disabled="!btnType">立即生成</el-button>
|
|
|
+ <el-button :type="btnType ? 'info' : 'primary'" plain :disabled="btnType" @click="downReport">下载报告</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="bottomBox" v-loading="loading">
|
|
|
+ <div class="miniBox">
|
|
|
+ <img style="width: 20px;height: 20px;display: block;margin-top: 10px;margin-left: 10px;"
|
|
|
+ src="../../../assets/icon/file_blue.png" alt="">
|
|
|
+ <span style="
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: Source Han Sans CN, Source Han Sans CN;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #1A2447;
|
|
|
+ display: flex;
|
|
|
+ margin-top: 10px;
|
|
|
+ /* margin-left: 10px; */
|
|
|
+ ">检测结果</span>
|
|
|
+ </div>
|
|
|
+ <div class="messageBox">
|
|
|
+ <!-- 树形结构盒子 -->
|
|
|
+ <div class="treeBox">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <!-- 大表格盒子 -->
|
|
|
+ <div class="tableBox">
|
|
|
+ <!-- 头部按钮和统计数据盒子 -->
|
|
|
+ <div class="btnBox">
|
|
|
+ <!-- 按钮盒子 -->
|
|
|
+ <div class="btn">
|
|
|
+ <el-button style="font-size: 16px;" type="primary" plain>
|
|
|
+ <svg t="1705980404021" class="iconSvg" viewBox="0 0 1024 1024" version="1.1"
|
|
|
+ xmlns="http://www.w3.org/2000/svg" p-id="7825" width="48" height="48">
|
|
|
+ <path
|
|
|
+ d="M486.4 367.616l-89.344 86.016a25.6 25.6 0 1 1-35.584-36.864l131.84-128A25.6 25.6 0 0 1 512 281.6h2.816a25.6 25.6 0 0 1 16.128 7.68l123.392 128a25.6 25.6 0 1 1-36.864 35.584L537.6 370.688V614.4a25.6 25.6 0 0 1-51.2 0zM972.8 230.4v691.2a102.4 102.4 0 0 1-102.4 102.4H153.6a102.4 102.4 0 0 1-102.4-102.4V102.4a102.4 102.4 0 0 1 102.4-102.4h593.92z m-230.4-162.56V204.8a25.6 25.6 0 0 0 25.6 25.6h133.12zM921.6 281.6h-153.6a76.8 76.8 0 0 1-76.8-76.8V51.2H153.6a51.2 51.2 0 0 0-51.2 51.2v819.2a51.2 51.2 0 0 0 51.2 51.2h716.8a51.2 51.2 0 0 0 51.2-51.2zM358.4 768a25.6 25.6 0 0 1 0-51.2h307.2a25.6 25.6 0 0 1 0 51.2z"
|
|
|
+ fill="#255be7" p-id="7826"></path>
|
|
|
+ </svg>
|
|
|
+ 导出所有结果
|
|
|
+ </el-button>
|
|
|
+ <el-button style="font-size: 16px;" type="primary" plain>
|
|
|
+ <svg t="1705980404021" class="iconSvg" viewBox="0 0 1024 1024" version="1.1"
|
|
|
+ xmlns="http://www.w3.org/2000/svg" p-id="7825" width="48" height="48">
|
|
|
+ <path
|
|
|
+ d="M486.4 367.616l-89.344 86.016a25.6 25.6 0 1 1-35.584-36.864l131.84-128A25.6 25.6 0 0 1 512 281.6h2.816a25.6 25.6 0 0 1 16.128 7.68l123.392 128a25.6 25.6 0 1 1-36.864 35.584L537.6 370.688V614.4a25.6 25.6 0 0 1-51.2 0zM972.8 230.4v691.2a102.4 102.4 0 0 1-102.4 102.4H153.6a102.4 102.4 0 0 1-102.4-102.4V102.4a102.4 102.4 0 0 1 102.4-102.4h593.92z m-230.4-162.56V204.8a25.6 25.6 0 0 0 25.6 25.6h133.12zM921.6 281.6h-153.6a76.8 76.8 0 0 1-76.8-76.8V51.2H153.6a51.2 51.2 0 0 0-51.2 51.2v819.2a51.2 51.2 0 0 0 51.2 51.2h716.8a51.2 51.2 0 0 0 51.2-51.2zM358.4 768a25.6 25.6 0 0 1 0-51.2h307.2a25.6 25.6 0 0 1 0 51.2z"
|
|
|
+ fill="#255be7" p-id="7826"></path>
|
|
|
+ </svg>
|
|
|
+ 导出当前节点结果
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ <!-- 统计数据盒子 -->
|
|
|
+ <div class="count">
|
|
|
+ <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">全部:
|
|
|
+ <em>{{ Number(warnCount) + Number(dangerCount) + Number(infoCount) }}</em></span>
|
|
|
+ <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">错误:
|
|
|
+ <em style="color: red;">{{ dangerCount }}</em></span>
|
|
|
+ <span style="margin-right: 5px;font-size: 16px;font-weight: 400;">告警:
|
|
|
+ <em style="color: orange;">{{ warnCount }}</em></span>
|
|
|
+ <span style="font-size: 16px;font-weight: 400;">提示:
|
|
|
+ <em style="color: blue;">{{ infoCount }}</em></span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="realBox" style="position: relative;">
|
|
|
+ <el-table :data="tableData" stripe
|
|
|
+ style="width: 100%;height: calc(100vh - 410px);margin-top: 10px;">
|
|
|
+ <el-table-column prop="ied_name" label="装置名称" width="180" />
|
|
|
+ <el-table-column prop="ied_desc" label="装置描述" width="180" />
|
|
|
+ <el-table-column label="等级" width="150">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-tag class="ml-2" :type="typeLevel(scope.row.alert_level)">{{
|
|
|
+ canLevel(scope.row.alert_level) }}</el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="行号" width="150">
|
|
|
+ <template #default="scope">
|
|
|
+ <span style="color: blue;border-bottom: 1px solid blue;cursor: pointer;">{{
|
|
|
+ scope.row.line_no }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="parse_result" label="描述" width="auto" />
|
|
|
+ <el-table-column label="标准及条款" width="150">
|
|
|
+ <template #default="scope">
|
|
|
+ <p>{{ scope.row.apply_standard }}</p>
|
|
|
+ <p>{{ scope.row.apply_standard_no }}</p>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <Pagination style="position: absolute;" :totals="totals" @pageBack="pageBack"></Pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { ref, watch, onMounted } from "vue"
|
|
|
-import { useRoute,useRouter } from "vue-router"
|
|
|
+import { useRoute, useRouter } from "vue-router"
|
|
|
import report from "@/api/report"
|
|
|
+import slc from "@/api/slc/slc"
|
|
|
+import Pagination from "./Pagination.vue"
|
|
|
+import { ElMessage } from "element-plus"
|
|
|
+import system from "@/api/system"
|
|
|
export default {
|
|
|
setup() {
|
|
|
let route = useRoute()
|
|
|
let router = useRouter()
|
|
|
let reportId = ref('')//报告id
|
|
|
+ let scdIds = ref("")//scdid
|
|
|
+ let tableData = ref([])//表格数据
|
|
|
+ let warnCount = ref(0)//告警总数
|
|
|
+ let dangerCount = ref(0)//错误总数
|
|
|
+ let infoCount = ref(0)//提示总数
|
|
|
+ let stationNames = ref("")//变电站名称
|
|
|
+ let relathing = ref('')//检测名称
|
|
|
+ let loading = ref(false)
|
|
|
+ let btnType = ref(true)//生成报告按钮和下载报告按钮状态
|
|
|
+ let fileId = ref("")//需要下载的报告id'
|
|
|
+ let totals = ref(0)
|
|
|
// 初始化组件
|
|
|
- function reload(){
|
|
|
- console.log(route,'route')
|
|
|
- report.genderReport({task_id:route.query.reportId-0}).then(res=>{
|
|
|
- console.log(res,'ressss');
|
|
|
+ function reload() {
|
|
|
+ console.log(route, 'route')
|
|
|
+ stationNames.value = route.query.stationName
|
|
|
+ relathing.value = route.query.names
|
|
|
+ reportId.value = route.query.reportId
|
|
|
+ // report.genderReport({ task_id: route.query.reportId - 0 }).then(res => {
|
|
|
+ // console.log(res, 'ressss');
|
|
|
+ // })
|
|
|
+ loading.value = true
|
|
|
+ slc.getScdByIdFromMission({
|
|
|
+ scd_id: route.query.scdId - 0,
|
|
|
+ pageno: 1,
|
|
|
+ pagesize: 20,
|
|
|
+ }).then(res => {//获取总数量
|
|
|
+ if (res.data != null) {
|
|
|
+ console.log(res.data);
|
|
|
+ tableData.value = res.data
|
|
|
+ totals.value = res.count
|
|
|
+ loading.value = false
|
|
|
+ } else {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ slc.getErrorByLevel({
|
|
|
+ scd_id: route.query.scdId - 0
|
|
|
+ }).then(res => {//获取各个等级总数
|
|
|
+ if (res.data != null) {
|
|
|
+ res.data.map(item => {
|
|
|
+ if (item.alert_level == 'waring') {
|
|
|
+ warnCount.value = item.cnt
|
|
|
+ } else if (item.alert_level == 'error') {
|
|
|
+ dangerCount.value = item.cnt
|
|
|
+ } else if (item.alert_level == 'info') {
|
|
|
+ infoCount.value = item.cnt
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ report.allReport({
|
|
|
+ pageno: 1,
|
|
|
+ pagesize: 20,
|
|
|
+ name: relathing.value
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, 'oisaghuih');
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 筛选等级
|
|
|
+ function canLevel(level) {
|
|
|
+ if (level == 'waring') {
|
|
|
+ return `告警`
|
|
|
+ } else if (level == 'error') {
|
|
|
+ return `错误`
|
|
|
+ } else if (level == 'info') {
|
|
|
+ return `提示`
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 筛选tag标签状态
|
|
|
+ function typeLevel(level) {
|
|
|
+ if (level == 'waring') {
|
|
|
+ return `warning`
|
|
|
+ } else if (level == 'error') {
|
|
|
+ return `danger`
|
|
|
+ } else if (level == 'info') {
|
|
|
+ return `info`
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 生成报告
|
|
|
+ function nowGet() {
|
|
|
+ report.genderReport({
|
|
|
+ task_id: reportId.value - 0
|
|
|
+ }).then(res => {
|
|
|
+ if (res.data != null) {
|
|
|
+ fileId.value = res.data.TaskId
|
|
|
+ btnType.value = false
|
|
|
+ ElMessage({
|
|
|
+ message: "生成报告成功",
|
|
|
+ type: "success"
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ // 下载报告
|
|
|
+ function downReport() {
|
|
|
+ system.downLoad({
|
|
|
+ ids: fileId.value - 0
|
|
|
+ }).then(res => {
|
|
|
+ console.log(res, '下载');
|
|
|
})
|
|
|
}
|
|
|
- onMounted(()=>{
|
|
|
+ // 分页组件返回
|
|
|
+ function pageBack(size, index) {
|
|
|
+ loading.value = true
|
|
|
+ slc.getScdByIdFromMission({
|
|
|
+ scd_id: route.query.scdId - 0,
|
|
|
+ pageno: index,
|
|
|
+ pagesize: size,
|
|
|
+ }).then(res => {//获取总数量
|
|
|
+ if (res.data != null) {
|
|
|
+ console.log(res.data);
|
|
|
+ tableData.value = res.data
|
|
|
+ totals.value = res.count
|
|
|
+ loading.value = false
|
|
|
+ } else {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ onMounted(() => {
|
|
|
reload()
|
|
|
})
|
|
|
return {
|
|
|
reload,//初始化组件
|
|
|
+ reportId,//报告id
|
|
|
+ tableData,//表格数据
|
|
|
+ scdIds,//scdid
|
|
|
+ canLevel,//筛选等级
|
|
|
+ typeLevel,//筛选tag标签状态
|
|
|
+ warnCount,//告警总数
|
|
|
+ dangerCount,//错误总数
|
|
|
+ infoCount,//提示总数
|
|
|
+ loading,//
|
|
|
+ stationNames,
|
|
|
+ relathing,
|
|
|
+ totals,//总条数
|
|
|
+ pageBack,
|
|
|
+ nowGet,//生成报告按钮
|
|
|
+ btnType,//按钮状态
|
|
|
+ fileId,//下载的报告id
|
|
|
+ downReport,//下载报告
|
|
|
}
|
|
|
+ },
|
|
|
+ components: {
|
|
|
+ Pagination,
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
+p {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+em {
|
|
|
+ list-style: none;
|
|
|
+ font-style: normal;
|
|
|
+}
|
|
|
+
|
|
|
+.bigBoxs {
|
|
|
+ width: 98%;
|
|
|
+ height: calc(100vh - 90px);
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.createReport {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100vh - 780px);
|
|
|
+ text-align: center;
|
|
|
+ line-height: 30px;
|
|
|
+ padding-top: 10px;
|
|
|
+ background: #F7F8FB;
|
|
|
+}
|
|
|
|
|
|
+.bottomBox {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100vh - 320px);
|
|
|
+ background-color: #F7F8FB;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.miniBox {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.messageBox {
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100vh - 380px);
|
|
|
+ /* border: 1px solid saddlebrown; */
|
|
|
+ margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.treeBox {
|
|
|
+ width: 20%;
|
|
|
+ height: calc(100vh - 380px);
|
|
|
+ border: 1px solid #A3ADE0;
|
|
|
+}
|
|
|
+
|
|
|
+.tableBox {
|
|
|
+ width: 78%;
|
|
|
+ height: calc(100vh - 380px);
|
|
|
+}
|
|
|
+
|
|
|
+.btnBox {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.btn {
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+.count {
|
|
|
+ width: 25%;
|
|
|
+}
|
|
|
+
|
|
|
+.iconSvg {
|
|
|
+ width: 20px;
|
|
|
+ height: 20px;
|
|
|
+}
|
|
|
</style>
|