|
|
@@ -0,0 +1,817 @@
|
|
|
+<template>
|
|
|
+ <div class="optimizationSuggestions">
|
|
|
+ <div class="main_top">
|
|
|
+ <p class="topPsty">优化建议报告</p>
|
|
|
+ <div class="seach">
|
|
|
+ <el-form class="generat-seach" :inline="true">
|
|
|
+ <el-form-item label="场站">
|
|
|
+ <el-select v-model="reportStation" placeholder="选择场站">
|
|
|
+ <el-option v-for="item in stationList" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="报告月份" class="!mb-0">
|
|
|
+ <el-date-picker style="width: 120px" v-model="reportParamDate" type="month"
|
|
|
+ value-format="YYYY-MM" placeholder="请选择" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="handleReportOp">查询</el-button>
|
|
|
+ <el-button style="width: 100px" type="danger" @click="exportPDFop" :loading="loading">导出 PDF
|
|
|
+ </el-button>
|
|
|
+ <!-- <el-button style="width: 100px" type="primary" @click="exportWORD" :loading="loading">导出 WORD
|
|
|
+ </el-button> -->
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="infoBox">
|
|
|
+ <div id="pdfDom" ref="pdfContent"
|
|
|
+ :style="!theme ? 'background-color: #040c0b' : 'background-color: #fff'">
|
|
|
+ <h2 style="
|
|
|
+ font-weight: bolder;
|
|
|
+ text-align: center;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ text-align: center;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ {{ OperationName }}
|
|
|
+ </h2>
|
|
|
+ <!-- 概述 -->
|
|
|
+ <h3 style="text-indent: 2em; font-weight: bolder; margin-bottom: 10px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 1.概述
|
|
|
+ </h3>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ {{ OperationGs }}
|
|
|
+ </p>
|
|
|
+ <h4 style="text-indent: 2em; font-weight: bolder; margin: 10px 0"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 1.1 风电场基本信息
|
|
|
+ </h4>
|
|
|
+ <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, index) in basrMsgArr"
|
|
|
+ :key="index">
|
|
|
+ <span style="
|
|
|
+ background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;
|
|
|
+ " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="font-weight: bolder; margin-right: 10px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.name }}:
|
|
|
+ </span>
|
|
|
+ <span style="text-align: justify; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.value }}</span>
|
|
|
+ </div>
|
|
|
+ <!-- 筛选标准 -->
|
|
|
+ <h3 style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-weight: bolder;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 2.筛选标准
|
|
|
+ </h3>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 本报告依据以下标准对风机进行筛选：
|
|
|
+ </p>
|
|
|
+ <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, index) in orderMsgArr"
|
|
|
+ :key="index">
|
|
|
+ <span style="
|
|
|
+ background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;
|
|
|
+ " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="font-weight: bolder; margin-right: 10px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.name }}:
|
|
|
+ </span>
|
|
|
+ <span style="text-align: justify; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.value }}</span>
|
|
|
+ </div>
|
|
|
+ <!-- 风机筛选分析 -->
|
|
|
+ <h3 style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-weight: bolder;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 3.风机筛选分析
|
|
|
+ </h3>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 根据以上标准，对每台风机的运行数据及隐患问题信息进行分析，结果如下：
|
|
|
+ </p>
|
|
|
+ <div class="warn-table">
|
|
|
+ <!-- <el-table class="toolSty" :data="fjsxList1" border style="width: 100%; margin: 10px 0"
|
|
|
+ max-height="500" stripe :header-cell-style="{
|
|
|
+ padding: '4px',
|
|
|
+ fontSize: '12px',
|
|
|
+ fontWeight: bold,
|
|
|
+ border: '0.5px solid rgba(0,0,0,.5) !important',
|
|
|
+ }" :cell-style="{
|
|
|
+ height: '40px',
|
|
|
+ padding: '3px',
|
|
|
+ fontSize: '12px',
|
|
|
+ 'border-top': '0px solid rgba(0,0,0,.5)',
|
|
|
+ 'border-bottom': '1px solid rgba(0,0,0,.5)',
|
|
|
+ 'border-right': '1px solid rgba(0,0,0,.5)',
|
|
|
+ }">
|
|
|
+ <el-table-column prop="turbineId" align="center" label="风机编号" width="60" />
|
|
|
+ <el-table-column prop="speed" align="center" label="平均风速(m/s)" width="60" />
|
|
|
+ <el-table-column prop="ratedPowerKw" align="center" label="额定功率(KW)" width="60" />
|
|
|
+ <el-table-column prop="actualRatedPowerKw" align="center" label="实际额定功率(KW)" width="60" />
|
|
|
+ <el-table-column v-for="(item, index) in orderTableColumn" :key="index" :label="item.name"
|
|
|
+ :width="item.width" align="center">
|
|
|
+ <el-table-column v-for="(res, index) in item.children" :key="index" :label="res.name"
|
|
|
+ align="center" :width="res.width ? res.width : 80">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>
|
|
|
+ {{ scope.row[res.code] }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column align="center" prop="performanceIssues" label="性能问题" width="60"
|
|
|
+ fixed="right" />
|
|
|
+ </el-table> -->
|
|
|
+ <!-- 温度类隐患 -->
|
|
|
+ <el-table class="toolSty" :data="fjsxList2" border style="width: 100%; margin: 10px 0"
|
|
|
+ stripe :header-cell-style="{
|
|
|
+ padding: '4px',
|
|
|
+ fontSize: '12px',
|
|
|
+ fontWeight: bold,
|
|
|
+ border: '0.5px solid rgba(0,0,0,.5) !important',
|
|
|
+ }" :cell-style="{
|
|
|
+ height: '40px',
|
|
|
+ padding: '3px',
|
|
|
+ fontSize: '12px',
|
|
|
+ 'border-top': '0px solid rgba(0,0,0,.5)',
|
|
|
+ 'border-bottom': '1px solid rgba(0,0,0,.5)',
|
|
|
+ 'border-right': '1px solid rgba(0,0,0,.5)',
|
|
|
+ }">
|
|
|
+ <el-table-column prop="turbineId" align="center" label="风机编号" />
|
|
|
+ <el-table-column prop="downtimeCount" align="center" label="故障停机次数" />
|
|
|
+ <el-table-column v-for="(item, index) in orderTableColumn2" :key="index" :label="item.name"
|
|
|
+ :width="item.width" align="center">
|
|
|
+ <el-table-column v-for="(res, index) in item.children" :key="index" :label="res.name"
|
|
|
+ align="center" width="71">
|
|
|
+ <template #default="scope">
|
|
|
+ <span>
|
|
|
+ {{ scope.row[res.code] ? scope.row[res.code] : "-" }}
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="reliabilityIssue" align="center" label="可靠性问题"
|
|
|
+ width="92" />
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <h4 style="text-indent: 2em; font-weight: bolder; margin: 10px 0"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 3.1 分析结果
|
|
|
+ </h4>
|
|
|
+ <!-- <div style="text-indent: 2em; line-height: 30px; font-size: 15px"
|
|
|
+ v-for="(item, index) in orderResultArr" :key="index">
|
|
|
+ <span style="
|
|
|
+ background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;
|
|
|
+ " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="text-align: justify; margin-right: 10px; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item }}</span>
|
|
|
+ </div> -->
|
|
|
+ <div style="text-indent: 2em;line-height: 30px;font-size: 15px;"
|
|
|
+ v-for="(item, index) in orderAnalysisArr" :key="index">
|
|
|
+ <span style="background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;" :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="font-weight: bolder;margin-right: 10px;"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{item.windName}}: </span>
|
|
|
+ <span style="
|
|
|
+ text-align: justify;margin-right: 10px;
|
|
|
+ line-height: 22px;" :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.value }}</span>
|
|
|
+ </div>
|
|
|
+ <p style="font-size: 16px;font-weight: bolder;margin: 10px 0 10px 40px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">根据以上分析，筛选出的问题风机包括: </p>
|
|
|
+ <div style="text-indent: 2em;line-height: 30px;font-size: 15px;" v-for="(item, index) in orderResultArr"
|
|
|
+ :key="index">
|
|
|
+ <span style="background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;" :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="font-weight: bolder;margin-right: 10px;"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{item.windName}}: </span>
|
|
|
+ <span style="
|
|
|
+ text-align: justify;margin-right: 10px;
|
|
|
+ line-height: 22px;" :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.value }}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 风机情况说明 -->
|
|
|
+ <h3 style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-weight: bolder;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 4.问题风机情况说明
|
|
|
+ </h3>
|
|
|
+ <div v-for="(val, key, index) in windSituationReport" :key="index">
|
|
|
+ <h4 style="text-indent: 2em; font-weight: bolder; margin: 10px 0"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ {{ `${key}号机组` }}
|
|
|
+ </h4>
|
|
|
+ <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, index) in val"
|
|
|
+ :key="index">
|
|
|
+ <span style="
|
|
|
+ background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;
|
|
|
+ " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span v-if="item.indexOf('\n') !== -1">
|
|
|
+ <span style="text-align: justify; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.split('\n')[0] }};</span>
|
|
|
+ <p style="text-indent: 9rem; text-align: justify; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.split('\n')[1] }}</p>
|
|
|
+ </span>
|
|
|
+ <span style="font-weight: bolder;margin-right: 10px;" v-else
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{item}} </span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 检修建议 -->
|
|
|
+ <h3 style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-weight: bolder;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 5.检修建议
|
|
|
+ </h3>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 针对筛选出的风机，提出以下检修建议：
|
|
|
+ </p>
|
|
|
+ <div v-for="(val, key, index) in maintenanceRecommendations" :key="index">
|
|
|
+ <h4 style="text-indent: 2em; font-weight: bolder; margin: 10px 0"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ {{ `${key}号机组` }}
|
|
|
+ </h4>
|
|
|
+ <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, idx) in val"
|
|
|
+ :key="idx">
|
|
|
+ <span style="
|
|
|
+ background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;
|
|
|
+ " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="text-align: justify; line-height: 22px"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{ item }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 结论 -->
|
|
|
+ <h3 style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-weight: bolder;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ margin-top: 10px;
|
|
|
+ " :style="!theme ? 'color: #fff' : 'color: #000'">
|
|
|
+ 6.结论
|
|
|
+ </h3>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ {{ conclusionMsg }}
|
|
|
+ </p>
|
|
|
+ <!-- <div style="text-indent: 2em;line-height: 30px;font-size: 15px;"
|
|
|
+ v-for="(item, idx) in conclusionMsg.resultObj" :key="idx">
|
|
|
+ <span style="background: #fff;
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ border-radius: 10px;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 15px 0 15px;" :style="!theme ? 'background: #fff' : 'background: #000'"></span>
|
|
|
+ <span style="font-weight: bolder;margin-right: 10px;"
|
|
|
+ :style="!theme ? 'color: #fff' : 'color: #000'">{{item.name}}: </span>
|
|
|
+ <span style="
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;" :style="!theme ? 'color: #fff' : 'color: #000'">{{ item.value }}</span>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- <div style="display: flex; margin-top: 15px">
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 编写人：XXX
|
|
|
+ </p>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 审核人：XXX
|
|
|
+ </p>
|
|
|
+ <p style="
|
|
|
+ text-indent: 2em;
|
|
|
+ font-size: 15px;
|
|
|
+ text-align: justify;
|
|
|
+ line-height: 22px;
|
|
|
+ ">
|
|
|
+ 日期：XXX
|
|
|
+ </p>
|
|
|
+ </div> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import httpRequest from "@/utils/request.js";
|
|
|
+ import Docxtemplater from "docxtemplater";
|
|
|
+ import PizZip from "pizzip";
|
|
|
+ import JSZipUtils from "jszip-utils";
|
|
|
+ import html2canvas from 'html2canvas';
|
|
|
+ import jsPDF from 'jspdf';
|
|
|
+ import {
|
|
|
+ saveAs
|
|
|
+ } from "file-saver";
|
|
|
+ import dayjs from "dayjs";
|
|
|
+
|
|
|
+ import {
|
|
|
+ getWpList
|
|
|
+ } from "@/api/zhbj";
|
|
|
+
|
|
|
+ import {
|
|
|
+ ElMessage
|
|
|
+ } from "element-plus";
|
|
|
+
|
|
|
+ import jsonData from "./dataJson.json";
|
|
|
+ export default {
|
|
|
+ name: "yhjyReport",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ stationList: [],
|
|
|
+ reportStation: "",
|
|
|
+ basrMsgArr: jsonData.basrMsgArr,
|
|
|
+ orderMsgArr: jsonData.orderMsgArr,
|
|
|
+ orderAnalysisArr: [],
|
|
|
+ orderResultArr: [],
|
|
|
+ maintenanceRecommendations: [],
|
|
|
+ windSituationReport: [],
|
|
|
+ orderTableColumn: jsonData.orderTableColumn,
|
|
|
+ orderTableColumn2: jsonData.orderTableColumn2,
|
|
|
+ conclusionMsg: {},
|
|
|
+ OperationName: "",
|
|
|
+ OperationGs: "",
|
|
|
+ OperationMonth: "",
|
|
|
+ fjsxList1: [],
|
|
|
+ fjsxList2: [],
|
|
|
+ theme: true,
|
|
|
+ loading: false,
|
|
|
+ reportParamDate: dayjs()
|
|
|
+ .subtract(1, "month")
|
|
|
+ .startOf("month")
|
|
|
+ .format("YYYY-MM"),
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ created() {
|
|
|
+ this.theme = this.$store.state.theme;
|
|
|
+ },
|
|
|
+
|
|
|
+ mounted() {
|
|
|
+ this.funGetStation();
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ /**场站 */
|
|
|
+ funGetStation() {
|
|
|
+ let that = this;
|
|
|
+ this.renderReportPage({
|
|
|
+ data: jsonData.reldata
|
|
|
+ });
|
|
|
+ // that.stationList = [];
|
|
|
+ // that.reportStation = "";
|
|
|
+ // getWpList().then((res) => {
|
|
|
+ // if (res) {
|
|
|
+ // that.stationList = res.data;
|
|
|
+ // if (that.stationList.length) {
|
|
|
+ // that.reportStation = that.stationList[0].id;
|
|
|
+ // that.handleReportOp();
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ },
|
|
|
+ async exportPDFop() {
|
|
|
+ this.loading = true;
|
|
|
+ try {
|
|
|
+ // 获取要转换为PDF的内容
|
|
|
+ const element = this.$refs.pdfContent;
|
|
|
+
|
|
|
+ // 保存当前滚动位置
|
|
|
+ const originalScrollTop = window.scrollY;
|
|
|
+
|
|
|
+ // 将页面滚动到顶部
|
|
|
+ window.scrollTo(0, 0);
|
|
|
+
|
|
|
+ // 设置元素的高度为内容的实际高度
|
|
|
+ const originalHeight = element.style.height;
|
|
|
+ const originalOverflow = element.style.overflow;
|
|
|
+ if (originalHeight) {
|
|
|
+ element.style.height = `${element.scrollHeight}px`;
|
|
|
+ }
|
|
|
+ if (originalOverflow) {
|
|
|
+ element.style.overflow = 'hidden';
|
|
|
+ }
|
|
|
+
|
|
|
+ // 使用html2canvas将HTML内容转换为canvas
|
|
|
+ const canvas = await html2canvas(element, {
|
|
|
+ scale: 2, // 提高分辨率
|
|
|
+ logging: true, // 开启日志记录
|
|
|
+ useCORS: true // 处理跨域图片
|
|
|
+ });
|
|
|
+
|
|
|
+ // 恢复原来的样式
|
|
|
+ element.style.height = originalHeight || '';
|
|
|
+ element.style.overflow = originalOverflow || '';
|
|
|
+
|
|
|
+ // 恢复滚动位置
|
|
|
+ window.scrollTo(0, originalScrollTop);
|
|
|
+
|
|
|
+ // 将canvas转换为Data URL
|
|
|
+ const imgData = canvas.toDataURL('image/png');
|
|
|
+
|
|
|
+ // 创建一个新的jsPDF实例
|
|
|
+ const doc = new jsPDF('p', 'mm', 'a4');
|
|
|
+
|
|
|
+ // 计算图片在PDF中的位置和大小
|
|
|
+ const imgProps = doc.getImageProperties(imgData);
|
|
|
+ const pdfWidth = doc.internal.pageSize.getWidth();
|
|
|
+ const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
|
|
|
+
|
|
|
+ // 计算每页的高度
|
|
|
+ const pageHeight = doc.internal.pageSize.getHeight();
|
|
|
+ let heightLeft = pdfHeight;
|
|
|
+
|
|
|
+ // 添加第一页
|
|
|
+ doc.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
|
|
|
+
|
|
|
+ // 添加后续页面
|
|
|
+ while (heightLeft > pageHeight) {
|
|
|
+ heightLeft -= pageHeight;
|
|
|
+ doc.addPage();
|
|
|
+ doc.addImage(imgData, 'PNG', 0, -pdfHeight + heightLeft, pdfWidth, pdfHeight);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 保存PDF文件
|
|
|
+ doc.save('优化建议报告.pdf');
|
|
|
+ this.loading = false;
|
|
|
+ } catch (error) {
|
|
|
+ console.error('Error generating PDF:', error);
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ exportWORD() {
|
|
|
+ httpRequest
|
|
|
+ .get(
|
|
|
+ `/WarningReport/report?time=${this.reportParamDate}&wpid=${this.reportStation}`
|
|
|
+ )
|
|
|
+ .then((tempRes) => {
|
|
|
+ this.getWordFn(tempRes);
|
|
|
+ })
|
|
|
+ .catch((e) => {
|
|
|
+ this.getWordFn({
|
|
|
+ data: jsonData.reldata,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 导出word方法
|
|
|
+ getWordFn(tempRes) {
|
|
|
+ let temWordData = {
|
|
|
+ titleName: this.OperationName,
|
|
|
+ operationGs: this.OperationGs,
|
|
|
+ stationName: tempRes.data.stationid.aname,
|
|
|
+ windNumber: tempRes.data.stationid.jrwindQuantityLd,
|
|
|
+ zzjrl: tempRes.data.stationid.windCapacity,
|
|
|
+ reportTime: tempRes.data.reporttime,
|
|
|
+ fjsxList1: tempRes.data.xnwtls,
|
|
|
+ fjsxList2: [],
|
|
|
+ orderAnalysisArr: this.orderAnalysisArr,
|
|
|
+ orderResultArr: this.orderResultArr,
|
|
|
+ windSituationReportWord: [],
|
|
|
+ maintenanceRecommendationsWord: [],
|
|
|
+ conclusionResult: `本次分析针对${tempRes.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`,
|
|
|
+ };
|
|
|
+
|
|
|
+ tempRes.data.kkxwtls.forEach((it) => {
|
|
|
+ for (const key in it) {
|
|
|
+ if (Object.prototype.hasOwnProperty.call(it, key)) {
|
|
|
+ const element = it[key];
|
|
|
+ if (element === null) {
|
|
|
+ it[key] = "-";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ temWordData.fjsxList2 = tempRes.data.kkxwtls;
|
|
|
+
|
|
|
+ //4.风机情况说明
|
|
|
+ let qksmNum = 0;
|
|
|
+ for (const key in tempRes.data.qksm) {
|
|
|
+ if (Object.prototype.hasOwnProperty.call(tempRes.data.qksm, key)) {
|
|
|
+ const element = tempRes.data.qksm[key];
|
|
|
+ let eleArr = [];
|
|
|
+
|
|
|
+ element.forEach((it) => {
|
|
|
+ let eleObj = {
|
|
|
+ name: it.substring(0, it.indexOf("：")),
|
|
|
+ value: it.substring(it.indexOf("："), it.length)
|
|
|
+ // value: it.substring(it.indexOf("："), it.length)?.indexOf('\n') > -1 ? it
|
|
|
+ // .substring(it.indexOf("："), it.length).split('\n') : it.substring(it
|
|
|
+ // .indexOf("："), it.length),
|
|
|
+ };
|
|
|
+ eleArr.push(eleObj);
|
|
|
+ });
|
|
|
+ let obj = {
|
|
|
+ index: qksmNum++,
|
|
|
+ windName: key,
|
|
|
+ windValue: eleArr,
|
|
|
+ };
|
|
|
+ temWordData.windSituationReportWord.push(obj);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ //5.风机情况说明
|
|
|
+ let jxjyNum = 0;
|
|
|
+ for (const key in tempRes.data.jxjy) {
|
|
|
+ if (Object.prototype.hasOwnProperty.call(tempRes.data.jxjy, key)) {
|
|
|
+ const element = tempRes.data.jxjy[key];
|
|
|
+ let eleArr = [];
|
|
|
+ element.forEach((it) => {
|
|
|
+ let eleObj = {
|
|
|
+ name: it.substring(0, it.indexOf(":")),
|
|
|
+ value: it.substring(it.indexOf(":"), it.length),
|
|
|
+ };
|
|
|
+ eleArr.push(eleObj);
|
|
|
+ });
|
|
|
+ let obj = {
|
|
|
+ index: jxjyNum++,
|
|
|
+ windName: key,
|
|
|
+ windValue: eleArr,
|
|
|
+ };
|
|
|
+ temWordData.maintenanceRecommendationsWord.push(obj);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 读取并获得模板文件的二进制内容
|
|
|
+ JSZipUtils.getBinaryContent(
|
|
|
+ `./static/optimizationSuggestionsReport.docx`,
|
|
|
+ (error, content) => {
|
|
|
+ // 抛出异常
|
|
|
+ if (error) throw error;
|
|
|
+ // 创建一个JSZip实例，内容为模板的内容
|
|
|
+ let zip = new PizZip(content);
|
|
|
+ // 创建并加载docxtemplater实例对象
|
|
|
+ let doc = new Docxtemplater();
|
|
|
+ doc.loadZip(zip);
|
|
|
+ doc.setData(temWordData);
|
|
|
+ try {
|
|
|
+ // 用模板变量的值替换所有模板变量
|
|
|
+ doc.render();
|
|
|
+ } catch (error) {
|
|
|
+ // 抛出异常
|
|
|
+ let e = {
|
|
|
+ message: error.message,
|
|
|
+ name: error.name,
|
|
|
+ stack: error.stack,
|
|
|
+ properties: error.properties,
|
|
|
+ };
|
|
|
+ console.log(
|
|
|
+ JSON.stringify({
|
|
|
+ error: e,
|
|
|
+ })
|
|
|
+ );
|
|
|
+ throw error;
|
|
|
+ }
|
|
|
+ // 生成一个代表docxtemplater对象的zip文件（不是一个真实的文件，而是在内存中的表示）
|
|
|
+ let out = doc.getZip().generate({
|
|
|
+ type: "blob",
|
|
|
+ mimeType: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
|
|
+ });
|
|
|
+ // 将目标文件对象保存为目标类型的文件，并命名
|
|
|
+ saveAs(out, `${temWordData.titleName}.docx`);
|
|
|
+ }
|
|
|
+ );
|
|
|
+ },
|
|
|
+ handleReportOp() {
|
|
|
+ if (this.reportParamDate) {
|
|
|
+ this.OperationName = "";
|
|
|
+ this.OperationGs = "";
|
|
|
+ this.OperationMonth = "";
|
|
|
+ // this.basrMsgArr = [];
|
|
|
+ this.fjsxList1 = [];
|
|
|
+ this.fjsxList2 = [];
|
|
|
+ this.orderAnalysisArr = []
|
|
|
+ this.orderResultArr = [];
|
|
|
+ this.windSituationReport = {};
|
|
|
+ this.maintenanceRecommendations = {};
|
|
|
+ this.conclusionMsg = "";
|
|
|
+
|
|
|
+ httpRequest
|
|
|
+ .get(
|
|
|
+ `/WarningReport/report?time=${this.reportParamDate}&wpid=${this.reportStation}`
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ this.renderReportPage(res);
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ this.renderReportPage({
|
|
|
+ data: jsonData.reldata,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ renderReportPage(res) {
|
|
|
+ this.OperationMonth = res.data.reporttime;
|
|
|
+ let date = this.OperationMonth.split("-");
|
|
|
+ this.OperationName =
|
|
|
+ date[0] +
|
|
|
+ "年" +
|
|
|
+ date[1] +
|
|
|
+ "月" +
|
|
|
+ res.data.stationid.aname +
|
|
|
+ "性能及可靠性优化建议报告";
|
|
|
+ this.OperationGs = `本报告旨在对${res.data.stationid.aname}内的风机进行综合分析，以筛选出同时存在性能问题和可靠性隐患的风机，为后续的检修与优化提供依据。`;
|
|
|
+
|
|
|
+ this.basrMsgArr.forEach((it) => {
|
|
|
+ if (it.nameEn === "reportDate") {
|
|
|
+ it.value = date[0] + "年" + date[1] + "月";
|
|
|
+ } else {
|
|
|
+ it.value = res.data.stationid[it.nameEn];
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ this.orderMsgArr.forEach((it) => {
|
|
|
+ it.value = jsonData.orderMsg[it.nameEn];
|
|
|
+ });
|
|
|
+
|
|
|
+ this.fjsxList2 = res.data.kkxwtls;
|
|
|
+ // 3.1筛选结果
|
|
|
+ res.data.FilterResults.split("\n").forEach((ele) => {
|
|
|
+ let obj = {
|
|
|
+ windName: ele.split("：")[0],
|
|
|
+ value: ele.split("：")[1]
|
|
|
+ }
|
|
|
+ this.orderResultArr.push(obj);
|
|
|
+ });
|
|
|
+ // for (const key in res.data.FilterResults) {
|
|
|
+ // if (Object.prototype.hasOwnProperty.call(res.data.FilterResults, key)) {
|
|
|
+ // const element = res.data.FilterResults[key];
|
|
|
+ // let obj = {
|
|
|
+ // windName: key,
|
|
|
+ // value: element
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // 4风机情况说明
|
|
|
+ this.windSituationReport = res.data.qksm;
|
|
|
+ // 5检修建议
|
|
|
+ this.maintenanceRecommendations = res.data.jxjy;
|
|
|
+
|
|
|
+ this.conclusionMsg =
|
|
|
+ `本次分析针对${res.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`;
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ watch: {
|
|
|
+ "$store.state.theme"(bool) {
|
|
|
+ this.theme = bool;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+ .optimizationSuggestions {
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-content: center;
|
|
|
+
|
|
|
+ .main_top {
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .topPsty {
|
|
|
+ position: relative;
|
|
|
+ top: 5px;
|
|
|
+ padding: 7px 20px;
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 600;
|
|
|
+ margin-left: 10px;
|
|
|
+ border-radius: 3px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .seach {
|
|
|
+ padding: 20px 0 0 20px;
|
|
|
+
|
|
|
+ .generat-seach {
|
|
|
+ .el-form-item {
|
|
|
+ .el-form-item__content {
|
|
|
+ .el-select {
|
|
|
+ width: 130px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .infoBox {
|
|
|
+ height: calc(100% - 80px);
|
|
|
+ overflow: scroll;
|
|
|
+
|
|
|
+ #pdfDom {
|
|
|
+ margin: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.themeLight {
|
|
|
+ .topPsty {
|
|
|
+ color: #2778ff;
|
|
|
+ background: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.themeDark {
|
|
|
+ .topPsty {
|
|
|
+ color: #1c99ff;
|
|
|
+ background: #1e2126;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style lang="less">
|
|
|
+ .el-overlay {
|
|
|
+ .el-overlay-dialog {
|
|
|
+ .reportDia {
|
|
|
+ margin-top: 0 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .reportDia {
|
|
|
+ .repoerDateBox {
|
|
|
+ width: calc(100% - 40px);
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
sunzehao