Merge branch 'master' of http://124.70.43.205:3000/sunzehao/fd_dwgz_zhyw_nx

src/components/alarm-badge/index.vue

@@ -24,8 +24,8 @@
         <img src="@assets/imgs/wgj1.png" />
       </div>
     </el-badge>
+    <!-- :dialogList="warnList.slice(0, 12)" -->
     <deligo-alarm-list
-        :dialogList="warnList.slice(0, 12)"
       @setConfig="displaySetting = true"
       @confirmed="handleConfirm"
       ref="deligoChild"

src/components/deligoAlarmList/index.vue

@@ -149,11 +149,7 @@ export default {
     };
   },
 
-  created() {
-    this.warnList = this.dialogList.filter(it => {
-        return !it.isClose
-    });
-  },
+  created() {},
   mounted() {},
   computed: {
     warnNum() {
@@ -197,7 +193,9 @@ export default {
       }
     },
     init(list) {
-      this.warnList = list;
+      this.warnList = list.filter((it) => {
+        return !it.endts > 0;
+      });
     },
     tableRowClassName({ row }) {
       if (row.isClose) {
@@ -228,7 +226,7 @@ export default {
         // arr = this.checkedRow.map((item) => {
         //   return { alarmType: item.alarmType, id: item.id };
         // });
-        arr = this.checkedRow
+        arr = this.checkedRow;
 
         confirmAlart(arr).then((res) => {
           if (res.code === 200) {

src/views/economicsOperation/benchmarkingManagement/compontent/bar-line-chart.vue

@@ -58,7 +58,16 @@ export default {
         // "#c531c7",
         // "#ffffff",
         // "#EDEB2F",
-        "#2999a0", "#67b9ff", "#ff6271", "#05b2fa", "#0ef167","#05bb4c", "#4b55ae", "#EDB32F", "#DB5520", "#323E6F"
+        "#2999a0",
+        "#67b9ff",
+        "#ff6271",
+        "#05b2fa",
+        "#0ef167",
+        "#05bb4c",
+        "#4b55ae",
+        "#EDB32F",
+        "#DB5520",
+        "#323E6F",
       ],
     },
     // 每页显示个数
@@ -129,6 +138,24 @@ export default {
               width: "1",
             },
           },
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:5px'>${params[0].axisValue}</div>`;
+            for (var i = 0; i < params.length; i++) {
+              htmlStr += `<div style='margin-bottom:2px'>`;
+              var param = params[i];
+              var seriesName = param.seriesName; //图例名称
+              var value = param.value; //y轴值
+              var mark = param.marker; //点
+              var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+              htmlStr += mark; //一个点
+              htmlStr += `${seriesName} : ${
+                value != null ? value + unit : "--"
+              }`; //圆点后面显示的文本
+              htmlStr += "</div>";
+            }
+            return htmlStr;
+          },
         },
         yAxis: [
           {
@@ -179,7 +206,7 @@ export default {
             axisLabel: {
               show: false,
               textStyle: {
-                color: "#a6c1dd"
+                color: "#a6c1dd",
               },
               // formatter: "{value}",
               // color: partten.getColor("gray"),

src/views/economicsOperation/benchmarkingManagement/loseRate/index.vue

@@ -444,7 +444,7 @@ export default {
       //   this.gerWxssl();
     },
     initialization() {
-      this.dataChange(dataJson.data);
+      //   this.dataChange(dataJson.data);
       companys().then(({ data: res }) => {
         if (res.data) {
           this.company = res.data[0].id;

src/views/economicsOperation/benchmarkingManagement/siteBenchmarking/index.vue

@@ -248,6 +248,19 @@
           show-overflow-tooltip
           sortable
         >
+          <template #header="scope">
+            <div v-if="scope.column.label.indexOf('(') > 0">
+              <div style="font-size: 14px">
+                {{
+                  scope.column.label.slice(0, scope.column.label.indexOf("("))
+                }}
+              </div>
+              <div style="font-size: 12px">
+                {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
+              </div>
+            </div>
+            <div v-else>{{ scope.column.label }}</div>
+          </template>
         </el-table-column>
       </el-table>
       <div class="pagination-class">
@@ -350,10 +363,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="fdl"
-              label="发电量"
+              label="发电量(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip
@@ -371,10 +402,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="gzssdl"
-              label="故障损失"
+              label="故障损失(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip
@@ -392,10 +441,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="jxssdl"
-              label="检修损失"
+              label="检修损失(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip
@@ -413,10 +480,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="xnssdl"
-              label="性能损失"
+              label="性能损失(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip
@@ -434,10 +519,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="xdssdl"
-              label="限电损失"
+              label="限电损失(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip
@@ -455,10 +558,28 @@
               header-align="center"
               label-class-name="s-tb-th"
               prop="slssdl"
-              label="受累损失"
+              label="受累损失(万kWh)"
               sortable
               minWidth="65"
             >
+              <template #header="scope">
+                <div v-if="scope.column.label.indexOf('(') > 0">
+                  <div style="font-size: 14px">
+                    {{
+                      scope.column.label.slice(
+                        0,
+                        scope.column.label.indexOf("(")
+                      )
+                    }}
+                  </div>
+                  <div style="font-size: 12px">
+                    {{
+                      scope.column.label.slice(scope.column.label.indexOf("("))
+                    }}
+                  </div>
+                </div>
+                <div v-else>{{ scope.column.label }}</div>
+              </template>
             </el-table-column>
             <el-table-column
               show-overflow-tooltip

src/views/economicsOperation/homePage/components/barCharts.vue

@@ -233,13 +233,22 @@ export default {
             },
           },
           formatter: function (params) {
-            let tooltipText = params[0].axisValueLabel + "<br/>";
-            params.forEach(function (item) {
-              // 为每个数据项添加单位，假设数值的单位是'元'
-              tooltipText +=
-                item.seriesName + "：" + item.value + " 万kWh<br/>";
-            });
-            return tooltipText;
+            var htmlStr = `<div style='margin-bottom:5px'>${params[0].axisValue}</div>`;
+            for (var i = 0; i < params.length; i++) {
+              htmlStr += `<div style='margin-bottom:2px'>`;
+              var param = params[i];
+              var seriesName = param.seriesName; //图例名称
+              var value = param.value; //y轴值
+              var mark = param.marker; //点
+              var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+              htmlStr += mark; //一个点
+              htmlStr += `${seriesName} : ${
+                value != null ? value + unit : "--"
+              }`; //圆点后面显示的文本
+              htmlStr += "</div>";
+            }
+            return htmlStr;
           },
         },
         legend: {

src/views/economicsOperation/homePage/components/pieChart.vue

@@ -41,7 +41,16 @@ export default {
     color: {
       type: Array,
       default: () => [
-        "#2999a0", "#67b9ff", "#ff6271", "#05b2fa", "#0ef167","#05bb4c", "#4b55ae", "#EDB32F", "#DB5520", "#323E6F"
+        "#2999a0",
+        "#67b9ff",
+        "#ff6271",
+        "#05b2fa",
+        "#0ef167",
+        "#05bb4c",
+        "#4b55ae",
+        "#EDB32F",
+        "#DB5520",
+        "#323E6F",
       ],
     },
   },
@@ -143,7 +152,7 @@ export default {
         legend: {
           type: "scroll",
           orient: "vertical",
-          right: '8%',
+          right: "8%",
           top: "middle",
           itemWidth: 8,
           itemHeight: 8,
@@ -194,6 +203,19 @@ export default {
         ],
         tooltip: {
           trigger: "item",
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:2px'>`;
+            var param = params;
+            var seriesName = param.data.name; //图例名称
+            var value = param.data.value; //y轴值
+            var mark = param.marker; //点
+            var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+            htmlStr += mark; //一个点
+            htmlStr += `${seriesName} : ${value != null ? value + unit : "--"}`; //圆点后面显示的文本
+            htmlStr += "</div>";
+            return htmlStr;
+          },
         },
         toolbox: {
           show: true,

src/views/economicsOperation/jjyxReport/index.vue

@@ -1,496 +1,563 @@
 <template>
-    <div class="optimizationSuggestions">
-        <div class="main_top">
-            <div class="form-wrapper">
-                <div class="station">
-                    场站：
-                    <el-select v-model="reportStation" placeholder="选择场站">
-                        <el-option v-for="item in stationList" :key="item.id" :label="item.name" :value="item.id">
-                        </el-option>
-                    </el-select>
-                </div>
-                <div class="station">
-                    机组：
-                    <el-select v-model="windStation" placeholder="选择机组" @change="changeWt">
-                        <el-option v-for="item in windList" :key="item.id" :label="item.aname" :value="item.id">
-                        </el-option>
-                    </el-select>
-                </div>
-                <div class="station">
-                    报告月份
-                    <el-date-picker style="width: 120px" v-model="reportParamDate" type="month" value-format="YYYY-MM"
-                        placeholder="请选择" />
-                </div>
-                <div class="but">
-                    <el-button type="primary" round size="mini" @click="handleReportOp">查询</el-button>
-                    <el-button style="width: 100px" round size="mini" type="danger" @click="exportPDFop"
-                        :loading="loading">导出 PDF
-                    </el-button>
-                </div>
-            </div>
+  <div class="optimizationSuggestions">
+    <div class="main_top">
+      <div class="form-wrapper">
+        <div class="station">
+          场站：
+          <el-select v-model="reportStation" placeholder="选择场站">
+            <el-option
+              v-for="item in stationList"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
         </div>
-        <div class="infoBox">
-            <div id="pdfDom" ref="pdfContent" :style="!theme ? 'background-color: #040c0b' : 'background-color: #fff'">
-                <h2 style="
+        <div class="station">
+          机组：
+          <el-select
+            v-model="windStation"
+            placeholder="选择机组"
+            @change="changeWt"
+          >
+            <el-option
+              v-for="item in windList"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="station">
+          报告月份
+          <el-date-picker
+            style="width: 120px"
+            v-model="reportParamDate"
+            type="month"
+            value-format="YYYY-MM"
+            placeholder="请选择"
+          />
+        </div>
+        <div class="but">
+          <el-button type="primary" round size="mini" @click="handleReportOp"
+            >查询</el-button
+          >
+          <el-button
+            style="width: 100px"
+            round
+            size="mini"
+            type="danger"
+            @click="exportPDFop"
+            :loading="loading"
+            >导出 PDF
+          </el-button>
+        </div>
+      </div>
+    </div>
+    <div class="infoBox">
+      <div
+        id="pdfDom"
+        ref="pdfContent"
+        :style="!theme ? 'background-color: #040c0b' : 'background-color: #fff'"
+      >
+        <h2
+          style="
             font-weight: bolder;
             text-align: center;
             margin-bottom: 20px;
             text-align: center;
-          " :style="!theme ? 'color: #fff' : 'color: #000'">
-                    {{ OperationName }}
-                </h2>
-                <!-- 单机运行指标性能分析 -->
-                <h3 style="
+          "
+          :style="!theme ? 'color: #fff' : 'color: #000'"
+        >
+          {{ OperationName }}
+        </h2>
+        <!-- 单机运行指标性能分析 -->
+        <h3
+          style="
             text-indent: 2em;
             font-weight: bolder;
             margin-bottom: 10px;
             margin-top: 10px;
-          " :style="!theme ? 'color: #fff' : 'color: #000'">
-                    单机运行指标性能分析
-                </h3>
-                <div class="warn-table">
-                    <el-table class="toolSty" :data="jjyxList" border style="width: 100%; margin: 10px 0" stripe
-                        :header-cell-style="{
-                        padding: '4px',
-                        fontSize: '12px',
-                        fontWeight: bold,
-                        border: '0.5px solid rgba(0,0,0,.5) !important',
-                        }" :cell-style="{
-                        height: '40px',
-                        padding: '3px',
-                        fontSize: '12px',
-                        'border-top': '0px solid rgba(0,0,0,.5)',
-                        'border-bottom': '1px solid rgba(0,0,0,.5)',
-                        'border-right': '1px solid rgba(0,0,0,.5)',
-                        }">
-                        <el-table-column v-for="(item, index) in jjyxTableColumn" :key="index" :label="item.name"
-                            :width="item.width" align="center">
-                            <template #default="scope">
-                                <span>
-                                    {{ scope.row[item.code] ? scope.row[item.code] : "-" }}
-                                </span>
-                            </template>
-                        </el-table-column>
-                    </el-table>
-                </div>
-
-                <!-- 本月运行情况总结 -->
-                <h3 style="
-                text-indent: 2em;
-                font-weight: bolder;
-                margin-bottom: 10px;
-                margin-top: 10px;
-            " :style="!theme ? 'color: #fff' : 'color: #000'">
-                    本月运行情况总结：
-                </h3>
-                <p style="font-size: 16px;font-weight: bolder;margin: 10px 0 10px 40px"
-                    :style="!theme ? 'color: #fff' : 'color: #000'">{{operationStatus}}</p>
-
-                <p style="font-size: 16px;font-weight: bolder;margin: 10px 0 10px 40px"
-                    :style="!theme ? 'color: #fff' : 'color: #000'">{{operationStatus2}}</p>
-
-                <div id="powerAndspeed" style="width:100%;height:500px"></div>
-            </div>
+          "
+          :style="!theme ? 'color: #fff' : 'color: #000'"
+        >
+          单机运行指标性能分析
+        </h3>
+        <div class="warn-table">
+          <el-table
+            class="toolSty"
+            :data="jjyxList"
+            border
+            style="width: 100%; margin: 10px 0"
+            stripe
+            :header-cell-style="{
+              padding: '4px',
+              fontSize: '12px',
+              fontWeight: bold,
+              border: '0.5px solid rgba(0,0,0,.5) !important',
+            }"
+            :cell-style="{
+              height: '40px',
+              padding: '3px',
+              fontSize: '12px',
+              'border-top': '0px solid rgba(0,0,0,.5)',
+              'border-bottom': '1px solid rgba(0,0,0,.5)',
+              'border-right': '1px solid rgba(0,0,0,.5)',
+            }"
+          >
+            <el-table-column
+              v-for="(item, index) in jjyxTableColumn"
+              :key="index"
+              :label="item.name"
+              :width="item.width"
+              align="center"
+            >
+              <template #default="scope">
+                <span>
+                  {{ scope.row[item.code] ? scope.row[item.code] : " " }}
+                </span>
+              </template>
+            </el-table-column>
+          </el-table>
         </div>
+
+        <!-- 本月运行情况总结 -->
+        <h3
+          style="
+            text-indent: 2em;
+            font-weight: bolder;
+            margin-bottom: 10px;
+            margin-top: 10px;
+          "
+          :style="!theme ? 'color: #fff' : 'color: #000'"
+        >
+          本月运行情况总结：
+        </h3>
+        <p
+          style="font-size: 16px; font-weight: bolder; margin: 10px 0 10px 40px"
+          :style="!theme ? 'color: #fff' : 'color: #000'"
+        >
+          {{ operationStatus }}
+        </p>
+
+        <p
+          style="font-size: 16px; font-weight: bolder; margin: 10px 0 10px 40px"
+          :style="!theme ? 'color: #fff' : 'color: #000'"
+        >
+          {{ operationStatus2 }}
+        </p>
+
+        <div id="powerAndspeed" style="width: 100%; height: 500px"></div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-    import html2canvas from 'html2canvas';
-    import jsPDF from 'jspdf';
-    import dayjs from "dayjs";
-    import {
-        getWpList,
-        getWtList,
-        apiGeWarningeconreportReport
-    } from "@/api/zhbj";
-    import jsonData from "./dataJson.json";
-    export default {
-        name: "yhjyReport",
-        data() {
-            return {
-                stationList: [],
-                windList: [],
-                reportStation: "",
-                windStation: "",
-                windStationName: "",
-                OperationName: "经济运行分析报告",
-                jjyxTableColumn: jsonData.jjyxTableColumn,
-                jjyxList: [],
-                operationStatus: "",
-                operationStatus2: "",
-                loading: false,
-                reportParamDate: dayjs()
-                    .subtract(1, "month")
-                    .startOf("month")
-                    .format("YYYY-MM"),
-            };
-        },
+import html2canvas from "html2canvas";
+import jsPDF from "jspdf";
+import dayjs from "dayjs";
+import { getWpList, getWtList, apiGeWarningeconreportReport } from "@/api/zhbj";
+import jsonData from "./dataJson.json";
+export default {
+  name: "yhjyReport",
+  data() {
+    return {
+      stationList: [],
+      windList: [],
+      reportStation: "",
+      windStation: "",
+      windStationName: "",
+      OperationName: "经济运行分析报告",
+      jjyxTableColumn: jsonData.jjyxTableColumn,
+      jjyxList: [],
+      operationStatus: "",
+      operationStatus2: "",
+      loading: false,
+      reportParamDate: dayjs()
+        .subtract(1, "month")
+        .startOf("month")
+        .format("YYYY-MM"),
+    };
+  },
 
-        created() {
-            this.theme = this.$store.state.theme;
-        },
+  created() {
+    this.theme = this.$store.state.theme;
+  },
 
-        mounted() {
-            this.funGetStation();
-        },
+  mounted() {
+    this.funGetStation();
+  },
+
+  methods: {
+    changeWt(value) {
+      this.windList.forEach((it) => {
+        if (value === it.id) {
+          this.windStationName = it.name;
+        }
+      });
+    },
+    /**场站 */
+    funGetStation() {
+      let that = this;
+      // this.renderReportPage({
+      //     data: jsonData.data
+      // });
+      that.stationList = [];
+      that.windStation = "";
+      getWpList().then((res) => {
+        if (res) {
+          that.stationList = res.data;
+          if (that.stationList.length) {
+            that.reportStation = that.stationList[0].id;
+            that.funGetWind(that.reportStation);
+          }
+        }
+      });
+    },
+    funGetWind(wpId) {
+      let that = this;
+      that.windList = [];
+      that.windStation = "";
+      getWtList({
+        wpId: wpId,
+      }).then((res) => {
+        if (res) {
+          that.windList = res.data.data;
+          if (that.windList.length) {
+            that.windStation = that.windList[0].id;
+            that.windStationName = that.windList[0].name;
+            that.handleReportOp();
+          }
+        }
+      });
+    },
+    async exportPDFop() {
+      this.loading = true;
+      try {
+        // 获取要转换为PDF的内容
+        const element = this.$refs.pdfContent;
+
+        // 保存当前滚动位置
+        const originalScrollTop = window.scrollY;
+
+        // 将页面滚动到顶部
+        window.scrollTo(0, 0);
+
+        // 设置元素的高度为内容的实际高度
+        const originalHeight = element.style.height;
+        const originalOverflow = element.style.overflow;
+        if (originalHeight) {
+          element.style.height = `${element.scrollHeight}px`;
+        }
+        if (originalOverflow) {
+          element.style.overflow = "hidden";
+        }
+
+        // 使用html2canvas将HTML内容转换为canvas
+        const canvas = await html2canvas(element, {
+          scale: 2, // 提高分辨率
+          logging: true, // 开启日志记录
+          useCORS: true, // 处理跨域图片
+        });
+
+        // 恢复原来的样式
+        element.style.height = originalHeight || "";
+        element.style.overflow = originalOverflow || "";
+
+        // 恢复滚动位置
+        window.scrollTo(0, originalScrollTop);
+
+        // 将canvas转换为Data URL
+        const imgData = canvas.toDataURL("image/png");
+
+        // 创建一个新的jsPDF实例
+        const doc = new jsPDF("p", "mm", "a4");
+
+        // 计算图片在PDF中的位置和大小
+        const imgProps = doc.getImageProperties(imgData);
+        const pdfWidth = doc.internal.pageSize.getWidth();
+        const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
+
+        // 计算每页的高度
+        const pageHeight = doc.internal.pageSize.getHeight();
+        let heightLeft = pdfHeight;
+
+        // 添加第一页
+        doc.addImage(imgData, "PNG", 0, 0, pdfWidth, pdfHeight);
+
+        // 添加后续页面
+        while (heightLeft > pageHeight) {
+          heightLeft -= pageHeight;
+          doc.addPage();
+          doc.addImage(
+            imgData,
+            "PNG",
+            0,
+            -pdfHeight + heightLeft,
+            pdfWidth,
+            pdfHeight
+          );
+        }
 
-        methods: {
-            changeWt(value) {
-                this.windList.forEach(it => {
-                    if (value === it.id) {
-                        this.windStationName = it.name
-                    }
-                })
+        // 保存PDF文件
+        doc.save("经济运行分析报告.pdf");
+        this.loading = false;
+      } catch (error) {
+        console.error("Error generating PDF:", error);
+        this.loading = false;
+      }
+    },
+    handleReportOp() {
+      if (this.reportParamDate) {
+        this.OperationName = "";
+        this.jjyxList = [];
+
+        let params = {
+          reportParamDate: this.reportParamDate,
+          windStation: this.windStation,
+        };
+        apiGeWarningeconreportReport(params).then((res) => {
+          this.renderReportPage(res);
+        });
+        // .catch(() => {
+        //     this.renderReportPage({
+        //         data: jsonData.data,
+        //     });
+        // });
+      }
+    },
+
+    renderReportPage(res) {
+      let date = this.reportParamDate.split("-");
+      this.OperationName =
+        date[0] +
+        "年" +
+        date[1] +
+        "月" +
+        this.windStationName +
+        "指标性能分析及运行情况报告";
+      this.jjyxList = res.data.lb;
+      this.operationStatus = res.data.wz1;
+      this.operationStatus2 = res.data.wz2;
+
+      let tbdata = res.data.tb;
+      let xAxis = [];
+      let servesBar = [];
+      let servesLine = [];
+      tbdata.forEach((it, index) => {
+        xAxis.push(dayjs(it.recordDate).format("D") + "日");
+        servesBar.push(it.rfdl);
+        servesLine.push(it.pjfs);
+      });
+      this.getcharts(xAxis, servesBar, servesLine);
+    },
+
+    getcharts(xAxis, servesBar, servesLine) {
+      let option = {
+        tooltip: {
+          trigger: "axis",
+        },
+        legend: {
+          textStyle: {
+            color: "#fff",
+          },
+          data: ["发电量(万kwh)", "风速(m/s)"],
+        },
+        xAxis: [
+          {
+            type: "category",
+            data: xAxis,
+            axisTick: {
+              show: true, // 显示刻度线
+              lineStyle: {
+                color: "#fff", // 设置刻度线颜色为红色
+              },
             },
-            /**场站 */
-            funGetStation() {
-                let that = this;
-                // this.renderReportPage({
-                //     data: jsonData.data
-                // });
-                that.stationList = [];
-                that.windStation = ""
-                getWpList().then((res) => {
-                    if (res) {
-                        that.stationList = res.data;
-                        if (that.stationList.length) {
-                            that.reportStation = that.stationList[0].id;
-                            that.funGetWind(that.reportStation);
-                        }
-                    }
-                });
+            axisLine: {
+              lineStyle: {
+                color: "#fff", // 设置轴线颜色为蓝色（可选）
+              },
             },
-            funGetWind(wpId) {
-                let that = this;
-                that.windList = []
-                that.windStation = ""
-                getWtList({
-                    wpId: wpId
-                }).then((res) => {
-                    if (res) {
-                        that.windList = res.data.data;
-                        if (that.windList.length) {
-                            that.windStation = that.windList[0].id;
-                            that.windStationName = that.windList[0].name;
-                            that.handleReportOp();
-                        }
-                    }
-                });
+            axisPointer: {
+              type: "shadow",
             },
-            async exportPDFop() {
-                this.loading = true;
-                try {
-                    // 获取要转换为PDF的内容
-                    const element = this.$refs.pdfContent;
-
-                    // 保存当前滚动位置
-                    const originalScrollTop = window.scrollY;
-
-                    // 将页面滚动到顶部
-                    window.scrollTo(0, 0);
-
-                    // 设置元素的高度为内容的实际高度
-                    const originalHeight = element.style.height;
-                    const originalOverflow = element.style.overflow;
-                    if (originalHeight) {
-                        element.style.height = `${element.scrollHeight}px`;
-                    }
-                    if (originalOverflow) {
-                        element.style.overflow = 'hidden';
-                    }
-
-                    // 使用html2canvas将HTML内容转换为canvas
-                    const canvas = await html2canvas(element, {
-                        scale: 2, // 提高分辨率
-                        logging: true, // 开启日志记录
-                        useCORS: true // 处理跨域图片
-                    });
-
-                    // 恢复原来的样式
-                    element.style.height = originalHeight || '';
-                    element.style.overflow = originalOverflow || '';
-
-                    // 恢复滚动位置
-                    window.scrollTo(0, originalScrollTop);
-
-                    // 将canvas转换为Data URL
-                    const imgData = canvas.toDataURL('image/png');
-
-                    // 创建一个新的jsPDF实例
-                    const doc = new jsPDF('p', 'mm', 'a4');
-
-                    // 计算图片在PDF中的位置和大小
-                    const imgProps = doc.getImageProperties(imgData);
-                    const pdfWidth = doc.internal.pageSize.getWidth();
-                    const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
-
-                    // 计算每页的高度
-                    const pageHeight = doc.internal.pageSize.getHeight();
-                    let heightLeft = pdfHeight;
-
-                    // 添加第一页
-                    doc.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
-
-                    // 添加后续页面
-                    while (heightLeft > pageHeight) {
-                        heightLeft -= pageHeight;
-                        doc.addPage();
-                        doc.addImage(imgData, 'PNG', 0, -pdfHeight + heightLeft, pdfWidth, pdfHeight);
-                    }
-
-                    // 保存PDF文件
-                    doc.save('经济运行分析报告.pdf');
-                    this.loading = false;
-                } catch (error) {
-                    console.error('Error generating PDF:', error);
-                    this.loading = false
-                }
+          },
+        ],
+        yAxis: [
+          {
+            type: "value",
+            name: "发电量(万kwh)",
+            min: 0,
+            axisTick: {
+              show: true, // 显示刻度线
+              lineStyle: {
+                color: "#fff", // 设置y轴刻度线颜色为红色
+              },
             },
-            handleReportOp() {
-                if (this.reportParamDate) {
-                    this.OperationName = "";
-                    this.jjyxList = [];
-
-                    let params = {
-                        reportParamDate: this.reportParamDate,
-                        windStation: this.windStation
-                    }
-                    apiGeWarningeconreportReport(params).then((res) => {
-                            this.renderReportPage(res);
-                        })
-                        // .catch(() => {
-                        //     this.renderReportPage({
-                        //         data: jsonData.data,
-                        //     });
-                        // });
-                }
+            axisLine: {
+              show: true, // 如果需要显示轴线
+              lineStyle: {
+                color: "#fff", // 设置y轴轴线颜色为蓝色（可选）
+              },
             },
-
-            renderReportPage(res) {
-                let date = this.reportParamDate.split("-");
-                this.OperationName =
-                    date[0] +
-                    "年" +
-                    date[1] +
-                    "月" +
-                    this.windStationName +
-                    "指标性能分析及运行情况报告";
-                this.jjyxList = res.data.lb;
-                this.operationStatus = res.data.wz1
-                this.operationStatus2 = res.data.wz2
-
-                let tbdata = res.data.tb
-                let xAxis = []
-                let servesBar = []
-                let servesLine = []
-                tbdata.forEach((it, index) => {
-                    xAxis.push((dayjs(it.recordDate).format('D')) + '日')
-                    servesBar.push(it.rfdl)
-                    servesLine.push(it.pjfs)
-                })
-                this.getcharts(xAxis, servesBar, servesLine)
+            splitLine: {
+              show: false, // 如果需要显示分割线
+              lineStyle: {
+                color: ["#333"], // 设置分割线颜色（可选）
+              },
             },
-
-            getcharts(xAxis, servesBar, servesLine) {
-                let option = {
-                    tooltip: {
-                        trigger: 'axis',
-                    },
-                    legend: {
-                        textStyle: {
-                            color: '#fff'
-                        },
-                        data: ['发电量(万kwh)', '风速(m/s)']
-                    },
-                    xAxis: [{
-                        type: 'category',
-                        data: xAxis,
-                        axisTick: {
-                            show: true, // 显示刻度线
-                            lineStyle: {
-                                color: '#fff' // 设置刻度线颜色为红色
-                            }
-                        },
-                        axisLine: {
-                            lineStyle: {
-                                color: '#fff' // 设置轴线颜色为蓝色（可选）
-                            }
-                        },
-                        axisPointer: {
-                            type: 'shadow'
-                        }
-                    }],
-                    yAxis: [{
-                            type: 'value',
-                            name: '发电量(万kwh)',
-                            min: 0,
-                            axisTick: {
-                                show: true, // 显示刻度线
-                                lineStyle: {
-                                    color: '#fff' // 设置y轴刻度线颜色为红色
-                                }
-                            },
-                            axisLine: {
-                                show: true, // 如果需要显示轴线
-                                lineStyle: {
-                                    color: '#fff' // 设置y轴轴线颜色为蓝色（可选）
-                                }
-                            },
-                            splitLine: {
-                                show: false, // 如果需要显示分割线
-                                lineStyle: {
-                                    color: ['#333'] // 设置分割线颜色（可选）
-                                }
-                            }
-                        },
-                        {
-                            type: 'value',
-                            name: '风速(m/s)',
-                            min: 0,
-                            axisTick: {
-                                show: true, // 显示刻度线
-                                lineStyle: {
-                                    color: '#fff' // 设置y轴刻度线颜色为红色
-                                }
-                            },
-                            axisLine: {
-                                show: true, // 如果需要显示轴线
-                                lineStyle: {
-                                    color: '#fff' // 设置y轴轴线颜色为蓝色（可选）
-                                }
-                            },
-                            splitLine: {
-                                show: false, // 如果需要显示分割线
-                                lineStyle: {
-                                    color: ['#333'] // 设置分割线颜色（可选）
-                                }
-                            }
-                        }
-                    ],
-                    series: [{
-                            name: '发电量(万kwh)',
-                            type: 'bar',
-                            data: servesBar
-                        },
-                        {
-                            name: '风速(m/s)',
-                            type: 'line',
-                            yAxisIndex: 1,
-                            data: servesLine
-                        }
-                    ]
-                };
-                // 基于准备好的dom，初始化echarts实例
-                let dom = document.getElementById('powerAndspeed');
-                dom.removeAttribute("_echarts_instance_") ?
-                    dom.removeAttribute("_echarts_instance_") :
-                    "";
-                let myChart = this.$echarts.init(dom, this.echartsTheme);
-                myChart.setOption(option);
-                window.addEventListener("resize", function () {
-                    myChart.resize();
-                });
+          },
+          {
+            type: "value",
+            name: "风速(m/s)",
+            min: 0,
+            axisTick: {
+              show: true, // 显示刻度线
+              lineStyle: {
+                color: "#fff", // 设置y轴刻度线颜色为红色
+              },
             },
-        },
-    };
+            axisLine: {
+              show: true, // 如果需要显示轴线
+              lineStyle: {
+                color: "#fff", // 设置y轴轴线颜色为蓝色（可选）
+              },
+            },
+            splitLine: {
+              show: false, // 如果需要显示分割线
+              lineStyle: {
+                color: ["#333"], // 设置分割线颜色（可选）
+              },
+            },
+          },
+        ],
+        series: [
+          {
+            name: "发电量(万kwh)",
+            type: "bar",
+            data: servesBar,
+          },
+          {
+            name: "风速(m/s)",
+            type: "line",
+            yAxisIndex: 1,
+            data: servesLine,
+          },
+        ],
+      };
+      // 基于准备好的dom，初始化echarts实例
+      let dom = document.getElementById("powerAndspeed");
+      dom.removeAttribute("_echarts_instance_")
+        ? dom.removeAttribute("_echarts_instance_")
+        : "";
+      let myChart = this.$echarts.init(dom, this.echartsTheme);
+      myChart.setOption(option);
+      window.addEventListener("resize", function () {
+        myChart.resize();
+      });
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
-    .optimizationSuggestions {
-        height: 100%;
+.optimizationSuggestions {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-content: center;
+
+  .main_top {
+    height: 40px;
+    display: flex;
+    align-items: center;
+
+    .form-wrapper {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      margin: 10px 0 10px 20px;
+
+      .station {
         display: flex;
-        flex-direction: column;
-        justify-content: flex-start;
+        flex-direction: row;
+        align-items: center;
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #b3b3b3;
+        margin-right: 10px;
+      }
+
+      .search-input {
+        margin-left: 10px;
+      }
+
+      .but {
+        display: flex;
+        flex-direction: row;
         align-content: center;
-
-        .main_top {
-            height: 40px;
-            display: flex;
-            align-items: center;
-
-            .form-wrapper {
-                display: flex;
-                flex-direction: row;
-                align-items: center;
-                margin: 10px 0 10px 20px;
-
-                .station {
-                    display: flex;
-                    flex-direction: row;
-                    align-items: center;
-                    font-size: 14px;
-                    font-family: Microsoft YaHei;
-                    font-weight: 400;
-                    color: #b3b3b3;
-                    margin-right: 10px;
-                }
-
-                .search-input {
-                    margin-left: 10px;
-                }
-
-                .but {
-                    display: flex;
-                    flex-direction: row;
-                    align-content: center;
-                    margin-left: 20px;
-                }
-
-                .buttons {
-                    background-color: rgba(5, 187, 76, 0.2);
-                    border: 1px solid #3b6c53;
-                    color: #b3b3b3;
-                    font-size: 14px;
-
-                    &:hover {
-                        background-color: rgba(5, 187, 76, 0.5);
-                        color: #ffffff;
-                    }
-                }
-            }
+        margin-left: 20px;
+      }
+
+      .buttons {
+        background-color: rgba(5, 187, 76, 0.2);
+        border: 1px solid #3b6c53;
+        color: #b3b3b3;
+        font-size: 14px;
+
+        &:hover {
+          background-color: rgba(5, 187, 76, 0.5);
+          color: #ffffff;
         }
+      }
+    }
+  }
 
-        .infoBox {
-            height: calc(100% - 80px);
-            overflow: scroll;
+  .infoBox {
+    height: calc(100% - 80px);
+    overflow: scroll;
 
-            #pdfDom {
-                margin: 20px;
-            }
-        }
+    #pdfDom {
+      margin: 20px;
+    }
+  }
 
-        &.themeLight {
-            .topPsty {
-                color: #2778ff;
-                background: #ffffff;
-            }
-        }
+  &.themeLight {
+    .topPsty {
+      color: #2778ff;
+      background: #ffffff;
+    }
+  }
 
-        &.themeDark {
-            .topPsty {
-                color: #1c99ff;
-                background: #1e2126;
-            }
-        }
+  &.themeDark {
+    .topPsty {
+      color: #1c99ff;
+      background: #1e2126;
     }
+  }
+}
 </style>
 <style lang="less">
-    .el-overlay {
-        .el-overlay-dialog {
-            .reportDia {
-                margin-top: 0 !important;
-            }
-        }
-    }
-
+.el-overlay {
+  .el-overlay-dialog {
     .reportDia {
-        .repoerDateBox {
-            width: calc(100% - 40px);
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            font-size: 12px;
-        }
+      margin-top: 0 !important;
     }
+  }
+}
+
+.reportDia {
+  .repoerDateBox {
+    width: calc(100% - 40px);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 12px;
+  }
+}
 </style>

src/views/economicsOperation/nxfHomePage/component/multiple-bar-chart.vue

@@ -1,390 +1,427 @@
 <template>
-    <div class="chart" :id="id"></div>
+  <div class="chart" :id="id"></div>
 </template>
 
 <script>
-    import util from "@/helper/util.js";
-    import partten from "@/helper/partten.js";
-    import * as echarts from "echarts";
+import util from "@/helper/util.js";
+import partten from "@/helper/partten.js";
+import * as echarts from "echarts";
 
-    export default {
-        name: "multiple-bar-charts",
-        componentName: "multiple-bar-chart",
-        props: {
-            width: {
-                type: String,
-                default: "100%",
+export default {
+  name: "multiple-bar-charts",
+  componentName: "multiple-bar-chart",
+  props: {
+    width: {
+      type: String,
+      default: "100%",
+    },
+    height: {
+      type: String,
+      default: "13.889vh",
+    },
+    // 传入数据
+    list: {
+      type: Array,
+      default: () => [
+        {
+          title: "日发电量",
+          yAxisIndex: 0,
+          value: [
+            {
+              text: "1日",
+              value: 1,
             },
-            height: {
-                type: String,
-                default: "13.889vh",
-            },
-            // 传入数据
-            list: {
-                type: Array,
-                default: () => [{
-                        title: "日发电量",
-                        yAxisIndex: 0,
-                        value: [{
-                            text: "1日",
-                            value: 1,
-                        }, ],
-                    },
-                    {
-                        title: "上网电量",
-                        yAxisIndex: 0,
-                        value: [{
-                                text: "1日",
-                                value: 1,
-                            },
-                            {
-                                text: "2日",
-                                value: 2,
-                            },
-                            {
-                                text: "3日",
-                                value: 1,
-                            },
-                            {
-                                text: "4日",
-                                value: 3,
-                            },
-                            {
-                                text: "5日",
-                                value: 3,
-                            },
-                            {
-                                text: "6日",
-                                value: 3,
-                            },
-                            {
-                                text: "7日",
-                                value: 3,
-                            },
-                        ],
-                    },
-                    {
-                        title: "购网电量",
-                        yAxisIndex: 0,
-                        value: [{
-                                text: "1日",
-                                value: 1,
-                            },
-                            {
-                                text: "2日",
-                                value: 2,
-                            },
-                            {
-                                text: "3日",
-                                value: 1,
-                            },
-                            {
-                                text: "4日",
-                                value: 3,
-                            },
-                            {
-                                text: "5日",
-                                value: 3,
-                            },
-                            {
-                                text: "6日",
-                                value: 3,
-                            },
-                            {
-                                text: "7日",
-                                value: 3,
-                            },
-                        ],
-                    },
-                    {
-                        title: "风速",
-                        yAxisIndex: 1,
-                        value: [{
-                                text: "1日",
-                                value: 1,
-                            },
-                            {
-                                text: "2日",
-                                value: 2,
-                            },
-                            {
-                                text: "3日",
-                                value: 1,
-                            },
-                            {
-                                text: "4日",
-                                value: 3,
-                            },
-                            {
-                                text: "5日",
-                                value: 3,
-                            },
-                            {
-                                text: "6日",
-                                value: 3,
-                            },
-                            {
-                                text: "7日",
-                                value: 3,
-                            },
-                        ],
-                    },
-                ],
+          ],
+        },
+        {
+          title: "上网电量",
+          yAxisIndex: 0,
+          value: [
+            {
+              text: "1日",
+              value: 1,
             },
-            // 单位
-            units: {
-                type: Array,
-                default: () => ["(万KWh)", "(风速)"],
+            {
+              text: "2日",
+              value: 2,
             },
-            // 显示 legend
-            showLegend: {
-                type: Boolean,
-                default: true,
+            {
+              text: "3日",
+              value: 1,
             },
-            // 颜色#
-            color: {
-                type: Array,
-                default: () => [
-                    "#2999a0", "#67b9ff", "#ff6271", 
-                    "#05bb4c",
-                    "#4b55ae",
-                    "#fa8c16",
-                    "#f8de5b",
-                    "#1a93cf",
-                    "#c531c7",
-                    "#bd3338",
-                ],
+            {
+              text: "4日",
+              value: 3,
             },
-            showAnimation: {
-                type: Boolean,
-                default: true,
+            {
+              text: "5日",
+              value: 3,
             },
-            // 柱子最大宽度
-            barMaxWidth: {
-                type: Number || String,
-                default: 0,
+            {
+              text: "6日",
+              value: 3,
             },
-            // 柱子间距
-            barGap: {
-                type: Number || String,
-                default: 0,
+            {
+              text: "7日",
+              value: 3,
             },
+          ],
         },
-        data() {
-            return {
-                id: "",
-                chart: null,
-                firstAnimation: true,
-            };
+        {
+          title: "购网电量",
+          yAxisIndex: 0,
+          value: [
+            {
+              text: "1日",
+              value: 1,
+            },
+            {
+              text: "2日",
+              value: 2,
+            },
+            {
+              text: "3日",
+              value: 1,
+            },
+            {
+              text: "4日",
+              value: 3,
+            },
+            {
+              text: "5日",
+              value: 3,
+            },
+            {
+              text: "6日",
+              value: 3,
+            },
+            {
+              text: "7日",
+              value: 3,
+            },
+          ],
         },
-        computed: {
-            legend() {
-                return this.list.map((t) => {
-                    return t.title;
-                });
+        {
+          title: "风速",
+          yAxisIndex: 1,
+          value: [
+            {
+              text: "1日",
+              value: 1,
             },
-            xdata() {
-                let result = [];
-                if (this.list && this.list.length > 0 && this.list[0].value.length > 0) {
-                    result = this.list[0].value.map((t) => {
-                        return t.text;
-                    });
-                }
-                return result;
+            {
+              text: "2日",
+              value: 2,
             },
-            ydata() {
-                let result = [];
-                this.units.forEach((value, index) => {
-                    let data = null;
-                    if (index == 0) {
-                        data = {
-                            type: "value",
-                            name: value,
-                            nameTextStyle: {
-                                color: "#a6c1dd"
-                            },
-                            axisLabel: {
-                                formatter: "{value} ",
-                                fontSize: 12,
-                                textStyle: {
-                                    color: this.$store.state.themeName === "dark" ?
-                                        "#a6c1dd" : "#000",
-                                },
-                            },
-                            //分格线
-                            splitLine: {
-                                lineStyle: {
-                                    color: this.$store.state.themeName === "dark" ? "#404d69" : "#000",
-                                    type: "dashed",
-                                },
-                            },
-                        };
-                    } else {
-                        data = {
-                            type: "value",
-                            name: value,
-                            nameTextStyle: {
-                                color: "#a6c1dd"
-                            },
-                            axisLabel: {
-                                formatter: "{value}",
-                                fontSize: 12,
-                                textStyle: {
-                                    color: this.$store.state.themeName === "dark" ?
-                                        "#a6c1dd" : "#000",
-                                },
-                            },
-                            //分格线
-                            splitLine: {
-                                show: false,
-                            },
-                        };
-                    }
-
-                    result.push(data);
-                });
-
-                return result;
+            {
+              text: "3日",
+              value: 1,
             },
-            series() {
-                let result = [];
-                if (this.list && this.list.length > 0) {
-                    this.list.forEach((value, index) => {
-                        let seriesItem = {
-                            name: value.title,
-                            type: "bar",
-                            barWidth: "8%",
-                            animation: this.firstAnimation && this.showAnimation,
-                            yAxisIndex: value.yAxisIndex,
-                            data: value.value.map((t) => {
-                                return t.value;
-                            }),
-                        };
-                        if (this.barMaxWidth) {
-                            seriesItem.barMaxWidth = this.barMaxWidth;
-                        } else {
-                            seriesItem.barWidth = "8%";
-                        }
-
-                        if (this.barGap) {
-                            seriesItem.barGap = this.barGap;
-                        }
-                        result.push(seriesItem);
-                    });
-                }
-                return result;
+            {
+              text: "4日",
+              value: 3,
+            },
+            {
+              text: "5日",
+              value: 3,
             },
+            {
+              text: "6日",
+              value: 3,
+            },
+            {
+              text: "7日",
+              value: 3,
+            },
+          ],
         },
-        methods: {
-            resize() {
-                this.initChart();
+      ],
+    },
+    // 单位
+    units: {
+      type: Array,
+      default: () => ["(万KWh)", "(风速)"],
+    },
+    // 显示 legend
+    showLegend: {
+      type: Boolean,
+      default: true,
+    },
+    // 颜色#
+    color: {
+      type: Array,
+      default: () => [
+        "#2999a0",
+        "#67b9ff",
+        "#ff6271",
+        "#05bb4c",
+        "#4b55ae",
+        "#fa8c16",
+        "#f8de5b",
+        "#1a93cf",
+        "#c531c7",
+        "#bd3338",
+      ],
+    },
+    showAnimation: {
+      type: Boolean,
+      default: true,
+    },
+    // 柱子最大宽度
+    barMaxWidth: {
+      type: Number || String,
+      default: 0,
+    },
+    // 柱子间距
+    barGap: {
+      type: Number || String,
+      default: 0,
+    },
+  },
+  data() {
+    return {
+      id: "",
+      chart: null,
+      firstAnimation: true,
+    };
+  },
+  computed: {
+    legend() {
+      return this.list.map((t) => {
+        return t.title;
+      });
+    },
+    xdata() {
+      let result = [];
+      if (this.list && this.list.length > 0 && this.list[0].value.length > 0) {
+        result = this.list[0].value.map((t) => {
+          return t.text;
+        });
+      }
+      return result;
+    },
+    ydata() {
+      let result = [];
+      this.units.forEach((value, index) => {
+        let data = null;
+        if (index == 0) {
+          data = {
+            type: "value",
+            name: value,
+            nameTextStyle: {
+              color: "#a6c1dd",
+            },
+            axisLabel: {
+              formatter: "{value} ",
+              fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark" ? "#a6c1dd" : "#000",
+              },
             },
-            initChart() {
-                let chart = echarts.init(this.$el);
+            //分格线
+            splitLine: {
+              lineStyle: {
+                color:
+                  this.$store.state.themeName === "dark" ? "#404d69" : "#000",
+                type: "dashed",
+              },
+            },
+          };
+        } else {
+          data = {
+            type: "value",
+            name: value,
+            nameTextStyle: {
+              color: "#a6c1dd",
+            },
+            axisLabel: {
+              formatter: "{value}",
+              fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark" ? "#a6c1dd" : "#000",
+              },
+            },
+            //分格线
+            splitLine: {
+              show: false,
+            },
+          };
+        }
 
-                let option = {
-                    color: this.color,
-                    tooltip: {
-                        trigger: "axis",
-                        backgroundColor: this.$store.state.themeName === "dark" ?
-                            "rgba(0,0,0,0.4)" : "rgba(255,255,255,0.5)",
-                        borderColor: this.$store.state.themeName === "dark" ?
-                            partten.getColor("gray") : "#000",
-                        textStyle: {
-                            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
-                            fontSize: 12,
-                        },
-                    },
-                    legend: {
-                        show: this.showLegend,
-                        data: this.legend,
-                        right: 56,
-                        icon: "ract",
-                        itemWidth: 8,
-                        itemHeight: 8,
-                        inactiveColor: this.$store.state.themeName === "dark" ?
-                            partten.getColor("gray") : "#000",
-                        textStyle: {
-                            fontSize: 12,
-                            color: this.$store.state.themeName === "dark" ?
-                                partten.getColor("grayl") : "#000",
-                        },
-                    },
-                    grid: {
-                        top: 32,
-                        left: 25,
-                        right: 30,
-                        bottom: 0,
-                        containLabel: true,
-                    },
-                    xAxis: [{
-                        type: "category",
-                        data: this.xdata,
-                        nameLocation: "center",
-                        axisPointer: {
-                            type: "shadow",
-                        },
-                        axisLabel: {
-                            interval: 0,
-                            fontSize: 12,
-                            textStyle: {
-                                color: this.$store.state.themeName === "dark" ?
-                                    "#a6c1dd" : "#000",
-                            },
-                        },
-                    }, ],
-                    yAxis: this.ydata,
-                    series: this.series,
-                };
+        result.push(data);
+      });
 
-                chart.clear();
-                chart.setOption(option);
+      return result;
+    },
+    series() {
+      let result = [];
+      if (this.list && this.list.length > 0) {
+        this.list.forEach((value, index) => {
+          let seriesItem = {
+            name: value.title,
+            type: "bar",
+            barWidth: "8%",
+            animation: this.firstAnimation && this.showAnimation,
+            yAxisIndex: value.yAxisIndex,
+            data: value.value.map((t) => {
+              return t.value;
+            }),
+          };
+          if (this.barMaxWidth) {
+            seriesItem.barMaxWidth = this.barMaxWidth;
+          } else {
+            seriesItem.barWidth = "8%";
+          }
 
-                this.resize = function () {
-                    chart.resize();
-                };
+          if (this.barGap) {
+            seriesItem.barGap = this.barGap;
+          }
+          result.push(seriesItem);
+        });
+      }
+      return result;
+    },
+  },
+  methods: {
+    resize() {
+      this.initChart();
+    },
+    initChart() {
+      let chart = echarts.init(this.$el);
 
-                window.addEventListener("resize", this.resize);
-            },
-        },
-        created() {
-            this.$nextTick(() => {
-                this.id = "pie-chart-" + util.newGUID();
-            });
-        },
-        mounted() {
-            this.$nextTick(() => {
-                this.$el.style.width = this.width;
-                this.$el.style.height = this.height;
-                this.initChart();
-                this.firstAnimation = false;
-            });
+      let option = {
+        color: this.color,
+        tooltip: {
+          trigger: "axis",
+          backgroundColor:
+            this.$store.state.themeName === "dark"
+              ? "rgba(0,0,0,0.4)"
+              : "rgba(255,255,255,0.5)",
+          borderColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
+          textStyle: {
+            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
+            fontSize: 12,
+          },
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:5px'>${params[0].axisValue}</div>`;
+            for (var i = 0; i < params.length; i++) {
+              htmlStr += `<div style='margin-bottom:2px'>`;
+              var param = params[i];
+              var seriesName = param.seriesName; //图例名称
+              var value = param.value; //y轴值
+              var mark = param.marker; //点
+              var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+              htmlStr += mark; //一个点
+              htmlStr += `${seriesName} : ${
+                value != null ? value + unit : "--"
+              }`; //圆点后面显示的文本
+              htmlStr += "</div>";
+            }
+            return htmlStr;
+          },
         },
-        updated() {
-            this.$nextTick(() => {
-                this.initChart();
-            });
+        legend: {
+          show: this.showLegend,
+          data: this.legend,
+          right: 56,
+          icon: "ract",
+          itemWidth: 8,
+          itemHeight: 8,
+          inactiveColor:
+            this.$store.state.themeName === "dark"
+              ? partten.getColor("gray")
+              : "#000",
+          textStyle: {
+            fontSize: 12,
+            color:
+              this.$store.state.themeName === "dark"
+                ? partten.getColor("grayl")
+                : "#000",
+          },
         },
-        unmounted() {
-            window.removeEventListener("resize", this.resize);
+        grid: {
+          top: 32,
+          left: 25,
+          right: 30,
+          bottom: 0,
+          containLabel: true,
         },
-
-        watch: {
-            "$store.state.themeName"() {
-                let myChart = echarts.init(document.getElementById(this.id));
-                myChart.dispose();
-                setTimeout(() => {
-                    this.initChart();
-                }, 300);
+        xAxis: [
+          {
+            type: "category",
+            data: this.xdata,
+            nameLocation: "center",
+            axisPointer: {
+              type: "shadow",
             },
-        },
-    };
+            axisLabel: {
+              interval: 0,
+              fontSize: 12,
+              textStyle: {
+                color:
+                  this.$store.state.themeName === "dark" ? "#a6c1dd" : "#000",
+              },
+            },
+          },
+        ],
+        yAxis: this.ydata,
+        series: this.series,
+      };
+
+      chart.clear();
+      chart.setOption(option);
+
+      this.resize = function () {
+        chart.resize();
+      };
+
+      window.addEventListener("resize", this.resize);
+    },
+  },
+  created() {
+    this.$nextTick(() => {
+      this.id = "pie-chart-" + util.newGUID();
+    });
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.$el.style.width = this.width;
+      this.$el.style.height = this.height;
+      this.initChart();
+      this.firstAnimation = false;
+    });
+  },
+  updated() {
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+  unmounted() {
+    window.removeEventListener("resize", this.resize);
+  },
+
+  watch: {
+    "$store.state.themeName"() {
+      let myChart = echarts.init(document.getElementById(this.id));
+      myChart.dispose();
+      setTimeout(() => {
+        this.initChart();
+      }, 300);
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .chart {
-        width: 100%;
-        height: 100%;
-        display: inline-block;
-    }
+.chart {
+  width: 100%;
+  height: 100%;
+  display: inline-block;
+}
 </style>

src/views/economicsOperation/nxfHomePage/component/multiple-y-line-chart-normal.vue

@@ -285,7 +285,18 @@ export default {
     return {
       id: "",
       chart: null,
-      color: ["#2999a0", "#67b9ff", "#ff6271", "#05b2fa", "#0ef167","#05bb4c", "#4b55ae", "#EDB32F", "#DB5520", "#323E6F",  ],
+      color: [
+        "#2999a0",
+        "#67b9ff",
+        "#ff6271",
+        "#05b2fa",
+        "#0ef167",
+        "#05bb4c",
+        "#4b55ae",
+        "#EDB32F",
+        "#DB5520",
+        "#323E6F",
+      ],
     };
   },
   computed: {
@@ -309,7 +320,7 @@ export default {
           nameLocation: p[item.position] % 2 == 0 ? "end" : "start",
           nameGap: 10,
           nameTextStyle: {
-            color: "#a6c1dd"
+            color: "#a6c1dd",
           },
           min: item.min,
           max: item.max,
@@ -320,9 +331,7 @@ export default {
             fontSize: 12,
             textStyle: {
               color:
-                this.$store.state.themeName === "dark"
-                  ? "#a6c1dd"
-                  : "#000",
+                this.$store.state.themeName === "dark" ? "#a6c1dd" : "#000",
             },
           },
           //分格线
@@ -401,6 +410,33 @@ export default {
             color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
             fontSize: 12,
           },
+          //   formatter: function (params) {
+          //     let tooltipText = params[0].axisValueLabel + "<br/>";
+          //     params.forEach(function (item) {
+          //       // 为每个数据项添加单位，假设数值的单位是'元'
+          //       tooltipText +=
+          //         item.seriesName + "：" + item.value + " 万kWh<br/>";
+          //     });
+          //     return tooltipText;
+          //   },
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:5px'>${params[0].axisValue}</div>`;
+            for (var i = 0; i < params.length; i++) {
+              htmlStr += `<div style='margin-bottom:2px'>`;
+              var param = params[i];
+              var seriesName = param.seriesName; //图例名称
+              var value = param.value; //y轴值
+              var mark = param.marker; //点
+              var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+              htmlStr += mark; //一个点
+              htmlStr += `${seriesName} : ${
+                value != null ? value + unit : "--"
+              }`; //圆点后面显示的文本
+              htmlStr += "</div>";
+            }
+            return htmlStr;
+          },
         },
         legend: {
           show: this.showLegend,
@@ -433,9 +469,7 @@ export default {
               fontSize: 12,
               textStyle: {
                 color:
-                  this.$store.state.themeName === "dark"
-                    ? "#a6c1dd"
-                    : "#000",
+                  this.$store.state.themeName === "dark" ? "#a6c1dd" : "#000",
               },
             },
             data: this.xdata,

src/views/economicsOperation/nxfHomePage/component/percent-card-2.vue

@@ -1,130 +1,151 @@
 <template>
-    <div class="percent-card">
-        <div class="card-chart">
-            <percent-bar width="13vh" height="13vh" :value="percent" :nameVa="PercentName" :color="color" />
-            <div class="card-title gray">{{ title }}</div>
+  <div class="percent-card">
+    <div class="card-chart">
+      <percent-bar
+        width="13vh"
+        height="13vh"
+        :value="percent"
+        :nameVa="PercentName"
+        :color="color"
+      />
+      <div class="card-title gray">{{ title }}</div>
+    </div>
+    <div class="card-info">
+      <div class="card-value">
+        <span class="value-text newBlue">{{ TotalText }}</span>
+        <div>
+          <span class="newwhite">{{ TotalValue.toFixed(2) }}</span>
+          <span class="newwhite" style="font-size: 12px">(万kWh)</span>
+        </div>
+      </div>
+      <div class="card-value">
+        <span class="value-text newBlue">{{ ActualText }}</span>
+        <!-- <span class="newwhite">{{ ActualValue * 10 }}</span> -->
+        <div>
+          <span class="newwhite">{{ ActualValue }}</span>
+          <span class="newwhite" style="font-size: 12px">(万kWh)</span>
         </div>
-        <div class="card-info">
-            <div class="card-value">
-                <span class="value-text newBlue">{{ TotalText }}</span>
-                <span class="newwhite">{{ TotalValue.toFixed(2) }}</span>
-            </div>
-            <div class="card-value">
-                <span class="value-text newBlue">{{ ActualText }}</span>
-                <!-- <span class="newwhite">{{ ActualValue * 10 }}</span> -->
-                <span class="newwhite">{{ ActualValue }}</span>
-            </div>
-            <div class="card-value">
-                <span class="value-text newBlue">{{ PercentText }}</span>
-                <span class="newwhite">{{ PercentValue ? PercentValue.toFixed(2) : 0 }}</span>
-            </div>
+        <!-- <span class="newwhite">{{ ActualValue }}</span> -->
+      </div>
+      <div class="card-value">
+        <span class="value-text newBlue">{{ PercentText }}</span>
+        <div>
+          <span class="newwhite">{{
+            PercentValue ? PercentValue.toFixed(2) : 0
+          }}</span>
+          <span class="newwhite" style="font-size: 12px">(万kWh)</span>
         </div>
+        <!-- <span class="newwhite"
+          >{{ PercentValue ? PercentValue.toFixed(2) : 0 }}(万kWh)</span
+        > -->
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-    // 百分比card2
-    // 使用位置 驾驶舱首页 计划电量完成情况 中的百分比卡片
-    import PercentBar from "./percent-bar.vue";
-    export default {
-        created() {},
-        components: {
-            PercentBar,
-        },
-        props: {
-            title: {
-                type: String,
-                default: "月计划完成率",
-            },
-            PercentName: {
-                type: String,
-                default: "",
-            },
-            TotalText: {
-                type: String,
-                default: "实际",
-            },
-            TotalValue: {
-                type: Number,
-                String,
-                default: 0,
-            },
-            ActualText: {
-                type: String,
-                default: "计划",
-            },
-            ActualValue: {
-                type: Number,
-                String,
-                default: 0,
-            },
-            PercentText: {
-                type: String,
-                default: "计划",
-            },
-            PercentValue: {
-                type: Number,
-                String,
-                default: 0,
-            },
-            color: {
-                type: String,
-                default: "green",
-            },
-        },
+// 百分比card2
+// 使用位置 驾驶舱首页 计划电量完成情况 中的百分比卡片
+import PercentBar from "./percent-bar.vue";
+export default {
+  created() {},
+  components: {
+    PercentBar,
+  },
+  props: {
+    title: {
+      type: String,
+      default: "月计划完成率",
+    },
+    PercentName: {
+      type: String,
+      default: "",
+    },
+    TotalText: {
+      type: String,
+      default: "实际",
+    },
+    TotalValue: {
+      type: Number,
+      String,
+      default: 0,
+    },
+    ActualText: {
+      type: String,
+      default: "计划",
+    },
+    ActualValue: {
+      type: Number,
+      String,
+      default: 0,
+    },
+    PercentText: {
+      type: String,
+      default: "计划",
+    },
+    PercentValue: {
+      type: Number,
+      String,
+      default: 0,
+    },
+    color: {
+      type: String,
+      default: "green",
+    },
+  },
 
-        computed: {
-            percent() {
-                return this.TotalValue === 0 || this.ActualValue === 0 ?
-                    0 :
-                    parseInt((this.TotalValue / this.ActualValue) * 100);
-            },
-        },
-    };
+  computed: {
+    percent() {
+      return this.TotalValue === 0 || this.ActualValue === 0
+        ? 0
+        : parseInt((this.TotalValue / this.ActualValue) * 100);
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
-    .percent-card {
-        display: flex;
+.percent-card {
+  display: flex;
 
-        .card-chart {
-            flex: 1 1 5.926vh;
-        }
+  .card-chart {
+    flex: 1 1 5.926vh;
+  }
 
-        .card-title {
-            text-align: center;
-            width: 100%;
-            margin-top: 1.481vh;
-            font-size: 12px;
-        }
+  .card-title {
+    text-align: center;
+    width: 100%;
+    margin-top: 1.481vh;
+    font-size: 12px;
+  }
 
-        .card-info {
-            flex: auto;
-            align-self: center;
-            margin-left: 10px;
-            margin-top: -0.4vh;
+  .card-info {
+    flex: auto;
+    align-self: center;
+    margin-left: 10px;
+    margin-top: -0.4vh;
 
-            .card-value {
-                font-size: 14px;
-                font-weight: 600;
-                margin-bottom: 1.1111vh;
-                white-space: nowrap;
+    .card-value {
+      font-size: 14px;
+      font-weight: 600;
+      margin-bottom: 1.1111vh;
+      white-space: nowrap;
 
-                .value-text {
-                    margin-right: 10px;
-                    font-family: @font-family-num;
-                }
-                .newBlue{
-                    color: #4d72bb;
-                }
-                .newwhite{
-                    color: #c3e1ff;
-                }
-            }
+      .value-text {
+        margin-right: 10px;
+        font-family: @font-family-num;
+      }
+      .newBlue {
+        color: #4d72bb;
+      }
+      .newwhite {
+        color: #c3e1ff;
+      }
+    }
 
-            .card-text {
-                font-size: @fontsize;
-            }
-        }
+    .card-text {
+      font-size: @fontsize;
     }
+  }
+}
 </style>

src/views/economicsOperation/stationAnalyse/angleAnalysis/components/current-scatter-chart.vue

@@ -101,7 +101,7 @@ export default {
 
     initChart(markItem = {}) {
       const that = this;
-    //   document.getElementById(this.id).removeAttribute("_echarts_instance_");
+      //   document.getElementById(this.id).removeAttribute("_echarts_instance_");
       that.chart = null;
       const theme = sessionStorage.getItem("theme") === "true" ? true : false;
 
@@ -222,6 +222,8 @@ export default {
                                   ele.seriesName
                                 }:<span style="font-weight: 700;margin-left:10px">${
                   ele.value || 0
+                }</span><span>${
+                  ele.seriesName === "平均风速" ? "m/s" : "MW"
                 }</span>
                             </span>
                            </p>

src/views/economicsOperation/stationAnalyse/angleAnalysis/index.vue

@@ -336,42 +336,42 @@ const funSubmit = (params) => {
         },
         {
           prop: "ygsdxz",
-          label: "有功设定限值",
+          label: "有功设定限值(MW)",
           width: 80,
         },
         {
           prop: "sfyg",
-          label: "实发有功",
+          label: "实发有功(MW)",
           width: 80,
         },
         {
           prop: "cz",
-          label: "差值",
+          label: "差值(MW)",
           width: 80,
         },
         {
           prop: "llgl",
-          label: "理论功率",
+          label: "理论功率(MW)",
           width: 80,
         },
         {
           prop: "pcsx",
-          label: "偏差上限",
+          label: "偏差上限(MW)",
           width: 80,
         },
         {
           prop: "pcxx",
-          label: "偏差下限",
+          label: "偏差下限(MW)",
           width: 100,
         },
         {
           prop: "bzgl",
-          label: "保证功率",
+          label: "保证功率(MW)",
           width: 100,
         },
         {
           prop: "pjfs",
-          label: "平均风速",
+          label: "平均风速(m/s)",
           width: 100,
         },
       ];

src/views/economicsOperation/stationAnalyse/fjglfsAnalysis/components/current-scatter-chart.vue

@@ -222,7 +222,7 @@ export default {
                                   ele.seriesName
                                 }:<span style="font-weight: 700;margin-left:10px">${
                   ele.value || 0
-                }</span>
+                }</span><span>${ele.seriesName === "风速" ? "m/s" : "MW"}</span>
                             </span>
                            </p>
                           </p>`;

src/views/economicsOperation/stationAnalyse/fjglfsAnalysis/index.vue

@@ -261,17 +261,17 @@ const funSubmit = (params) => {
         },
         {
           prop: "fs",
-          label: "风速",
+          label: "风速(m/s)",
           width: 80,
         },
         {
           prop: "sfyg",
-          label: "实发有功",
+          label: "实发有功(MW)",
           width: 80,
         },
         {
           prop: "llgl",
-          label: "理论功率",
+          label: "理论功率(MW)",
           width: 80,
         },
       ];

src/views/economicsOperation/thematicAnalysis/comprehensiveAnalysis/index.vue

@@ -715,6 +715,19 @@ export default {
           textStyle: {
             color: "#fff",
           },
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:2px'>`;
+            var param = params;
+            var seriesName = param.data.name; //图例名称
+            var value = param.data.value; //y轴值
+            var mark = param.marker; //点
+            var unit = `<span style='font-size:12px'>${"万kWh"}</span>`;
+
+            htmlStr += mark; //一个点
+            htmlStr += `${seriesName} : ${value != null ? value + unit : "--"}`; //圆点后面显示的文本
+            htmlStr += "</div>";
+            return htmlStr;
+          },
         },
         toolbox: {
           show: true,

src/views/economicsOperation/windAnalyse/cutInAndOutAnalysis/index.vue

@@ -168,7 +168,7 @@ import {
 import HistoryDetail from "./historyDetail.vue";
 import utils from "@/utills/downXlsx";
 import dayjs from "dayjs";
-import dataJson from "./dataJson.json"
+import dataJson from "./dataJson.json";
 export default {
   name: "CutInAndOutAnalysis", //切入切出分析
   components: {
@@ -189,33 +189,33 @@ export default {
         { id: -2, name: "光伏" },
       ],
       tableHeader: [
-        { title: "总小风切入", code: "inputSmall" },
-        { title: "总大风切入", code: "inputBig" },
-        { title: "总小风切出", code: "outputSmall" },
-        { title: "总大风切出", code: "outputBig" },
-        { title: "日小风切入", code: "dayInputSmall" },
+        { title: "总小风切入(m/s)", code: "inputSmall" },
+        { title: "总大风切入(m/s)", code: "inputBig" },
+        { title: "总小风切出(m/s)", code: "outputSmall" },
+        { title: "总大风切出(m/s)", code: "outputBig" },
+        { title: "日小风切入(m/s)", code: "dayInputSmall" },
         { title: "日小风切入合格率", code: "dayInputSmallRatio" },
-        { title: "日小风切出", code: "dayOutputSmall" },
+        { title: "日小风切出(m/s)", code: "dayOutputSmall" },
         { title: "日小风切出合格率", code: "dayOutputSmallRatio" },
-        { title: "日大风切入", code: "dayInputBig" },
+        { title: "日大风切入(m/s)", code: "dayInputBig" },
         { title: "日大风切入合格率", code: "dayInputBigRatio" },
-        { title: "日大风切出", code: "dayOutputBig" },
+        { title: "日大风切出(m/s)", code: "dayOutputBig" },
         { title: "日大风切出合格率", code: "dayOutputBigRatio" },
-        { title: "月小风切入", code: "monthInputSmall" },
+        { title: "月小风切入(m/s)", code: "monthInputSmall" },
         { title: "月小风切入合格率", code: "monthInputSmallRatio" },
-        { title: "月大风切入", code: "monthInputBig" },
+        { title: "月大风切入(m/s)", code: "monthInputBig" },
         { title: "月大风切入合格率", code: "monthInputBigRatio" },
-        { title: "月小风切出", code: "monthOutputSmall" },
+        { title: "月小风切出(m/s)", code: "monthOutputSmall" },
         { title: "月小风切出合格率", code: "monthOutputSmallRatio" },
-        { title: "月大风切出", code: "monthOutputBig" },
+        { title: "月大风切出(m/s)", code: "monthOutputBig" },
         { title: "月大风切出合格率", code: "monthOutputBigRatio" },
-        { title: "年小风切入", code: "yearInputSmall" },
+        { title: "年小风切入(m/s)", code: "yearInputSmall" },
         { title: "年小风切入合格率", code: "yearInputSmallRatio" },
-        { title: "年大风切入", code: "yearInputBig" },
+        { title: "年大风切入(m/s)", code: "yearInputBig" },
         { title: "年大风切入合格率", code: "yearInputBigRatio" },
-        { title: "年小风切出", code: "yearOutputSmall" },
+        { title: "年小风切出(m/s)", code: "yearOutputSmall" },
         { title: "年小风切出合格率", code: "yearOutputSmallRatio" },
-        { title: "年大风切出", code: "yearOutputBig" },
+        { title: "年大风切出(m/s)", code: "yearOutputBig" },
         { title: "年大风切出合格率", code: "yearOutputBigRatio" },
       ],
       page: {
@@ -236,7 +236,7 @@ export default {
     } else {
       this.isFullScreen = false;
     }
-    
+
     //   this.cutInAndOutAnalysisData = dataJson.data.data.records;
     //   this.page.total = dataJson.data.data.total;
     this.getCompanyData();

src/views/economicsOperation/windAnalyse/powerSearch/index.vue

@@ -142,14 +142,12 @@ import {
   getApiPerformancecurvefitting,
 } from "@/api/monthlyPerformanceAnalysis";
 
-import {
-  getApiequipmentListByWp2
-} from "@/api/monthlyPerformanceAnalysis";
+import { getApiequipmentListByWp2 } from "@/api/monthlyPerformanceAnalysis";
 import * as echarts from "echarts";
 import partten from "@/helper/partten.js";
 import util from "@/helper/util.js";
 import utils from "@/utills/downXlsx";
-import dataJson from "./dataJson.json"
+import dataJson from "./dataJson.json";
 export default {
   name: "PowerSearch",
   data() {
@@ -174,11 +172,9 @@ export default {
       originData: [],
     };
   },
-  created() {
-  },
-  mounted(){
+  created() {},
+  mounted() {
     this.getCompanyData();
-    
   },
   watch: {},
   methods: {
@@ -224,8 +220,8 @@ export default {
     },
     // 获取公司列表
     async getCompanyData() {
-        // this.powerLinefittingData = dataJson.data.data
-        // this.changeEchartsData(dataJson.data.data);
+      // this.powerLinefittingData = dataJson.data.data
+      // this.changeEchartsData(dataJson.data.data);
 
       this.companyOptions = [];
       this.pickerTimer = this.getchangeTime(new Date());
@@ -273,16 +269,16 @@ export default {
     // 获取风机
     async getWindData() {
       this.windsOptions = [];
-    //   let params = {
-    //     companyId: this.companyVal,
-    //     wpIds: this.stationVal,
-    //     projectIds: "",
-    //     lineIds: "",
-    //     type: 0,
-    //   };
-    let params = {
-        wpid: this.stationVal
-    }
+      //   let params = {
+      //     companyId: this.companyVal,
+      //     wpIds: this.stationVal,
+      //     projectIds: "",
+      //     lineIds: "",
+      //     type: 0,
+      //   };
+      let params = {
+        wpid: this.stationVal,
+      };
       const { data: datas } = await getApiequipmentListByWp2(params);
       if (datas.data.length) {
         this.windsOptions = datas.data;
@@ -302,7 +298,6 @@ export default {
         wtId: this.windVal,
         type: this.tabEvent,
       };
-      
 
       const { data: datas } = await getApiPerformancecurvefitting(params);
 
@@ -357,7 +352,13 @@ export default {
     getChartes(xAxis, lenged, series, showY) {
       let option = {
         color: [
-          "#2999a0", "#67b9ff", "#ff6271", "#05b2fa", "#0ef167","#05bb4c", "#4b55ae"
+          "#2999a0",
+          "#67b9ff",
+          "#ff6271",
+          "#05b2fa",
+          "#0ef167",
+          "#05bb4c",
+          "#4b55ae",
         ],
         tooltip: {
           trigger: "axis",
@@ -367,6 +368,24 @@ export default {
             color: "#fff",
             fontSize: util.vh(16),
           },
+          formatter: function (params) {
+            var htmlStr = `<div style='margin-bottom:5px'>${params[0].axisValue}</div>`;
+            for (var i = 0; i < params.length; i++) {
+              htmlStr += `<div style='margin-bottom:2px'>`;
+              var param = params[i];
+              var seriesName = param.seriesName; //图例名称
+              var value = param.value; //y轴值
+              var mark = param.marker; //点
+              var unit = `<span style='font-size:12px'>${"kW"}</span>`;
+
+              htmlStr += mark; //一个点
+              htmlStr += `${seriesName} : ${
+                value != null ? value + unit : "--"
+              }`; //圆点后面显示的文本
+              htmlStr += "</div>";
+            }
+            return htmlStr;
+          },
         },
         legend: {
           show: true,