功率预测问题修复

components.d.ts

@@ -166,7 +166,7 @@ declare module 'vue' {
     StrightLineChart: typeof import('./src/components/chart/line/stright-line-chart.vue')['default']
     SubmitBtn: typeof import('./src/components/generatingCapacityComponent/SubmitBtn.vue')['default']
     SvgDraw: typeof import('./src/components/coms/icon/svg-draw.vue')['default']
-    SvgIcon: typeof import('./src/components/powerPredictionComponent/svgIcon/index.vue')['default']
+    SvgIcon: typeof import('./src/components/coms/icon/svg-icon.vue')['default']
     SvgPageShow: typeof import('./src/components/powerPredictionComponent/powerControlSvg/svgPageShow.vue')['default']
     Tab: typeof import('./src/components/coms/tabs/tab.vue')['default']
     Table: typeof import('./src/components/generatingCapacityComponent/table.vue')['default']

package.json

@@ -22,7 +22,7 @@
     "html2canvas": "^1.4.1",
     "js-cookie": "^3.0.5",
     "json-bigint": "^1.0.0",
-    "jspdf": "^2.5.1",
+    "jspdf": "^2.5.2",
     "jszip": "^3.10.1",
     "jszip-utils": "^0.1.0",
     "leaflet": "^1.9.4",

src/views/generatingCapacity/report/fixGetPDF.js

@@ -10,19 +10,20 @@
 import html2Canvas from 'html2canvas';
 import jsPDF from 'jspdf';
 const htmlToPdf = {
-    getPdf(loading, title,) {
-        let dom = null
+    getPdf(doms, title,) {
+        let dom = document.getElementById(doms);
         let domStr = ''
-        if (title === '经济运行分析会报告') {
-            dom = document.querySelector('#pdfDomop')
-            domStr = '#pdfDomop'
-        } else {
-            dom = document.querySelector('#pdfDom')
-            domStr = '#pdfDom'
-        }
-        let theme = dom.className === 'block' ? false : true
+        // if (title === '经济运行分析会报告') {
+        //     dom = document.querySelector('#pdfDomop')
+        //     domStr = '#pdfDomop'
+        // } else {
+        //     dom = document.querySelector('#pdfDom')
+        //     domStr = '#pdfDom'
+        // }
+        
+        // let theme = dom?.className === 'block' ? false : true
 
-        html2Canvas(document.querySelector(domStr), {
+        html2Canvas(dom, {
             allowTaint: false,
             taintTest: false,
             logging: false,
@@ -31,10 +32,10 @@ const htmlToPdf = {
             scale: 4, //按比例增加分辨率
         }).then((canvas) => {
             var pdf = new jsPDF('p', 'mm', 'a4'); //A4纸，纵向
-            if (!theme) {
-                pdf.setDrawColor(4, 12, 11);
-                pdf.rect(0, 0, pdf.internal.pageSize.getWidth(), pdf.internal.pageSize.getHeight(), 'F');
-            }
+            // if (!theme) {
+            //     // pdf.setDrawColor(4, 12, 11);
+            //     pdf.rect(0, 0, pdf.internal.pageSize.getWidth(), pdf.internal.pageSize.getHeight(), 'F');
+            // }
             var ctx = canvas.getContext('2d'),
                 a4w = 190,
                 a4h = 272, //A4大小，210mm x 297mm，四边各保留10mm的边距，显示区域190x277
@@ -71,10 +72,10 @@ const htmlToPdf = {
                 renderedHeight += imgHeight;
                 if (renderedHeight < canvas.height) {
                     pdf.addPage(); //如果后面还有内容，添加一个空页
-                    if (!theme) {
-                        pdf.setDrawColor(4, 12, 11);
-                        pdf.rect(0, 0, pdf.internal.pageSize.getWidth(), pdf.internal.pageSize.getHeight(), 'F');
-                    }
+                    // if (!theme) {
+                    //     // pdf.setDrawColor(4, 12, 11);
+                    //     pdf.rect(0, 0, pdf.internal.pageSize.getWidth(), pdf.internal.pageSize.getHeight(), 'F');
+                    // }
                 }
                 // delete page;
             }
@@ -84,6 +85,42 @@ const htmlToPdf = {
             console.log(loading);
         });
     },
+    getPDFfn(dom, title) { 
+        // 获取要转换为PDF的内容
+        const element = document.getElementById(dom);
+
+        // 使用html2canvas将HTML内容转换为canvas
+        html2Canvas(element, {
+            // scale: 2, // 提高分辨率
+            // logging: true, // 开启日志记录
+            // useCORS: true // 处理跨域图片
+
+            allowTaint: false,
+            taintTest: false,
+            logging: false,
+            useCORS: true,
+            dpi: window.devicePixelRatio * 4, //将分辨率提高到特定的DPI 提高四倍
+            scale: 4, //按比例增加分辨率
+        }).then((canvas) => { 
+            // 将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;
+    
+            // 添加图片到PDF
+            doc.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
+    
+            // 保存PDF文件
+            doc.save(title+'.pdf');
+        });
+
+    }
 };
 
 export default htmlToPdf;

src/views/generatingCapacity/yhjyReport/dataJson.json

@@ -28,23 +28,23 @@
             "value": ""
         },
         {
-            "name": "温度异常",
-            "nameEn": "wdyc",
+            "name": "停机次数",
+            "nameEn": "tjcs",
             "value": ""
         },
         {
-            "name": "故障预警",
-            "nameEn": "gzyj",
+            "name": "对风偏差",
+            "nameEn": "dfpc",
             "value": ""
         },
         {
-            "name": "停机次数",
-            "nameEn": "tjcs",
+            "name": "故障预警",
+            "nameEn": "gzyj",
             "value": ""
         },
         {
-            "name": "对风偏差",
-            "nameEn": "dfpc",
+            "name": "温度异常",
+            "nameEn": "wdyc",
             "value": ""
         },
         {
@@ -53,6 +53,14 @@
             "value": ""
         }
     ],
+    "orderMsg": {
+        "fdnlxj": "实际发电能力低于预期，功率曲线偏差较大。",
+        "tjcs": "频繁停机或运行时间较短的风机。",
+        "dfpc": "如静态偏航误差、动态偏航误差等。",
+        "gzyj": "根据传感器数据的预警模型，识别出潜在故障。",
+        "wdyc": "关键部件（如齿轮箱、发电机、变桨系统）温升超过阈值。",
+        "qtyh": "如振动，测风，电气，液压等异常。"
+    },
     "stationList": [
         {
             "id": "GJNY_SXGS_FSG_FDC_STA",
@@ -587,14 +595,6 @@
             ]
         }
     ],
-    "orderMsg": {
-        "fdnlxj": "实际发电能力低于预期，功率曲线偏差较大。",
-        "wdyc": "关键部件（如齿轮箱、发电机、变桨系统）温升超过阈值。",
-        "gzyj": "根据传感器数据的预警模型，识别出潜在故障。",
-        "tjcs": "频繁停机或运行时间较短的风机。从不运行时间较长的风机取前五名，风速大于3m/s。",
-        "dfpc": "如静态偏航误差、动态偏航误差等。",
-        "qtyh": "如变桨角度异常等。"
-    },
     "reportData":{
         "title": {
             "id": "181868052012130111311",
@@ -2814,74 +2814,7 @@
                 "performanceIssues": "是"
             }
         ],
-        "FilterResults": {
-            "F120": "发电能力下降，存在性能问题",
-            "F121": "发电能力下降，存在性能问题",
-            "F122": "发电能力下降，存在性能问题",
-            "F123": "发电能力下降，存在性能问题",
-            "F124": "发电能力下降，存在性能问题",
-            "F201": "发电能力下降，存在性能问题",
-            "F125": "发电能力下降，存在性能问题",
-            "F202": "发电能力下降，存在性能问题",
-            "F126": "发电能力下降，存在性能问题",
-            "F203": "发电能力下降，存在性能问题",
-            "F127": "发电能力下降，存在性能问题",
-            "F204": "发电能力下降，存在性能问题",
-            "F128": "发电能力下降，存在性能问题",
-            "F205": "发电能力下降，存在性能问题",
-            "F129": "发电能力下降，存在性能问题",
-            "F206": "发电能力下降，存在性能问题",
-            "F207": "发电能力下降，存在性能问题",
-            "F208": "发电能力下降，存在性能问题",
-            "F209": "发电能力下降，存在性能问题",
-            "F230": "发电能力下降，存在性能问题",
-            "F110": "发电能力下降，存在性能问题",
-            "F231": "发电能力下降，存在性能问题",
-            "F111": "发电能力下降，存在性能问题",
-            "F232": "发电能力下降，存在性能问题",
-            "F112": "发电能力下降，存在性能问题",
-            "F233": "发电能力下降，存在性能问题",
-            "F113": "发电能力下降，存在性能问题",
-            "F114": "发电能力下降，存在性能问题",
-            "F115": "发电能力下降，存在性能问题",
-            "F116": "发电能力下降，存在性能问题",
-            "F117": "发电能力下降，存在性能问题",
-            "F118": "发电能力下降，存在性能问题",
-            "F119": "发电能力下降，存在性能问题",
-            "F220": "发电能力下降，存在性能问题",
-            "F221": "发电能力下降，存在性能问题",
-            "F222": "发电能力下降，存在性能问题",
-            "F101": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F223": "发电能力下降，存在性能问题",
-            "F102": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F224": "发电能力下降，存在性能问题",
-            "F103": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F225": "发电能力下降，存在性能问题",
-            "F104": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F105": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F226": "发电能力下降，存在性能问题",
-            "F106": "发电能力下降，存在性能问题",
-            "F227": "发电能力下降，存在性能问题",
-            "F107": "发电能力下降，存在性能问题",
-            "F228": "发电能力下降，存在性能问题",
-            "F108": "发电能力下降，存在性能问题",
-            "F229": "发电能力下降，存在性能问题",
-            "F109": "发电能力下降，存在性能问题",
-            "F130": "发电能力下降，存在性能问题",
-            "F131": "发电能力下降，存在性能问题",
-            "F132": "发电能力下降，存在性能问题",
-            "F133": "发电能力下降，存在性能问题",
-            "F210": "发电能力下降，存在性能问题",
-            "F211": "发电能力下降，存在性能问题",
-            "F212": "发电能力下降，存在性能问题",
-            "F213": "发电能力下降，存在性能问题",
-            "F214": "发电能力下降，存在性能问题",
-            "F215": "发电能力下降，存在性能问题",
-            "F216": "发电能力下降，存在性能问题",
-            "F217": "发电能力下降，存在性能问题",
-            "F218": "发电能力下降，存在性能问题",
-            "F219": "发电能力下降，存在性能问题"
-        },
+        "FilterResults": "以下风机额定功率小于设定值：F122,F217,F231\n以下风机不运行时间较长：F101,F102,F103,F104,F105\n以下风机发电能力显著下降：F101,F102,F103,F104,F107\n以下风机存在状态类隐患：F101,F102,F103,F104,F105",
         "kkxwtls": [
             {
                 "id": 353,
@@ -7260,54 +7193,8 @@
                 "performanceIssues": "是"
             }
         ],
-        "FilterResults": {
-            "F101": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F102": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F103": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F104": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F107": "发电能力下降，存在状态类隐患，存在性能问题，存在可靠性问题",
-            "F108": "发电能力下降，存在性能问题",
-            "F110": "发电能力下降，存在性能问题",
-            "F111": "发电能力下降，存在性能问题",
-            "F112": "发电能力下降，存在性能问题",
-            "F113": "发电能力下降，存在性能问题",
-            "F114": "发电能力下降，存在性能问题",
-            "F115": "发电能力下降，存在性能问题",
-            "F116": "发电能力下降，存在性能问题",
-            "F117": "发电能力下降，存在性能问题",
-            "F118": "发电能力下降，存在性能问题",
-            "F119": "发电能力下降，存在性能问题",
-            "F120": "发电能力下降，存在性能问题",
-            "F121": "发电能力下降，存在性能问题",
-            "F122": "发电能力下降，存在性能问题",
-            "F123": "发电能力下降，存在性能问题",
-            "F124": "发电能力下降，存在性能问题",
-            "F125": "发电能力下降，存在性能问题",
-            "F126": "发电能力下降，存在性能问题",
-            "F127": "发电能力下降，存在性能问题",
-            "F128": "发电能力下降，存在性能问题",
-            "F129": "发电能力下降，存在性能问题",
-            "F131": "发电能力下降，存在性能问题",
-            "F133": "发电能力下降，存在性能问题",
-            "F201": "发电能力下降，存在性能问题",
-            "F204": "发电能力下降，存在性能问题",
-            "F207": "发电能力下降，存在性能问题",
-            "F208": "发电能力下降，存在性能问题",
-            "F209": "发电能力下降，存在性能问题",
-            "F210": "发电能力下降，存在性能问题",
-            "F211": "发电能力下降，存在性能问题",
-            "F212": "发电能力下降，存在性能问题",
-            "F214": "发电能力下降，存在性能问题",
-            "F216": "发电能力下降，存在性能问题",
-            "F217": "发电能力下降，存在性能问题",
-            "F222": "发电能力下降，存在性能问题",
-            "F223": "发电能力下降，存在性能问题",
-            "F225": "发电能力下降，存在性能问题",
-            "F229": "发电能力下降，存在性能问题",
-            "F230": "发电能力下降，存在性能问题",
-            "F231": "发电能力下降，存在性能问题",
-            "F233": "发电能力下降，存在性能问题"
-        },
+        "Filteranalysis": "以下风机额定功率小于设定值：F122,F217,F231；以下风机不运行时间较长：F101,F102,F103,F104,F105；以下风机发电能力显著下降：F101,F102,F103,F104,F107；以下风机存在状态类隐患：F101,F102,F103,F104,F105",
+        "FilterResults": "以下风机额定功率小于设定值：F122,F217,F231\n以下风机不运行时间较长：F101,F102,F103,F104,F105\n以下风机发电能力显著下降：F101,F102,F103,F104,F107\n以下风机存在状态类隐患：F101,F102,F103,F104,F105",
         "kkxwtls": [
             {
                 "id": 352,

src/views/generatingCapacity/yhjyReport/index.vue

@@ -16,13 +16,8 @@
                     </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="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>
@@ -30,7 +25,7 @@
             </div>
         </div>
         <div class="infoBox">
-            <div id="pdfDomop" :class="!theme ? 'block' : 'white'"
+            <div id="pdfDom" :class="!theme ? 'block' : 'white'" ref="pdfContent"
                 :style="!theme ? 'background-color: #040c0b' : 'background-color: #fff'">
                 <h2 style="
             font-weight: bolder;
@@ -57,23 +52,29 @@
                     :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"
+                <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>
+              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'">
+                <h3 style="
+            text-indent: 2em;
+            font-weight: bolder;
+            margin-bottom: 10px;
+            margin-top: 10px;
+          " :style="!theme ? 'color: #fff' : 'color: #000'">
                     2.筛选标准
                 </h3>
                 <p style="
@@ -84,23 +85,29 @@
           ">
                     本报告依据以下标准对风机进行筛选：
                 </p>
-                <div style="text-indent: 2em;line-height: 30px;font-size: 15px;" v-for="(item, index) in orderMsgArr"
+                <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>
+              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'">
+                <h3 style="
+            text-indent: 2em;
+            font-weight: bolder;
+            margin-bottom: 10px;
+            margin-top: 10px;
+          " :style="!theme ? 'color: #fff' : 'color: #000'">
                     3.风机筛选分析
                 </h3>
                 <p style="
@@ -112,20 +119,20 @@
                     根据以上标准，对每台风机的运行数据及隐患问题信息进行分析，结果如下：
                 </p>
                 <div class="warn-table">
-                    <el-table class="toolSty" :data="fjsxList1" border style="width: 100%; margin: 10px 0;"
+                    <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',
+              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)',
-                }">
+              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" />
@@ -147,18 +154,18 @@
                     <!-- 温度类隐患 -->
                     <el-table class="toolSty" :data="fjsxList2" 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',
+              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)',
-                }">
+              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" fixed />
                         <el-table-column prop="downtimeCount" align="center" label="故障停机次数" width="60" />
                         <el-table-column v-for="(item, index) in orderTableColumn2" :key="index" :label="item.name"
@@ -167,7 +174,7 @@
                                 align="center" width="68">
                                 <template #default="scope">
                                     <span>
-                                        {{ scope.row[res.code] ? scope.row[res.code] : '-' }}
+                                        {{ scope.row[res.code] ? scope.row[res.code] : "-" }}
                                     </span>
                                 </template>
                             </el-table-column>
@@ -179,8 +186,37 @@
 
                 <h4 style="text-indent: 2em; font-weight: bolder; margin: 10px 0"
                     :style="!theme ? 'color: #fff' : 'color: #000'">
-                    3.1 筛选结果
+                    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;
@@ -197,34 +233,43 @@
                 </div>
 
                 <!-- 风机情况说明 -->
-                <h3 style="text-indent: 2em; font-weight: bolder; margin-bottom: 10px; margin-top: 10px"
-                    :style="!theme ? 'color: #fff' : 'color: #000'">
-                    4.风机情况说明
+                <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'">
-                        {{`4.${index+1} ${key}` }}
+                        {{ `${key}号机组` }}
                     </h4>
-                    <div style="text-indent: 2em;line-height: 30px;font-size: 15px;" v-for="(item, index) in val"
+                    <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, index) in val"
                         :key="index">
-                        <span style="background: #fff;
+                        <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>
+                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 }}</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'">
+                <h3 style="
+            text-indent: 2em;
+            font-weight: bolder;
+            margin-bottom: 10px;
+            margin-top: 10px;
+          " :style="!theme ? 'color: #fff' : 'color: #000'">
                     5.检修建议
                 </h3>
                 <p style="
@@ -238,28 +283,33 @@
                 <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'">
-                        {{`5.${index+1} ${key}` }}
+                        {{ `${key}号机组` }}
                     </h4>
-                    <div style="text-indent: 2em;line-height: 30px;font-size: 15px;" v-for="(item, idx) in val"
+                    <div style="text-indent: 2em; line-height: 30px; font-size: 15px" v-for="(item, idx) in val"
                         :key="idx">
-                        <span style="background: #fff;
+                        <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>
+                margin: 0 15px 0 15px;
+              " :style="!theme ? 'background: #fff' : 'background: #000'"></span>
                         <!-- <span>{{idx+1}}</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 }}</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'">
+                <h3 style="
+            text-indent: 2em;
+            font-weight: bolder;
+            margin-bottom: 10px;
+            margin-top: 10px;
+          " :style="!theme ? 'color: #fff' : 'color: #000'">
                     6.结论
                 </h3>
                 <p style="
@@ -268,7 +318,7 @@
             text-align: justify;
             line-height: 22px;
           ">
-                    {{conclusionMsg}}
+                    {{ conclusionMsg }}
                 </p>
                 <!-- <div style="text-indent: 2em;line-height: 30px;font-size: 15px;"
                     v-for="(item, idx) in conclusionMsg.resultObj" :key="idx">
@@ -311,7 +361,6 @@
                         日期：XXX
                     </p>
                 </div> -->
-
             </div>
         </div>
     </div>
@@ -323,6 +372,8 @@
     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";
@@ -346,6 +397,7 @@
                 reportStation: "",
                 basrMsgArr: jsonData.basrMsgArr,
                 orderMsgArr: jsonData.orderMsgArr,
+                orderAnalysisArr: [],
                 orderResultArr: [],
                 maintenanceRecommendations: [],
                 windSituationReport: [],
@@ -371,7 +423,7 @@
         },
 
         mounted() {
-            this.funGetStation()
+            this.funGetStation();
         },
 
         methods: {
@@ -381,38 +433,109 @@
                 // this.renderReportPage({
                 //     data: jsonData.reldata
                 // });
-                that.stationList = []
-                that.reportStation = ""
+                that.stationList = [];
+                that.reportStation = "";
                 apiGetbaseStation().then((res) => {
                     if (res) {
                         that.stationList = res.data;
                         if (that.stationList.length) {
                             that.reportStation = that.stationList[0].id;
-                            that.handleReportOp()
+                            that.handleReportOp();
                         }
                     }
                 });
             },
-            exportPDFop() {
+            async exportPDFop() {
                 this.loading = true;
-                htmlToPdf.getPdf(
-                    document.querySelector("#pdfDomop"),
-                    "经济运行分析会报告"
-                );
-                setTimeout(() => {
-                    this.loading = false;
-                    ElMessage.success("打印成功!");
-                }, 1000);
+                // htmlToPdf.getPDFfn(
+                //     "pdfDom",
+                //     "优化建议报告"
+                // );
+                // setTimeout(() => {
+                //     this.loading = false;
+                //     ElMessage.success("打印成功!");
+                // }, 1000);
+                this.generatePDF()
+
+            },
+            async generatePDF() {
+                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('output.pdf');
+                } catch (error) {
+                    console.error('Error generating PDF:', error);
+                }
             },
             exportWORD() {
                 httpRequest
-                    .get(`/WarningReport/report?time=${this.reportParamDate}&wpid=${this.reportStation}`)
+                    .get(
+                        `/WarningReport/report?time=${this.reportParamDate}&wpid=${this.reportStation}`
+                    )
                     .then((tempRes) => {
-                        this.getWordFn(tempRes)
-                    }).catch(e => {
+                        this.getWordFn(tempRes);
+                    })
+                    .catch((e) => {
                         this.getWordFn({
-                            data: jsonData.data
-                        })
+                            data: jsonData.data,
+                        });
                     });
             },
             // 导出word方法
@@ -426,66 +549,67 @@
                     reportTime: tempRes.data.reporttime,
                     fjsxList1: tempRes.data.xnwtls,
                     fjsxList2: [],
+                    orderAnalysisArr: this.orderAnalysisArr,
                     orderResultArr: this.orderResultArr,
                     windSituationReportWord: [],
                     maintenanceRecommendationsWord: [],
-                    conclusionResult: `本次分析针对${tempRes.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`
-                }
+                    conclusionResult: `本次分析针对${tempRes.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`,
+                };
 
-                tempRes.data.kkxwtls.forEach(it => {
+                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] = '-'
+                                it[key] = "-";
                             }
                         }
                     }
-                })
-                temWordData.fjsxList2 = tempRes.data.kkxwtls
+                });
+                temWordData.fjsxList2 = tempRes.data.kkxwtls;
 
                 //4.风机情况说明
-                let qksmNum = 0
+                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 = []
+                        let eleArr = [];
 
-                        element.forEach(it => {
+                        element.forEach((it) => {
                             let eleObj = {
-                                name: it.substring(0, it.indexOf('：')),
-                                value: it.substring(it.indexOf('：'), it.length)
-                            }
-                            eleArr.push(eleObj)
-                        })
+                                name: it.substring(0, it.indexOf("：")),
+                                value: it.substring(it.indexOf("："), it.length),
+                            };
+                            eleArr.push(eleObj);
+                        });
                         let obj = {
                             index: qksmNum++,
                             windName: key,
-                            windValue: eleArr
-                        }
-                        temWordData.windSituationReportWord.push(obj)
+                            windValue: eleArr,
+                        };
+                        temWordData.windSituationReportWord.push(obj);
                     }
                 }
 
                 //5.风机情况说明
-                let jxjyNum = 0
+                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 eleArr = [];
+                        element.forEach((it) => {
                             let eleObj = {
-                                name: it.substring(0, it.indexOf(':')),
-                                value: it.substring(it.indexOf(':'), it.length)
-                            }
-                            eleArr.push(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)
+                            windValue: eleArr,
+                        };
+                        temWordData.maintenanceRecommendationsWord.push(obj);
                     }
                 }
 
@@ -512,9 +636,11 @@
                                 stack: error.stack,
                                 properties: error.properties,
                             };
-                            console.log(JSON.stringify({
-                                error: e
-                            }));
+                            console.log(
+                                JSON.stringify({
+                                    error: e,
+                                })
+                            );
                             throw error;
                         }
                         // 生成一个代表docxtemplater对象的zip文件（不是一个真实的文件，而是在内存中的表示）
@@ -530,68 +656,89 @@
             handleReportOp() {
                 if (this.reportParamDate) {
                     this.OperationName = "";
-                    this.OperationGs = ""
+                    this.OperationGs = "";
                     this.OperationMonth = "";
-                    this.basrMsgArr = []
-                    this.fjsxList1 = []
-                    this.fjsxList2 = []
-                    this.orderResultArr = []
-                    this.windSituationReport = {}
-                    this.maintenanceRecommendations = {}
-                    this.conclusionMsg = ""
+                    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}`)
+                        .get(
+                            `/WarningReport/report?time=${this.reportParamDate}&wpid=${this.reportStation}`
+                        )
                         .then((res) => {
                             this.renderReportPage(res);
                         })
                         .catch(() => {
                             this.renderReportPage({
-                                data: jsonData.reldata
+                                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 => {
+                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] + '月'
+                        it.value = date[0] + "年" + date[1] + "月";
                     } else {
-                        it.value = res.data.stationid[it.nameEn]
+                        it.value = res.data.stationid[it.nameEn];
                     }
-                })
+                });
 
-                this.orderMsgArr.forEach(it => {
-                    it.value = jsonData.orderMsg[it.nameEn]
-                })
+                this.orderMsgArr.forEach((it) => {
+                    it.value = jsonData.orderMsg[it.nameEn];
+                });
 
                 this.fjsxList1 = res.data.xnwtls;
                 this.fjsxList2 = res.data.kkxwtls;
                 // 3.1筛选结果
-                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
-                        }
-                        this.orderResultArr.push(obj)
+                res.data.Filteranalysis.split("；").forEach((ele) => {
+                    let obj = {
+                        windName: ele.split("：")[0],
+                        value: ele.split("：")[1]
                     }
-                }
+                    this.orderAnalysisArr.push(obj);
+                });
+                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
+                this.windSituationReport = res.data.qksm;
                 // 5检修建议
-                this.maintenanceRecommendations = res.data.jxjy
+                this.maintenanceRecommendations = res.data.jxjy;
 
                 this.conclusionMsg =
-                    `本次分析针对${res.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`
+                    `本次分析针对${res.data.stationid.aname}的风机发电能力下降及可靠性隐患进行了全面评估。通过实施短期和长期检修措施，预计将显著提高设备的发电效率和运行可靠性。`;
             },
         },
 
@@ -646,12 +793,9 @@
             background: #fff;
             overflow: scroll;
 
-            #pdfDomop {
+            #pdfDom {
                 margin: 20px;
-
             }
-
-
         }
 
         &.themeLight {

src/views/powerPrediction/component/power.json

@@ -1485,504 +1485,590 @@
     },
     "globalPowerPredictionChartData2": {
         "dataFormatList": [
-            {
-                "name": "理论",
-                "data": [
-                    0.11626600000000001,
-                    0.22816399999999998,
-                    1.0983209999999999,
-                    1.7967829999999998,
-                    2.290194,
-                    2.606036,
-                    2.128662,
-                    2.025283,
-                    2.2941700000000003,
-                    2.465363,
-                    3.243848,
-                    4.123433,
-                    5.517728,
-                    6.165694,
-                    6.95021,
-                    5.8811350000000004,
-                    8.07709,
-                    11.344355,
-                    10.925002000000001,
-                    8.30119,
-                    6.649412,
-                    8.865291,
-                    9.441736,
-                    10.356954,
-                    12.3656,
-                    16.781773,
-                    15.703359,
-                    16.595723999999997,
-                    16.596693,
-                    14.827625,
-                    12.772991,
-                    11.321477000000002,
-                    10.539136000000001,
-                    9.959066,
-                    10.998705,
-                    11.150547000000001,
-                    9.147966,
-                    8.283851,
-                    8.452446,
-                    5.730014,
-                    4.930219,
-                    6.090648,
-                    6.517353,
-                    5.82508,
-                    6.3510290000000005,
-                    7.566637,
-                    8.630962,
-                    7.502498999999999,
-                    6.582264,
-                    5.860528,
-                    4.991448999999999,
-                    3.524125,
-                    3.278988,
-                    3.8735340000000003,
-                    2.896201,
-                    1.1655989999999998,
-                    0.6644249999999999,
-                    0.744915,
-                    1.304962,
-                    1.6595250000000001,
-                    1.5888550000000001
-                ],
-                "xaxisData": null
-            },
-            {
-                "name": "可用",
-                "data": [
-                    0.113771,
-                    0.2235,
-                    1.043926,
-                    1.758695,
-                    2.240821,
-                    2.593714,
-                    2.081747,
-                    1.982135,
-                    2.2383,
-                    2.3984,
-                    3.233729,
-                    3.9651,
-                    5.494987,
-                    6.0183789999999995,
-                    6.861197,
-                    5.842138,
-                    7.8111239999999995,
-                    11.193344999999999,
-                    10.831620999999998,
-                    8.198754000000001,
-                    6.591729999999999,
-                    8.727183,
-                    9.300481,
-                    10.06542,
-                    12.053261000000001,
-                    15.621963,
-                    14.873218999999999,
-                    15.58361,
-                    15.770178,
-                    14.183704,
-                    12.555396,
-                    11.015902,
-                    10.267641,
-                    9.826514999999999,
-                    10.613745999999999,
-                    10.890165999999999,
-                    8.976106,
-                    8.224197,
-                    8.343114,
-                    5.642606,
-                    4.7576279999999995,
-                    5.991218,
-                    6.458829,
-                    5.774046,
-                    6.239001,
-                    7.316705,
-                    8.381920000000001,
-                    7.412033,
-                    6.481863000000001,
-                    5.76893,
-                    4.963488999999999,
-                    3.515346,
-                    3.2414560000000003,
-                    3.798331,
-                    2.83686,
-                    1.16502,
-                    0.664091,
-                    0.728523,
-                    1.2839690000000001,
-                    1.648518,
-                    1.581597
-                ],
-                "xaxisData": null
-            },
-            {
-                "name": "AGC",
-                "data": [
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006,
-                    43.182781000000006
-                ],
-                "xaxisData": null
-            },
-            {
-                "name": "短期",
-                "data": [
-                    23.062977,
-                    22.277086,
-                    21.599064,
-                    20.690155999999998,
-                    19.975313999999997,
-                    19.605102,
-                    19.079401999999998,
-                    18.677529,
-                    18.631833999999998,
-                    18.704137,
-                    18.682465,
-                    18.832584,
-                    19.030598,
-                    19.319633000000003,
-                    19.586645,
-                    19.524588,
-                    19.883691,
-                    19.804754,
-                    19.497854,
-                    19.151613,
-                    18.112236,
-                    17.132209,
-                    15.930200000000001,
-                    14.363887,
-                    12.825097,
-                    10.736559,
-                    9.047812,
-                    6.8388,
-                    4.705493000000001,
-                    2.588184,
-                    1.1008209999999998,
-                    -0.5546,
-                    -2.070839,
-                    -3.385609,
-                    -4.238123,
-                    -4.930662,
-                    -5.267946,
-                    -5.258902,
-                    -4.70055,
-                    -3.954786,
-                    -2.92571,
-                    -2.120601,
-                    -1.3140399999999999,
-                    -0.02506,
-                    1.264052,
-                    2.437544,
-                    3.825652,
-                    5.045738,
-                    6.239941,
-                    7.083719,
-                    8.095203,
-                    9.04408,
-                    9.690463,
-                    10.162438,
-                    10.781221,
-                    11.340301,
-                    11.798568,
-                    12.107734,
-                    12.521738,
-                    13.073822,
-                    13.377505999999999,
-                    13.861415999999998,
-                    14.463914,
-                    14.742606,
-                    15.226321,
-                    15.982004000000002,
-                    16.627115,
-                    17.228854,
-                    17.794953,
-                    18.527631,
-                    19.397805,
-                    20.220482,
-                    20.72199,
-                    21.25449,
-                    21.344209,
-                    21.435373,
-                    21.322117,
-                    21.068960999999998,
-                    20.683062999999997,
-                    20.115416,
-                    19.477588,
-                    18.411338,
-                    17.493984,
-                    16.608416000000002,
-                    15.745999,
-                    15.005708,
-                    14.143448000000001,
-                    13.136425,
-                    12.530512,
-                    12.073348,
-                    11.695675,
-                    11.026916,
-                    10.780537,
-                    10.783620999999998,
-                    11.191681,
-                    11.345141
-                ],
-                "xaxisData": null
-            },
-            {
-                "name": "超短期",
-                "data": [
-                    1.3954280000000001,
-                    3.1591129999999996,
-                    3.074888,
-                    2.5321640000000003,
-                    1.743166,
-                    2.266271,
-                    3.283061,
-                    4.402942,
-                    4.524763,
-                    4.483956,
-                    2.980381,
-                    2.212193,
-                    2.08503,
-                    2.6764,
-                    3.17046,
-                    3.09843,
-                    2.442139,
-                    2.30711,
-                    2.256288,
-                    2.952572,
-                    3.781804,
-                    3.13341,
-                    2.5291289999999997,
-                    2.018671
-                ],
-                "xaxisData": null
-            },
-            {
-                "name": "实际",
-                "data": [
-                    0.093447,
-                    0.143557,
-                    0.913408,
-                    1.4744549999999998,
-                    2.097629,
-                    2.58773,
-                    2.027205,
-                    2.057511,
-                    2.1811,
-                    2.310939,
-                    3.2497849999999997,
-                    3.7379029999999998,
-                    5.371778,
-                    5.867165,
-                    6.696911,
-                    5.858071,
-                    7.552846,
-                    11.141555,
-                    10.771806,
-                    8.17731,
-                    6.499969,
-                    8.632014999999999,
-                    9.304583000000001,
-                    9.978494000000001,
-                    11.844794,
-                    15.037144,
-                    14.640227999999999,
-                    15.335873,
-                    15.596635000000001,
-                    13.991817,
-                    12.376227,
-                    10.868765,
-                    10.120223,
-                    9.769466,
-                    10.505734,
-                    10.81493,
-                    8.96303,
-                    8.202151,
-                    8.233869,
-                    5.404851,
-                    4.542929,
-                    5.631602,
-                    6.112246,
-                    5.4289819999999995,
-                    5.929206,
-                    6.6746490000000005,
-                    7.86912,
-                    6.92686,
-                    6.125488000000001,
-                    5.524787,
-                    4.871506999999999,
-                    3.460814,
-                    3.037176,
-                    3.656244,
-                    2.86063,
-                    0.933868,
-                    0.60699,
-                    0.5521309999999999,
-                    1.052691,
-                    1.522199,
-                    1.427337
-                ],
-                "xaxisData": null
-            }
-        ],
-        "dateList": [
-            "2024-11-12 00:15:00",
-            "2024-11-12 00:30:00",
-            "2024-11-12 00:45:00",
-            "2024-11-12 01:00:00",
-            "2024-11-12 01:15:00",
-            "2024-11-12 01:30:00",
-            "2024-11-12 01:45:00",
-            "2024-11-12 02:00:00",
-            "2024-11-12 02:15:00",
-            "2024-11-12 02:30:00",
-            "2024-11-12 02:45:00",
-            "2024-11-12 03:00:00",
-            "2024-11-12 03:15:00",
-            "2024-11-12 03:30:00",
-            "2024-11-12 03:45:00",
-            "2024-11-12 04:00:00",
-            "2024-11-12 04:15:00",
-            "2024-11-12 04:30:00",
-            "2024-11-12 04:45:00",
-            "2024-11-12 05:00:00",
-            "2024-11-12 05:15:00",
-            "2024-11-12 05:30:00",
-            "2024-11-12 05:45:00",
-            "2024-11-12 06:00:00",
-            "2024-11-12 06:15:00",
-            "2024-11-12 06:30:00",
-            "2024-11-12 06:45:00",
-            "2024-11-12 07:00:00",
-            "2024-11-12 07:15:00",
-            "2024-11-12 07:30:00",
-            "2024-11-12 07:45:00",
-            "2024-11-12 08:00:00",
-            "2024-11-12 08:15:00",
-            "2024-11-12 08:30:00",
-            "2024-11-12 08:45:00",
-            "2024-11-12 09:00:00",
-            "2024-11-12 09:15:00",
-            "2024-11-12 09:30:00",
-            "2024-11-12 09:45:00",
-            "2024-11-12 10:00:00",
-            "2024-11-12 10:15:00",
-            "2024-11-12 10:30:00",
-            "2024-11-12 10:45:00",
-            "2024-11-12 11:00:00",
-            "2024-11-12 11:15:00",
-            "2024-11-12 11:30:00",
-            "2024-11-12 11:45:00",
-            "2024-11-12 12:00:00",
-            "2024-11-12 12:15:00",
-            "2024-11-12 12:30:00",
-            "2024-11-12 12:45:00",
-            "2024-11-12 13:00:00",
-            "2024-11-12 13:15:00",
-            "2024-11-12 13:30:00",
-            "2024-11-12 13:45:00",
-            "2024-11-12 14:00:00",
-            "2024-11-12 14:15:00",
-            "2024-11-12 14:30:00",
-            "2024-11-12 14:45:00",
-            "2024-11-12 15:00:00",
-            "2024-11-12 15:15:00",
-            "2024-11-12 15:30:00",
-            "2024-11-12 15:45:00",
-            "2024-11-12 16:00:00",
-            "2024-11-12 16:15:00",
-            "2024-11-12 16:30:00",
-            "2024-11-12 16:45:00",
-            "2024-11-12 17:00:00",
-            "2024-11-12 17:15:00",
-            "2024-11-12 17:30:00",
-            "2024-11-12 17:45:00",
-            "2024-11-12 18:00:00",
-            "2024-11-12 18:15:00",
-            "2024-11-12 18:30:00",
-            "2024-11-12 18:45:00",
-            "2024-11-12 19:00:00",
-            "2024-11-12 19:15:00",
-            "2024-11-12 19:30:00",
-            "2024-11-12 19:45:00",
-            "2024-11-12 20:00:00",
-            "2024-11-12 20:15:00",
-            "2024-11-12 20:30:00",
-            "2024-11-12 20:45:00",
-            "2024-11-12 21:00:00",
-            "2024-11-12 21:15:00",
-            "2024-11-12 21:30:00",
-            "2024-11-12 21:45:00",
-            "2024-11-12 22:00:00",
-            "2024-11-12 22:15:00",
-            "2024-11-12 22:30:00",
-            "2024-11-12 22:45:00",
-            "2024-11-12 23:00:00",
-            "2024-11-12 23:15:00",
-            "2024-11-12 23:30:00",
-            "2024-11-12 23:45:00",
-            "2024-11-13 00:00:00"
-        ]
+                {
+                    "name": "理论",
+                    "data": [
+                        0.0,
+                        0.0,
+                        0.006533000000000001,
+                        0.0,
+                        0.019600000000000003,
+                        0.06749,
+                        0.064848,
+                        0.07085,
+                        0.174604,
+                        0.430779,
+                        1.093595,
+                        1.1971939999999999,
+                        1.336,
+                        1.446032,
+                        1.680677,
+                        1.809589,
+                        1.783965,
+                        2.379343,
+                        1.57299,
+                        1.612171,
+                        1.660201,
+                        0.789379,
+                        0.425491,
+                        0.409931,
+                        0.30925,
+                        0.148416,
+                        0.511414,
+                        0.352259,
+                        1.10175,
+                        2.2477869999999998,
+                        5.28815,
+                        7.066634,
+                        8.808583,
+                        7.444564000000001,
+                        8.476716,
+                        6.448217,
+                        6.786687,
+                        7.55628,
+                        5.579575,
+                        3.7257979999999997,
+                        4.807752000000001,
+                        2.362418,
+                        3.501741,
+                        5.221674,
+                        5.593104,
+                        9.835237999999999,
+                        11.25607,
+                        11.542406000000001,
+                        8.587088,
+                        9.69585,
+                        9.338318,
+                        8.658828999999999,
+                        9.554885,
+                        12.923684999999999,
+                        10.845169,
+                        10.685428,
+                        10.409047000000001,
+                        8.612308,
+                        6.592894,
+                        10.457924,
+                        8.924897999999999,
+                        12.94331,
+                        11.746362,
+                        10.833364
+                    ],
+                    "xaxisData": null
+                },
+                {
+                    "name": "可用",
+                    "data": [
+                        0.0,
+                        0.0,
+                        0.00588,
+                        0.0,
+                        0.01764,
+                        0.06074,
+                        0.061502,
+                        0.06819599999999999,
+                        0.168703,
+                        0.40798399999999996,
+                        1.001078,
+                        1.1782260000000002,
+                        1.312455,
+                        1.419073,
+                        1.648287,
+                        1.733497,
+                        1.7502170000000001,
+                        2.346779,
+                        1.56969,
+                        1.604727,
+                        1.64472,
+                        0.788335,
+                        0.424888,
+                        0.409725,
+                        0.309095,
+                        0.146357,
+                        0.507422,
+                        0.35208300000000003,
+                        1.074522,
+                        2.21559,
+                        5.1980129999999996,
+                        6.935496,
+                        8.677021,
+                        7.288232,
+                        8.378082000000001,
+                        6.424345000000001,
+                        6.692189,
+                        7.456592,
+                        5.548437,
+                        3.661345,
+                        4.733395000000001,
+                        2.302444,
+                        3.380632,
+                        5.120066,
+                        5.506085,
+                        9.691242,
+                        11.107778,
+                        11.471112,
+                        8.582792,
+                        9.660177,
+                        9.242102999999998,
+                        8.586782999999999,
+                        9.463978,
+                        12.84468,
+                        10.737991,
+                        10.591535,
+                        10.263346,
+                        8.561736000000002,
+                        6.487356,
+                        10.351678,
+                        8.682274,
+                        12.865591,
+                        11.712001,
+                        10.748384
+                    ],
+                    "xaxisData": null
+                },
+                {
+                    "name": "AGC",
+                    "data": [
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        43.182781000000006,
+                        13.011406000000001,
+                        10.187769,
+                        13.764258,
+                        13.764258,
+                        17.37907,
+                        17.37907,
+                        17.37907
+                    ],
+                    "xaxisData": null
+                },
+                {
+                    "name": "短期",
+                    "data": [
+                        7.283,
+                        6.161293,
+                        5.071131,
+                        4.744854,
+                        3.431163,
+                        2.243855,
+                        0.48570100000000005,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.97812,
+                        2.186204,
+                        2.517346,
+                        1.538027,
+                        0.807929,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.872583,
+                        1.1521780000000001,
+                        0.7210059999999999,
+                        0.657672,
+                        0.37071699999999996,
+                        0.047852,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.32069,
+                        1.622683,
+                        2.4943519999999997,
+                        3.8516909999999998,
+                        5.145653,
+                        6.766228,
+                        8.571784,
+                        10.222627000000001,
+                        11.780191,
+                        13.276854,
+                        14.088313,
+                        15.030147999999999,
+                        15.435289000000001,
+                        15.549710999999999,
+                        15.870417,
+                        15.081052,
+                        14.699519,
+                        13.802223,
+                        12.502727,
+                        11.273644,
+                        9.499353999999999,
+                        8.312072
+                    ],
+                    "xaxisData": null
+                },
+                {
+                    "name": "超短期",
+                    "data": [
+                        2.594996,
+                        2.6531640000000003,
+                        3.179732,
+                        3.658049,
+                        3.979475,
+                        4.484711,
+                        4.065679,
+                        4.281703,
+                        4.664035,
+                        5.098738999999999,
+                        4.265104,
+                        2.881812,
+                        1.900217,
+                        1.312074,
+                        1.140382,
+                        1.434677,
+                        1.728604,
+                        1.618652,
+                        0.787674,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.08893899999999999,
+                        0.490163,
+                        0.343702,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.5220629999999999,
+                        1.562927,
+                        2.068437,
+                        1.5968699999999998,
+                        2.313602,
+                        2.5713850000000003,
+                        3.5462860000000003,
+                        4.626392,
+                        4.569212,
+                        4.538375,
+                        4.591085,
+                        3.903221,
+                        3.648363,
+                        3.993261,
+                        4.278341,
+                        5.558198999999999,
+                        6.80328,
+                        7.42977,
+                        6.706125,
+                        6.940549,
+                        6.17249,
+                        5.370979999999999,
+                        5.171072000000001,
+                        7.022129,
+                        5.866907,
+                        6.694349,
+                        6.286462,
+                        4.845314,
+                        4.289488,
+                        4.980613,
+                        5.035395,
+                        6.852625,
+                        5.899573999999999,
+                        5.336645000000001,
+                        2.124099,
+                        0.029792000000000003,
+                        0.339881,
+                        1.426257,
+                        2.799817,
+                        3.49916,
+                        4.265202,
+                        5.026823,
+                        6.516433,
+                        7.105963,
+                        7.60863,
+                        7.575747000000001,
+                        6.778404999999999,
+                        5.935938,
+                        5.327889,
+                        5.253035,
+                        6.301521,
+                        6.716044,
+                        7.295802,
+                        7.416282,
+                        6.139811,
+                        5.3210299999999995,
+                        5.062755,
+                        16.36463,
+                        17.752373,
+                        19.237785,
+                        20.498412000000002,
+                        22.538588,
+                        24.28398,
+                        26.078105,
+                        27.539666
+                    ],
+                    "xaxisData": null
+                },
+                {
+                    "name": "实际",
+                    "data": [
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.0,
+                        0.035789,
+                        0.044631,
+                        0.044441,
+                        0.201516,
+                        0.531531,
+                        1.109916,
+                        1.253682,
+                        1.340923,
+                        1.549428,
+                        1.638632,
+                        1.568583,
+                        2.035728,
+                        1.536615,
+                        1.613699,
+                        1.650145,
+                        0.7203379999999999,
+                        0.419041,
+                        0.334582,
+                        0.2868,
+                        0.108602,
+                        0.293262,
+                        0.346154,
+                        0.872414,
+                        1.767789,
+                        4.249924,
+                        6.593037000000001,
+                        7.931993,
+                        6.740257,
+                        7.7434840000000005,
+                        6.287243999999999,
+                        6.293473,
+                        6.971361,
+                        5.062041,
+                        3.3730610000000003,
+                        4.495439,
+                        2.139643,
+                        3.133302,
+                        4.858779999999999,
+                        5.35876,
+                        9.430841000000001,
+                        11.102917,
+                        11.215487999999999,
+                        8.701599,
+                        9.580642,
+                        9.161245999999998,
+                        8.591483,
+                        9.477412000000001,
+                        12.9565,
+                        10.607735,
+                        10.595374,
+                        10.225536,
+                        8.114924,
+                        6.393107,
+                        10.161916999999999,
+                        8.678511,
+                        13.062265,
+                        11.625426,
+                        10.842759
+                    ],
+                    "xaxisData": null
+                }
+            ],
+            "dateList": [
+                "2024-11-14 00:15:00",
+                "2024-11-14 00:30:00",
+                "2024-11-14 00:45:00",
+                "2024-11-14 01:00:00",
+                "2024-11-14 01:15:00",
+                "2024-11-14 01:30:00",
+                "2024-11-14 01:45:00",
+                "2024-11-14 02:00:00",
+                "2024-11-14 02:15:00",
+                "2024-11-14 02:30:00",
+                "2024-11-14 02:45:00",
+                "2024-11-14 03:00:00",
+                "2024-11-14 03:15:00",
+                "2024-11-14 03:30:00",
+                "2024-11-14 03:45:00",
+                "2024-11-14 04:00:00",
+                "2024-11-14 04:15:00",
+                "2024-11-14 04:30:00",
+                "2024-11-14 04:45:00",
+                "2024-11-14 05:00:00",
+                "2024-11-14 05:15:00",
+                "2024-11-14 05:30:00",
+                "2024-11-14 05:45:00",
+                "2024-11-14 06:00:00",
+                "2024-11-14 06:15:00",
+                "2024-11-14 06:30:00",
+                "2024-11-14 06:45:00",
+                "2024-11-14 07:00:00",
+                "2024-11-14 07:15:00",
+                "2024-11-14 07:30:00",
+                "2024-11-14 07:45:00",
+                "2024-11-14 08:00:00",
+                "2024-11-14 08:15:00",
+                "2024-11-14 08:30:00",
+                "2024-11-14 08:45:00",
+                "2024-11-14 09:00:00",
+                "2024-11-14 09:15:00",
+                "2024-11-14 09:30:00",
+                "2024-11-14 09:45:00",
+                "2024-11-14 10:00:00",
+                "2024-11-14 10:15:00",
+                "2024-11-14 10:30:00",
+                "2024-11-14 10:45:00",
+                "2024-11-14 11:00:00",
+                "2024-11-14 11:15:00",
+                "2024-11-14 11:30:00",
+                "2024-11-14 11:45:00",
+                "2024-11-14 12:00:00",
+                "2024-11-14 12:15:00",
+                "2024-11-14 12:30:00",
+                "2024-11-14 12:45:00",
+                "2024-11-14 13:00:00",
+                "2024-11-14 13:15:00",
+                "2024-11-14 13:30:00",
+                "2024-11-14 13:45:00",
+                "2024-11-14 14:00:00",
+                "2024-11-14 14:15:00",
+                "2024-11-14 14:30:00",
+                "2024-11-14 14:45:00",
+                "2024-11-14 15:00:00",
+                "2024-11-14 15:15:00",
+                "2024-11-14 15:30:00",
+                "2024-11-14 15:45:00",
+                "2024-11-14 16:00:00",
+                "2024-11-14 16:15:00",
+                "2024-11-14 16:30:00",
+                "2024-11-14 16:45:00",
+                "2024-11-14 17:00:00",
+                "2024-11-14 17:15:00",
+                "2024-11-14 17:30:00",
+                "2024-11-14 17:45:00",
+                "2024-11-14 18:00:00",
+                "2024-11-14 18:15:00",
+                "2024-11-14 18:30:00",
+                "2024-11-14 18:45:00",
+                "2024-11-14 19:00:00",
+                "2024-11-14 19:15:00",
+                "2024-11-14 19:30:00",
+                "2024-11-14 19:45:00",
+                "2024-11-14 20:00:00",
+                "2024-11-14 20:15:00",
+                "2024-11-14 20:30:00",
+                "2024-11-14 20:45:00",
+                "2024-11-14 21:00:00",
+                "2024-11-14 21:15:00",
+                "2024-11-14 21:30:00",
+                "2024-11-14 21:45:00",
+                "2024-11-14 22:00:00",
+                "2024-11-14 22:15:00",
+                "2024-11-14 22:30:00",
+                "2024-11-14 22:45:00",
+                "2024-11-14 23:00:00",
+                "2024-11-14 23:15:00",
+                "2024-11-14 23:30:00",
+                "2024-11-14 23:45:00",
+                "2024-11-15 00:00:00"
+            ]
     }
 }

src/views/powerPrediction/component/statisticalSummary.json

@@ -381,6 +381,38 @@
                 "forecastWindSpeedTq": null,
                 "actualWindSpeedSy": null,
                 "forecastWindSpeedSy": null,
+                "january": 9472.26,
+                "february": 10492.0,
+                "march": 11190.0,
+                "april": 10808.0,
+                "may": 7301.58,
+                "june": 9750.0,
+                "july": 11155.0,
+                "august": 11325.0,
+                "september": 9557.0,
+                "october": 10304.0,
+                "november": 10225.0,
+                "december": 10703.0
+            },
+            {
+                "dataTime": null,
+                "theoreticalPower": null,
+                "availablePower": null,
+                "actualPowerDq": null,
+                "veryShortTermForecastDq": null,
+                "shortTermForecastDq": null,
+                "actualPowerTq": null,
+                "veryShortTermForecastTq": null,
+                "shortTermForecastTq": null,
+                "actualPowerSy": null,
+                "veryShortTermForecastSy": null,
+                "shortTermForecastSy": null,
+                "actualWindSpeedDq": null,
+                "forecastWindSpeedDq": null,
+                "actualWindSpeedTq": null,
+                "forecastWindSpeedTq": null,
+                "actualWindSpeedSy": null,
+                "forecastWindSpeedSy": null,
                 "january": 11245.374,
                 "february": 8624.14,
                 "march": 13214.845,

src/views/powerPrediction/homePageNoMap.vue

@@ -668,6 +668,10 @@
                     color: "#e96366",
                 },
                 {
+                    name: "短期",
+                    color: "#39d93d",
+                },
+                {
                     name: "实际",
                     color: "#7ac1dd",
                 },
@@ -726,8 +730,8 @@
             },
         },
         mounted() {
-            // this.initPageData();
-            this.initPageFn()
+            this.initPageData();
+            // this.initPageFn()
         },
         beforeRouteLeave(to, from, next) {
             next();
@@ -1665,8 +1669,8 @@
                                         <span style="display:inline-block;">${it.seriesName}:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
 
-                                            this.showpowerLegend[index].name = it.seriesName;
-                                            this.showpowerLegend[index].color = it.color;
+                                            // this.showpowerLegend[index].name = it.seriesName;
+                                            // this.showpowerLegend[index].color = it.color;
                                         } else {
                                             if (it.axisValue === "00:15:00") {
                                                 it.color = "#e96366";
@@ -1679,12 +1683,12 @@
                                           it.color === "#e96366" ? "超短期" : "短期"
                                         }:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
-                                            if (it.color === "#e96366") {
-                                                this.showpowerLegend[index].name = "超短期";
-                                            } else {
-                                                this.showpowerLegend[index].name = "短期";
-                                            }
-                                            this.showpowerLegend[index].color = it.color;
+                                            // if (it.color === "#e96366") {
+                                            //     this.showpowerLegend[index].name = "超短期";
+                                            // } else {
+                                            //     this.showpowerLegend[index].name = "短期";
+                                            // }
+                                            // this.showpowerLegend[index].color = it.color;
                                         }
                                         str = str + strMsg;
                                     });
@@ -1700,12 +1704,12 @@
                                         item[0].color === "#e96366" ? "超短期" : "短期"
                                     }:</span>&nbsp;&nbsp;<span>${item[0].value}</span>
                                         </div>`;
-                                    if (item[0].color === "#e96366") {
-                                        this.showpowerLegend[3].name = "超短期";
-                                    } else {
-                                        this.showpowerLegend[3].name = "短期";
-                                    }
-                                    this.showpowerLegend[3].color = item[0].color;
+                                    // if (item[0].color === "#e96366") {
+                                    //     this.showpowerLegend[3].name = "超短期";
+                                    // } else {
+                                    //     this.showpowerLegend[3].name = "短期";
+                                    // }
+                                    // this.showpowerLegend[3].color = item[0].color;
                                     str = str + strMsg;
                                 }
                                 return str;
@@ -1776,6 +1780,13 @@
                         name: title === "今日功率预测" ?
                             "兆瓦(Mw)" : title === "今日风速预测" ?
                             "m/s" : "W/㎡",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     },
                     series: series,
                 };
@@ -1814,7 +1825,7 @@
                                 },
                                 {
                                     gt: num,
-                                    color: "#39ccd9",
+                                    color: "#39d93d",
                                 },
                             ],
                         };
@@ -1988,6 +1999,13 @@
                     yAxis: [{
                         type: "value",
                         name: title === "预测考核分数" ? "分" : "兆瓦(M/w)",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     }, ],
                     series: series,
                 };

src/views/powerPrediction/panoramicPower.vue

@@ -31,7 +31,7 @@
                 display: flex;
                 float: right;
                 justify-content: end;
-                margin-right: 53px;
+                margin-right: 5px;
               ">
                             <div v-for="it in item.showpowerLegend" :key="it.name">
                                 <span class="lineColor" :style="{ background: it.color }"></span>
@@ -331,11 +331,11 @@
         },
         mounted() {
             let that = this;
-            // that.initPageData();
+            that.initPageData();
             // that.getChartData();
             that.getWindStatus();
             that.planFiveMin = setInterval(function () {
-                that.getChartData();
+                // that.getChartData();
             }, 300000);
         },
         computed: {
@@ -399,6 +399,10 @@
                                     color: "#e96366",
                                 },
                                 {
+                                    name: "短期",
+                                    color: "#39d93d",
+                                },
+                                {
                                     name: "实际",
                                     color: "#7ac1dd",
                                 },
@@ -602,9 +606,9 @@
                                         <span style="display:inline-block;margin-right:4px;margin-top:3px;border-radius:10px;width:10px;height:10px;background-color:${it.color};\"></span>&nbsp;
                                         <span style="display:inline-block;">${it.seriesName}:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
-                                        this.chartsData[numxc].showpowerLegend[index].name =
-                                            it.seriesName;
-                                        this.chartsData[numxc].showpowerLegend[index].color = it.color;
+                                        // this.chartsData[numxc].showpowerLegend[index].name =
+                                        //     it.seriesName;
+                                        // this.chartsData[numxc].showpowerLegend[index].color = it.color;
                                     } else {
                                         if (it.axisValue === "00:15:00") {
                                             it.color = "#e96366";
@@ -617,12 +621,12 @@
                                           it.color === "#e96366" ? "超短期" : "短期"
                                         }:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
-                                        if (it.color === "#e96366") {
-                                            this.chartsData[numxc].showpowerLegend[index].name = "超短期";
-                                        } else {
-                                            this.chartsData[numxc].showpowerLegend[index].name = "短期";
-                                        }
-                                        this.chartsData[numxc].showpowerLegend[index].color = it.color;
+                                        // if (it.color === "#e96366") {
+                                        //     this.chartsData[numxc].showpowerLegend[index].name = "超短期";
+                                        // } else {
+                                        //     this.chartsData[numxc].showpowerLegend[index].name = "短期";
+                                        // }
+                                        // this.chartsData[numxc].showpowerLegend[index].color = it.color;
                                     }
                                     str = str + strMsg;
                                 });
@@ -638,12 +642,12 @@
                                     item[0].color === "#e96366" ? "超短期" : "短期"
                                 }:</span>&nbsp;&nbsp;<span>${item[0].value}</span>
                                     </div>`;
-                                if (item[0].color === "#e96366") {
-                                    this.chartsData[numxc].showpowerLegend[3].name = "超短期";
-                                } else {
-                                    this.chartsData[numxc].showpowerLegend[3].name = "短期";
-                                }
-                                this.chartsData[numxc].showpowerLegend[3].color = item[0].color;
+                                // if (item[0].color === "#e96366") {
+                                //     this.chartsData[numxc].showpowerLegend[3].name = "超短期";
+                                // } else {
+                                //     this.chartsData[numxc].showpowerLegend[3].name = "短期";
+                                // }
+                                // this.chartsData[numxc].showpowerLegend[3].color = item[0].color;
                                 str = str + strMsg;
                             }
                             return str;
@@ -669,6 +673,13 @@
                     yAxis: {
                         type: "value",
                         name: "兆瓦(Mw)",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     },
                     series: series,
                 };
@@ -703,7 +714,7 @@
                             },
                             {
                                 gt: num,
-                                color: "#39ccd9",
+                                color: "#39d93d",
                             },
                         ],
                     };

src/views/powerPrediction/powerPredictionPage.vue

@@ -1,9 +1,9 @@
 <template>
     <div class="powerPredictionPage" :class="!theme ? 'themeDark' : 'themeLight'">
         <el-row class="windStstus">
-            <el-col :span="6" class="scrollbar">
+            <el-col :span="10" class="scrollbar">
                 <!-- <span class="scrollbarName">场站名称：</span> -->
-                <div class="seachPower">
+                <!-- <div class="seachPower">
                     <el-form class="generat-seach" :inline="true">
                         <el-form-item label="场站">
                             <el-select v-model="reportStation" placeholder="选择场站" @change="changeWindNo">
@@ -16,19 +16,19 @@
                             <el-button type="primary" @click="seachData">查询</el-button>
                         </el-form-item>
                     </el-form>
+                </div> -->
+                <!-- <el-scrollbar> -->
+                <div class="scrollbar-flex-content " style="transform: scale(.9)">
+                    <p v-for="item in stationData" :key="item.no" class="scrollbar-demo-item"
+                        :class="item.showBac ? 'changeBacksty' : 'defaultBacksty'" @click="changeStation(item.no)">
+                        {{ item.stationName }}
+                    </p>
                 </div>
-                <!-- <el-scrollbar>
-                    <div class="scrollbar-flex-content">
-                        <p v-for="item in stationData" :key="item.no" class="scrollbar-demo-item"
-                            :class="item.showBac ? 'changeBacksty' : 'defaultBacksty'" @click="changeStation(item.no)">
-                            {{ item.stationName }}
-                        </p>
-                    </div>
-                </el-scrollbar> -->
+                <!-- </el-scrollbar> -->
             </el-col>
-            <el-col :span="17">
-                <div class="everyOne" v-for="(item, index) in !theme ? statusData : statusDataW" :key="index"
-                    :style="statusSty(item)">
+            <el-col :span="14">
+                <div class="everyOne" style="transform: scale(.85)"
+                    v-for="(item, index) in !theme ? statusData : statusDataW" :key="index" :style="statusSty(item)">
                     <div class="everyOneImg" style="width: 39px">
                         <img :src="item.img" alt="" />
                     </div>
@@ -42,7 +42,7 @@
         </el-row>
         <div class="lineMain" :style="pageHeight">
             <el-row>
-                <el-col :span="14">
+                <el-col :span="12">
                     <div class="lineStyle" v-on:dblclick="doubleclick('功率预测')" style="position: relative">
                         <div style="
                 display: flex;
@@ -82,7 +82,7 @@
                         <div id="assessmentChart" :style="chartStyle"></div>
                     </div>
                 </el-col>
-                <el-col :span="10">
+                <el-col :span="12">
                     <div class="lineStyle1" style="position: relative">
                         <div class="chart-name">
                             <div class="point point-left bottom"></div>
@@ -435,11 +435,14 @@
                     color: "#e96366",
                 },
                 {
+                    name: "短期",
+                    color: "#39d93d",
+                },
+                {
                     name: "实际",
                     color: "#7ac1dd",
                 },
             ];
-            // this.getStationData();
         },
         computed: {
             pageHeight() {
@@ -489,6 +492,8 @@
         methods: {
             initPageData() {
                 const that = this;
+                that.stationData = jsonData.glStationsAllData.list;
+                that.stationData[0].showBac = true;
 
                 {
                     let xAxis = [];
@@ -722,13 +727,14 @@
                 return `border: 1px solid ${item.borderSty};background:${item.numBack}`;
             },
             doubleclick(name) {
-                let title = this.reportStation;
+                // let title = this.reportStation;
+                let title = "";
                 // debugger
-                // this.stationData.forEach((item) => {
-                //     if (item.stationName === this.windTurbines) {
-                //         title = item.stationName;
-                //     }
-                // });
+                this.stationData.forEach((item) => {
+                    if (item.stationName === this.windTurbines) {
+                        title = item.stationName;
+                    }
+                });
                 this.$refs.prediction.dialogVisible = true;
                 this.$refs.prediction.isPower = false;
                 this.$refs.prediction.tableData = [];
@@ -769,7 +775,7 @@
                     this.stationData = datas.data.list;
                     this.stationData[0].showBac = true;
                     this.windTurbines = datas.data.list[0].no;
-                    this.reportStation = datas.data.list[0].stationName;
+                    // this.reportStation = datas.data.list[0].stationName;
                     this.stationCode = datas.data.list[0].stationCode;
                     this.itemVal = datas.data.list[0].itemVal;
                     this.getPowerPrediction();
@@ -830,6 +836,18 @@
                         }
                     })
             },
+            changeStation(val) {
+                this.windTurbines = val;
+                this.stationData.forEach((item) => {
+                    if (item.no === val) {
+                        this.itemVal = item.itemVal;
+                        item.showBac = true;
+                    } else {
+                        item.showBac = false;
+                    }
+                });
+                this.seachData();
+            },
             changeWindNo(val) {
                 this.windTurbines = val
                 this.stationData.forEach((item) => {
@@ -859,6 +877,7 @@
                 return picture;
             },
             seachData() {
+                this.getStationData();
                 this.getPowerPrediction();
                 this.getWindSpeed();
                 this.getCapacity();
@@ -991,8 +1010,8 @@
                                         <span style="display:inline-block;margin-right:4px;margin-top:3px;border-radius:10px;width:10px;height:10px;background-color:${it.color};\"></span>&nbsp;
                                         <span style="display:inline-block;">${it.seriesName}:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
-                                            this.showpowerLegend[index].name = it.seriesName;
-                                            this.showpowerLegend[index].color = it.color;
+                                            // this.showpowerLegend[index].name = it.seriesName;
+                                            // this.showpowerLegend[index].color = it.color;
                                         } else {
                                             if (it.axisValue === "00:15:00") {
                                                 it.color = "#e96366";
@@ -1005,12 +1024,12 @@
                                           it.color === "#e96366" ? "超短期" : "短期"
                                         }:</span>&nbsp;&nbsp;<span>${it.value}</span>
                                             </div>`;
-                                            if (it.color === "#e96366") {
-                                                this.showpowerLegend[index].name = "超短期";
-                                            } else {
-                                                this.showpowerLegend[index].name = "短期";
-                                            }
-                                            this.showpowerLegend[index].color = it.color;
+                                            // if (it.color === "#e96366") {
+                                            //     this.showpowerLegend[index].name = "超短期";
+                                            // } else {
+                                            //     this.showpowerLegend[index].name = "短期";
+                                            // }
+                                            // this.showpowerLegend[index].color = it.color;
                                         }
                                         str = str + strMsg;
                                     });
@@ -1026,12 +1045,12 @@
                                         item[0].color === "#e96366" ? "超短期" : "短期"
                                     }:</span>&nbsp;&nbsp;<span>${item[0].value}</span>
                                         </div>`;
-                                    if (item[0].color === "#e96366") {
-                                        this.showpowerLegend[3].name = "超短期";
-                                    } else {
-                                        this.showpowerLegend[3].name = "短期";
-                                    }
-                                    this.showpowerLegend[3].color = item[0].color;
+                                    // if (item[0].color === "#e96366") {
+                                    //     this.showpowerLegend[3].name = "超短期";
+                                    // } else {
+                                    //     this.showpowerLegend[3].name = "短期";
+                                    // }
+                                    // this.showpowerLegend[3].color = item[0].color;
                                     str = str + strMsg;
                                 }
                                 return str;
@@ -1058,6 +1077,13 @@
                     yAxis: {
                         type: "value",
                         name: title === "功率预测" ? "兆瓦(Mw)" : "m/s",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     },
                     series: series,
                 };
@@ -1093,7 +1119,7 @@
                                 },
                                 {
                                     gt: num,
-                                    color: "#39ccd9",
+                                    color: "#39d93d",
                                 },
                             ],
                         };
@@ -1246,6 +1272,13 @@
                     yAxis: [{
                         type: "value",
                         name: title === "预测考核分数" ? "分" : "兆瓦(M/w)",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     }, ],
                     series: series,
                 };

src/views/powerPrediction/statisticalSummaryPage.vue

@@ -18,7 +18,7 @@
         </div>
         <div class="lineMain" v-loading="loading">
             <el-row>
-                <el-col :span="10" :style="pageHeight" style="padding-right: 10px">
+                <el-col :span="12" :style="pageHeight" style="padding-right: 10px">
                     <div class="lineStyle1">
                         <div id="monthChartBar" :style="chartsHeight"></div>
                     </div>
@@ -36,22 +36,33 @@
                         </div>
                     </div>
                 </el-col>
-                <el-col :span="14" :style="pageHeight">
+                <el-col :span="12" :style="pageHeight">
                     <div class="lineStyle1">
                         <div id="yearChartBar" :style="chartsHeight"></div>
                         <div :style="tableHeight">
                             <div style="display: flex; margin: 10px 0">
                                 <!-- <el-button type="primary" disabled>年发电量报告</el-button> -->
                             </div>
-                            <div class="tablestyle warn-table" style="margin-top: 30px">
+                            <div class="tablestyle warn-table" style="margin-top: 20px">
                                 <el-table :data="tableData" border style="width: 100%"
-                                    element-loading-background="rgba(0,0,0,.5)"
-                                    :header-cell-style="{ 'text-align': 'center' }">
-                                    <el-table-column prop="name" label="月份" width="90" align="center" fixed>
+                                    element-loading-background="rgba(0,0,0,.5)" :header-cell-style="{
+                                        padding: '4px',
+                                        fontSize: '11px',
+                                        fontWeight: bold,
+                                        border: '0.5px solid rgba(0,0,0,.5) !important',
+                                        }" :cell-style="{
+                                        height: '40px',
+                                        padding: '3px',
+                                        fontSize: '11px',
+                                        '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="name" label="月份" width="54" align="center">
                                     </el-table-column>
-                                    <el-table-column prop="statistic" width="90" label="合计" align="right" fixed>
+                                    <el-table-column prop="statistic" width="60" label="合计">
                                     </el-table-column>
-                                    <el-table-column :prop="item.value" align="right" :label="item.name"
+                                    <el-table-column :prop="item.value" width="60" :label="item.name"
                                         v-for="(item, index) in tableColumn" :key="index">
                                     </el-table-column>
                                 </el-table>
@@ -93,14 +104,14 @@
                 handler: function (newVal, oldVal) {
                     this.theme = newVal;
                     this.echartsTheme = !newVal ? "dark" : "";
-                    this.getStationData();
+                    // this.getStationData();
                 },
                 immediate: true,
             },
         },
         created() {
-            // this.initPageData();
-            this.getStationData();
+            this.initPageData();
+            // this.getStationData();
             (this.pieColor = [{
                     value: "",
                     name: "一月",
@@ -225,7 +236,7 @@
                 };
             },
             tableHeight() {
-                let height = (document.documentElement.clientHeight - 190) / 2 + "px";
+                let height = (document.documentElement.clientHeight - 150) / 2 + "px";
                 return {
                     width: "100%",
                     height: height,
@@ -271,7 +282,7 @@
                                 let seriesObj1 = {
                                     name: iten.name,
                                     type: "bar",
-                                    barGap: 0,
+                                    barGap: "1",
                                     emphasis: {
                                         focus: "series",
                                     },
@@ -373,7 +384,7 @@
                                 let seriesObj1 = {
                                     name: iten.name,
                                     type: "bar",
-                                    barGap: 0,
+                                    barGap: "1",
                                     emphasis: {
                                         focus: "series",
                                     },
@@ -510,7 +521,7 @@
                 this.tableData = datas;
             },
             getTableData2(datas) {
-                let nameArr = ["计划发电", "实际发电", "当月占比", "全年占比", "短期准确率", "超短准确率"]
+                let nameArr = ["预测发电", "实际发电", "计划发电", "当月占比", "全年占比", "短期准确率", "超短准确率"]
                 let monthName = [
                     "january",
                     "february",
@@ -530,13 +541,15 @@
                     it.name = nameArr[idx]
                     monthName.forEach(o => {
                         if (it[o] !== null) {
-                            it[o] = Number(it[o].toFixed(2))
+                            // it[o] = Number(it[o].toFixed(2))
+                            it[o] = Math.ceil(it[o])
                             statisticNum = statisticNum + it[o]
                         } else {
                             statisticNum = statisticNum + 0
                         }
                     })
-                    it.statistic = statisticNum.toFixed(2)
+                    // it.statistic = statisticNum.toFixed(2)
+                    it.statistic = Math.ceil(statisticNum)
                 })
                 this.tableData = datas;
             },
@@ -560,11 +573,11 @@
                 for (let i = 0; i < val; i++) {
                     xAxis.push(xAxisAll[i]);
                 }
-                let legend = ["计划发电", "实际发电"];
+                let legend = ["预测发电", "实际发电", "计划发电"];
                 let series = [{
-                        name: "计划发电",
+                        name: "预测发电",
                         type: "bar",
-                        barGap: 0,
+                        barGap: "1",
                         emphasis: {
                             focus: "series",
                         },
@@ -572,47 +585,42 @@
                     {
                         name: "实际发电",
                         type: "bar",
-                        barGap: 0,
+                        barGap: "1",
+                        emphasis: {
+                            focus: "series",
+                        },
+                    },
+                    {
+                        name: "计划发电",
+                        type: "bar",
+                        barGap: "1",
                         emphasis: {
                             focus: "series",
                         },
                     },
                 ];
                 datas.forEach((itn) => {
+                    let data = [
+                        itn.january,
+                        itn.february,
+                        itn.march,
+                        itn.april,
+                        itn.may,
+                        itn.june,
+                        itn.july,
+                        itn.august,
+                        itn.september,
+                        itn.october,
+                        itn.november,
+                        itn.december,
+                    ];
                     if (itn.name === "计划发电") {
-                        let data = [
-                            itn.january,
-                            itn.february,
-                            itn.march,
-                            itn.april,
-                            itn.may,
-                            itn.june,
-                            itn.july,
-                            itn.august,
-                            itn.september,
-                            itn.october,
-                            itn.november,
-                            itn.december,
-                        ];
+                        series[1].data = data;
+                    } else if (itn.name === "实际发电") {
+                        series[2].data = data;
+                    } else if (itn.name === "预测发电") {
                         series[0].data = data;
                     }
-                    if (itn.name === "实际发电") {
-                        let data1 = [
-                            itn.january,
-                            itn.february,
-                            itn.march,
-                            itn.april,
-                            itn.may,
-                            itn.june,
-                            itn.july,
-                            itn.august,
-                            itn.september,
-                            itn.october,
-                            itn.november,
-                            itn.december,
-                        ];
-                        series[1].data = data1;
-                    }
                 });
                 this.getPowerBar(
                     "yearChartBar",
@@ -755,6 +763,13 @@
                     yAxis: [{
                         type: "value",
                         name: "万千瓦时(Wkw/h)",
+                        splitLine: {
+                            lineStyle: {
+                                color: this.theme ? "#000" : "#ccc",
+                                type: "dashed", // 修改为虚线
+                                opacity: 0.2,
+                            }
+                        }
                     }, ],
                     series: series,
                 };

src/viewsCss/powerPredictionPageLess.less

@@ -1,7 +1,7 @@
 .powerPredictionPage {
     .windStstus {
         display: flex;
-        justify-content: space-around;
+        justify-content: space-between;
         align-items: center;
         margin: 0 10px;
         // border: 1px solid #7674d8;
@@ -42,36 +42,38 @@
                 left: 20px;
             }
 
-            .el-scrollbar {
-                width: 90%;
+            .scrollbar-flex-content {
+                display: flex;
+                width: 100%;
 
-                .scrollbar-flex-content {
+                .scrollbar-demo-item {
+                    flex-shrink: 0;
                     display: flex;
-                    width: 50%;
-
-                    .scrollbar-demo-item {
-                        flex-shrink: 0;
-                        display: flex;
-                        align-items: center;
-                        justify-content: center;
-                        padding: 0px 15px;
-                        margin: 10px;
-                        text-align: center;
-                        border-radius: 4px;
-                        border: 1px solid #8679df;
-                        color: #fff;
-                        font-size: 14px;
-                        cursor: pointer;
-                    }
+                    align-items: center;
+                    justify-content: center;
+                    padding: 0px 15px;
+                    margin: 10px 5px;
+                    text-align: center;
+                    border-radius: 4px;
+                    border: 1px solid #8679df;
+                    color: #fff;
+                    font-size: 14px;
+                    cursor: pointer;
+                }
 
-                    .changeBacksty {
-                        background-color: #4bb780 !important;
-                    }
+                .changeBacksty {
+                    background-color: #4bb780 !important;
+                }
 
-                    .defaultBacksty {
-                        background-color: #373590 !important;
-                    }
+                .defaultBacksty {
+                    background-color: #373590 !important;
                 }
+            }
+
+            .el-scrollbar {
+                width: 90%;
+
+
 
                 .el-scrollbar__bar {
                     display: block !important;