Selaa lähdekoodia

修改单机性能、功率拟合、性能等级评估页面,修改对标管理的部分展示文字

baiyanting 1 vuosi sitten
vanhempi
commit
66c1571170
34 muutettua tiedostoa jossa 7422 lisäystä ja 3572 poistoa
  1. 2 1
      .env.development
  2. 8 0
      src/api/headerNav.js
  3. 2 2
      src/api/monthlyPerformanceAnalysis.js
  4. 405 403
      src/assets/css/common.css
  5. 84 0
      src/router/index.js
  6. 8 202
      src/views/layout/economicsOperation/analyse/standAloneAnalyse/historyDetail.vue
  7. 464 0
      src/views/layout/economicsOperation/analyse/standAloneAnalyse/historyDetailFd.vue
  8. 83 147
      src/views/layout/economicsOperation/analyse/standAloneAnalyse/index.vue
  9. 567 0
      src/views/layout/economicsOperation/analyse/standAloneAnalyse/indexFd.vue
  10. 1 1
      src/views/layout/economicsOperation/benchmarkingManagement/companyBenchmarking/index.vue
  11. 2 3
      src/views/layout/economicsOperation/benchmarkingManagement/intervalBenchmarking/index.vue
  12. 3 3
      src/views/layout/economicsOperation/benchmarkingManagement/loseRate/index.vue
  13. 7 3
      src/views/layout/economicsOperation/benchmarkingManagement/machineBenchmarking/index.vue
  14. 3 2
      src/views/layout/economicsOperation/benchmarkingManagement/performanceRankingList/index.vue
  15. 1 1
      src/views/layout/economicsOperation/benchmarkingManagement/projectBenchmarking/index.vue
  16. 147 124
      src/views/layout/economicsOperation/benchmarkingManagement/quarterBenchmarking/index.vue
  17. 0 839
      src/views/layout/economicsOperation/benchmarkingManagement/singleMachineBenchmarking/index.vue
  18. 2 4
      src/views/layout/economicsOperation/benchmarkingManagement/siteBenchmarking/index.vue
  19. 1 1
      src/views/layout/economicsOperation/benchmarkingManagement/wiringBenchmarking/index.vue
  20. 41 35
      src/views/layout/economicsOperation/index.vue
  21. 34 167
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/dayDetailInfo.vue
  22. 615 0
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/dayDetailInfoFd.vue
  23. 213 190
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/historyDetail.vue
  24. 230 0
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/historyDetailFd.vue
  25. 55 90
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/index.vue
  26. 571 0
      src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/indexFd.vue
  27. 65 78
      src/views/layout/economicsOperation/powerCurve/powerLinefitting/index.vue
  28. 675 0
      src/views/layout/economicsOperation/powerCurve/powerLinefitting/indexFd.vue
  29. 572 493
      src/views/layout/economicsOperation/thematicAnalysis/failure/index.vue
  30. 633 0
      src/views/layout/economicsOperation/thematicAnalysis/failure/indexFd.vue
  31. 481 408
      src/views/layout/economicsOperation/thematicAnalysis/generation/index.vue
  32. 544 0
      src/views/layout/economicsOperation/thematicAnalysis/generation/indexFd.vue
  33. 420 375
      src/views/layout/economicsOperation/thematicAnalysis/windEnergy/index.vue
  34. 483 0
      src/views/layout/economicsOperation/thematicAnalysis/windEnergy/indexGf.vue

+ 2 - 1
.env.development

@@ -1,7 +1,8 @@
 # VUE_APP_BASE_API = http://192.168.11.250:18600
 # VUE_APP_Economy = http://192.168.11.250:6060
 # VUE_APP_BASE_API = http://192.168.1.101:6060
-VUE_APP_Economy = http://192.168.1.103:6060
+VUE_APP_Economy = http://192.168.1.117:6060
+
 # 服务名,调用后台微服务
 VUE_APP_SERVER_NAME = /nem-api
 

+ 8 - 0
src/api/headerNav.js

@@ -17,6 +17,14 @@ export function GetStationByCompany(data) {
     method: "get",
   });
 }
+// 根据场站 ID 获取风机
+export function GetwtByWp(wpids) {
+  return request({
+    baseURL: process.env.VUE_APP_Economy,
+    url: `benchmarking/wtByWplist?wpids=${wpids}`,
+    method: "get",
+  });
+}
 
 // 根据场站 ID 获取风机列表
 export function GeWtList(lnids) {

+ 2 - 2
src/api/monthlyPerformanceAnalysis.js

@@ -65,7 +65,7 @@ export function getApiwindturbinegoodnesslist(params) {
 export function getApiwindturbinegoodnesslistGf(params) {
   return request({
     baseURL: process.env.VUE_APP_Economy,
-    url: `/goodness/pvgoodness?wpid=${params.wpId}&recorddate=${params.recorddate}&companys=${params.cmId}&target=''&sort=''`,
+    url: `/goodness/pvgoodness?wpid=${params.wpId}&recorddate=${params.recorddate}&companys=${params.cmId}&pageNum=${params.pageNum}&pageSize=${params.pageSize}&target=''&sort=''`,
     method: "GET",
   });
 }
@@ -320,7 +320,7 @@ export function getApiequipmentinfoDayCompareList(params) {
 export function getApiPerformancecurvefitting(params) {
   return request({
     baseURL: process.env.VUE_APP_Economy,
-    url: `/performance/curvefitting?dateType=${params.dateType}&type=${params.type}&windturbineIds=${params.wtId}`,
+    url: `/performance/curvefitting?wpids=${params.wpids}&type=${params.type}&windturbineIds=${params.wtId}&companys=${params.companys}`,
     method: "GET",
   });
 }

Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 405 - 403
src/assets/css/common.css


+ 84 - 0
src/router/index.js

@@ -683,6 +683,18 @@ export const asyncRoutes = [
               icon: "",
             },
           },
+          {
+            path: "performanceAssessFd",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/performanceAnalyse/performanceAssess/indexFd.vue"
+              ),
+            name: "performanceAssessFd",
+            meta: {
+              title: "性能等级评估",
+              icon: "",
+            },
+          },
         ],
       },
       {
@@ -708,6 +720,18 @@ export const asyncRoutes = [
             },
           },
           {
+            path: "standAloneAnalyseFd",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/analyse/standAloneAnalyse/indexFd.vue"
+              ),
+            name: "standAloneAnalyseFd",
+            meta: {
+              title: "单机性能分析",
+              icon: "",
+            },
+          },
+          {
             path: "monthlyAnalysis",
             component: () =>
               import(
@@ -744,6 +768,18 @@ export const asyncRoutes = [
             },
           },
           {
+            path: "powerLinefittingFd",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/powerCurve/powerLinefitting/indexFd.vue"
+              ),
+            name: "powerLinefittingFd",
+            meta: {
+              title: "功率曲线拟合",
+              icon: "",
+            },
+          },
+          {
             path: "cutInAndOutAnalysis",
             component: () =>
               import(
@@ -793,6 +829,18 @@ export const asyncRoutes = [
             },
           },
           {
+            path: "lightEnergy",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/thematicAnalysis/windEnergy/indexGf.vue"
+              ),
+            name: "lightEnergy",
+            meta: {
+              title: "光能利用率",
+              icon: "",
+            },
+          },
+          {
             path: "failure",
             component: () =>
               import(
@@ -805,6 +853,42 @@ export const asyncRoutes = [
             },
           },
           {
+            path: "failureFd",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/thematicAnalysis/failure/indexFd.vue"
+              ),
+            name: "failureGf",
+            meta: {
+              title: "五项损失率",
+              icon: "",
+            },
+          },
+          {
+            path: "generation",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/thematicAnalysis/generation"
+              ),
+            name: "generation",
+            meta: {
+              title: "发电量分析",
+              icon: "",
+            },
+          },
+          {
+            path: "generationFd",
+            component: () =>
+              import(
+                "@/views/layout/economicsOperation/thematicAnalysis/generation/indexFd.vue"
+              ),
+            name: "generationFd",
+            meta: {
+              title: "发电量分析",
+              icon: "",
+            },
+          },
+          {
             path: "reset",
             component: () =>
               import(

+ 8 - 202
src/views/layout/economicsOperation/analyse/standAloneAnalyse/historyDetail.vue

@@ -1,61 +1,6 @@
 <template>
   <div class="historysingleMachine">
     <div class="historysingleMachine_top">
-      <!-- <el-select size="mini" v-model="hiscompanyVal" placeholder="请选择">
-        <el-option
-          v-for="item in historyCompanyOptions"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <div class="tabCut">
-        <div
-          @click="changeBtn(val.id)"
-          :class="tabIndex === val.id ? 'active' : ''"
-          v-for="val in tabOptions"
-          :key="val.id"
-        >
-          <span>{{ val.name }}</span>
-        </div>
-      </div> -->
-      <div class="station">
-        场站:
-        <el-select
-          size="mini"
-          v-model="hisstationVal"
-          placeholder="请选择"
-          clearable
-          @change="changeStation"
-        >
-          <el-option
-            v-for="item in historyStationOptions"
-            :key="item.id"
-            :label="item.name"
-            :value="item.id"
-          >
-          </el-option>
-        </el-select>
-      </div>
-      <div class="station">
-        机组:
-        <el-select
-          size="mini"
-          v-model="hiswindVal"
-          placeholder="请选择"
-          clearable
-          @change="changeWind"
-        >
-          <el-option
-            v-for="item in hisWindOptions"
-            :key="item.id"
-            :label="item.aname"
-            :value="item.id"
-          >
-          </el-option>
-        </el-select>
-      </div>
       <div class="stationsv">
         <span class="timeaa">时间</span>
         <el-date-picker
@@ -87,12 +32,7 @@
         ref="historysingleTable"
         style="width: 100%"
       >
-        <el-table-column
-          align="center"
-          :label="tabIndex === -1 ? '风机' : '逆变器'"
-          width="130"
-          fixed="left"
-        >
+        <el-table-column align="center" label="逆变器" width="130" fixed="left">
           <template #default="{ row }">
             <span>{{ tabIndex === -1 ? row.wtcode : row.wtname }}</span>
           </template>
@@ -109,7 +49,7 @@
           </template>
         </el-table-column>
         <el-table-column
-          v-for="(item, index) in tabIndex === -1 ? tableHeader : tableHeaderGf"
+          v-for="(item, index) in tableHeaderGf"
           :key="index"
           sortable
           :prop="item.code"
@@ -138,7 +78,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <el-pagination
+      <!-- <el-pagination
         @size-change="handleSizeChange"
         @current-change="handleCurrentChange"
         :current-page="page.currentPage"
@@ -146,7 +86,7 @@
         layout="total, prev, pager, next, jumper"
         :total="page.total"
       >
-      </el-pagination>
+      </el-pagination> -->
     </div>
   </div>
 </template>
@@ -179,78 +119,6 @@ export default {
       historysingleMachineData: [],
       hisWindOptions: [],
       showBtn: true,
-      page: {
-        pagesize: 11,
-        currentPage: 1,
-        total: 0,
-      },
-      //   tabIndex: -1,
-      //   tabOptions: [
-      //     { id: -1, name: "风电" },
-      //     { id: -2, name: "光伏" },
-      //   ],
-      tableHeader: [
-        { title: "日发电量", code: "rfdl" },
-        { title: "月发电量", code: "yfdl" },
-        { title: "年发电量", code: "nfdl" },
-        { title: "日应发电量", code: "ryfdl" },
-        { title: "月应发电量", code: "yyfdl" },
-        { title: "年应发电量", code: "nyfdl" },
-        { title: "日平均功率", code: "rpjgl" },
-        { title: "月平均功率", code: "ypjgl" },
-        { title: "年平均功率", code: "npjgl" },
-        { title: "日平均风速", code: "rpjfs" },
-        { title: "月平均风速", code: "ypjfs" },
-        { title: "年平均风速", code: "npjfs" },
-        { title: "日运行小时", code: "ryxxs" },
-        { title: "月运行小时", code: "yyxxs" },
-        { title: "年运行小时", code: "nyxxs" },
-        { title: "日待机小时", code: "rdjxs" },
-        { title: "月待机小时", code: "ydjxs" },
-        { title: "年待机小时", code: "ndjxs" },
-        { title: "日故障小时", code: "rgzxs" },
-        { title: "月故障小时", code: "ygzxs" },
-        { title: "年故障小时", code: "ngzxs" },
-        { title: "日检修小时", code: "rjxxs" },
-        { title: "月检修小时", code: "yjxxs" },
-        { title: "年检修小时", code: "njxxs" },
-        { title: "日中断小时", code: "rzdxs" },
-        { title: "月中断小时", code: "yzdxs" },
-        { title: "年中断小时", code: "nzdxs" },
-        { title: "日有效风时", code: "ryxfs" },
-        { title: "月有效风时", code: "yyxfs" },
-        { title: "年有效风时", code: "nyxfs" },
-        { title: "日损失电量", code: "rssdl" },
-        { title: "月损失电量", code: "yssdl" },
-        { title: "年损失电量", code: "nssdl" },
-        { title: "日报警次数", code: "rbjcs" },
-        { title: "月报警次数", code: "ybjcs" },
-        { title: "年报警次数", code: "nbjcs" },
-        { title: "日停机次数", code: "rtjcs" },
-        { title: "月停机次数", code: "ytjcs" },
-        { title: "年停机数", code: "ntjcs" },
-        { title: "日不饱和数", code: "rbbhcs" },
-        { title: "月不饱和数", code: "ybbhcs" },
-        { title: "年不饱和数", code: "nbbhcs" },
-        { title: "日可利用率", code: "rsbklyl" },
-        { title: "月可利用率", code: "ysbklyl" },
-        { title: "年可利用率", code: "nsbklyl" },
-        { title: "日平均温度", code: "rpjwd" },
-        { title: "月平均温度", code: "ypjwd" },
-        { title: "年平均温度", code: "npjwd" },
-        { title: "日平均湿度", code: "rpjsd" },
-        { title: "月平均湿度", code: "ypjsd" },
-        { title: "年平均湿度", code: "npjsd" },
-        { title: "日平均压强", code: "rpjyq" },
-        { title: "月平均压强", code: "ypjyq" },
-        { title: "年平均压强", code: "npjyq" },
-        { title: "日拟合优度", code: "rnhyd" },
-        { title: "月拟合优度", code: "ynhyd" },
-        { title: "年拟合优度", code: "nnhyd" },
-        { title: "日实际/保证", code: "rsjbz" },
-        { title: "月实际/保证", code: "ysjbz" },
-        { title: "年实际/保正", code: "nsjbz" },
-      ],
       tableHeaderGf: [
         { title: "型号", code: "model" },
         { title: "日系统效率", code: "rxtxl" },
@@ -265,38 +133,9 @@ export default {
       ],
     };
   },
-  //   watch: {
-  //     tabIndex(val) {
-  //       this.tableHeader = this.tableHeader.map((item) => {
-  //         if (val == -2) {
-  //           if (item.code == "rpjfs") {
-  //             item.title = "日平均光照";
-  //           }
-  //           if (item.code == "ypjfs") {
-  //             item.title = "月平均光照";
-  //           }
-  //           if (item.code == "npjfs") {
-  //             item.title = "年平均光照";
-  //           }
-  //         } else {
-  //           if (item.code == "rpjfs") {
-  //             item.title = "日平均风速";
-  //           }
-  //           if (item.code == "ypjfs") {
-  //             item.title = "月平均风速";
-  //           }
-  //           if (item.code == "npjfs") {
-  //             item.title = "年平均风速";
-  //           }
-  //         }
-  //         return { ...item };
-  //       });
-  //     },
-  //   },
 
   methods: {
     init(row) {
-      //   this.hiscompanyVal = row.companyId;
       this.hisstationVal = row.windtpowerstationId;
       this.hiswindVal = row.windturbineId || row.wtid;
       this.getTableData();
@@ -325,52 +164,19 @@ export default {
       });
       return Newarr;
     },
-    async getWindPowerStation() {
-      const { data } = await getApiequipmentListByWp({
-        wpid: this.hisstationVal,
-      });
-      this.hisWindOptions = data;
-      if (!this.hiswindVal && data.length) {
-        this.hiswindVal = data[0].id;
-      }
-    },
-    // changeBtn(id) {
-    //   this.tabIndex = id;
-    //   this.$emit("getHisStationOptions", this.tabIndex, this.hiscompanyVal);
-    //   this.getTableData();
-    // },
-    changeStation(val) {
-      this.hisstationVal = val;
-      this.hiswindVal = "";
-      this.getWindPowerStation();
-    },
-    changeWind(val) {
-      this.hiswindVal = val;
-      this.getTableData();
-    },
     seachData() {
       this.getTableData();
     },
     async getTableData() {
       let params = {
         type: this.tabIndex,
-        pageNum: this.page.currentPage,
-        pageSize: this.page.pagesize,
         beginDate: this.pickerTimer[0],
         endDate: this.pickerTimer[1],
         wpId: this.hisstationVal,
         wtId: this.hiswindVal,
       };
-      let datas = {};
-      if (this.tabIndex == -1) {
-        datas = await getApihistorywindturbinegoodnesslist(params);
-        this.historysingleMachineData = datas.data.records;
-        this.page.total = datas.data.total;
-      } else {
-        datas = await getApihistorywindturbinegoodnesslistGf(params);
-        this.historysingleMachineData = datas.data;
-        this.page.total = datas.data.length;
-      }
+      let datas = await getApihistorywindturbinegoodnesslistGf(params);
+      this.historysingleMachineData = datas.data;
     },
     handleSizeChange(val) {
       this.page.pagesize = val;
@@ -390,8 +196,8 @@ export default {
       return y + "-" + m + "-" + d;
     },
     downXlsxFn() {
-      let header = ["风机", "日期"];
-      this.tableHeader.forEach((it) => {
+      let header = ["逆变器", "日期"];
+      this.tableHeaderGf.forEach((it) => {
         header.push(it.title);
       });
       utils.exportExcel(

+ 464 - 0
src/views/layout/economicsOperation/analyse/standAloneAnalyse/historyDetailFd.vue

@@ -0,0 +1,464 @@
+<template>
+  <div class="historysingleMachine">
+    <div class="historysingleMachine_top">
+      <div class="stationsv">
+        <span class="timeaa">时间</span>
+        <el-date-picker
+          v-model="pickerTimer"
+          type="daterange"
+          range-separator="To"
+          start-placeholder="开始时间"
+          end-placeholder="结束时间"
+          :size="size"
+          format="YYYY/MM/DD"
+          value-format="YYYY-MM-DD"
+        />
+      </div>
+      <div class="but">
+        <el-button round size="mini" class="buttons" @click="seachData"
+          >搜索</el-button
+        >
+        <el-button round size="mini" class="buttons" @click="downXlsxFn"
+          >导出</el-button
+        >
+      </div>
+    </div>
+    <div class="cutInAndOutAnalysis_Table">
+      <el-table
+        :data="historysingleMachineData"
+        stripe
+        size="mini"
+        height="80vh"
+        ref="historysingleTable"
+        style="width: 100%"
+      >
+        <el-table-column align="center" label="风机" width="130" fixed="left">
+          <template #default="{ row }">
+            <span>{{ tabIndex === -1 ? row.wtcode : row.wtname }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="recordDate"
+          label="日期"
+          width="150"
+          fixed="left"
+        >
+          <template #default="scope">
+            <span>{{ dateTimeFn(scope.row) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in tableHeader"
+          :key="index"
+          sortable
+          :prop="item.code"
+          :label="item.title"
+          align="center"
+          :width="item.title === '操作' ? '200' : ''"
+        >
+          <template #header="scope">
+            <div v-if="scope.column.label.indexOf('(') > 0">
+              <div>
+                {{
+                  scope.column.label.slice(0, scope.column.label.indexOf("("))
+                }}
+              </div>
+              <div>
+                {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
+              </div>
+            </div>
+            <div v-else>{{ scope.column.label }}</div>
+          </template>
+          <template #default="scope" v-if="item.title === '操作'">
+            <!-- <span class="historyBtn" @click="seachDetail(scope.row)">详情</span> -->
+            <span class="historyBtn" @click="seachHistoryData(scope.row)"
+              >历史</span
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="page.currentPage"
+        :page-size="page.pagesize"
+        layout="total, prev, pager, next, jumper"
+        :total="page.total"
+      >
+      </el-pagination>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getApihistorywindturbinegoodnesslist,
+  getApihistorywindturbinegoodnesslistGf,
+  getApiequipmentListByWp,
+} from "@/api/monthlyPerformanceAnalysis";
+import utils from "@/utils/downXlsx";
+export default {
+  props: {
+    // historyCompanyOptions: {
+    //   type: Array,
+    //   default: () => [],
+    // },
+    tabIndex: { type: Number, required: true },
+    historyStationOptions: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      //   hiscompanyVal: "",
+      hisstationVal: "",
+      hiswindVal: "",
+      pickerTimer: [],
+      historysingleMachineData: [],
+      hisWindOptions: [],
+      showBtn: true,
+      page: {
+        pagesize: 11,
+        currentPage: 1,
+        total: 0,
+      },
+      //   tabIndex: -1,
+      //   tabOptions: [
+      //     { id: -1, name: "风电" },
+      //     { id: -2, name: "光伏" },
+      //   ],
+      tableHeader: [
+        { title: "日发电量", code: "rfdl" },
+        { title: "月发电量", code: "yfdl" },
+        { title: "年发电量", code: "nfdl" },
+        { title: "日应发电量", code: "ryfdl" },
+        { title: "月应发电量", code: "yyfdl" },
+        { title: "年应发电量", code: "nyfdl" },
+        { title: "日平均功率", code: "rpjgl" },
+        { title: "月平均功率", code: "ypjgl" },
+        { title: "年平均功率", code: "npjgl" },
+        { title: "日平均风速", code: "rpjfs" },
+        { title: "月平均风速", code: "ypjfs" },
+        { title: "年平均风速", code: "npjfs" },
+        { title: "日运行小时", code: "ryxxs" },
+        { title: "月运行小时", code: "yyxxs" },
+        { title: "年运行小时", code: "nyxxs" },
+        { title: "日待机小时", code: "rdjxs" },
+        { title: "月待机小时", code: "ydjxs" },
+        { title: "年待机小时", code: "ndjxs" },
+        { title: "日故障小时", code: "rgzxs" },
+        { title: "月故障小时", code: "ygzxs" },
+        { title: "年故障小时", code: "ngzxs" },
+        { title: "日检修小时", code: "rjxxs" },
+        { title: "月检修小时", code: "yjxxs" },
+        { title: "年检修小时", code: "njxxs" },
+        { title: "日中断小时", code: "rzdxs" },
+        { title: "月中断小时", code: "yzdxs" },
+        { title: "年中断小时", code: "nzdxs" },
+        { title: "日有效风时", code: "ryxfs" },
+        { title: "月有效风时", code: "yyxfs" },
+        { title: "年有效风时", code: "nyxfs" },
+        { title: "日损失电量", code: "rssdl" },
+        { title: "月损失电量", code: "yssdl" },
+        { title: "年损失电量", code: "nssdl" },
+        { title: "日报警次数", code: "rbjcs" },
+        { title: "月报警次数", code: "ybjcs" },
+        { title: "年报警次数", code: "nbjcs" },
+        { title: "日停机次数", code: "rtjcs" },
+        { title: "月停机次数", code: "ytjcs" },
+        { title: "年停机数", code: "ntjcs" },
+        { title: "日不饱和数", code: "rbbhcs" },
+        { title: "月不饱和数", code: "ybbhcs" },
+        { title: "年不饱和数", code: "nbbhcs" },
+        { title: "日可利用率", code: "rsbklyl" },
+        { title: "月可利用率", code: "ysbklyl" },
+        { title: "年可利用率", code: "nsbklyl" },
+        { title: "日平均温度", code: "rpjwd" },
+        { title: "月平均温度", code: "ypjwd" },
+        { title: "年平均温度", code: "npjwd" },
+        { title: "日平均湿度", code: "rpjsd" },
+        { title: "月平均湿度", code: "ypjsd" },
+        { title: "年平均湿度", code: "npjsd" },
+        { title: "日平均压强", code: "rpjyq" },
+        { title: "月平均压强", code: "ypjyq" },
+        { title: "年平均压强", code: "npjyq" },
+        { title: "日拟合优度", code: "rnhyd" },
+        { title: "月拟合优度", code: "ynhyd" },
+        { title: "年拟合优度", code: "nnhyd" },
+        { title: "日实际/保证", code: "rsjbz" },
+        { title: "月实际/保证", code: "ysjbz" },
+        { title: "年实际/保正", code: "nsjbz" },
+      ],
+    };
+  },
+
+  methods: {
+    init(row) {
+      this.hisstationVal = row.windtpowerstationId;
+      this.hiswindVal = row.windturbineId || row.wtid;
+      this.getTableData();
+    },
+    dateTimeFn(row) {
+      return row.recordDate
+        ? row.recordDate.substring(0, row.recordDate.indexOf("T"))
+        : row.date.substring(0, row.date.indexOf("T"));
+    },
+    headerArr(label) {
+      let arr = label.split("");
+      let Newarr = [];
+      let num = 0;
+      let str = "";
+      arr.forEach((it, index) => {
+        num++;
+        str += it;
+        if (label.indexOf(it) + 1 !== label.length) {
+          if (num % 2 === 0) {
+            Newarr.push(str);
+            str = "";
+          }
+        } else {
+          Newarr.push(str);
+        }
+      });
+      return Newarr;
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        type: this.tabIndex,
+        pageNum: this.page.currentPage,
+        pageSize: this.page.pagesize,
+        beginDate: this.pickerTimer[0],
+        endDate: this.pickerTimer[1],
+        wpId: this.hisstationVal,
+        wtId: this.hiswindVal,
+      };
+      let datas = await getApihistorywindturbinegoodnesslist(params);
+      this.historysingleMachineData = datas.data.records;
+      this.page.total = datas.data.total;
+    },
+    handleSizeChange(val) {
+      this.page.pagesize = val;
+      this.getTableData();
+    },
+    handleCurrentChange(val) {
+      this.page.currentPage = val;
+      this.getTableData();
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+    downXlsxFn() {
+      let header = ["风机", "日期"];
+      this.tableHeader.forEach((it) => {
+        header.push(it.title);
+      });
+      utils.exportExcel(
+        this.$refs["historysingleTable"].$el,
+        header,
+        "单机性能历史分析数据"
+      );
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.historysingleMachine {
+  padding: 0 23px;
+  .historysingleMachine_top {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    margin-top: 10px;
+    margin-bottom: 10px;
+
+    .station {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      font-size: 14px;
+      font-family: Microsoft YaHei;
+      font-weight: 400;
+      color: #b3b3b3;
+      margin-right: 10px;
+      margin-left: 10px;
+    }
+    .stationsv {
+      .timeaa {
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #b3b3b3;
+        margin-right: 10px;
+        margin-left: 10px;
+      }
+    }
+    .tabCut {
+      display: inline-block;
+      margin: 0 10px;
+
+      div {
+        display: inline-block;
+        width: 60px;
+        height: 27px;
+        border: 1px solid #354460;
+        text-align: center;
+        line-height: 25px;
+        cursor: pointer;
+      }
+
+      div:nth-child(1) {
+        border-radius: 13px 0px 0px 13px;
+      }
+
+      div:nth-child(2) {
+        border-radius: 0px 13px 13px 0px;
+      }
+
+      .active {
+        background-color: #0c3378;
+        color: #fff;
+      }
+    }
+
+    .search-input {
+      margin-left: 10px;
+      .el-input__inner {
+        width: 175px;
+      }
+      .el-input__suffix {
+        right: -50px;
+      }
+    }
+
+    .but {
+      display: flex;
+      flex-direction: row;
+      align-content: center;
+      margin-left: 20px;
+      .buttons:nth-child(1) {
+        background: rgba(0, 70, 199, 0.6);
+        border: 1px solid #1f51ae;
+        border-radius: 13px;
+        color: #fff;
+        &:hover {
+          background: rgba(14, 90, 229, 0.9);
+          border-radius: 13px;
+          color: #fff;
+        }
+      }
+      .buttons:nth-child(2) {
+        background: rgba(67, 81, 107, 0.3);
+        border: 1px solid #3b4c6c;
+        border-radius: 13px;
+        font-size: 14px;
+        color: #b3b3b3;
+      }
+    }
+    .el-date-editor--daterange {
+      background: transparent;
+      border: 1px solid #2a374f;
+      border-radius: 30px;
+      height: 25px;
+      .el-range-input {
+        background: transparent;
+        color: #fff;
+      }
+      .el-range-separator {
+        width: 10%;
+        color: #fff;
+        position: relative;
+        top: -7px;
+      }
+    }
+  }
+  .historysingleMachine_Table {
+    padding: 5px;
+    padding-bottom: 10px;
+    background: rgba(0, 0, 0, 0.4);
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+          }
+        }
+      }
+    }
+  }
+}
+.el-pagination {
+  display: flex;
+  justify-content: flex-end;
+  margin-right: 40px;
+  margin-top: 20px;
+
+  .btn-prev,
+  .btn-next,
+  .btn-quickprev,
+  .btn-quicknext,
+  .el-pager,
+  .number {
+    background: rgba(58, 63, 75, 0.4) !important;
+    color: #fff;
+    border-radius: 2px;
+  }
+
+  .el-pager .active {
+    background: #083c94;
+    color: #fff;
+    border-radius: 2px;
+  }
+
+  .el-pagination__total,
+  .el-pagination__jump {
+    color: #fff;
+    .el-input__inner {
+      background: rgba(58, 63, 75, 0.2);
+      border: 1px solid #3e4349;
+      color: #fff;
+      border-radius: 2px;
+    }
+  }
+}
+.historyBtn {
+  background: #43516b;
+  border-radius: 15px;
+  margin-top: 5px;
+  border: 1px solid #43516b;
+  span {
+    color: #fff;
+  }
+}
+</style>

+ 83 - 147
src/views/layout/economicsOperation/analyse/standAloneAnalyse/index.vue

@@ -1,32 +1,35 @@
 <template>
   <div class="singleMachine">
     <div class="singleMachine_top">
-      <el-select
-        size="mini"
-        v-model="companyVal"
-        placeholder="请选择"
-        @change="changeCompan"
-      >
-        <el-option
-          v-for="item in companyOptions"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
+      <div class="singleMachine-form">
+        <el-select
+          size="mini"
+          v-model="tabIndex"
+          placeholder="请选择"
+          @change="changeBtn"
         >
-        </el-option>
-      </el-select>
-      <div class="tabCut">
-        <div
-          @click="changeBtn(val.id)"
-          :class="tabIndex === val.id ? 'active' : ''"
-          v-for="val in tabOptions"
-          :key="val.id"
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="companyVal"
+          placeholder="请选择"
+          @change="changeCompan"
         >
-          <span>{{ val.name }}</span>
-        </div>
-      </div>
-      <div class="station">
-        场站:
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
         <el-select
           size="mini"
           v-model="stationVal"
@@ -37,23 +40,23 @@
           <el-option
             v-for="item in stationOptions"
             :key="item.id"
-            :label="item.name"
+            :label="item.aname"
             :value="item.id"
           >
           </el-option>
         </el-select>
-      </div>
-      <div class="station">
-        时间
-        <div class="search-input">
-          <el-date-picker
-            v-model="pickerTimer"
-            type="date"
-            value-format="YYYY-MM-DD"
-            placeholder="选择日期"
-            popper-class="date-select"
-          >
-          </el-date-picker>
+        <div class="station">
+          时间
+          <div class="search-input">
+            <el-date-picker
+              v-model="pickerTimer"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
         </div>
       </div>
       <div class="but">
@@ -80,9 +83,7 @@
           style="width: 100%"
         >
           <el-table-column
-            v-for="(item, index) in tabIndex === -1
-              ? tableHeader
-              : tableHeaderGf"
+            v-for="(item, index) in tableHeaderGf"
             :key="index"
             sortable
             :prop="item.code"
@@ -106,7 +107,6 @@
               <div v-else>{{ scope.column.label }}</div>
             </template>
             <template #default="scope" v-if="item.title === '操作'">
-              <!-- <span class="historyBtn" @click="seachDetail(scope.row)">详情</span> -->
               <span class="historyBtn" @click="seachHistoryData(scope.row)"
                 >历史</span
               >
@@ -114,7 +114,6 @@
           </el-table-column>
         </el-table>
         <el-pagination
-          @size-change="handleSizeChange"
           @current-change="handleCurrentChange"
           :current-page="page.currentPage"
           :page-size="page.pagesize"
@@ -148,47 +147,22 @@
         </history-detail>
       </div>
     </el-dialog>
-    <el-dialog
-      v-model="dialogDetail"
-      width="100%"
-      custom-class="windDetailmodal"
-      :close-on-click-modal="false"
-    >
-      <template #title>
-        <div class="dialog-title">
-          <img
-            class="dialog-title-img"
-            src="@assets/img/images/dialog-title.png"
-          />
-          <div class="title">详情</div>
-        </div>
-      </template>
-      <div class="body">
-        <wind-detail-dialog
-          ref="windDetail"
-          :wpArray="stationOptions"
-        ></wind-detail-dialog>
-      </div>
-    </el-dialog>
   </div>
 </template>
 
 <script>
 import {
-  getApicompanyslist,
-  getApiwpByCplistlist,
   getApiwindturbinegoodnesslist,
   getApiwindturbinegoodnesslistGf,
 } from "@/api/monthlyPerformanceAnalysis";
+import { GetOrganization, GetStationByCompany } from "@/api/headerNav.js";
 import historyDetail from "./historyDetail.vue";
-import WindDetailDialog from "./windDetailDialog.vue";
 import utils from "@/utils/downXlsx";
 import dayjs from "dayjs";
 export default {
   name: "standAloneAnalyse", //单机性能分析
   components: {
     historyDetail,
-    WindDetailDialog,
   },
   data() {
     return {
@@ -200,37 +174,29 @@ export default {
       singleMachineData: [],
       showBtn: true,
       dialogTitle: "",
-      tabIndex: -1,
+      tabIndex: -2,
       tabOptions: [
         { id: -1, name: "风电" },
         { id: -2, name: "光伏" },
       ],
-      tableHeader: [
-        { title: "风机", code: "wtcode" },
-        { title: "型号", code: "modelId" },
-        { title: "日排行榜", code: "dayTop" },
-        { title: "日拟合优度(%)", code: "dayGoodness" },
-        { title: "日风速(m/s)", code: "daySpeed" },
-        { title: "月排行榜", code: "monthTop" },
-        { title: "月拟合优度(%)", code: "monthGoodness" },
-        { title: "月风速(m/s)", code: "monthSpeed" },
-        { title: "年排行榜", code: "yearTop" },
-        { title: "年拟合优度(%)", code: "yearGoodness" },
-        { title: "年风速(m/s)", code: "yearSpeed" },
-        { title: "操作" },
-      ],
       tableHeaderGf: [
         { title: "逆变器", code: "wtname" },
         { title: "型号", code: "model" },
         { title: "日系统效率", code: "rxtxl" },
-        { title: "日离散率", code: "rlsl" },
-        { title: "日转换效率", code: "rzhxl" },
+        { title: "日拟合优度(%)", code: "rlsl" },
+        { title: "日光照(W/m²)", code: "rzhxl" },
+        // { title: "日离散率", code: "rlsl" },
+        // { title: "日转换效率", code: "rzhxl" },
         { title: "月系统效率", code: "yxtxl" },
-        { title: "月离散率", code: "ylsl" },
-        { title: "月转换效率", code: "yzhxl" },
+        { title: "月拟合优度(%)", code: "ylsl" },
+        { title: "月光照(W/m²)", code: "yzhxl" },
+        // { title: "月离散率", code: "ylsl" },
+        // { title: "月转换效率", code: "yzhxl" },
         { title: "年系统效率", code: "nxtxl" },
-        { title: "年离散率", code: "nlsl" },
-        { title: "年转换效率", code: "nzhxl" },
+        { title: "年拟合优度(%)", code: "nlsl" },
+        { title: "年光照(W/m²)", code: "nzhxl" },
+        // { title: "年离散率", code: "nlsl" },
+        // { title: "年转换效率", code: "nzhxl" },
         { title: "操作" },
       ],
       page: {
@@ -280,16 +246,15 @@ export default {
       this.pickerTimer = dayjs(new Date().getTime() - 86400000).format(
         "YYYY-MM-DD"
       );
-      const datas = await getApicompanyslist();
+      const datas = await GetOrganization({ type: this.tabIndex });
       this.companyOptions = datas.data;
       this.companyVal = datas.data[0]?.id;
       this.getStationData(this.companyVal);
     },
-    changeBtn(id) {
-      this.tabIndex = id;
-      this.stationVal = "";
-      this.singleMachineData = [];
-      this.getStationData(this.companyVal);
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/analyse/standAloneAnalyseFd",
+      });
     },
     changeCompan(val) {
       this.companyVal = val;
@@ -302,9 +267,9 @@ export default {
       this.stationOptions = [];
       let params = {
         type: this.tabIndex,
-        companyid: companyVal,
+        companyids: companyVal,
       };
-      const { data } = await getApiwpByCplistlist(params);
+      const { data } = await GetStationByCompany(params);
       if (data.length) {
         this.stationOptions = data;
         this.stationVal = data[0].id || "";
@@ -335,20 +300,9 @@ export default {
         recorddate: this.pickerTimer,
         wpId: this.stationVal,
       };
-      let datas = {};
-      if (this.tabIndex == -2) {
-        datas = await getApiwindturbinegoodnesslistGf(params);
-        this.singleMachineData = datas.data;
-        this.page.total = datas.data.length;
-      } else {
-        datas = await getApiwindturbinegoodnesslist(params);
-        this.singleMachineData = datas.data.records;
-        this.page.total = datas.data.total;
-      }
-    },
-    handleSizeChange(val) {
-      this.page.pagesize = val;
-      this.getTableData();
+      let { data } = await getApiwindturbinegoodnesslistGf(params);
+      this.singleMachineData = data.records;
+      this.page.total = data.total;
     },
     handleCurrentChange(val) {
       this.page.currentPage = val;
@@ -380,18 +334,16 @@ export default {
           this.getchangeTime(new Date(startT)),
           this.pickerTimer,
         ];
-        if (this.tabIndex == -1) {
-          this.$refs.windhistoryDetail.init(row);
-        } else {
-          row.windtpowerstationId = this.stationVal;
-          this.$refs.windhistoryDetail.init(row);
-        }
-        this.$refs.windhistoryDetail.getWindPowerStation();
+
+        row.windtpowerstationId = this.stationVal;
+        this.$refs.windhistoryDetail.init(row);
+
+        // this.$refs.windhistoryDetail.getWindPowerStation();
       });
     },
     downXlsxFn() {
       let header = [];
-      this.tableHeader.forEach((it) => {
+      this.tableHeaderGf.forEach((it) => {
         if (it.title !== "操作") {
           header.push(it.title);
         }
@@ -465,6 +417,17 @@ export default {
     padding-top: 10px;
     margin-bottom: 10px;
 
+    .singleMachine-form {
+      display: flex;
+      align-items: center;
+      .el-select {
+        width: 155px;
+        margin-right: 15px;
+        ::v-deep.el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+    }
     .station {
       display: flex;
       flex-direction: row;
@@ -476,33 +439,6 @@ export default {
       margin-right: 10px;
       margin-left: 10px;
     }
-    .tabCut {
-      display: inline-block;
-      margin: 0 10px;
-
-      div {
-        display: inline-block;
-        width: 60px;
-        height: 27px;
-        border: 1px solid #354460;
-        text-align: center;
-        line-height: 25px;
-        cursor: pointer;
-      }
-
-      div:nth-child(1) {
-        border-radius: 13px 0px 0px 13px;
-      }
-
-      div:nth-child(2) {
-        border-radius: 0px 13px 13px 0px;
-      }
-
-      .active {
-        background-color: #0c3378;
-        color: #fff;
-      }
-    }
 
     .search-input {
       margin-left: 10px;
@@ -611,7 +547,7 @@ export default {
     .historyBtn {
       cursor: pointer;
       color: #1c99ff;
-      margin-right: 15px;
+      padding: 3px 10px;
     }
   }
 

+ 567 - 0
src/views/layout/economicsOperation/analyse/standAloneAnalyse/indexFd.vue

@@ -0,0 +1,567 @@
+<template>
+  <div class="singleMachine">
+    <div class="singleMachine_top">
+      <div class="singleMachine-form">
+        <el-select
+          size="mini"
+          v-model="tabIndex"
+          placeholder="请选择"
+          @change="changeBtn"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="companyVal"
+          placeholder="请选择"
+          @change="changeCompan"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="stationVal"
+          placeholder="请选择"
+          @change="changeStation"
+          clearable
+        >
+          <el-option
+            v-for="item in stationOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <div class="station">
+          时间
+          <div class="search-input">
+            <el-date-picker
+              v-model="pickerTimer"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+      </div>
+      <div class="but">
+        <el-button round size="mini" class="buttons" @click="seachData"
+          >搜索</el-button
+        >
+        <el-button round size="mini" class="buttons" @click="downXlsxFn"
+          >导出</el-button
+        >
+      </div>
+    </div>
+    <div style="background: rgba(0, 0, 0, 0.45)">
+      <div class="singleMachine_title clearfix">
+        <div class="leftContent floatLeft"><span>单机性能分析</span></div>
+        <div class="rightContent floatRight"></div>
+      </div>
+      <div class="singleMachine_Table">
+        <el-table
+          :data="singleMachineData"
+          size="mini"
+          stripe
+          ref="stand_table"
+          height="75vh"
+          style="width: 100%"
+        >
+          <el-table-column
+            v-for="(item, index) in tableHeader"
+            :key="index"
+            sortable
+            :prop="item.code"
+            :label="item.title"
+            align="center"
+            :width="item.title === '操作' ? '200' : ''"
+          >
+            <template #header="scope">
+              <div v-if="scope.column.label.indexOf('(') > 0">
+                <div>
+                  {{
+                    scope.column.label.slice(0, scope.column.label.indexOf("("))
+                  }}
+                </div>
+                <div>
+                  {{
+                    scope.column.label.slice(scope.column.label.indexOf("("))
+                  }}
+                </div>
+              </div>
+              <div v-else>{{ scope.column.label }}</div>
+            </template>
+            <template #default="scope" v-if="item.title === '操作'">
+              <span class="historyBtn" @click="seachHistoryData(scope.row)"
+                >历史</span
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination
+          @current-change="handleCurrentChange"
+          :current-page="page.currentPage"
+          :page-size="page.pagesize"
+          layout="total, prev, pager, next, jumper"
+          :total="page.total"
+        >
+        </el-pagination>
+      </div>
+    </div>
+    <el-dialog
+      v-model="dialogVisible"
+      width="100%"
+      custom-class="windhistoryDetailModel"
+      :close-on-click-modal="false"
+    >
+      <template #title>
+        <div class="dialog-title">
+          <img
+            class="dialog-title-img"
+            src="@assets/img/images/dialog-title.png"
+          />
+          <div class="title">{{ dialogTitle }}</div>
+        </div>
+      </template>
+      <div class="body">
+        <historyDetailFd
+          ref="windhistoryDetail"
+          :tabIndex="tabIndex"
+          :historyStationOptions="stationOptions"
+        />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  getApiwindturbinegoodnesslist,
+  getApiwindturbinegoodnesslistGf,
+} from "@/api/monthlyPerformanceAnalysis";
+import { GetOrganization, GetStationByCompany } from "@/api/headerNav.js";
+import historyDetailFd from "./historyDetailFd.vue";
+import WindDetailDialog from "./windDetailDialog.vue";
+import utils from "@/utils/downXlsx";
+import dayjs from "dayjs";
+export default {
+  name: "standAloneAnalyseFd", //单机性能分析(风电)
+  components: {
+    historyDetailFd,
+  },
+  data() {
+    return {
+      companyVal: "",
+      companyOptions: [],
+      stationVal: "",
+      stationOptions: [],
+      pickerTimer: "",
+      singleMachineData: [],
+      showBtn: true,
+      dialogTitle: "",
+      tabIndex: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      tableHeader: [
+        { title: "风机", code: "wtcode" },
+        { title: "型号", code: "modelId" },
+        { title: "日排行榜", code: "dayTop" },
+        { title: "日拟合优度(%)", code: "dayGoodness" },
+        { title: "日风速(m/s)", code: "daySpeed" },
+        { title: "月排行榜", code: "monthTop" },
+        { title: "月拟合优度(%)", code: "monthGoodness" },
+        { title: "月风速(m/s)", code: "monthSpeed" },
+        { title: "年排行榜", code: "yearTop" },
+        { title: "年拟合优度(%)", code: "yearGoodness" },
+        { title: "年风速(m/s)", code: "yearSpeed" },
+        { title: "操作" },
+      ],
+      page: {
+        pagesize: 20,
+        currentPage: 1,
+        total: 0,
+      },
+      dialogVisible: false,
+      dialogDetail: false,
+      isFullScreen: false,
+    };
+  },
+  created() {
+    const clientHeight =
+      document.documentElement.clientHeight || document.body.clientHeight;
+    if (clientHeight === 1080) {
+      this.isFullScreen = true;
+    } else {
+      this.isFullScreen = false;
+    }
+    this.getCompanyData();
+  },
+  mounted() {
+    window.onresize = () => {
+      const clientHeight =
+        document.documentElement.clientHeight || document.body.clientHeight;
+      this.isFullScreen = window.screen.height == clientHeight;
+      this.getTableData();
+    };
+  },
+  computed: {
+    pageHeight() {
+      return {
+        height: document.documentElement.clientHeight - 130 + "px",
+      };
+    },
+    pagewindHeight() {
+      return {
+        height: document.documentElement.clientHeight - 100 + "px",
+      };
+    },
+  },
+  methods: {
+    // 获取公司列表
+    async getCompanyData() {
+      this.companyOptions = [];
+      this.pickerTimer = dayjs(new Date().getTime() - 86400000).format(
+        "YYYY-MM-DD"
+      );
+      const datas = await GetOrganization({ type: this.tabIndex });
+      this.companyOptions = datas.data;
+      this.companyVal = datas.data[0]?.id;
+      this.getStationData(this.companyVal);
+    },
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/analyse/standAloneAnalyse",
+      });
+    },
+    changeCompan(val) {
+      this.companyVal = val;
+      this.stationVal = "";
+      this.singleMachineData = [];
+      this.getStationData(this.companyVal);
+    },
+    // 获取场站
+    async getStationData(companyVal) {
+      this.stationOptions = [];
+      let params = {
+        type: this.tabIndex,
+        companyids: companyVal,
+      };
+      const { data } = await GetStationByCompany(params);
+      if (data.length) {
+        this.stationOptions = data;
+        this.stationVal = data[0].id || "";
+      } else {
+        this.stationOptions = [];
+        this.stationVal = "";
+      }
+      this.getTableData();
+    },
+    changeStation(val) {
+      this.stationVal = val;
+      this.getTableData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      if (this.isFullScreen) {
+        this.page.pagesize = 21;
+      } else {
+        this.page.pagesize = 20;
+      }
+      let params = {
+        cmId: this.companyVal,
+        type: this.tabIndex,
+        pageNum: this.page.currentPage,
+        pageSize: this.page.pagesize,
+        recorddate: this.pickerTimer,
+        wpId: this.stationVal,
+      };
+      let datas = await getApiwindturbinegoodnesslist(params);
+      this.singleMachineData = datas.data.records;
+      this.page.total = datas.data.total;
+    },
+    handleCurrentChange(val) {
+      this.page.currentPage = val;
+      this.getTableData();
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+    seachDetail(row) {
+      this.dialogDetail = true;
+      this.$nextTick(() => {
+        this.$refs.windDetail.recorddate = this.pickerTimer;
+        this.$refs.windDetail.init(row);
+      });
+    },
+    seachHistoryData(row) {
+      this.dialogVisible = true;
+      this.dialogTitle = "历史数据查询";
+      this.$nextTick(() => {
+        let startT =
+          new Date(this.pickerTimer).getTime() - 10 * 24 * 60 * 60 * 1000;
+        this.$refs.windhistoryDetail.pickerTimer = [
+          this.getchangeTime(new Date(startT)),
+          this.pickerTimer,
+        ];
+        this.$refs.windhistoryDetail.init(row);
+      });
+    },
+    downXlsxFn() {
+      let header = [];
+      this.tableHeader.forEach((it) => {
+        if (it.title !== "操作") {
+          header.push(it.title);
+        }
+      });
+      if (this.singleMachineData.length > 0) {
+        utils.exportExcel(
+          this.$refs["stand_table"].$el,
+          header,
+          "单机性能分析"
+        );
+      }
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.singleMachine {
+  padding: 0 23px;
+
+  .singleMachine_title {
+    padding-left: 10px;
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .floatLeft {
+      float: left;
+    }
+
+    .floatRight {
+      float: right;
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+  }
+
+  .clearfix::after {
+    content: "";
+    clear: both;
+    height: 0;
+    line-height: 0;
+    visibility: hidden;
+    display: block;
+  }
+
+  .clearfix {
+    zoom: 1;
+  }
+
+  .singleMachine_top {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-top: 10px;
+    margin-bottom: 10px;
+
+    .singleMachine-form {
+      display: flex;
+      align-items: center;
+      .el-select {
+        width: 155px;
+        margin-right: 15px;
+        ::v-deep.el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+    }
+    .station {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      font-size: 14px;
+      font-family: Microsoft YaHei;
+      font-weight: 400;
+      color: #b3b3b3;
+      margin-right: 10px;
+      margin-left: 10px;
+    }
+
+    .search-input {
+      margin-left: 10px;
+      .el-input__inner {
+        width: 175px;
+      }
+      .el-input__suffix {
+        right: -50px;
+      }
+    }
+
+    .but {
+      display: flex;
+      flex-direction: row;
+      align-content: center;
+      margin-left: 20px;
+      .buttons:nth-child(1) {
+        background: rgba(0, 70, 199, 0.6);
+        border: 1px solid #1f51ae;
+        border-radius: 13px;
+        color: #fff;
+        &:hover {
+          background: rgba(14, 90, 229, 0.9);
+          border-radius: 13px;
+          color: #fff;
+        }
+      }
+      .buttons:nth-child(2) {
+        background: rgba(67, 81, 107, 0.3);
+        border: 1px solid #3b4c6c;
+        border-radius: 13px;
+        font-size: 14px;
+        color: #b3b3b3;
+      }
+    }
+  }
+
+  .singleMachine_Table {
+    margin: 0 5px 5px 5px;
+    padding-bottom: 10px;
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+          }
+        }
+      }
+    }
+
+    .el-pagination {
+      display: flex;
+      justify-content: flex-end;
+      margin-right: 40px;
+      margin-top: 20px;
+
+      .btn-prev,
+      .btn-next,
+      .btn-quickprev,
+      .btn-quicknext,
+      .el-pager,
+      .number {
+        background: rgba(58, 63, 75, 0.4);
+        color: #fff;
+        border-radius: 2px;
+      }
+
+      .el-pager .active {
+        background: #083c94;
+        color: #fff;
+        border-radius: 2px;
+      }
+
+      .el-pagination__total,
+      .el-pagination__jump {
+        color: #fff;
+        .el-input__inner {
+          background: rgba(58, 63, 75, 0.2);
+          border: 1px solid #3e4349;
+          color: #fff;
+          border-radius: 2px;
+        }
+      }
+    }
+
+    .historyBtn {
+      cursor: pointer;
+      color: #1c99ff;
+      padding: 3px 10px;
+    }
+  }
+
+  .el-overlay {
+    .el-overlay-dialog {
+      overflow-y: hidden !important;
+
+      .windhistoryDetailModel,
+      .windDetailmodal {
+        margin-top: 0 !important;
+
+        .el-dialog__body {
+          padding: 10px 20px 20px 20px;
+        }
+      }
+    }
+  }
+
+  .el-picker__popper .el-date-range-picker__header .el-picker-panel__icon-btn {
+    color: #fff;
+  }
+
+  .el-picker__popper .el-date-table .in-range div {
+    background: #43516b;
+  }
+}
+</style>

+ 1 - 1
src/views/layout/economicsOperation/benchmarkingManagement/companyBenchmarking/index.vue

@@ -379,7 +379,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          label="场站名称"
           width="150"
           sortable
         >

+ 2 - 3
src/views/layout/economicsOperation/benchmarkingManagement/intervalBenchmarking/index.vue

@@ -395,7 +395,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >
@@ -631,7 +631,6 @@ export default {
       this.tabIndex = val;
       this.stationObj = [];
       this.initialization();
-      this.gerCjdb();
     },
     initialization() {
       GetOrganization({ type: this.tabIndex }).then((res) => {
@@ -649,7 +648,7 @@ export default {
       }).then((res) => {
         if (res.data.length) {
           this.stationList = res.data;
-        //   this.stationObj = [res.data[0].id];
+          //   this.stationObj = [res.data[0].id];
         } else {
           this.stationList = [];
         }

+ 3 - 3
src/views/layout/economicsOperation/benchmarkingManagement/loseRate/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="parcel-box">
     <div class="title">
-        <el-select
+      <el-select
         size="mini"
         :disabled="displayDetail"
         v-model="tabIndex"
@@ -426,7 +426,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >
@@ -695,7 +695,7 @@ export default {
       this.lineObj = [];
       this.initialization();
     },
-   initialization() {
+    initialization() {
       GetOrganization({ type: this.tabIndex }).then((res) => {
         if (res.data) {
           this.company = res.data[0].id;

+ 7 - 3
src/views/layout/economicsOperation/benchmarkingManagement/machineBenchmarking/index.vue

@@ -182,7 +182,6 @@
           v-if="displayDetail"
           >返回</el-button
         >
-        <!-- <el-button round size="mini" class="buttons">导出</el-button> -->
       </div>
     </div>
     <div class="bodys" v-if="!displayDetail">
@@ -473,7 +472,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >
@@ -626,7 +625,6 @@
 
 <script>
 import dayjs from "dayjs";
-import { companys } from "@/api/curveAnalyse";
 import {
   GetOrganization,
   GetStationByCompany,
@@ -752,8 +750,11 @@ export default {
       GetProjectList(stationids.join(",")).then((res) => {
         if (res.data.length) {
           this.projectList = res.data;
+          this.projectObj = [res.data[0].id];
+          this.getLineList(this.projectObj);
         } else {
           this.projectList = [];
+          this.lineObj = [];
         }
         this.gerSbdb();
       });
@@ -762,8 +763,11 @@ export default {
       GetLineList(projectids.join(",")).then((res) => {
         if (res.data.length) {
           this.lineList = res.data;
+          this.lineObj = [res.data[0].id];
+          this.getSquareList(this.lineObj);
         } else {
           this.lineList = [];
+          this.lineObj = [];
         }
         this.gerSbdb();
       });

+ 3 - 2
src/views/layout/economicsOperation/benchmarkingManagement/performanceRankingList/index.vue

@@ -349,10 +349,10 @@ export default {
         type: this.tabIndex,
       }).then((res) => {
         if (res.data.length) {
-          //   this.stationObj = res.data[0].id;
           this.stationList = res.data;
           this.getPerformance();
-          //   this.getProject(this.stationObj);
+          this.projectObj = "";
+          this.getProject(this.stationObj);
         } else {
           this.stationList = [];
         }
@@ -362,6 +362,7 @@ export default {
       GetProjectList(stationids).then((res) => {
         if (res.data.length) {
           this.projectList = res.data;
+          this.lineObj = "";
         } else {
           this.projectList = [];
         }

+ 1 - 1
src/views/layout/economicsOperation/benchmarkingManagement/projectBenchmarking/index.vue

@@ -408,7 +408,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+    :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >

+ 147 - 124
src/views/layout/economicsOperation/benchmarkingManagement/quarterBenchmarking/index.vue

@@ -1,134 +1,140 @@
 <template>
   <div class="parcel-box">
     <div class="title">
-      <el-select
-        size="mini"
-        :disabled="displayDetail"
-        v-model="tabIndex"
-        placeholder="请选择"
-        @change="tabClick"
-      >
-        <el-option
-          v-for="item in tabOptions"
-          :key="item.id"
-          :label="item.name"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <el-select
-        size="mini"
-        :disabled="displayDetail"
-        v-model="company"
-        placeholder="请选择"
-        @change="handleCompanyChange(company)"
-      >
-        <el-option
-          v-for="item in companyOptions"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <el-select
-        size="mini"
-        :disabled="displayDetail"
-        v-model="stationObj"
-        multiple
-        collapse-tags
-        placeholder="请选择"
-        @change="handleStationChange(stationObj)"
-        clearable
-      >
-        <el-option
-          v-for="item in stationList"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <el-select
-        size="mini"
-        v-model="projectObj"
-        placeholder="请选择"
-        multiple
-        collapse-tags
-        @change="handleProjectChange(projectObj)"
-        clearable
-      >
-        <el-option
-          v-for="item in projectList"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <el-select
-        size="mini"
-        v-model="lineObj"
-        placeholder="请选择"
-        multiple
-        collapse-tags
-        @change="handleLineChange(lineObj)"
-        clearable
-      >
-        <el-option
-          v-for="item in lineList"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-      <el-select
-        size="mini"
-        v-model="squareObj"
-        placeholder="请选择"
-        multiple
-        collapse-tags
-        @change="handleSquareChange(squareObj)"
-        clearable
-      >
-        <el-option
-          v-for="item in squareList"
-          :key="item.id"
-          :label="item.aname"
-          :value="item.id"
-        >
-        </el-option>
-      </el-select>
-
-      <div class="station">
-        开始日期
-        <div class="search-input">
-          <el-date-picker
-            v-model="starTime"
+      <div class="quarter-form">
+        <div class="quarter-select">
+          <el-select
+            size="mini"
             :disabled="displayDetail"
-            type="date"
-            value-format="YYYY-MM-DD"
-            placeholder="选择日期"
-            popper-class="date-select"
+            v-model="tabIndex"
+            placeholder="请选择"
+            @change="tabClick"
           >
-          </el-date-picker>
-        </div>
-      </div>
-      <div class="station">
-        结束日期
-        <div class="search-input">
-          <el-date-picker
-            v-model="endTime"
+            <el-option
+              v-for="item in tabOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            :disabled="displayDetail"
+            v-model="company"
+            placeholder="请选择"
+            @change="handleCompanyChange(company)"
+          >
+            <el-option
+              v-for="item in companyOptions"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
             :disabled="displayDetail"
-            type="date"
-            value-format="YYYY-MM-DD"
-            placeholder="选择日期"
-            popper-class="date-select"
+            v-model="stationObj"
+            multiple
+            collapse-tags
+            placeholder="请选择"
+            @change="handleStationChange(stationObj)"
+            clearable
           >
-          </el-date-picker>
+            <el-option
+              v-for="item in stationList"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="projectObj"
+            placeholder="请选择"
+            multiple
+            collapse-tags
+            @change="handleProjectChange(projectObj)"
+            clearable
+          >
+            <el-option
+              v-for="item in projectList"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="lineObj"
+            placeholder="请选择"
+            multiple
+            collapse-tags
+            @change="handleLineChange(lineObj)"
+            clearable
+          >
+            <el-option
+              v-for="item in lineList"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="squareObj"
+            placeholder="请选择"
+            multiple
+            collapse-tags
+            @change="handleSquareChange(squareObj)"
+            clearable
+          >
+            <el-option
+              v-for="item in squareList"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="quarter-date">
+          <div class="station">
+            开始日期
+            <div class="search-input">
+              <el-date-picker
+                v-model="starTime"
+                :disabled="displayDetail"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="选择日期"
+                popper-class="date-select"
+              >
+              </el-date-picker>
+            </div>
+          </div>
+          <div class="station">
+            结束日期
+            <div class="search-input">
+              <el-date-picker
+                v-model="endTime"
+                :disabled="displayDetail"
+                type="date"
+                value-format="YYYY-MM-DD"
+                placeholder="选择日期"
+                popper-class="date-select"
+              >
+              </el-date-picker>
+            </div>
+          </div>
         </div>
       </div>
+
       <div class="but">
         <el-button
           round
@@ -156,7 +162,6 @@
           v-if="displayDetail"
           >返回</el-button
         >
-        <!-- <el-button round size="mini" class="buttons">导出</el-button> -->
       </div>
     </div>
     <div class="bodys" v-if="!displayDetail">
@@ -447,7 +452,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >
@@ -1071,6 +1076,24 @@ export default {
 <style lang="less" scoped>
 .parcel-box {
   padding: 0 15px;
+  ::v-deep .quarter-form {
+    display: flex;
+    .quarter-select {
+      display: flex;
+      align-items: center;
+      margin-right: 20px;
+      .el-select {
+        width: 155px;
+        .el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+    }
+    .quarter-date {
+      display: flex;
+      align-items: center;
+    }
+  }
 }
 
 .title {

+ 0 - 839
src/views/layout/economicsOperation/benchmarkingManagement/singleMachineBenchmarking/index.vue

@@ -1,839 +0,0 @@
-<template>
-  <div class="Benchmarking">
-    <div class="Benchmarking_topAll">
-      <div class="Benchmarking_top">
-        <div class="stationcm" >
-          <el-select size="mini" v-model="companyVal" placeholder="请选择" @change="changeCompan">
-            <el-option v-for="item in companyOptions" :key="item.id" :label="item.aname" :value="item.id">
-            </el-option>
-          </el-select>
-        </div>
-        <!-- <div class="tabCut">
-            <div @click="changeBtn(val.id)" :class="tabEvent === val.id ? 'active' : ''" v-for="val in tabOptions"
-            :key="val.id"><span>{{ val.name }}</span></div>
-        </div> -->
-        <div class="station stationss">
-          场站:
-          <el-select size="mini" v-model="stationVal" placeholder="请选择"
-                     @change="changeStation" clearable  multiple collapse-tags>
-            <el-option v-for="item in stationOptions" :key="item.id" :label="item.name" :value="item.id">
-            </el-option>
-          </el-select>
-        </div>
-        <div class="station stationss">
-          项目:
-          <el-select size="mini" v-model="projectVal" placeholder="请选择" multiple collapse-tags @change="changeProject" clearable>
-            <el-option v-for="item in projectOptions" :key="item.id" :label="item.name" :value="item.id">
-            </el-option>
-          </el-select>
-        </div>
-        <div class="station stationss">
-          线路:
-          <el-select size="mini" v-model="lineVal" placeholder="请选择" multiple collapse-tags @change="changeByLine" clearable>
-            <el-option v-for="item in lineOptions" :key="item.id" :label="item.name" :value="item.id">
-            </el-option>
-          </el-select>
-        </div>
-        <div class="station">
-          风机:
-          <el-select size="mini" v-model="windVal" placeholder="请选择" multiple collapse-tags multiple-limit="5" clearable>
-            <el-option v-for="item in windOptions" :key="item.id" :label="item.name" :value="item.id">
-            </el-option>
-          </el-select>
-        </div>
-        <div class="station">
-          时间
-          <div class="search-input">
-            <el-date-picker v-model="pickerTimer" type="date" value-format="YYYY-MM-DD" placeholder="选择日期"
-                            popper-class="date-select">
-            </el-date-picker>
-          </div>
-        </div>
-        <div class="but">
-          <el-button round size="mini" class="buttons" @click="seachData">搜索</el-button>
-          <el-button round size="mini" class="buttons" @click="downXlsxFn">导出</el-button>
-        </div>
-      </div>
-      <div class="selections">
-        <div class="selections_btn" @click="tabSelect(0)" :class="{ active: tabIndex == 0 }">
-          日
-        </div>
-        <div class="selections_btn" @click="tabSelect(1)" :class="{ active: tabIndex == 1 }">
-          月
-        </div>
-        <div class="selections_btn" @click="tabSelect(2)" :class="{ active: tabIndex == 2 }">
-          年
-        </div>
-      </div>
-    </div>
-    <div style="background: rgba(0,0,0,0.4);">
-      <div class="Benchmarking_title clearfix">
-        <div class="leftContent floatLeft"><span>单机对标</span></div>
-        <div class="rightContent floatRight"></div>
-      </div>
-      <div class="Benchmarking_Table">
-        <el-table
-            :data="BenchmarkingData"
-            size="mini"
-            height="46vh"
-            ref="stand_table"
-            style="width: 100%">
-          <el-table-column type="index" label="序号" width="55" align="center">
-          </el-table-column>
-          <!-- <el-table-column prop='name' label="指标" width="55" align="center">
-          </el-table-column> -->
-          <el-table-column v-for="(item,index) in tableHeader" :key="index"
-                           :prop="item.code"
-                           :label="item.title"
-                           align="center"
-                           :width="item.title === '指标' ? '150' : ''"
-          >
-            <template #default="scope">
-              <span v-if="item.title === '指标'">{{scope.row.name}}</span>
-              <span v-else>
-                            <span v-if="scope.row.name === '风资源' && scope.row[item.code*1]">
-                                <div class="chart-namess">
-                                    <div class="point left"></div>
-                                    <div class="point right"></div>
-                                </div>
-
-                              <!-- :indicator="scope.row[item.code*1].indicator"  :showLegend="true"-->
-                              <!-- <direction-radar-chart
-                                  width="300px"
-                                  height="300px"
-                                  :value="[scope.row[item.code*1]]"
-                                  :showTool="false"
-                              /> -->
-                              <!-- :lenged="scope.row[item.code*1].lenged" -->
-                                <direction-radar-chart
-                                    width="280px"
-                                    height="300px"
-                                    :xAxis='scope.row[item.code*1].rzdfsxaisx'
-                                    :series="scope.row[item.code*1].data"
-                                    title=""
-                                    :isRadar="false"
-                                />
-                                <div class="chart-namess">
-                                    <div class="point left"></div>
-                                    <div class="point right"></div>
-                                </div>
-                            </span>
-                            <span v-else>{{scope.row[item.code*1]}}</span>
-                        </span>
-            </template>
-          </el-table-column>
-        </el-table>
-      </div>
-    </div>
-    <div class="Benchmarking_Echarts">
-      <div class="chart-name">
-        <div class="point left bottom"></div>
-        <div class="point right bottom"></div>
-        <span>功率曲线对比</span>
-      </div>
-      <div id="markmainEchart" class="markmainEchartSty"></div>
-    </div>
-  </div>
-</template>
-
-<script>
-// import DirectionRadarChart from "@/components/chart/radar/direction-radar-chart.vue";
-// import DirectionRadarChart from "@/components/chart/radar/radar-chart.vue";
-// import DirectionRadarChart from "../../homePage/components/normal-radar-chart.vue";
-import DirectionRadarChart from "../../analyse/standAloneAnalyse/raderswithhart.vue"
-import * as echarts from "echarts";
-import {
-  getApicompanyslist,
-  getApiwpByCplistlist,
-  getApipjByWplist,
-  getApilnByPjlist,
-  getApiequipmentList,
-  getApiequipmentPerformaCompare,
-  getApicurveFitting
-} from '@/api/monthlyPerformanceAnalysis'
-import utils from '@/utils/downXlsx'
-import partten from "@/helper/partten.js";
-import util from "@/helper/util.js";
-export default {
-  name:'singleMachineBenchmarking',
-  components: {
-    DirectionRadarChart
-  },
-  data() {
-    return {
-      tabIndex: 0,
-      companyVal: '',
-      companyOptions: [],
-      stationVal: [],
-      stationOptions: [],
-      projectVal: [],
-      projectOptions: [],
-      lineVal: [],
-      lineOptions: [],
-      windVal: [],
-      windOptions: [],
-      pickerTimer: '',
-      BenchmarkingData: [],
-      dialogTitle: '',
-      tableHeader:[],
-      dialogVisible: false,
-      dialogDetail: false,
-      // tabEvent: -1,
-      // tabOptions: [
-      //     { id: -1, name: "风电" },
-      //     { id: -2, name: "光伏" },
-      // ],
-    }
-  },
-  created() {
-    this.getCompanyData()
-  },
-  methods: {
-    // 切换tab
-    tabSelect(index) {
-      this.tabIndex = index;
-      this.seachData();
-    },
-    // changeBtn(id) {
-    //     this.tabEvent = id
-    //     this.stationVal = []
-    //     this.windVal = []
-    //     this.getStationData()
-    // },
-    // 获取公司列表
-    async getCompanyData() {
-      this.companyOptions = []
-      this.pickerTimer = this.getchangeTime(new Date())
-      const datas = await getApicompanyslist()
-      this.companyOptions = datas.data
-      this.companyVal = datas.data[0]?.id
-      this.getStationData()
-    },
-    changeCompan(val) {
-      this.stationVal = []
-      this.projectVal = []
-      this.lineVal = []
-      this.windVal = []
-      this.companyVal = val
-      this.getStationData()
-    },
-    // 获取场站列表
-    async getStationData() {
-      let params = {
-        type: -1,
-        companyid: this.companyVal
-      }
-      const datas = await getApiwpByCplistlist(params)
-      this.stationOptions = datas.data
-      this.stationVal[0] = datas.data[0].id
-
-      this.getBywindData()
-    },
-    changeStation(val) {
-      this.projectVal = []
-      this.lineVal = []
-      this.windVal = []
-      this.stationVal = val
-      this.getProjectData()
-      this.getBywindData()
-    },
-    // 获取期次列表
-    async getProjectData() {
-      let params = {
-        wpids: this.stationVal.length>0 ? this.stationVal.join(',') : ''
-      }
-      const datas = await getApipjByWplist(params)
-      this.projectOptions = datas.data
-    },
-    changeProject(val) {
-      this.lineVal = []
-      this.windVal = []
-      this.projectVal = val
-      this.getByLineData()
-    },
-    // 获取线路列表
-    async getByLineData() {
-      let params = {
-        pjids: this.projectVal.length>0 ? this.projectVal.join(',') : ''
-      }
-      const datas = await getApilnByPjlist(params)
-      this.lineOptions = datas.data
-      this.getBywindData()
-    },
-    changeByLine(val) {
-      this.windVal = []
-      this.lineVal = val
-      this.getBywindData()
-    },
-    // 获取风机列表
-    async getBywindData() {
-      let params = {
-        companyId: this.companyVal,
-        wpIds: this.stationVal.length>0 ? this.stationVal.join(',') : '',
-        projectIds: this.projectVal > 0 ?this.projectVal.join(',') : '',
-        lineIds: this.lineVal.length>0 ? this.lineVal.join(',') : '',
-        type: 0
-      }
-      const datas = await getApiequipmentList(params)
-      this.windOptions = datas.data
-      if (this.windOptions.length>0) {
-        this.windOptions.forEach((it, index) =>{
-          if (index < 5) {
-            this.windVal.push(it.id)
-          }
-        })
-      }
-      this.seachData()
-    },
-    seachData() {
-      this.getTableData()
-      this.getEchartsData()
-    },
-    async getTableData() {
-        console.log(this.windVal,"11")
-      let params = {
-        wtIds: this.windVal.join(','),
-        dateType: this.tabIndex*1 + 1,
-        date: this.pickerTimer,
-        type: -1
-      }
-      const datas = await getApiequipmentPerformaCompare(params)
-      this.BenchmarkingData = []
-      this.tableHeader = []
-      if (datas.data.length>0) {
-        datas.data.forEach((item, index) =>{
-          if (item.name === '风电机') {
-            item.name = '指标'
-            for(let i in item) {
-              let obj = {
-                title: item[i],
-                code: i
-              }
-              this.tableHeader.unshift(obj)
-            }
-          } else {
-            this.BenchmarkingData.push(item)
-            if(item.name === '风资源') {
-              this.tableHeader.forEach(it =>{
-                if (item['1']) {
-                  if (it.code === '1') {
-                    item['1'] = this.windResourcesDataFn(item['1'], it.title)
-                  }
-                }
-                if (item['2']) {
-                  if (it.code === '2') {
-                    item['2'] = this.windResourcesDataFn(item['2'], it.title)
-                  }
-                }
-                if (item['3']) {
-                  if (it.code === '3') {
-                    item['3'] = this.windResourcesDataFn(item['3'], it.title)
-                  }
-                }
-                if (item['4']) {
-                  if (it.code === '4') {
-                    item['4'] = this.windResourcesDataFn(item['4'], it.title)
-                  }
-                }
-                if (item['5']) {
-                  if (it.code === '5') {
-                    item['5'] = this.windResourcesDataFn(item['5'], it.title)
-                  }
-                }
-              })
-            }
-          }
-        })
-      }
-    },
-    windResourcesDataFn(row, name) {
-      let windResourcesData = {
-        rzdfsxaisx: {
-          type: 'category',
-          boundaryGap: false,
-          data: [],
-          splitLine: {
-            show: true
-          }
-        },
-        lenged: [name],
-        data: [
-          {
-            type: 'bar',
-            data: [],
-            coordinateSystem: 'polar',
-            name: name,
-            stack: 'a',
-            emphasis: {
-              focus: 'series'
-            }
-          }
-        ],
-      };
-      // debugger
-      if (row.length>0) {
-        row.forEach((ele) => {
-          windResourcesData.rzdfsxaisx.data.push(ele.name);
-          windResourcesData.data[0].data.push(ele.value);
-        });
-
-      }
-      return windResourcesData
-    },
-    async getEchartsData() {
-      let that = this
-      let params = {
-        wtIds: that.windVal.join(',')
-      }
-      const datas = await getApicurveFitting(params)
-      if (datas && JSON.stringify(datas.data) !== {}) {
-        let lenged = []
-        let xAxis = []
-        let series = []
-        for(let i in datas.data) {
-          if (xAxis.length === 0) {
-            datas.data[i].forEach(it =>{
-              xAxis.push(it.speed)
-            })
-          }
-          lenged.push(i)
-          let seriescv = []
-          datas.data[i].forEach(it =>{
-            seriescv.push(it.actualPower)
-          })
-          let obj = {
-            name: i,
-            type: 'line',
-            smooth: true,
-            lineStyle: {
-              width: 1
-            },
-            data: seriescv
-          }
-          series.push(obj)
-        }
-        that.getChart(xAxis, lenged, series)
-      }
-    },
-    getChart(xAxis, lenged, series){
-      let option = {
-        color: ["#1C99FF", "#FF8700", "#3D54BE", "#fa8c16", "#1DA0D7", "#DD5044"],
-        tooltip: {
-          trigger: "axis",
-          backgroundColor: "rgba(0,0,0,0.4)",
-          borderColor: partten.getColor("gray"),
-          textStyle: {
-            color: "#fff",
-            fontSize: util.vh(16),
-          },
-        },
-        legend: {
-          show: true,
-          data: lenged,
-          padding: [10,10],
-          right: 56,
-          icon: "circle",
-          itemWidth: 6,
-          inactiveColor:partten.getColor("gray"),
-          textStyle: {
-            color:partten.getColor("grayl"),
-            fontSize: 12,
-          },
-        },
-        grid: {
-          top: 56,
-          left: 40,
-          right: 15,
-          bottom: 24,
-        },
-        xAxis: [
-          {
-            type: "category",
-            boundaryGap: false,
-            axisLabel: {
-              formatter: "{value}",
-              textStyle: {
-                color: partten.getColor("gray"),
-                fontSize: util.vh(10),
-              },
-            },
-            data: xAxis
-          },
-        ],
-        yAxis: {
-          type: "value",
-          name: 'kWh',
-          axisLabel: {
-            formatter: "{value}",
-            fontSize: '14px',
-          },
-          boundaryGap: false,
-          //分格线
-          splitLine: {
-            show: false,
-          },
-        },
-        series: series,
-      };
-      let dom = document.getElementById('markmainEchart');
-      dom.removeAttribute("_echarts_instance_")
-      let myChart = echarts.init(dom);
-      myChart.clear();
-      myChart.setOption(option);
-      window.addEventListener("resize", function () {
-        myChart.resize()
-      })
-    },
-    //转换时间
-    getchangeTime(date){
-      var y = date.getFullYear();
-      var m = date.getMonth() + 1;
-      m = m < 10 ? ('0' + m) : m;
-      var d = date.getDate();
-      d = d < 10 ? ('0' + d) : d;
-      return y + '-' + m + '-' + d
-    },
-    seachDetail(row) {
-      this.dialogDetail = true
-      this.$nextTick(() =>{
-        this.$refs.windDetail.recorddate = this.pickerTimer
-        this.$refs.windDetail.init(row)
-      })
-    },
-    seachHistoryData(row) {
-      this.dialogVisible = true
-      this.dialogTitle = row.windturbineId
-      this.$nextTick(() =>{
-        let startT = new Date(this.pickerTimer).getTime() - 10*24*60*60*1000
-        this.$refs.windhistoryDetail.pickerTimer = [this.getchangeTime(new Date(startT)) ,this.pickerTimer]
-        this.$refs.windhistoryDetail.init(row)
-      })
-    },
-    downXlsxFn() {
-      let header = []
-      this.tableHeader.forEach(it =>{
-        if (it.title !== '操作') {
-          header.push(it.title)
-        }
-      })
-      if (this.BenchmarkingData.length>0) {
-        utils.exportExcel(this.$refs['stand_table'].$el, header, '单机性能分析')
-      }
-    },
-  }
-}
-</script>
-
-<style lang="less">
-.Benchmarking{
-  padding: 0 23px;
-  .Benchmarking_topAll{
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    .Benchmarking_top {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      margin-top: 10px;
-      margin-bottom: 10px;
-
-      .station {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        font-size: 14px;
-        font-family: Microsoft YaHei;
-        font-weight: 400;
-        color: #B3B3B3;
-        margin-right: 10px;
-        margin-left: 10px;
-
-      }
-      .tabCut {
-        display: inline-block;
-        margin: 0 10px;
-
-        div {
-          display: inline-block;
-          width: 60px;
-          height: 27px;
-          border: 1px solid #354460;
-          text-align: center;
-          line-height: 25px;
-          cursor: pointer;
-        }
-
-        div:nth-child(1) {
-          border-radius: 13px 0px 0px 13px;
-        }
-
-        div:nth-child(2) {
-          border-radius: 0px 13px 13px 0px;
-        }
-
-        .active {
-          background-color: #0C3378;
-          color: #fff;
-        }
-      }
-      .stationss{
-        .el-input__inner{
-          max-width: 250px !important;
-          width: 208px;
-        }
-      }
-      .stationcm{
-        .el-input__inner{
-          max-width: 125px !important;
-          width: 110px;
-        }
-      }
-
-      .search-input {
-        margin-left: 10px;
-        .el-input__inner{
-          width: 150px;
-        }
-        .el-input__suffix{
-          right: -20px;
-        }
-      }
-
-      .but {
-        display: flex;
-        flex-direction: row;
-        align-content: center;
-        .buttons:nth-child(1) {
-          background: rgba(0,70,199,0.6);
-          border: 1px solid #1F51AE;
-          border-radius: 13px;
-          color: #fff;
-          padding: 0 20px !important;
-          &:hover {
-            background: rgba(14,90,229,0.9);
-            border-radius: 13px;
-            color: #fff
-          }
-        }
-        .buttons:nth-child(2) {
-          background: rgba(67,81,107,0.3);
-          border: 1px solid #3B4C6C;
-          border-radius: 13px;
-          font-size: 14px;
-          color: #B3B3B3;
-          padding: 0 20px !important;
-        }
-      }
-    }
-    .selections {
-      position: relative;
-      right: 100px;
-      display: flex;
-      margin-top: 13px;
-      .selections_btn {
-        flex: 0 0 50px;
-        text-align: center;
-        height: 33px;
-        line-height: 33px;
-        margin-right: 8px;
-        color: #fff;
-        font-size: 1.296vh;
-        background: fade(#606769, 20);
-        border: 1px solid fade(#606769, 20);
-        border-radius: 20px;
-        &:hover,
-        &.active {
-          background: fade(#0046C7, 80);
-          border: 1px solid #0046C7;
-          color: #b9b9b9;
-          cursor: pointer;
-        }
-      }
-    }
-  }
-  .Benchmarking_title{
-    padding-left: 10px;
-    .leftContent {
-      width: 242px;
-      height: 41px;
-      line-height: 41px;
-      background: url("../../../../../assets/imgs/title_left_bg.png");
-      span {
-        font-size: 16px;
-        font-family: Microsoft YaHei;
-        font-weight: 400;
-        color: #FFFFFF;
-        margin-left: 25px;
-      }
-    }
-    .floatLeft{
-      float: left;
-    }
-    .floatRight{
-      float: right;
-    }
-    .rightContent {
-      width: 212px;
-      height: 28px;
-      margin-top: 13px;
-      background: url("../../../../../assets/imgs/title_right_bg.png");
-    }
-  }
-  .clearfix::after {
-    content: "";
-    clear: both;
-    height: 0;
-    line-height: 0;
-    visibility: hidden;
-    display: block;
-  }
-  .clearfix {
-    zoom: 1;
-  }
-
-  .Benchmarking_Table{
-    margin: 0 5px 5px 5px;
-    padding-bottom: 10px;
-    .el-table--mini{
-      margin: 5px;
-      .el-table__header-wrapper{
-        tr{
-          background: rgba(83,89,104,0.3) !important;
-          th{
-            border-right: 10px solid rgba(0, 0, 0, 0.5);
-          }
-          .cell{
-            color: #B3B3B3;
-            font-family: MicrosoftYaHei;
-            font-size: 14px;
-          }
-        }
-      }
-      .el-table__body-wrapper{
-        tr{
-          &:nth-child(2n-1) {
-            background: rgba(83,89,104,0.05) !important;
-          }
-          td{
-            border-right: 10px solid rgba(0, 0, 0, 0.5);
-          }
-          .cell{
-            color: #D8D8D9;
-            font-family: ArialMT;
-            font-size: 13px;
-            .chart-namess{
-              margin-top: 2px;
-              border: 1px solid rgba(255,255,255,0.1);
-              height: 2px;
-              .point {
-                width: 6px;
-                height: 1px;
-                background-color: #ffffff;
-                position: absolute;
-
-                &.left {
-                  left: 0;
-                }
-
-                &.right {
-                  right: 0;
-                }
-
-                &.top {
-                  top: -1px;
-                }
-
-                &.bottom {
-                  bottom: -1px;
-                }
-              }
-            }
-          }
-        }
-      }
-    }
-    .historyBtn{
-      background: #43516B;
-      border-radius: 15px;
-      margin-top: 5px;
-      border: 1px solid #43516B;
-      span{
-        color: #fff;
-      }
-    }
-  }
-  .Benchmarking_Echarts{
-    margin-top: 10px;
-    width: 100%;
-    background: rgba(0, 0, 0, 0.45);
-    position: relative;
-    height: 39px;
-    // border-bottom: 1px solid rgba(153, 153, 153, 0.5);
-    font-size: 16px;
-    font-family: Microsoft YaHei;
-    font-weight: 400;
-    color: #FFFFFF;
-    .chart-name{
-      display: flex;
-      align-items: center;
-      padding-left: 20px;
-      position: relative;
-      height: 39px;
-      width: 98%;
-      margin-left: 1%;
-      border-bottom: 1px solid rgba(153, 153, 153, 0.5);
-      font-size: 16px;
-      font-family: Microsoft YaHei;
-      font-weight: 400;
-      color: #FFFFFF;
-
-      .point {
-        width: 6px;
-        height: 1px;
-        background-color: #ffffff;
-        position: absolute;
-
-        &.left {
-          left: 0;
-        }
-
-        &.right {
-          right: 0;
-        }
-
-        &.top {
-          top: -1px;
-        }
-
-        &.bottom {
-          bottom: -1px;
-        }
-      }
-    }
-    .markmainEchartSty{
-      width: 100%;
-      height: 280px;
-      background: rgba(0, 0, 0, 0.45);
-    }
-  }
-  .el-overlay{
-    .el-overlay-dialog{
-      overflow-y: hidden !important;
-      .windhistoryDetailModel, .windDetailmodal{
-        margin-top: 0 !important;
-        .el-dialog__body{
-          padding: 10px 20px 20px 20px;
-        }
-      }
-    }
-  }
-
-  .el-picker__popper .el-date-range-picker__header .el-picker-panel__icon-btn{
-    color: #fff;
-  }
-  .el-picker__popper .el-date-table .in-range div{
-    background: #43516B;
-  }
-}
-</style>

+ 2 - 4
src/views/layout/economicsOperation/benchmarkingManagement/siteBenchmarking/index.vue

@@ -394,7 +394,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >
@@ -915,9 +915,7 @@ export default {
     },
     tabClick(val) {
       this.tabIndex = val;
-      this.getStation(this.company);
-      this.gerCndb();
-      //   this.initialization();
+      this.initialization();
     },
     initialization() {
       GetOrganization({ type: this.tabIndex }).then((res) => {

+ 1 - 1
src/views/layout/economicsOperation/benchmarkingManagement/wiringBenchmarking/index.vue

@@ -426,7 +426,7 @@
         <el-table-column
           align="center"
           prop="name"
-          label="风机名称"
+          :label="tabIndex == -2 ? '逆变器名称' : '风机名称'"
           width="150"
           sortable
         >

+ 41 - 35
src/views/layout/economicsOperation/index.vue

@@ -34,7 +34,7 @@ export default {
           icon: "icon-power-curve",
           path: "/economicsOperation/comphomepageGf",
         },
-        
+
         {
           titleName: "对标管理",
           icon: "icon-dbgl",
@@ -120,11 +120,11 @@ export default {
             },
           ],
         },
-        {
-          titleName: "性能等级评估",
-          icon: "icon-fjfx",
-          path: "/economicsOperation/performanceAnalyse/performanceAssess",
-        },
+        // {
+        //   titleName: "性能等级评估",
+        //   icon: "icon-fjfx",
+        //   path: "/economicsOperation/performanceAnalyse/performanceAssess",
+        // },
         {
           titleName: "性能分析",
           icon: "icon-dimension-new",
@@ -136,10 +136,15 @@ export default {
               path: "/economicsOperation/analyse/standAloneAnalyse",
             },
             {
-              titleName: "单机月度分析",
-              icon: "",
-              path: "/economicsOperation/analyse/monthlyAnalysis",
+              titleName: "性能等级评估",
+              icon: "icon-fjfx",
+              path: "/economicsOperation/performanceAnalyse/performanceAssess",
             },
+            // {
+            //   titleName: "单机月度分析",
+            //   icon: "",
+            //   path: "/economicsOperation/analyse/monthlyAnalysis",
+            // },
           ],
         },
         {
@@ -152,11 +157,11 @@ export default {
               icon: "",
               path: "/economicsOperation/powerCurve/powerLinefitting",
             },
-            {
-              titleName: "切入切出分析(风)",
-              icon: "",
-              path: "/economicsOperation/powerCurve/cutInAndOutAnalysis",
-            },
+            // {
+            //   titleName: "切入切出分析(风)",
+            //   icon: "",
+            //   path: "/economicsOperation/powerCurve/cutInAndOutAnalysis",
+            // },
           ],
         },
         {
@@ -164,21 +169,26 @@ export default {
           icon: "icon-ztfx",
           path: "/economicsOperation/thematicAnalysis",
           children: [
-            {
-              titleName: "综合分析",
-              icon: "",
-              path: "/economicsOperation/thematicAnalysis/comprehensiveAnalysis",
-            },
+            // {
+            //   titleName: "综合分析",
+            //   icon: "",
+            //   path: "/economicsOperation/thematicAnalysis/comprehensiveAnalysis",
+            // },
             {
               titleName: "风/光能利用率",
               icon: "",
-              path: "/economicsOperation/thematicAnalysis/windEnergy",
+              path: "/economicsOperation/thematicAnalysis/lightEnergy",
             },
             {
               titleName: "五项损失率",
               icon: "",
               path: "/economicsOperation/thematicAnalysis/failure",
             },
+            {
+              titleName: "电量分析",
+              icon: "",
+              path: "/economicsOperation/thematicAnalysis/generation",
+            },
             // {
             //   titleName: "维护损失率",
             //   icon: '',
@@ -199,11 +209,11 @@ export default {
             //   icon: '',
             //   path: "/economicsOperation/thematicAnalysis/affected",
             // },
-            {
-              titleName: "三率分析",
-              icon: "",
-              path: "/economicsOperation/thematicAnalysis/reset",
-            },
+            // {
+            //   titleName: "三率分析",
+            //   icon: "",
+            //   path: "/economicsOperation/thematicAnalysis/reset",
+            // },
             // {
             //   titleName: "状态转换率",
             //   icon: '',
@@ -214,21 +224,17 @@ export default {
             //   icon: '',
             //   path: "/economicsOperation/thematicAnalysis/defect",
             // },
-            {
-              titleName: "可靠性分析",
-              icon: "",
-              path: "/economicsOperation/thematicAnalysis/MTBF",
-            },
+            // {
+            //   titleName: "可靠性分析",
+            //   icon: "",
+            //   path: "/economicsOperation/thematicAnalysis/MTBF",
+            // },
             // {
             //   titleName: "MTTR分析",
             //   icon: '',
             //   path: "/economicsOperation/thematicAnalysis/MTTR",
             // },
-            {
-              titleName: "电量分析",
-              icon: "",
-              path: "/economicsOperation/thematicAnalysis/generation",
-            },
+
             // {
             //   titleName: "综合厂用电量",
             //   icon: '',

+ 34 - 167
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/dayDetailInfo.vue

@@ -6,7 +6,7 @@
     </div>
     <div class="header">
       <span class="herder-info" v-for="item of gridDatas" :key="item"
-      >风机编号:{{ item.nemCode }}</span
+        >逆变器编号:{{ item.nemCode }}</span
       >
       <span class="herder-info">基础指标</span>
     </div>
@@ -43,13 +43,18 @@
             <td class="white" :colspan="gridDatas.length">排名</td>
             <td class="white" colspan="2">评分</td>
           </tr>
-          <tr v-for="item of tabEvent === -1 ? column : columnGf" :key="item">
+          <tr v-for="item of columnGf" :key="item">
             <td class="white">{{ item.type }}</td>
             <td class="white">{{ item.name }}</td>
             <td class="white colorSty" v-for="row of gridDatas" :key="row">
               {{ row[item.field] }}
             </td>
-            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+            <td
+              class="white colorSty"
+              :class="index >= 6 ? 'nowrap' : ''"
+              v-for="(row, index) of gridDatas"
+              :key="row"
+            >
               {{ row[item.rank] }}
             </td>
             <td class="white colorSty" v-for="row of gridDatas" :key="row">
@@ -96,138 +101,7 @@ export default {
         id: "",
         charts: [],
       },
-      column: [
-        {
-          name: "发电量",
-          field: "dayfdl",
-          rank: "monthfdl",
-          score: "yearfdl",
-        },
-        {
-          name: "理论发电量",
-          field: "dayllfdl",
-          rank: "monthllfdl",
-          score: "yearllfdl",
-        },
-        {
-          name: "平均功率",
-          field: "daygl",
-          rank: "monthgl",
-          score: "yeargl",
-        },
-        {
-          name: "故障损失电量",
-          field: "daygzssdl",
-          rank: "monthgzssdl",
-          score: "yeargzssdl",
-        },
-        {
-          name: "限电损失电量",
-          field: "dayxdssdl",
-          rank: "monthxdssdl",
-          score: "yearxdssdl",
-        },
-        {
-          name: "维护损失电量",
-          field: "daywhssdl",
-          rank: "monthwhssdl",
-          score: "yearwhssdl",
-        },
-        {
-          name: "故障时间",
-          field: "daygzsj",
-          rank: "monthgzsj",
-          score: "yeargzsj",
-        },
-        {
-          name: "维护时间",
-          field: "daywhsj",
-          rank: "monthwhsj",
-          score: "yearwhsj",
-        },
-        {
-          name: "运行时间",
-          field: "dayyxsj",
-          rank: "monthyxsj",
-          score: "yearyxsj",
-        },
-        {
-          name: "停机时间",
-          field: "daytjsj",
-          rank: "monthtjsj",
-          score: "yeartjsj",
-        },
-        {
-          name: "平均切入风速",
-          field: "dayxfqr",
-          type: "性能",
-          rank: "monthxfqr",
-          score: "yearxfqr",
-        },
-        {
-          name: "性能损失电量",
-          field: "dayxnssdl",
-          type: "性能",
-          rank: "monthxnssdl",
-          score: "yearxnssdl",
-        },
-        {
-          name: "拟合优度",
-          field: "daynhyd",
-          type: "性能",
-          rank: "monthnhyd",
-          score: "yearnhyd",
-        },
-        {
-          name: "功率一致性系数",
-          field: "dayglyzxxs",
-          type: "性能",
-          rank: "monthglyzxxs",
-          score: "yearglyzxxs",
-        },
-        {
-          name: "利用小时",
-          field: "daylyxs",
-          type: "可靠性管理",
-          rank: "monthlyxs",
-          score: "yearlyxs",
-        },
-        {
-          name: "设备可利用率",
-          field: "daysbklyl",
-          type: "可靠性管理",
-          rank: "monthsbklyl",
-          score: "yearsbklyl",
-        },
-        {
-          name: "等效可利用率",
-          field: "daydxkyxs",
-          type: "可靠性管理",
-          rank: "monthdxkyxs",
-          score: "yeardxkyxs",
-        },
-        {
-          name: "有效风时数",
-          field: "dayyxfss",
-          type: "可靠性管理",
-          rank: "monthyxfss",
-          score: "yearyxfss",
-        },
-        {
-          name: "平均风速",
-          field: "dayfs",
-          type: "资源",
-          rank: "monthfs",
-          score: "yearfs",
-        },
-        {
-          name: "静风频率",
-          field: "dayjfpl",
-          type: "资源",
-          rank: "monthjfpl",
-          score: "yearjfpl",
-        },
-      ],
+
       columnGf: [
         {
           name: "发电量",
@@ -390,16 +264,16 @@ export default {
       if (datas && datas.data) {
         if (datas.data.charts) {
           if (
-              datas.data.charts[this.oidObj.name] &&
-              datas.data.charts[this.oidObj.name].length > 0
+            datas.data.charts[this.oidObj.name] &&
+            datas.data.charts[this.oidObj.name].length > 0
           ) {
             datas.data.charts[this.oidObj.name].forEach((it, index) => {
               this.oidObj.charts.push(it);
             });
           }
           if (
-              datas.data.charts[this.tidObj.name] &&
-              datas.data.charts[this.tidObj.name].length > 0
+            datas.data.charts[this.tidObj.name] &&
+            datas.data.charts[this.tidObj.name].length > 0
           ) {
             datas.data.charts[this.tidObj.name].forEach((it, index) => {
               this.tidObj.charts.push(it);
@@ -420,33 +294,18 @@ export default {
     },
     //整理charts数据
     changeChartsData() {
-      let valArr = [];
-      if (this.tabEvent == -1) {
-        valArr = [
-          "平均切入风速",
-          "性能损失电量",
-          "拟合优度",
-          "功率一致性系数",
-          "利用小时",
-          "设备可利用率",
-          "等效可利用系数",
-          "有效风时数",
-          "平均风速",
-          "静风频率",
-        ];
-      } else {
-        valArr = [
-          "平均切入光照",
-          "性能损失电量",
-          "拟合优度",
-          "功率一致性系数",
-          "利用小时",
-          "设备可利用率",
-          "等效可利用系数",
-          "有效光时数",
-          "平均光照",
-        ];
-      }
+      let valArr = [
+        "平均切入光照",
+        "性能损失电量",
+        "拟合优度",
+        "功率一致性系数",
+        "利用小时",
+        "设备可利用率",
+        "等效可利用系数",
+        "有效光时数",
+        "平均光照",
+      ];
+
       const service1 = {
         name: this.oidObj.name,
         value: [],
@@ -488,6 +347,7 @@ export default {
 
 <style lang="less">
 .Evaluationinfo {
+  height: 100%;
   .header {
     display: flex;
     width: 100%;
@@ -496,7 +356,7 @@ export default {
     background: rgba(83, 89, 104, 0.3);
     font-family: MicrosoftYaHei;
     .herder-info {
-      flex: 1 0 25%;
+      flex: 1 0 8.5%;
       color: #a5a3a3;
       font-family: MicrosoftYaHei;
       text-align: center;
@@ -509,10 +369,13 @@ export default {
   }
   .Evaluationinfo_main {
     display: flex;
+    height: calc(100% - 40px - 11px);
     .mainleft {
       flex: 0 0 50%;
       display: flex;
       flex-direction: column;
+      height: 100%;
+      overflow: auto;
       .table-form {
         width: 100%;
         border-collapse: collapse;
@@ -545,7 +408,11 @@ export default {
         .colorSty {
           color: #1c99ff;
           font-size: 14px;
+          //   white-space: nowrap;
           font-family: MicrosoftYaHei;
+          &.nowrap {
+            white-space: nowrap;
+          }
         }
       }
       .chart-namess {

+ 615 - 0
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/dayDetailInfoFd.vue

@@ -0,0 +1,615 @@
+<template>
+  <div class="Evaluationinfo" v-if="!noData">
+    <div class="chart-name">
+      <div class="point left"></div>
+      <div class="point right"></div>
+    </div>
+    <div class="header">
+      <span class="herder-info" v-for="item of gridDatas" :key="item"
+      >风机编号:{{ item.nemCode }}</span
+      >
+      <span class="herder-info">基础指标</span>
+    </div>
+    <div class="Evaluationinfo_main">
+      <div class="mainleft">
+        <table class="table-form">
+          <tr>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              量化评级:{{ item.dayLevel }}
+            </td>
+          </tr>
+          <tr>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              综合排名:{{ item.dayRank }}
+            </td>
+          </tr>
+        </table>
+        <div class="chart-namess">
+          <div class="point left"></div>
+          <div class="point right"></div>
+        </div>
+        <div class="chart-body">
+          <normal-radar-chart :height="'500px'" :value="chartDatas" />
+        </div>
+      </div>
+      <div class="mainleft">
+        <table class="table-form">
+          <tr>
+            <td class="white">类型</td>
+            <td class="white">指标</td>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              {{ item.nemCode }}
+            </td>
+            <td class="white" :colspan="gridDatas.length">排名</td>
+            <td class="white" colspan="2">评分</td>
+          </tr>
+          <tr v-for="item of tabEvent === -1 ? column : columnGf" :key="item">
+            <td class="white">{{ item.type }}</td>
+            <td class="white">{{ item.name }}</td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.field] }}
+            </td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.rank] }}
+            </td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.score] }}
+            </td>
+          </tr>
+        </table>
+      </div>
+    </div>
+  </div>
+  <div v-else style="text-align: center">
+    <span style="color: #fff">暂无数据</span>
+  </div>
+</template>
+
+<script>
+import NormalRadarChart from "../../homePage/components/normal-radar-chart.vue";
+
+import { getApiequipmentinfoDayCompareList } from "@/api/monthlyPerformanceAnalysis";
+export default {
+  components: { NormalRadarChart },
+  props: {
+    chooseList: {
+      type: Array,
+      default: () => [],
+    },
+    tabEvent: {
+      type: Number,
+      default: -1,
+    },
+  },
+  data() {
+    return {
+      tabIndex: 0,
+      gridDatas: [],
+      chartDatas: [],
+      oidObj: {
+        name: "",
+        id: "",
+        charts: [],
+      },
+      tidObj: {
+        name: "",
+        id: "",
+        charts: [],
+      },
+      column: [
+        {
+          name: "发电量",
+          field: "dayfdl",
+          rank: "monthfdl",
+          score: "yearfdl",
+        },
+        {
+          name: "理论发电量",
+          field: "dayllfdl",
+          rank: "monthllfdl",
+          score: "yearllfdl",
+        },
+        {
+          name: "平均功率",
+          field: "daygl",
+          rank: "monthgl",
+          score: "yeargl",
+        },
+        {
+          name: "故障损失电量",
+          field: "daygzssdl",
+          rank: "monthgzssdl",
+          score: "yeargzssdl",
+        },
+        {
+          name: "限电损失电量",
+          field: "dayxdssdl",
+          rank: "monthxdssdl",
+          score: "yearxdssdl",
+        },
+        {
+          name: "维护损失电量",
+          field: "daywhssdl",
+          rank: "monthwhssdl",
+          score: "yearwhssdl",
+        },
+        {
+          name: "故障时间",
+          field: "daygzsj",
+          rank: "monthgzsj",
+          score: "yeargzsj",
+        },
+        {
+          name: "维护时间",
+          field: "daywhsj",
+          rank: "monthwhsj",
+          score: "yearwhsj",
+        },
+        {
+          name: "运行时间",
+          field: "dayyxsj",
+          rank: "monthyxsj",
+          score: "yearyxsj",
+        },
+        {
+          name: "停机时间",
+          field: "daytjsj",
+          rank: "monthtjsj",
+          score: "yeartjsj",
+        },
+        {
+          name: "平均切入风速",
+          field: "dayxfqr",
+          type: "性能",
+          rank: "monthxfqr",
+          score: "yearxfqr",
+        },
+        {
+          name: "性能损失电量",
+          field: "dayxnssdl",
+          type: "性能",
+          rank: "monthxnssdl",
+          score: "yearxnssdl",
+        },
+        {
+          name: "拟合优度",
+          field: "daynhyd",
+          type: "性能",
+          rank: "monthnhyd",
+          score: "yearnhyd",
+        },
+        {
+          name: "功率一致性系数",
+          field: "dayglyzxxs",
+          type: "性能",
+          rank: "monthglyzxxs",
+          score: "yearglyzxxs",
+        },
+        {
+          name: "利用小时",
+          field: "daylyxs",
+          type: "可靠性管理",
+          rank: "monthlyxs",
+          score: "yearlyxs",
+        },
+        {
+          name: "设备可利用率",
+          field: "daysbklyl",
+          type: "可靠性管理",
+          rank: "monthsbklyl",
+          score: "yearsbklyl",
+        },
+        {
+          name: "等效可利用率",
+          field: "daydxkyxs",
+          type: "可靠性管理",
+          rank: "monthdxkyxs",
+          score: "yeardxkyxs",
+        },
+        {
+          name: "有效风时数",
+          field: "dayyxfss",
+          type: "可靠性管理",
+          rank: "monthyxfss",
+          score: "yearyxfss",
+        },
+        {
+          name: "平均风速",
+          field: "dayfs",
+          type: "资源",
+          rank: "monthfs",
+          score: "yearfs",
+        },
+        {
+          name: "静风频率",
+          field: "dayjfpl",
+          type: "资源",
+          rank: "monthjfpl",
+          score: "yearjfpl",
+        },
+      ],
+      columnGf: [
+        {
+          name: "发电量",
+          field: "dayfdl",
+          rank: "monthfdl",
+          score: "yearfdl",
+        },
+        {
+          name: "理论发电量",
+          field: "dayllfdl",
+          rank: "monthllfdl",
+          score: "yearllfdl",
+        },
+        {
+          name: "平均功率",
+          field: "daygl",
+          rank: "monthgl",
+          score: "yeargl",
+        },
+        {
+          name: "故障损失电量",
+          field: "daygzssdl",
+          rank: "monthgzssdl",
+          score: "yeargzssdl",
+        },
+        {
+          name: "限电损失电量",
+          field: "dayxdssdl",
+          rank: "monthxdssdl",
+          score: "yearxdssdl",
+        },
+        {
+          name: "维护损失电量",
+          field: "daywhssdl",
+          rank: "monthwhssdl",
+          score: "yearwhssdl",
+        },
+        {
+          name: "故障时间",
+          field: "daygzsj",
+          rank: "monthgzsj",
+          score: "yeargzsj",
+        },
+        {
+          name: "维护时间",
+          field: "daywhsj",
+          rank: "monthwhsj",
+          score: "yearwhsj",
+        },
+        {
+          name: "运行时间",
+          field: "dayyxsj",
+          rank: "monthyxsj",
+          score: "yearyxsj",
+        },
+        {
+          name: "停机时间",
+          field: "daytjsj",
+          rank: "monthtjsj",
+          score: "yeartjsj",
+        },
+        {
+          name: "平均切入光照",
+          field: "dayxfqr",
+          type: "性能",
+          rank: "monthxfqr",
+          score: "yearxfqr",
+        },
+        {
+          name: "性能损失电量",
+          field: "dayxnssdl",
+          type: "性能",
+          rank: "monthxnssdl",
+          score: "yearxnssdl",
+        },
+        {
+          name: "拟合优度",
+          field: "daynhyd",
+          type: "性能",
+          rank: "monthnhyd",
+          score: "yearnhyd",
+        },
+        {
+          name: "功率一致性系数",
+          field: "dayglyzxxs",
+          type: "性能",
+          rank: "monthglyzxxs",
+          score: "yearglyzxxs",
+        },
+        {
+          name: "利用小时",
+          field: "daylyxs",
+          type: "可靠性管理",
+          rank: "monthlyxs",
+          score: "yearlyxs",
+        },
+        {
+          name: "设备可利用率",
+          field: "daysbklyl",
+          type: "可靠性管理",
+          rank: "monthsbklyl",
+          score: "yearsbklyl",
+        },
+        {
+          name: "等效可利用率",
+          field: "daydxkyxs",
+          type: "可靠性管理",
+          rank: "monthdxkyxs",
+          score: "yeardxkyxs",
+        },
+        {
+          name: "有效光时数",
+          field: "dayyxfss",
+          type: "可靠性管理",
+          rank: "monthyxfss",
+          score: "yearyxfss",
+        },
+        {
+          name: "平均光照",
+          field: "dayfs",
+          type: "资源",
+          rank: "monthfs",
+          score: "yearfs",
+        },
+        // {
+        //   name: "静风频率",
+        //   field: "dayjfpl",
+        //   type: "资源",
+        //   rank: "monthjfpl",
+        //   score: "yearjfpl",
+        // },
+      ],
+      noData: false,
+    };
+  },
+  methods: {
+    init() {
+      this.oidObj.name = this.chooseList[0].nemCode;
+      this.oidObj.id = this.chooseList[0].id;
+      this.oidObj.charts = [];
+      this.tidObj.name = this.chooseList[1].nemCode;
+      this.tidObj.id = this.chooseList[1].id;
+      this.tidObj.charts = [];
+      this.getDetailInfo();
+    },
+    showName(val) {
+      let str = "";
+      str = val.substring(val.indexOf("_F") + 3, val.length);
+      return str;
+    },
+    // 获取对比详情数据
+    async getDetailInfo() {
+      this.noData = false;
+      let params = {
+        oid: this.oidObj.id,
+        tid: this.tidObj.id,
+        types: this.tabIndex,
+      };
+      const datas = await getApiequipmentinfoDayCompareList(params);
+      if (datas && datas.data) {
+        if (datas.data.charts) {
+          if (
+              datas.data.charts[this.oidObj.name] &&
+              datas.data.charts[this.oidObj.name].length > 0
+          ) {
+            datas.data.charts[this.oidObj.name].forEach((it, index) => {
+              this.oidObj.charts.push(it);
+            });
+          }
+          if (
+              datas.data.charts[this.tidObj.name] &&
+              datas.data.charts[this.tidObj.name].length > 0
+          ) {
+            datas.data.charts[this.tidObj.name].forEach((it, index) => {
+              this.tidObj.charts.push(it);
+            });
+          }
+          this.changeChartsData();
+        } else {
+          this.noData = true;
+        }
+        if (datas.data.data.length > 0) {
+          this.gridDatas = datas.data.data;
+          // this.oidObj.datas = datas.data.data[0]
+          // this.tidObj.datas = datas.data.data[1]
+        } else {
+          this.noData = true;
+        }
+      }
+    },
+    //整理charts数据
+    changeChartsData() {
+      let valArr = [];
+      if (this.tabEvent == -1) {
+        valArr = [
+          "平均切入风速",
+          "性能损失电量",
+          "拟合优度",
+          "功率一致性系数",
+          "利用小时",
+          "设备可利用率",
+          "等效可利用系数",
+          "有效风时数",
+          "平均风速",
+          "静风频率",
+        ];
+      } else {
+        valArr = [
+          "平均切入光照",
+          "性能损失电量",
+          "拟合优度",
+          "功率一致性系数",
+          "利用小时",
+          "设备可利用率",
+          "等效可利用系数",
+          "有效光时数",
+          "平均光照",
+        ];
+      }
+      const service1 = {
+        name: this.oidObj.name,
+        value: [],
+      };
+      const service2 = {
+        name: this.tidObj.name,
+        value: [],
+      };
+      for (let i = 0; i < valArr.length; i++) {
+        let it = valArr[i];
+        for (let j = 0; j < this.oidObj.charts.length; j++) {
+          let ic = this.oidObj.charts[j];
+          if (it === ic.target) {
+            service1.value.push(ic.data);
+          }
+        }
+        for (let k = 0; k < this.tidObj.charts.length; k++) {
+          let iv = this.tidObj.charts[k];
+          if (it === iv.target) {
+            service2.value.push(iv.data);
+          }
+        }
+      }
+      const chartData = [
+        {
+          indicator: valArr,
+          data: [service1],
+        },
+        {
+          indicator: valArr,
+          data: [service2],
+        },
+      ];
+      this.chartDatas = chartData;
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.Evaluationinfo {
+  .header {
+    display: flex;
+    width: 100%;
+    height: 40px;
+    line-height: 40px;
+    background: rgba(83, 89, 104, 0.3);
+    font-family: MicrosoftYaHei;
+    .herder-info {
+      flex: 1 0 16.5%;
+      color: #a5a3a3;
+      font-family: MicrosoftYaHei;
+      text-align: center;
+      font-size: 14px;
+      font-weight: 400;
+      &:last-child {
+        flex: 1 0 50%;
+      }
+    }
+  }
+  .Evaluationinfo_main {
+    display: flex;
+    .mainleft {
+      flex: 0 0 50%;
+      display: flex;
+      flex-direction: column;
+      .table-form {
+        width: 100%;
+        border-collapse: collapse;
+        tr {
+          background: transparent;
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.1);
+          }
+          td {
+            padding: 0.741vh;
+            border: 0px;
+            font-size: 12px;
+            text-align: center;
+            &.text {
+              min-width: 13vh;
+            }
+            &.value {
+              min-width: 6vh;
+            }
+            &.unit {
+              min-width: 40px;
+            }
+          }
+        }
+        .white {
+          color: #b3b3b3;
+          font-size: 14px;
+          font-family: MicrosoftYaHei;
+        }
+        .colorSty {
+          color: #1c99ff;
+          font-size: 14px;
+          font-family: MicrosoftYaHei;
+        }
+      }
+      .chart-namess {
+        height: 1px;
+        margin-top: 10px;
+        border-bottom: 1px solid rgba(153, 153, 153, 1);
+        .point {
+          width: 6px;
+          height: 1px;
+          background-color: #ffffff;
+          position: absolute;
+          &.left {
+            left: 0;
+          }
+
+          &.right {
+            right: 50%;
+          }
+
+          &.top {
+            top: -1px;
+          }
+
+          &.bottom {
+            bottom: 0px;
+          }
+        }
+      }
+      .chart-body {
+        flex-grow: 1;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .right {
+      flex: 0 0 50%;
+    }
+  }
+  .chart-name {
+    height: 1px;
+    margin-bottom: 10px;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    .point {
+      width: 6px;
+      height: 1px;
+      background-color: #ffffff;
+      position: absolute;
+
+      &.left {
+        left: 0;
+      }
+
+      &.right {
+        right: 1px;
+      }
+
+      &.top {
+        top: -1px;
+      }
+
+      &.bottom {
+        bottom: 0px;
+      }
+    }
+  }
+}
+</style>

+ 213 - 190
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/historyDetail.vue

@@ -1,210 +1,233 @@
 <template>
-    <div class="historyEvaluation">
-        <div class="historyEvaluation_top">
-            <el-date-picker
-                v-model="pickerTimer"
-                type="daterange"
-                range-separator="To"
-                start-placeholder="开始时间"
-                end-placeholder="结束时间"
-                :size="size"
-                format="YYYY/MM/DD"
-                value-format="YYYY-MM-DD"
-            />
-            <!-- <el-button class="sousuo" @click="seachData">搜索</el-button> -->
-            <div class="btn">
-                <el-button round size="mini" class="buttons" @click="seachData">搜索</el-button>
+  <div class="historyEvaluation">
+    <div class="historyEvaluation_top">
+      <el-date-picker
+        v-model="pickerTimer"
+        type="daterange"
+        range-separator="To"
+        start-placeholder="开始时间"
+        end-placeholder="结束时间"
+        :size="size"
+        format="YYYY/MM/DD"
+        value-format="YYYY-MM-DD"
+      />
+      <div class="btn">
+        <el-button round size="mini" class="buttons" @click="seachData"
+          >搜索</el-button
+        >
+      </div>
+    </div>
+    <div class="historyEvaluation_Table">
+      <el-table
+        :data="historyEvaluationData"
+        stripe
+        size="mini"
+        height="85vh"
+        ref="historysingleTable"
+        style="width: 100%"
+      >
+        <el-table-column
+          align="center"
+          prop="nemCode"
+          label="逆变器"
+          width="150"
+        >
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="recordDate"
+          label="日期"
+          width="150"
+        >
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in tabEvent === -1 ? tableHeader : tableHeaderGf"
+          :key="index"
+          sortable
+          :prop="item.code"
+          :label="item.title"
+          align="center"
+        >
+          <template #header="scope">
+            <div>
+              {{ scope.column.label.slice(0, scope.column.label.indexOf("(")) }}
+            </div>
+            <div>
+              {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
             </div>
-        </div>
-        <div class="historyEvaluation_Table">
-            <el-table
-                :data="historyEvaluationData"
-                stripe
-                size="mini"
-                height="85vh"
-                ref="historysingleTable"
-                style="width: 100%">
-                <el-table-column align="center" prop="nemCode" label="设备编号" width="150">
-                </el-table-column>
-                <el-table-column align="center" prop="recordDate" label="日期" width="150">
-                </el-table-column>
-                <el-table-column v-for="(item,index) in tabEvent === -1 ? tableHeader : tableHeaderGf" :key="index" sortable
-                    :prop="item.code"
-                    :label="item.title"
-                    align="center"
-                    >
-                    <template #header="scope">
-                        <div>{{scope.column.label.slice(0, scope.column.label.indexOf('('))}}</div>
-                        <div>{{scope.column.label.slice(scope.column.label.indexOf('('))}}</div>
-                    </template>
-                </el-table-column>
-            </el-table>
-        </div>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
+  </div>
 </template>
 
 <script>
-import {
-    getApiequipmentinfoDayHistoryList
-} from '@/api/monthlyPerformanceAnalysis'
+import { getApiequipmentinfoDayHistoryList } from "@/api/monthlyPerformanceAnalysis";
 export default {
-    data() {
-        return {
-            hiswindVal: '',
-            tabIndex: 0,
-            tabEvent: 0,
-            pickerTimer: [],
-            historyEvaluationData: [],
-            tableHeader:[{ title: '发电量(kWh)', code: 'dayfdl' },{ title: '理论发电量(kWh)', code: 'dayllfdl' }, { title: '平均风速(m/s)', code: 'dayfs' }, 
-            { title: '平均功率(KW)', code: 'daygl' },{ title: '故障损失(kWh)', code: 'daygzssdl' }, { title: '限电损失(kWh)', code: 'dayxdssdl' },
-            { title: '维护损失(kWh)', code: 'daywhssdl' },{ title: '性能损失(kWh)', code: 'dayxnssdl' }, { title: '利用小时数(h)', code: 'daylyxs'},
-            { title: '拟合优度(%)', code: 'daynhyd' },{ title: '可利用率(%)', code: 'daysbklyl' }, { title: '可用系数(%)', code: 'daydxkyxs' }, 
-            { title: '有效风时数(h)', code: 'dayyxfss' },{ title: '平均切入(m/s)', code: 'dayxfqr' }, { title: '静风频率(%)', code: 'dayjfpl' },
-            { title: '功率一致性(%)', code: 'dayglyzxxs' }
-            ],
-            tableHeaderGf:[{ title: '发电量(kWh)', code: 'dayfdl' },{ title: '理论发电量(kWh)', code: 'dayllfdl' }, { title: '光照强度(W/㎡)', code: 'dayfs' }, 
-            { title: '平均功率(KW)', code: 'daygl' },{ title: '故障损失(kWh)', code: 'daygzssdl' }, { title: '限电损失(kWh)', code: 'dayxdssdl' },
-            { title: '维护损失(kWh)', code: 'daywhssdl' },{ title: '性能损失(kWh)', code: 'dayxnssdl' }, { title: '利用小时数(h)', code: 'daylyxs'},
-            { title: '拟合优度(%)', code: 'daynhyd' },{ title: '可利用率(%)', code: 'daysbklyl' }, { title: '可用系数(%)', code: 'daydxkyxs' }, 
-            { title: '有效光时数(h)', code: 'dayyxfss' },{ title: '功率一致性(%)', code: 'dayglyzxxs' }
-            ],
-        }
+  data() {
+    return {
+      hiswindVal: "",
+      tabIndex: 0,
+      tabEvent: 0,
+      pickerTimer: [],
+      historyEvaluationData: [],
+      tableHeaderGf: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "光照强度(W/㎡)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "维护损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "可用系数(%)", code: "daydxkyxs" },
+        { title: "有效光时数(h)", code: "dayyxfss" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+    };
+  },
+  methods: {
+    init(row) {
+      this.hiswindVal = row.windturbineId;
+      this.getTableData();
     },
-    methods: {
-        init(row) {
-            this.hiswindVal = row.windturbineId
-            this.getTableData()
-        },
-        seachData() {
-            this.getTableData()
-        },
-        async getTableData() {
-            let params = {
-                beginDate: this.pickerTimer[0],
-                endDate: this.pickerTimer[1],
-                types: this.tabIndex,
-                wtId: this.hiswindVal,
-                type: this.tabEvent
-            }
-            const datas = await getApiequipmentinfoDayHistoryList(params)
-            this.historyEvaluationData = datas.data
-        },
-        //转换时间
-        getchangeTime(date){
-            var y = date.getFullYear();  
-            var m = date.getMonth() + 1;  
-            m = m < 10 ? ('0' + m) : m;  
-            var d = date.getDate();  
-            d = d < 10 ? ('0' + d) : d;
-            return y + '-' + m + '-' + d
-        }
-    }
-}
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        beginDate: this.pickerTimer[0],
+        endDate: this.pickerTimer[1],
+        types: this.tabIndex,
+        wtId: this.hiswindVal,
+        type: this.tabEvent,
+      };
+      const datas = await getApiequipmentinfoDayHistoryList(params);
+      this.historyEvaluationData = datas.data;
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-.historyEvaluation{
-    padding: 0 23px;
-    .historyEvaluation_top{
-        display: flex;
-        .el-date-editor--daterange{
-            background: transparent;
-            border: 1px solid #2A374F;
-            border-radius: 30px;
-            height: 25px;
-            .el-range-input{
-                background: transparent;
-                color: #fff;
-            }
-            .el-range-separator{
-                width: 10%;
-                color: #fff;
-                position: relative;
-                top: -7px;
-            }
-        }
-        .btn{
-            margin-left: 10px;
-            .buttons {
-                background-color: rgba(0, 70, 199, 0.2);
-                border: 1px solid #3B4C6C;
-                color: #B3B3B3;
-                font-size: 14px;
+.historyEvaluation {
+  padding: 0 23px;
+  .historyEvaluation_top {
+    display: flex;
+    .el-date-editor--daterange {
+      background: transparent;
+      border: 1px solid #2a374f;
+      border-radius: 30px;
+      height: 25px;
+      .el-range-input {
+        background: transparent;
+        color: #fff;
+      }
+      .el-range-separator {
+        width: 10%;
+        color: #fff;
+        position: relative;
+        top: -7px;
+      }
+    }
+    .btn {
+      margin-left: 10px;
+      .buttons {
+        background-color: rgba(0, 70, 199, 0.2);
+        border: 1px solid #3b4c6c;
+        color: #b3b3b3;
+        font-size: 14px;
 
-                &:hover {
-                background-color: rgba(0, 70, 199, .5);
-                color: #ffffff;
-                }
-            }
+        &:hover {
+          background-color: rgba(0, 70, 199, 0.5);
+          color: #ffffff;
         }
+      }
     }
-    .historyEvaluation_Table{
-        
-        padding-bottom: 10px;
-        background: rgba(0,0,0,0.4);
-        .el-table--mini{
-            margin: 5px;
-            .el-table__header-wrapper{
-                tr{
-                    background: rgba(83,89,104,0.3) !important;
-                    th{
-                        vertical-align: top !important;
-                    }
-                    .cell{
-                        color: #B3B3B3;
-                        font-family: MicrosoftYaHei;
-                        font-size: 14px;
-                    }
-                }
-            }
-            .el-table__body-wrapper{
-                tr{
-                    &:nth-child(2n) {
-                        background: rgba(83,89,104,0.05) !important;
-                    }
-                    .cell{
-                        color: #D8D8D9;
-                        font-family: ArialMT;
-                        font-size: 13px;
-                        height: 25px !important;
-                        .el-checkbox{
-                            height: 25px;
-                        }
-                    }
-                }
-            }
+  }
+  .historyEvaluation_Table {
+    padding-bottom: 10px;
+    background: rgba(0, 0, 0, 0.4);
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
         }
-        .el-pagination{
-            display: flex;
-            justify-content: flex-end;
-            margin-right: 40px;
-            margin-top: 20px;
-            .btn-prev, .btn-next, .el-pager .active, .number{
-                background: #43516B;
-            }
-            .el-pager{
-                position: relative;
-                top: -1px;
-                .number {
-                    color: #bbbaba;
-                }
-                .active{
-                    color: #fff;
-                }
-            }
-            .el-pagination__total, .el-pagination__jump{
-                color: #fff;
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+            .el-checkbox {
+              height: 25px;
             }
+          }
         }
-        .historyBtn{
-            background: #43516B;
-            border-radius: 15px;
-            margin-top: 5px;
-            border: 1px solid #43516B;
-            span{
-                color: #fff;
-            }
+      }
+    }
+    .el-pagination {
+      display: flex;
+      justify-content: flex-end;
+      margin-right: 40px;
+      margin-top: 20px;
+      .btn-prev,
+      .btn-next,
+      .el-pager .active,
+      .number {
+        background: #43516b;
+      }
+      .el-pager {
+        position: relative;
+        top: -1px;
+        .number {
+          color: #bbbaba;
         }
+        .active {
+          color: #fff;
+        }
+      }
+      .el-pagination__total,
+      .el-pagination__jump {
+        color: #fff;
+      }
+    }
+    .historyBtn {
+      background: #43516b;
+      border-radius: 15px;
+      margin-top: 5px;
+      border: 1px solid #43516b;
+      span {
+        color: #fff;
+      }
     }
+  }
 }
-</style>
+</style>

+ 230 - 0
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/historyDetailFd.vue

@@ -0,0 +1,230 @@
+<template>
+  <div class="historyEvaluation">
+    <div class="historyEvaluation_top">
+      <el-date-picker
+        v-model="pickerTimer"
+        type="daterange"
+        range-separator="To"
+        start-placeholder="开始时间"
+        end-placeholder="结束时间"
+        :size="size"
+        format="YYYY/MM/DD"
+        value-format="YYYY-MM-DD"
+      />
+      <div class="btn">
+        <el-button round size="mini" class="buttons" @click="seachData"
+          >搜索</el-button
+        >
+      </div>
+    </div>
+    <div class="historyEvaluation_Table">
+      <el-table
+        :data="historyEvaluationData"
+        stripe
+        size="mini"
+        height="85vh"
+        ref="historysingleTable"
+        style="width: 100%"
+      >
+        <el-table-column align="center" prop="nemCode" label="风机" width="150">
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="recordDate"
+          label="日期"
+          width="150"
+        >
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in tabEvent === -1 ? tableHeader : tableHeaderGf"
+          :key="index"
+          sortable
+          :prop="item.code"
+          :label="item.title"
+          align="center"
+        >
+          <template #header="scope">
+            <div>
+              {{ scope.column.label.slice(0, scope.column.label.indexOf("(")) }}
+            </div>
+            <div>
+              {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getApiequipmentinfoDayHistoryList } from "@/api/monthlyPerformanceAnalysis";
+export default {
+  data() {
+    return {
+      hiswindVal: "",
+      tabIndex: 0,
+      tabEvent: 0,
+      pickerTimer: [],
+      historyEvaluationData: [],
+      tableHeader: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "平均风速(m/s)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "维护损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "可用系数(%)", code: "daydxkyxs" },
+        { title: "有效风时数(h)", code: "dayyxfss" },
+        { title: "平均切入(m/s)", code: "dayxfqr" },
+        { title: "静风频率(%)", code: "dayjfpl" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+    };
+  },
+  methods: {
+    init(row) {
+      this.hiswindVal = row.windturbineId;
+      this.getTableData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        beginDate: this.pickerTimer[0],
+        endDate: this.pickerTimer[1],
+        types: this.tabIndex,
+        wtId: this.hiswindVal,
+        type: this.tabEvent,
+      };
+      const datas = await getApiequipmentinfoDayHistoryList(params);
+      this.historyEvaluationData = datas.data;
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.historyEvaluation {
+  padding: 0 23px;
+  .historyEvaluation_top {
+    display: flex;
+    .el-date-editor--daterange {
+      background: transparent;
+      border: 1px solid #2a374f;
+      border-radius: 30px;
+      height: 25px;
+      .el-range-input {
+        background: transparent;
+        color: #fff;
+      }
+      .el-range-separator {
+        width: 10%;
+        color: #fff;
+        position: relative;
+        top: -7px;
+      }
+    }
+    .btn {
+      margin-left: 10px;
+      .buttons {
+        background-color: rgba(0, 70, 199, 0.2);
+        border: 1px solid #3b4c6c;
+        color: #b3b3b3;
+        font-size: 14px;
+
+        &:hover {
+          background-color: rgba(0, 70, 199, 0.5);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+  .historyEvaluation_Table {
+    padding-bottom: 10px;
+    background: rgba(0, 0, 0, 0.4);
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+            .el-checkbox {
+              height: 25px;
+            }
+          }
+        }
+      }
+    }
+    .el-pagination {
+      display: flex;
+      justify-content: flex-end;
+      margin-right: 40px;
+      margin-top: 20px;
+      .btn-prev,
+      .btn-next,
+      .el-pager .active,
+      .number {
+        background: #43516b;
+      }
+      .el-pager {
+        position: relative;
+        top: -1px;
+        .number {
+          color: #bbbaba;
+        }
+        .active {
+          color: #fff;
+        }
+      }
+      .el-pagination__total,
+      .el-pagination__jump {
+        color: #fff;
+      }
+    }
+    .historyBtn {
+      background: #43516b;
+      border-radius: 15px;
+      margin-top: 5px;
+      border: 1px solid #43516b;
+      span {
+        color: #fff;
+      }
+    }
+  }
+}
+</style>

+ 55 - 90
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/index.vue

@@ -4,6 +4,20 @@
       <div class="Evaluation_top">
         <el-select
           size="mini"
+          v-model="tabEvent"
+          placeholder="请选择"
+          @change="changeBtn"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
           v-model="companyVal"
           placeholder="请选择"
           @change="changeCompan"
@@ -16,34 +30,22 @@
           >
           </el-option>
         </el-select>
-        <div class="tabCut">
-          <div
-            @click="changeBtn(val.id)"
-            :class="tabEvent === val.id ? 'active' : ''"
-            v-for="val in tabOptions"
-            :key="val.id"
-          >
-            <span>{{ val.name }}</span>
-          </div>
-        </div>
-        <div class="station">
-          场站:
-          <el-select
-            size="mini"
-            v-model="stationVal"
-            placeholder="请选择"
-            clearable
-            @change="changeStation"
+
+        <el-select
+          size="mini"
+          v-model="stationVal"
+          placeholder="请选择"
+          clearable
+          @change="changeStation"
+        >
+          <el-option
+            v-for="item in stationOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
           >
-            <el-option
-              v-for="item in stationOptions"
-              :key="item.id"
-              :label="item.aname"
-              :value="item.id"
-            >
-            </el-option>
-          </el-select>
-        </div>
+          </el-option>
+        </el-select>
         <div class="station">
           时间
           <div class="search-input">
@@ -113,21 +115,19 @@
         >
           <el-table-column type="selection" width="55" align="center">
           </el-table-column>
-          <el-table-column prop="nemCode" label="设备编号" align="center">
+          <el-table-column prop="nemCode" label="逆变器" align="center">
           </el-table-column>
           <el-table-column prop="dayLevel" label="等级" align="center">
           </el-table-column>
           <el-table-column prop="dayRank" label="综合排名" align="center">
           </el-table-column>
           <el-table-column
-            v-for="(item, index) in tabEvent === -1
-              ? tableHeader
-              : tableHeaderGf"
+            v-for="(item, index) in tableHeaderGf"
             :key="index"
             sortable
             :prop="item.code"
             :label="item.title"
-            align="center"
+            align="center"        
           >
             <template #header="scope">
               <div>
@@ -173,8 +173,9 @@
     </el-dialog>
     <el-dialog
       v-model="contrastVisible"
-      width="70%"
-      top="5vh"
+      width="88%"
+      height="48vh"
+      top="1.5vh"
       custom-class="contrastModal"
       :close-on-click-modal="false"
     >
@@ -205,6 +206,7 @@ import {
   getApiwpByCplistlist,
   getApiequipmentinfoDayList,
 } from "@/api/monthlyPerformanceAnalysis";
+import { GetOrganization, GetStationByCompany } from "@/api/headerNav.js";
 import utils from "@/utils/downXlsx";
 import historyDetail from "./historyDetail.vue";
 import dayDetailInfo from "./dayDetailInfo.vue";
@@ -223,24 +225,6 @@ export default {
       stationOptions: [],
       pickerTimer: "",
       EvaluationData: [],
-      tableHeader: [
-        { title: "发电量(kWh)", code: "dayfdl" },
-        { title: "理论发电量(kWh)", code: "dayllfdl" },
-        { title: "平均风速(m/s)", code: "dayfs" },
-        { title: "平均功率(KW)", code: "daygl" },
-        { title: "故障损失(kWh)", code: "daygzssdl" },
-        { title: "限电损失(kWh)", code: "dayxdssdl" },
-        { title: "维护损失(kWh)", code: "daywhssdl" },
-        { title: "性能损失(kWh)", code: "dayxnssdl" },
-        { title: "利用小时数(h)", code: "daylyxs" },
-        { title: "拟合优度(%)", code: "daynhyd" },
-        { title: "可利用率(%)", code: "daysbklyl" },
-        { title: "可用系数(%)", code: "daydxkyxs" },
-        { title: "有效风时数(h)", code: "dayyxfss" },
-        { title: "平均切入(m/s)", code: "dayxfqr" },
-        { title: "静风频率(%)", code: "dayjfpl" },
-        { title: "功率一致性(%)", code: "dayglyzxxs" },
-      ],
       tableHeaderGf: [
         { title: "发电量(kWh)", code: "dayfdl" },
         { title: "理论发电量(kWh)", code: "dayllfdl" },
@@ -261,7 +245,7 @@ export default {
       dialogTitle: "",
       chooseList: [],
       contrastVisible: false,
-      tabEvent: -1,
+      tabEvent: -2,
       tabOptions: [
         { id: -1, name: "风电" },
         { id: -2, name: "光伏" },
@@ -284,18 +268,16 @@ export default {
       this.tabIndex = index;
       this.seachData();
     },
-    changeBtn(id) {
-      this.tabEvent = id;
-      this.stationVal = "";
-      this.stationOptions = [];
-      this.getStationData();
-      this.seachData();
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/performanceAnalyse/performanceAssessFd",
+      });
     },
     // 获取公司列表
     async getCompanyData() {
       this.companyOptions = [];
       this.pickerTimer = this.getchangeTime(new Date());
-      const datas = await getApicompanyslist();
+      const datas = await GetOrganization({ type: this.tabEvent });
       this.companyOptions = datas.data;
       this.companyVal = datas.data[0]?.id;
       this.getStationData();
@@ -311,9 +293,9 @@ export default {
       this.stationOptions = [];
       let params = {
         type: this.tabEvent,
-        companyid: this.companyVal,
+        companyids: this.companyVal,
       };
-      const datas = await getApiwpByCplistlist(params);
+      const datas = await GetStationByCompany(params);
       this.stationOptions = datas.data;
       this.stationVal = datas.data[0].id;
       this.getTableData();
@@ -462,7 +444,13 @@ export default {
       align-items: center;
       margin-top: 10px;
       margin-bottom: 10px;
-
+      .el-select {
+        width: 155px;
+        margin-right: 15px;
+        ::v-deep .el-input .el-input__inner {
+          width: 150px;
+        }
+      }
       .station {
         display: flex;
         flex-direction: row;
@@ -484,33 +472,6 @@ export default {
           right: -50px;
         }
       }
-      .tabCut {
-        display: inline-block;
-        margin: 0 10px;
-
-        div {
-          display: inline-block;
-          width: 60px;
-          height: 27px;
-          border: 1px solid #354460;
-          text-align: center;
-          line-height: 25px;
-          cursor: pointer;
-        }
-
-        div:nth-child(1) {
-          border-radius: 13px 0px 0px 13px;
-        }
-
-        div:nth-child(2) {
-          border-radius: 0px 13px 13px 0px;
-        }
-
-        .active {
-          background-color: #0c3378;
-          color: #fff;
-        }
-      }
 
       .but {
         display: flex;
@@ -597,7 +558,11 @@ export default {
           border: none;
         }
         .el-dialog__body {
+            height: calc(100vh - 2.5vh - 54px);
           padding-top: 10px;
+          .dialog-body{
+            height: 100%;
+          }
         }
       }
     }

+ 571 - 0
src/views/layout/economicsOperation/performanceAnalyse/performanceAssess/indexFd.vue

@@ -0,0 +1,571 @@
+<template>
+  <div class="comprehensiveEvaluation">
+    <div class="Evaluation_topall">
+      <div class="Evaluation_top">
+        <el-select
+          size="mini"
+          v-model="tabEvent"
+          placeholder="请选择"
+          @change="changeBtn"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="companyVal"
+          placeholder="请选择"
+          @change="changeCompan"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+
+        <el-select
+          size="mini"
+          v-model="stationVal"
+          placeholder="请选择"
+          clearable
+          @change="changeStation"
+        >
+          <el-option
+            v-for="item in stationOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <div class="station">
+          时间
+          <div class="search-input">
+            <el-date-picker
+              v-model="pickerTimer"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="but">
+          <el-button round size="mini" class="buttons" @click="seachData"
+            >搜索</el-button
+          >
+          <el-button
+            round
+            size="mini"
+            class="buttons"
+            @click="contrastFn"
+            :disabled="chooseList.length === 2 ? false : true"
+            >信息对比</el-button
+          >
+        </div>
+      </div>
+      <div class="selections">
+        <div
+          class="selections_btn"
+          @click="tabSelect(0)"
+          :class="{ active: tabIndex == 0 }"
+        >
+          日
+        </div>
+        <div
+          class="selections_btn"
+          @click="tabSelect(1)"
+          :class="{ active: tabIndex == 1 }"
+        >
+          月
+        </div>
+        <div
+          class="selections_btn"
+          @click="tabSelect(2)"
+          :class="{ active: tabIndex == 2 }"
+        >
+          年
+        </div>
+      </div>
+    </div>
+    <div style="background: rgba(0, 0, 0, 0.4)">
+      <div class="Evaluation_title clearfix">
+        <div class="leftContent floatLeft"><span>性能等级评估</span></div>
+        <div class="rightContent floatRight"></div>
+      </div>
+
+      <div class="Evaluation_Table">
+        <el-table
+          :data="EvaluationData"
+          stripe
+          @selection-change="handleCurrentChange"
+          size="mini"
+          height="80vh"
+          ref="Eval_table"
+          style="width: 100%"
+        >
+          <el-table-column type="selection" width="55" align="center">
+          </el-table-column>
+          <el-table-column prop="nemCode" label="风机" align="center">
+          </el-table-column>
+          <el-table-column prop="dayLevel" label="等级" align="center">
+          </el-table-column>
+          <el-table-column prop="dayRank" label="综合排名" align="center">
+          </el-table-column>
+          <el-table-column
+            v-for="(item, index) in tableHeader"
+            :key="index"
+            sortable
+            :prop="item.code"
+            :label="item.title"
+            align="center"
+          >
+            <template #header="scope">
+              <div>
+                {{
+                  scope.column.label.slice(0, scope.column.label.indexOf("("))
+                }}
+              </div>
+              <div>
+                {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
+              </div>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center">
+            <template #default="scope">
+              <span
+                @click="seachHistoryData(scope.row)"
+                style="cursor: pointer; color: #1c99ff"
+                >历史</span
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <el-dialog
+      v-model="dialogVisible"
+      width="100%"
+      custom-class="EvaluationhistoryModel"
+      :close-on-click-modal="false"
+    >
+      <template #title>
+        <div class="dialog-title">
+          <img
+            class="dialog-title-img"
+            src="@assets/img/images/dialog-title.png"
+          />
+          <div class="title">{{ dialogTitle }}</div>
+        </div>
+      </template>
+      <div class="body">
+        <historyDetailFd ref="windhistoryDetail" />
+      </div>
+    </el-dialog>
+    <el-dialog
+      v-model="contrastVisible"
+      width="70%"
+      top="5vh"
+      custom-class="contrastModal"
+      :close-on-click-modal="false"
+    >
+      <template #title>
+        <div class="dialog-title">
+          <img
+            class="dialog-title-img"
+            src="@assets/img/images/dialog-title.png"
+          />
+          <div class="title">信息对比</div>
+        </div>
+      </template>
+      <div class="dialog-body">
+        <img class="dialog-img" src="@assets/img/images/dialog.png" />
+        <dayDetailInfoFd
+          :chooseList="chooseList"
+          :tabEvent="tabEvent"
+          ref="MessageContrast"
+        />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getApiequipmentinfoDayList } from "@/api/monthlyPerformanceAnalysis";
+import { GetOrganization, GetStationByCompany } from "@/api/headerNav.js";
+import historyDetailFd from "./historyDetailFd.vue";
+import dayDetailInfoFd from "./dayDetailInfoFd.vue";
+export default {
+  name: "performanceAssess",
+  components: {
+    historyDetailFd,
+    dayDetailInfoFd,
+  },
+  data() {
+    return {
+      tabIndex: 0,
+      companyVal: "",
+      companyOptions: [],
+      stationVal: "",
+      stationOptions: [],
+      pickerTimer: "",
+      EvaluationData: [],
+      tableHeader: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "平均风速(m/s)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "维护损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "可用系数(%)", code: "daydxkyxs" },
+        { title: "有效风时数(h)", code: "dayyxfss" },
+        { title: "平均切入(m/s)", code: "dayxfqr" },
+        { title: "静风频率(%)", code: "dayjfpl" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+
+      dialogVisible: false,
+      dialogTitle: "",
+      chooseList: [],
+      contrastVisible: false,
+      tabEvent: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+    };
+  },
+  created() {
+    this.getCompanyData();
+  },
+  computed: {
+    pageHeight() {
+      return {
+        height: document.documentElement.clientHeight - 130 + "px",
+      };
+    },
+  },
+  methods: {
+    // 切换tab
+    tabSelect(index) {
+      this.tabIndex = index;
+      this.seachData();
+    },
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/performanceAnalyse/performanceAssess",
+      });
+    },
+    // 获取公司列表
+    async getCompanyData() {
+      this.companyOptions = [];
+      this.pickerTimer = this.getchangeTime(new Date());
+      const datas = await GetOrganization({ type: this.tabEvent });
+      this.companyOptions = datas.data;
+      this.companyVal = datas.data[0]?.id;
+      this.getStationData();
+    },
+    changeCompan(val) {
+      this.companyVal = val;
+      this.stationOptions = [];
+      this.stationVal = "";
+      this.getStationData();
+    },
+    // 获取场站列表
+    async getStationData() {
+      this.stationOptions = [];
+      let params = {
+        type: this.tabEvent,
+        companyids: this.companyVal,
+      };
+      const datas = await GetStationByCompany(params);
+      this.stationOptions = datas.data;
+      this.stationVal = datas.data[0].id;
+      this.getTableData();
+    },
+    changeStation(val) {
+      this.stationVal = val;
+      this.getTableData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        companyId: this.companyVal,
+        date: this.pickerTimer,
+        staType: -1,
+        types: this.tabIndex * 1 + 1,
+        wpId: this.stationVal,
+        type: this.tabEvent,
+      };
+      const datas = await getApiequipmentinfoDayList(params);
+      this.EvaluationData = datas.data;
+    },
+    handleCurrentChange(val) {
+      if (val.length > 2) {
+        let del_row = val.shift();
+        this.$refs.Eval_table.toggleRowSelection(del_row, false);
+      }
+      let arr = [];
+      val.forEach((item, index) => {
+        if (index < 2) {
+          arr.push(item);
+        }
+      });
+      this.chooseList = arr;
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+    seachHistoryData(row) {
+      this.dialogVisible = true;
+      this.dialogTitle = "历史数据查询";
+      this.$nextTick(() => {
+        let startT =
+          new Date(this.pickerTimer).getTime() - 10 * 24 * 60 * 60 * 1000;
+        this.$refs.windhistoryDetail.pickerTimer = [
+          this.getchangeTime(new Date(startT)),
+          this.pickerTimer,
+        ];
+        this.$refs.windhistoryDetail.tabIndex = this.tabIndex * 1 + 1;
+        this.$refs.windhistoryDetail.tabEvent = this.tabEvent;
+        this.$refs.windhistoryDetail.init(row);
+      });
+    },
+    contrastFn() {
+      this.contrastVisible = true;
+      this.$nextTick(() => {
+        this.$refs.MessageContrast.tabIndex = this.tabIndex * 1 + 1;
+        this.$refs.MessageContrast.init();
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.comprehensiveEvaluation {
+  padding: 0 23px;
+
+  .Evaluation_title {
+    padding-left: 10px;
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+    .floatLeft {
+      float: left;
+    }
+    .floatRight {
+      float: right;
+    }
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+  }
+  .clearfix::after {
+    content: "";
+    clear: both;
+    height: 0;
+    line-height: 0;
+    visibility: hidden;
+    display: block;
+  }
+  .clearfix {
+    zoom: 1;
+  }
+  .Evaluation_topall {
+    display: flex;
+    justify-content: space-between;
+    .selections {
+      position: relative;
+      right: 120px;
+      display: flex;
+      margin-top: 10px;
+      .selections_btn {
+        flex: 0 0 55px;
+        text-align: center;
+        height: 33px;
+        line-height: 33px;
+        margin-right: 8px;
+        color: #fff;
+        font-size: 1.296vh;
+        background: fade(#606769, 20);
+        border: 1px solid fade(#606769, 20);
+        border-radius: 20px;
+        &:hover,
+        &.active {
+          background: fade(#0046c7, 80);
+          border: 1px solid #0046c7;
+          color: #b9b9b9;
+          cursor: pointer;
+        }
+      }
+    }
+    .Evaluation_top {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      margin-top: 10px;
+      margin-bottom: 10px;
+      .el-select {
+        width: 155px;
+        margin-right: 15px;
+        ::v-deep .el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+      .station {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #b3b3b3;
+        margin-right: 10px;
+        margin-left: 10px;
+      }
+
+      .search-input {
+        margin-left: 10px;
+        .el-input__inner {
+          width: 175px;
+        }
+        .el-input__suffix {
+          right: -50px;
+        }
+      }
+
+      .but {
+        display: flex;
+        flex-direction: row;
+        align-content: center;
+        margin-left: 20px;
+        .buttons:nth-child(1) {
+          background: rgba(0, 70, 199, 0.6);
+          border: 1px solid #1f51ae;
+          border-radius: 13px;
+          color: #fff;
+          &:hover {
+            background: rgba(14, 90, 229, 0.9);
+            border-radius: 13px;
+            color: #fff;
+          }
+        }
+        .buttons:nth-child(2) {
+          background: rgba(67, 81, 107, 0.3);
+          border: 1px solid #3b4c6c;
+          border-radius: 13px;
+          font-size: 14px;
+          color: #b3b3b3;
+        }
+      }
+    }
+  }
+  .Evaluation_Table {
+    padding: 5px;
+    padding-bottom: 10px;
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+            .el-checkbox {
+              height: 25px;
+            }
+          }
+        }
+      }
+    }
+    .historyBtn {
+      background: #43516b;
+      border-radius: 15px;
+      margin-top: 5px;
+      border: 1px solid #43516b;
+      span {
+        color: #fff;
+      }
+    }
+  }
+  .el-overlay {
+    .el-overlay-dialog {
+      overflow-y: hidden !important;
+      .EvaluationhistoryModel {
+        margin-top: 0 !important;
+        .el-dialog__body {
+          padding-top: 10px;
+        }
+      }
+      .contrastModal {
+        .el-dialog__header {
+          border: none;
+        }
+        .el-dialog__body {
+          padding-top: 10px;
+        }
+      }
+    }
+  }
+
+  .el-picker__popper .el-date-range-picker__header .el-picker-panel__icon-btn {
+    color: #fff;
+  }
+  .el-picker__popper .el-date-table .in-range div {
+    background: #43516b;
+  }
+}
+</style>

+ 65 - 78
src/views/layout/economicsOperation/powerCurve/powerLinefitting/index.vue

@@ -4,6 +4,20 @@
       <div class="powerLinefitting_top">
         <el-select
           size="mini"
+          v-model="tabEvent"
+          placeholder="请选择"
+          @change="changeBtn"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
           v-model="companyVal"
           placeholder="请选择"
           @change="changeCompan"
@@ -16,51 +30,32 @@
           >
           </el-option>
         </el-select>
-        <div class="tabCut">
-          <div
-            @click="changeBtn(val.id)"
-            :class="tabEvent === val.id ? 'active' : ''"
-            v-for="val in tabOptions"
-            :key="val.id"
-          >
-            <span>{{ val.name }}</span>
-          </div>
-        </div>
-        <div class="station">
-          场站:
-          <el-select
-            size="mini"
-            v-model="stationVal"
-            placeholder="请选择"
-            clearable
-            @change="changeStation"
+
+        <el-select
+          size="mini"
+          v-model="stationVal"
+          placeholder="请选择"
+          clearable
+          @change="changeStation"
+        >
+          <el-option
+            v-for="item in stationOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
           >
-            <el-option
-              v-for="item in stationOptions"
-              :key="item.id"
-              :label="item.name"
-              :value="item.id"
-            >
-            </el-option>
-          </el-select>
-        </div>
-        <div class="station">
-          风机:
-          <el-select
-            size="mini"
-            v-model="windVal"
-            placeholder="请选择"
-            clearable
+          </el-option>
+        </el-select>
+
+        <el-select size="mini" v-model="windVal" placeholder="请选择" clearable>
+          <el-option
+            v-for="item in windsOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.nemCode"
           >
-            <el-option
-              v-for="item in windsOptions"
-              :key="item.id"
-              :label="item.name"
-              :value="item.id"
-            >
-            </el-option>
-          </el-select>
-        </div>
+          </el-option>
+        </el-select>
         <div class="but">
           <el-button round size="mini" class="buttons" @click="seachData"
             >拟合</el-button
@@ -70,7 +65,7 @@
           >
         </div>
       </div>
-      <div class="selections">
+      <!-- <div class="selections">
         <div
           class="selections_btn"
           @click="tabSelect(0)"
@@ -92,7 +87,7 @@
         >
         </div>
-      </div>
+      </div> -->
     </div>
     <div style="background: rgba(0, 0, 0, 0.4)">
       <div class="powerLinefitting_title clearfix">
@@ -139,6 +134,15 @@ import {
   getApiequipmentList,
   getApiPerformancecurvefitting,
 } from "@/api/monthlyPerformanceAnalysis";
+import {
+  GetOrganization,
+  GetStationByCompany,
+  GetwtByWp,
+  GetProjectList,
+  GetLineList,
+  GetSquareList,
+  GeWtList,
+} from "@/api/headerNav.js";
 import * as echarts from "echarts";
 import partten from "@/helper/partten.js";
 import util from "@/helper/util.js";
@@ -158,11 +162,11 @@ export default {
       powerLinefitData: [],
       tableHeader: [
         { title: "名称", code: "nemCode" },
-        { title: "风速(m/s)", code: "speed" },
+        { title: "光照(W/m²)", code: "speed" },
         { title: "保证功率(KW)", code: "ensurepower" },
         { title: "拟合功率(KW)", code: "theorypower" },
       ],
-      tabEvent: -1,
+      tabEvent: -2,
       tabOptions: [
         { id: -1, name: "风电" },
         { id: -2, name: "光伏" },
@@ -173,16 +177,9 @@ export default {
     this.getCompanyData();
   },
   watch: {
-    tabEvent(val) {
-      this.tableHeader = this.tableHeader.map((item) => {
-        if (item.code == "speed") {
-          if (val == -2) {
-            item.title = "光照(W/m²)";
-          } else {
-            item.title = "风速(m/s)";
-          }
-        }
-        return { ...item };
+    tabEvent() {
+      this.$router.push({
+        path: "/economicsOperation/powerCurve/powerLinefittingFd",
       });
     },
   },
@@ -192,20 +189,16 @@ export default {
       this.tabIndex = index;
       this.getTableData();
     },
-    changeBtn(id) {
-      this.tabEvent = id;
-      this.stationVal = "";
-      this.stationOptions = [];
-      this.windVal = "";
-      this.windsOptions = [];
-      this.getStationData();
-      //   this.getTableData();
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/powerCurve/powerLinefittingFd",
+      });
     },
     // 获取公司列表
     async getCompanyData() {
       this.companyOptions = [];
       this.pickerTimer = this.getchangeTime(new Date());
-      const datas = await getApicompanyslist();
+      const datas = await GetOrganization({ type: this.tabEvent });
       this.companyOptions = datas.data;
       this.companyVal = datas.data[0]?.id;
       this.getStationData(this.companyVal);
@@ -223,9 +216,9 @@ export default {
       this.stationOptions = [];
       let params = {
         type: this.tabEvent,
-        companyid: this.companyVal,
+        companyids: this.companyVal,
       };
-      const datas = await getApiwpByCplistlist(params);
+      const datas = await GetStationByCompany(params);
       this.stationOptions = datas.data;
       this.stationVal = datas.data[0].id;
       this.getWindData();
@@ -237,17 +230,10 @@ export default {
     // 获取风机
     async getWindData() {
       this.windsOptions = [];
-      let params = {
-        companyId: this.companyVal,
-        wpIds: this.stationVal,
-        projectIds: "",
-        lineIds: "",
-        type: 0,
-      };
-      const datas = await getApiequipmentList(params);
+      const datas = await GetwtByWp(this.stationVal);
       if (datas.data.length) {
         this.windsOptions = datas.data;
-        this.windVal = datas.data[0].id;
+        this.windVal = datas.data[0].nemCode;
       } else {
         this.windsOptions = datas.data;
         this.windVal = "";
@@ -259,9 +245,10 @@ export default {
     },
     async getTableData() {
       let params = {
-        dateType: this.tabIndex * 1 + 1,
+        wpids: this.stationVal,
         wtId: this.windVal,
         type: this.tabEvent,
+        companys: this.companyVal,
       };
       const datas = await getApiPerformancecurvefitting(params);
       console.log("time111===>", new Date().getTime());

+ 675 - 0
src/views/layout/economicsOperation/powerCurve/powerLinefitting/indexFd.vue

@@ -0,0 +1,675 @@
+<template>
+  <div class="powerLinefitting">
+    <div class="powerLinefitting_topAll">
+      <div class="powerLinefitting_top">
+        <el-select
+          size="mini"
+          v-model="tabEvent"
+          placeholder="请选择"
+          @change="changeBtn"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="companyVal"
+          placeholder="请选择"
+          @change="changeCompan"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+
+        <el-select
+          size="mini"
+          v-model="stationVal"
+          placeholder="请选择"
+          clearable
+          @change="changeStation"
+        >
+          <el-option
+            v-for="item in stationOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+
+        <el-select size="mini" v-model="windVal" placeholder="请选择" clearable>
+          <el-option
+            v-for="item in windsOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.nemCode"
+          >
+          </el-option>
+        </el-select>
+        <div class="but">
+          <el-button round size="mini" class="buttons" @click="seachData"
+            >拟合</el-button
+          >
+          <el-button round size="mini" class="buttons" @click="downXlsxFn"
+            >导出</el-button
+          >
+        </div>
+      </div>
+      <!-- <div class="selections">
+        <div
+          class="selections_btn"
+          @click="tabSelect(0)"
+          :class="{ active: tabIndex == 0 }"
+        >
+          日
+        </div>
+        <div
+          class="selections_btn"
+          @click="tabSelect(1)"
+          :class="{ active: tabIndex == 1 }"
+        >
+          月
+        </div>
+        <div
+          class="selections_btn"
+          @click="tabSelect(2)"
+          :class="{ active: tabIndex == 2 }"
+        >
+          年
+        </div>
+      </div> -->
+    </div>
+    <div style="background: rgba(0, 0, 0, 0.4)">
+      <div class="powerLinefitting_title clearfix">
+        <div class="leftContent floatLeft"><span>功率曲线拟合</span></div>
+        <div class="rightContent floatRight"></div>
+      </div>
+
+      <div class="powerLinefitting_Table">
+        <el-table
+          :data="powerLinefittingData"
+          stripe
+          size="mini"
+          height="48vh"
+          ref="fitting_table"
+          style="width: 100%"
+        >
+          <el-table-column
+            v-for="(item, index) in tableHeader"
+            :key="index"
+            sortable
+            :prop="item.code"
+            :label="item.title"
+            align="center"
+          >
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="powerLinefitting_Echarts">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        <span>功率曲线</span>
+      </div>
+      <div id="fittingid" class="fittingEchartSty"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {
+  getApicompanyslist,
+  getApiwpByCplistlist,
+  getApiequipmentList,
+  getApiPerformancecurvefitting,
+} from "@/api/monthlyPerformanceAnalysis";
+import {
+  GetOrganization,
+  GetStationByCompany,
+  GetwtByWp,
+  GetProjectList,
+  GetLineList,
+  GetSquareList,
+  GeWtList,
+} from "@/api/headerNav.js";
+import * as echarts from "echarts";
+import partten from "@/helper/partten.js";
+import util from "@/helper/util.js";
+import utils from "@/utils/downXlsx";
+export default {
+  name: "powerLinefitting",
+  data() {
+    return {
+      tabIndex: 0,
+      companyVal: "",
+      companyOptions: [],
+      stationVal: "",
+      stationOptions: [],
+      windVal: "",
+      windsOptions: [],
+      powerLinefittingData: [],
+      powerLinefitData: [],
+      tableHeader: [
+        { title: "名称", code: "nemCode" },
+        { title: "风速(m/s)", code: "speed" },
+        { title: "保证功率(KW)", code: "ensurepower" },
+        { title: "拟合功率(KW)", code: "theorypower" },
+      ],
+      tabEvent: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+    };
+  },
+  created() {
+    this.getCompanyData();
+  },
+  watch: {
+    tabEvent() {
+      this.$router.push({
+        path: "/economicsOperation/powerCurve/powerLinefitting",
+      });
+    },
+  },
+  methods: {
+    // 切换tab
+    tabSelect(index) {
+      this.tabIndex = index;
+      this.getTableData();
+    },
+    changeBtn() {
+      this.$router.push({
+        path: "/economicsOperation/powerCurve/powerLinefittingFd",
+      });
+    },
+    // 获取公司列表
+    async getCompanyData() {
+      this.companyOptions = [];
+      this.pickerTimer = this.getchangeTime(new Date());
+      const datas = await GetOrganization({ type: this.tabEvent });
+      this.companyOptions = datas.data;
+      this.companyVal = datas.data[0]?.id;
+      this.getStationData(this.companyVal);
+    },
+    changeCompan(val) {
+      this.companyVal = val;
+      this.stationOptions = [];
+      this.windsOptions = [];
+      this.stationVal = "";
+      this.windVal = "";
+      this.getStationData();
+    },
+    // 获取场站列表
+    async getStationData() {
+      this.stationOptions = [];
+      let params = {
+        type: this.tabEvent,
+        companyids: this.companyVal,
+      };
+      const datas = await GetStationByCompany(params);
+      this.stationOptions = datas.data;
+      this.stationVal = datas.data[0].id;
+      this.getWindData();
+    },
+    changeStation(val) {
+      this.stationVal = val;
+      this.getWindData();
+    },
+    // 获取风机
+    async getWindData() {
+      this.windsOptions = [];
+      const datas = await GetwtByWp(this.stationVal);
+      if (datas.data.length) {
+        this.windsOptions = datas.data;
+        this.windVal = datas.data[0].nemCode;
+      } else {
+        this.windsOptions = datas.data;
+        this.windVal = "";
+      }
+      this.seachData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        wpids: this.stationVal,
+        wtId: this.windVal,
+        type: this.tabEvent,
+        companys: this.companyVal,
+      };
+      const datas = await getApiPerformancecurvefitting(params);
+      console.log("time111===>", new Date().getTime());
+      this.changeEchartsData(datas.data.chanrt);
+      datas.data.list.forEach((item) => {
+        item.speed = item.speed.toFixed(2);
+      });
+      this.powerLinefittingData = datas.data.list;
+    },
+    // 整合echarts数据
+    changeEchartsData(datas) {
+      let xAxis = [];
+      let lenged = [];
+      let seriesOne = [];
+      let seriesTwo = [];
+      let series = [];
+      let showYx = false;
+      if (datas && datas.length > 0) {
+        showYx = true;
+        lenged = ["保证功率", "拟合功率"];
+        datas.forEach((it, index) => {
+          xAxis.push(it.speed);
+          seriesOne.push(it.ensurepower);
+          seriesTwo.push(it.theorypower);
+        });
+        let obj = {
+          name: "保证功率",
+          type: "line",
+          smooth: true,
+          lineStyle: {
+            width: 1,
+          },
+          data: seriesOne,
+        };
+        // series.push(obj)
+        let objs = {
+          name: "拟合功率",
+          type: "line",
+          smooth: true,
+          lineStyle: {
+            width: 1,
+          },
+          data: seriesTwo,
+        };
+        // series.push(objs)
+        series = [obj, objs];
+      }
+      this.getChartes(xAxis, lenged, series, showYx);
+    },
+    getChartes(xAxis, lenged, series, showY) {
+      let option = {
+        color: [
+          "#1C99FF",
+          "#FF8700",
+          "#3D54BE",
+          "#fa8c16",
+          "#1DA0D7",
+          "#DD5044",
+        ],
+        tooltip: {
+          trigger: "axis",
+          backgroundColor: "rgba(0,0,0,0.4)",
+          borderColor: partten.getColor("gray"),
+          textStyle: {
+            color: "#fff",
+            fontSize: util.vh(16),
+          },
+        },
+        legend: {
+          show: true,
+          data: lenged,
+          padding: [10, 10],
+          right: 56,
+          icon: "circle",
+          itemWidth: 6,
+          inactiveColor: partten.getColor("gray"),
+          textStyle: {
+            color: partten.getColor("grayl"),
+            fontSize: 12,
+          },
+        },
+        grid: {
+          top: 56,
+          left: 40,
+          right: 15,
+          bottom: 24,
+        },
+        xAxis: [
+          {
+            type: "category",
+            boundaryGap: false,
+            axisLabel: {
+              formatter: "{value}",
+              textStyle: {
+                color: partten.getColor("gray"),
+                fontSize: util.vh(10),
+              },
+            },
+            data: xAxis,
+          },
+        ],
+        yAxis: {
+          // show: showY,
+          type: "value",
+          name: "kWh",
+          axisLabel: {
+            formatter: "{value}",
+            fontSize: "14px",
+          },
+          boundaryGap: false,
+          //分格线
+          splitLine: {
+            show: false,
+          },
+        },
+        series: series,
+      };
+      let dom = document.getElementById("fittingid");
+      dom.removeAttribute("_echarts_instance_");
+      let myChart = echarts.init(dom);
+      myChart.clear();
+      myChart.setOption(option);
+      console.log(222222, new Date().getTime());
+      window.addEventListener("resize", function () {
+        myChart.resize();
+      });
+      console.log("time222===>", new Date().getTime());
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+    downXlsxFn() {
+      let header = [];
+      this.tableHeader.forEach((it) => {
+        header.push(it.title);
+      });
+      utils.exportExcel(
+        this.$refs["fitting_table"].$el,
+        header,
+        "功率曲线拟合"
+      );
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.powerLinefitting {
+  padding: 0 23px;
+  .powerLinefitting_topAll {
+    display: flex;
+    justify-content: space-between;
+    .powerLinefitting_top {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      margin-top: 10px;
+      margin-bottom: 10px;
+      .station {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #b3b3b3;
+        margin-right: 10px;
+        margin-left: 10px;
+      }
+      .search-input {
+        margin-left: 10px;
+        .el-input__inner {
+          width: 175px;
+        }
+        .el-input__suffix {
+          right: -50px;
+        }
+      }
+
+      .tabCut {
+        display: inline-block;
+        margin: 0 10px;
+
+        div {
+          display: inline-block;
+          width: 60px;
+          height: 27px;
+          border: 1px solid #354460;
+          text-align: center;
+          line-height: 25px;
+          cursor: pointer;
+        }
+
+        div:nth-child(1) {
+          border-radius: 13px 0px 0px 13px;
+        }
+
+        div:nth-child(2) {
+          border-radius: 0px 13px 13px 0px;
+        }
+
+        .active {
+          background-color: #0c3378;
+          color: #fff;
+        }
+      }
+
+      .but {
+        display: flex;
+        flex-direction: row;
+        align-content: center;
+        margin-left: 20px;
+        .buttons:nth-child(1) {
+          background: rgba(0, 70, 199, 0.6);
+          border: 1px solid #1f51ae;
+          border-radius: 13px;
+          color: #fff;
+          &:hover {
+            background: rgba(14, 90, 229, 0.9);
+            border-radius: 13px;
+            color: #fff;
+          }
+        }
+        .buttons:nth-child(2) {
+          background: rgba(67, 81, 107, 0.3);
+          border: 1px solid #3b4c6c;
+          border-radius: 13px;
+          font-size: 14px;
+          color: #b3b3b3;
+        }
+      }
+    }
+    .selections {
+      display: flex;
+      margin-top: 10px;
+      position: relative;
+      right: 120px;
+      .selections_btn {
+        flex: 0 0 55px;
+        text-align: center;
+        height: 33px;
+        line-height: 33px;
+        margin-right: 8px;
+        color: #fff;
+        font-size: 1.296vh;
+        background: fade(#606769, 20);
+        border: 1px solid fade(#606769, 20);
+        border-radius: 20px;
+        &:hover,
+        &.active {
+          background: fade(#0046c7, 80);
+          border: 1px solid #0046c7;
+          color: #b9b9b9;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+  .powerLinefitting_title {
+    padding-left: 10px;
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+    .floatLeft {
+      float: left;
+    }
+    .floatRight {
+      float: right;
+    }
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+  }
+  .clearfix::after {
+    content: "";
+    clear: both;
+    height: 0;
+    line-height: 0;
+    visibility: hidden;
+    display: block;
+  }
+  .clearfix {
+    zoom: 1;
+  }
+
+  .powerLinefitting_Table {
+    margin: 0 5px 5px 5px;
+    padding-bottom: 10px;
+    .el-table--mini {
+      margin: 5px;
+      .el-table__header-wrapper {
+        tr {
+          background: rgba(83, 89, 104, 0.3) !important;
+          th {
+            vertical-align: top !important;
+          }
+          .cell {
+            color: #b3b3b3;
+            font-family: MicrosoftYaHei;
+            font-size: 14px;
+          }
+        }
+      }
+      .el-table__body-wrapper {
+        tr {
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.05) !important;
+          }
+          .cell {
+            color: #d8d8d9;
+            font-family: ArialMT;
+            font-size: 13px;
+            height: 25px !important;
+          }
+        }
+      }
+    }
+    .historyBtn {
+      background: #43516b;
+      border-radius: 15px;
+      margin-top: 5px;
+      border: 1px solid #43516b;
+      span {
+        color: #fff;
+      }
+    }
+  }
+  .powerLinefitting_Echarts {
+    margin-top: 10px;
+    width: 100%;
+    background: rgba(0, 0, 0, 0.45);
+    position: relative;
+    height: 39px;
+    // border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    font-size: 16px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    color: #ffffff;
+    .chart-name {
+      display: flex;
+      align-items: center;
+      padding-left: 20px;
+      position: relative;
+      height: 39px;
+      width: 98%;
+      margin-left: 1%;
+      border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+      font-size: 16px;
+      font-family: Microsoft YaHei;
+      font-weight: 400;
+      color: #ffffff;
+      .point {
+        width: 6px;
+        height: 1px;
+        background-color: #ffffff;
+        position: absolute;
+
+        &.left {
+          left: 0;
+        }
+
+        &.right {
+          right: 0;
+        }
+
+        &.top {
+          top: -1px;
+        }
+
+        &.bottom {
+          bottom: -1px;
+        }
+      }
+    }
+    .fittingEchartSty {
+      width: 100%;
+      height: 280px;
+      background: rgba(0, 0, 0, 0.45);
+    }
+  }
+  .el-overlay {
+    .el-overlay-dialog {
+      overflow-y: hidden !important;
+      .powerLinefittinghistoryModel {
+        margin-top: 0 !important;
+        .el-dialog__body {
+          padding-top: 10px;
+        }
+      }
+      .contrastModal {
+        .el-dialog__body {
+          padding-top: 10px;
+        }
+      }
+    }
+  }
+
+  .el-picker__popper .el-date-range-picker__header .el-picker-panel__icon-btn {
+    color: #fff;
+  }
+  .el-picker__popper .el-date-table .in-range div {
+    background: #43516b;
+  }
+}
+</style>

Tiedoston diff-näkymää rajattu, sillä se on liian suuri
+ 572 - 493
src/views/layout/economicsOperation/thematicAnalysis/failure/index.vue


+ 633 - 0
src/views/layout/economicsOperation/thematicAnalysis/failure/indexFd.vue

@@ -0,0 +1,633 @@
+<template>
+  <div class="parcel-box">
+    <div class="failure-header">
+      <div class="search">
+        <div class="search-left">
+          <el-select
+            size="mini"
+            v-model="tabIndex"
+            placeholder="请选择"
+            @change="tabClick"
+          >
+            <el-option
+              v-for="item in tabOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="company"
+            placeholder="请选择"
+            @change="getHomePageData()"
+          >
+            <el-option
+              v-for="item in companyOptions"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <div class="search-input">
+            <el-date-picker
+              size="mini"
+              v-model="searchYear"
+              type="year"
+              value-format="YYYY"
+              placeholder="选择年"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="search-btns">
+          <el-button round size="mini" class="searchColor" @click="search"
+            >搜索</el-button
+          >
+        </div>
+        <!-- <el-button round size="mini">导出</el-button> -->
+      </div>
+      <div class="search-right">
+        <img class="select-back" src="@assets/img/images/select-back.png" />
+        <div class="title-select">
+          <el-select
+            v-model="selectValue"
+            placeholder="请选择"
+            @change="getHomePageData()"
+            clearable
+          >
+            <el-option
+              v-for="item in selectList"
+              :key="item.name"
+              :label="item.name"
+              :value="item.name"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </div>
+    <div class="data-bodys">
+      <div class="line clearfix">
+        <div class="leftContent left">
+          <span>{{ selectValue }}</span>
+        </div>
+        <div class="rightContent line-right"></div>
+      </div>
+      <div class="economicTable">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          size="mini"
+          stripe
+          height="50vh"
+          @row-click="rowClick"
+        >
+          <el-table-column
+            align="center"
+            prop=""
+            label="场站"
+            show-overflow-tooltip
+            sortable
+          >
+            <template v-slot="scope">
+              <span style="cursor: pointer">{{ scope.row.wpname }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            :label="val"
+            v-for="(val, index) in tableHead"
+            :key="index"
+            width="144"
+            sortable
+          >
+            <template v-slot="scope">
+              <div v-if="scope.row.wpname == ''">
+                <el-row>
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data?.current }}</span></el-col
+                  >
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data.sameperiod }}</span></el-col
+                  >
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12" style="position: relative">
+                    <div
+                      style="
+                        padding: 0 10px;
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                      "
+                    >
+                      <span style="width: 40px">{{
+                        scope.row.targetList &&
+                        (scope.row.targetList[index]?.current ||
+                        scope.row.targetList[index]?.current === 0
+                          ? scope.row.targetList[index]?.current
+                          : "--")
+                      }}</span>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          (scope.row.targetList[index]?.compare > 0 ||
+                            scope.row.targetList[index]?.compare === 0)
+                        "
+                        class="active_icon icon-arrow-up compare-lift-up"
+                      ></i>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          scope.row.targetList[index]?.compare < 0
+                        "
+                        class="active_icon icon-arrow-dpwn compare-lift-down"
+                      ></i>
+                    </div>
+                  </el-col>
+                  <el-col :span="12"
+                    ><span>{{
+                      scope.row.targetList &&
+                      (scope.row.targetList[index]?.sameperiod ||
+                      scope.row.targetList[index]?.sameperiod === 0
+                        ? scope.row.targetList[index]?.sameperiod
+                        : "--")
+                    }}</span></el-col
+                  >
+                </el-row>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="echarts" style="height: 30vh">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        {{ selectValue }}
+      </div>
+      <div>
+        <BarCharts
+          :list="barList"
+          width="97%"
+          height="32vh"
+          :top="60"
+          :pillarName="pillarName"
+          :xdate="false"
+          :showLegend="true"
+          :units="['', '']"
+        ></BarCharts>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetOrganization } from "@/api/headerNav.js";
+import BarCharts from "../../homePage/components/barCharts.vue";
+import {
+  companys,
+  gzsslList,
+  whsslList,
+  xdsslList,
+  xnsslList,
+  slsslList,
+} from "@/api/curveAnalyse";
+export default {
+  name: "failureFd",
+  components: {
+    // ChartColumnar,
+    // Panel,
+    BarCharts,
+  },
+  data() {
+    return {
+      pillarName: "",
+      list: [],
+      tabIndex: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      // barHeight: '260px',
+      barList: [],
+      tableData: [],
+      tableHead: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "六月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      company: "",
+      companyOptions: [],
+      searchYear: this.getmonthValue(),
+      selectValue: "故障损失率",
+      selectList: [
+        {
+          name: "故障损失率",
+        },
+        {
+          name: "维护损失率",
+        },
+        {
+          name: "限电损失率",
+        },
+        {
+          name: "受累损失率",
+        },
+        {
+          name: "性能损失率",
+        },
+      ],
+    };
+  },
+  watch: {},
+  filters: {},
+  computed: {},
+  created() {
+    this.initialization();
+  },
+  methods: {
+    compare(property) {
+      return (a, b) => {
+        let val1 = a[property];
+        let val2 = b[property];
+        return val1 - val2;
+      };
+    },
+    rowClick(list) {
+      if (list?.wpname) {
+        let barList = [
+          {
+            name: "本期",
+            children: [],
+            date: [],
+          },
+          {
+            name: "同期",
+            children: [],
+          },
+        ];
+        this.pillarName = list.wpname;
+        list.targetList.forEach((item) => {
+          barList[0].date.push(item.month + "月");
+          barList[0].children.push(item.current || 0);
+          barList[1].children.push(item.compare || 0);
+        });
+        this.barList = barList;
+      }
+    },
+    isNumber(val) {
+      return typeof val === "number" && !isNaN(val);
+    },
+    search() {
+      switch (this.selectValue) {
+        case "故障损失率":
+          gzsslList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            }
+          });
+          break;
+        case "维护损失率":
+          whsslList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            }
+          });
+          break;
+        case "限电损失率":
+          xdsslList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            }
+          });
+          break;
+        case "受累损失率":
+          slsslList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            }
+          });
+          break;
+        case "性能损失率":
+          xnsslList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            }
+          });
+          break;
+      }
+    },
+    getHomePageData() {
+      this.search();
+    },
+    monthChange(data) {
+      let year = new Date(data).getFullYear().toString();
+      return year;
+    },
+    getmonthValue() {
+      let year = new Date().getFullYear().toString();
+      return year;
+    },
+
+    tabClick(data) {
+      this.$router.push({
+        path: "/economicsOperation/thematicAnalysis/failure",
+      });
+    },
+    initialization() {
+      GetOrganization({ type: this.tabIndex }).then((res) => {
+        if (res.data) {
+          this.companyOptions = res.data;
+          this.company = res.data[0].id;
+          this.search();
+        }
+      });
+    },
+  },
+  mounted() {},
+  beforeUnmount() {},
+};
+</script>
+
+<style lang="less" scoped>
+.data-bodys {
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(0, 0, 0, 0.45);
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.parcel-box {
+  padding: 0 20px;
+  box-sizing: border-box;
+  .failure-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .search {
+    display: flex;
+    flex-direction: row;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    align-items: center;
+    // justify-content: space-between;
+
+    button {
+      margin-left: 10px;
+      background: rgba(67, 81, 107, 0.3);
+      border: 1px solid #354460;
+      color: #b3b3b3;
+    }
+    ::v-deep .search-left {
+      display: flex;
+      align-items: center;
+      .el-select {
+        margin-right: 10px;
+        width: 155px;
+        .el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+    }
+    .search-btns {
+      display: flex;
+      .searchColor {
+        background-color: rgba(0, 70, 199, 0.2);
+        border: 1px solid #3b4c6c;
+        color: #b3b3b3;
+        font-size: 14px;
+
+        &:hover {
+          background-color: rgba(0, 70, 199, 0.5);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+  .search-right {
+    position: relative;
+    .select-back {
+      position: absolute;
+      top: -1px;
+      left: 0;
+    }
+  }
+
+  .line {
+    padding-bottom: 5px;
+
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+    .left {
+      float: left;
+    }
+    .line-right {
+      float: right;
+    }
+  }
+
+  .echarts {
+    margin-top: 20px;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    width: 100%;
+  }
+}
+
+.clearfix::after {
+  content: "";
+  clear: both;
+  height: 0;
+  line-height: 0;
+  visibility: hidden;
+  display: block;
+}
+
+.clearfix {
+  zoom: 1;
+}
+
+/deep/ .el-input__prefix {
+  right: -15px;
+  left: unset;
+}
+
+/deep/ .el-input--prefix .el-input__inner {
+  padding-left: 20px;
+}
+
+.el-table::before {
+  height: 0;
+}
+
+.compare-lift-down {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #ff8300;
+}
+
+.compare-lift-up {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #1c99ff;
+}
+
+.chart-name {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  width: 100%;
+  height: 40px;
+  border-bottom: 1px solid rgba(106, 106, 106, 0.5);
+  font-size: 16px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #ffffff;
+}
+
+.point {
+  width: 6px;
+  height: 1px;
+  background-color: #ffffff;
+  position: absolute;
+
+  &.left {
+    left: 0;
+  }
+
+  &.right {
+    right: 0;
+  }
+
+  &.top {
+    top: -1px;
+  }
+
+  &.bottom {
+    bottom: -1px;
+  }
+}
+</style>

+ 481 - 408
src/views/layout/economicsOperation/thematicAnalysis/generation/index.vue

@@ -1,469 +1,542 @@
 <template>
-    <div class="parcel-box">
-        <div class="search">
-            <div class="left">
-                <el-select size="mini" v-model="company" placeholder="请选择" @change="search()">
-                    <el-option v-for="item in companyOptions" :key="item.id" :label="item.aname" :value="item.id">
-                    </el-option>
-                </el-select>
-                <div class="tabCut">
-                    <div @click="tabClick(val.id)" :class="tabIndex === val.id ? 'active' : ''"
-                        v-for="val in tabOptions" :key="val.id"><span>{{ val.name }}</span></div>
-                </div>
-                <div class="search-input">
-                    <el-date-picker v-model="searchYear" type="year" value-format="YYYY" placeholder="选择年"
-                        popper-class="date-select">
-                    </el-date-picker>
-                </div>
-                <el-button round size="mini" class="searchColor" @click="search">搜索</el-button>
-            </div>
-            <div class="right">
-                <img class="select-back" src="@assets/img/images/select-back.png">
-                <div class="title-select">
-                    <el-select v-model="selectValue" placeholder="请选择" @change="search()" clearable>
-                        <el-option v-for="item in selectList" :key="item.name" :label="item.name" :value="item.name">
-                        </el-option>
-                    </el-select>
-                </div>
-            </div>
-            <!-- <el-button round size="mini">导出</el-button> -->
+  <div class="parcel-box">
+    <div class="failure-header">
+      <div class="search">
+        <div class="search-left">
+          <el-select
+            size="mini"
+            v-model="tabIndex"
+            placeholder="请选择"
+            @change="tabClick"
+          >
+            <el-option
+              v-for="item in tabOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="company"
+            placeholder="请选择"
+            @change="search"
+          >
+            <el-option
+              v-for="item in companyOptions"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <div class="search-input">
+            <el-date-picker
+              size="mini"
+              v-model="searchYear"
+              type="year"
+              value-format="YYYY"
+              placeholder="选择年"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
         </div>
-        <div class="data-bodys">
-            <div class="line clearfix">
-                <div class="leftContent left"><span>{{ selectValue }}</span></div>
-                <div class="rightContent right"></div>
-            </div>
-            <div class="economicTable">
-                <el-table :data="tableData" style="width: 100%" size="mini" stripe height="50vh" @row-click="rowClick">
-                    <el-table-column align="center" prop="" label="场站" show-overflow-tooltip sortable>
-                        <template v-slot="scope">
-                            <span style="cursor: pointer;">{{ scope.row.wpname }}</span>
-                        </template>
-                    </el-table-column>
-                    <el-table-column align="center" :label="val" v-for="(val, index) in tableHead" :key="index"
-                        width="142" sortable>
-                        <template v-slot="scope">
-                            <div v-if="scope.row.wpname == ''">
-                                <el-row>
-                                    <el-col :span="12"><span>{{ scope.row.data?.current }}</span></el-col>
-                                    <el-col :span="12"><span>{{ scope.row.data.sameperiod }}</span></el-col>
-                                </el-row>
-                            </div>
-                            <div v-else>
-                                <el-row>
-                                    <el-col :span="12" style="position: relative;">
-                                        <div
-                                            style="padding: 0 10px; width: 100%; height: 100%;display: flex; flex-direction: row; align-items: center; justify-content: center;">
-                                            <span style="width: 40px">{{ scope.row.targetList&&((scope.row.targetList[index]?.current || scope.row.targetList[index]?.current===0)?scope.row.targetList[index]?.current: '--') }}</span>
-                                            <i style="position: absolute; right: 0;" v-if="(scope.row.targetList&& (scope.row.targetList[index]?.compare > 0 || scope.row.targetList[index]?.compare === 0))"
-                                                class="active_icon icon-arrow-up compare-lift-up"></i>
-                                            <i style="position: absolute; right: 0;" v-if="(scope.row.targetList&& scope.row.targetList[index]?.compare < 0)" class="active_icon icon-arrow-dpwn compare-lift-down"></i>
-                                        </div>
-
-                                    </el-col>
-                                    <el-col :span="12"><span>{{ scope.row.targetList&& ((scope.row.targetList[index]?.sameperiod || scope.row.targetList[index]?.sameperiod===0 )? scope.row.targetList[index]?.sameperiod: '--')}}</span></el-col>
-                                </el-row>
-                            </div>
-                        </template>
-                    </el-table-column>
-                </el-table>
-            </div>
+        <div class="search-btns">
+          <el-button round size="mini" class="searchColor" @click="search"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+      <div class="search-right">
+        <img class="select-back" src="@assets/img/images/select-back.png" />
+        <div class="title-select">
+          <el-select
+            v-model="selectValue"
+            placeholder="请选择"
+            @change="search"
+            clearable
+          >
+            <el-option
+              v-for="item in selectList"
+              :key="item.name"
+              :label="item.name"
+              :value="item.name"
+            >
+            </el-option>
+          </el-select>
         </div>
-        <div class="echarts" style="height:30vh;">
-            <div class="chart-name">
-                <div class="point left bottom"></div>
-                <div class="point right bottom"></div>
-                {{ selectValue }}
-            </div>
-            <div>
-                <BarCharts :list="barList" width="97%" height="32vh" :top="60" :pillarName="pillarName" :xdate="false"
-                    :showLegend="true" :units="['', '']"></BarCharts>
-            </div>
+      </div>
+    </div>
+    <div class="data-bodys">
+      <div class="line clearfix">
+        <div class="leftContent left">
+          <span>{{ selectValue }}</span>
         </div>
+        <div class="rightContent line-right"></div>
+      </div>
+      <div class="economicTable">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          size="mini"
+          stripe
+          height="50vh"
+          @row-click="rowClick"
+        >
+          <el-table-column
+            align="center"
+            prop=""
+            label="场站"
+            show-overflow-tooltip
+            sortable
+          >
+            <template v-slot="scope">
+              <span style="cursor: pointer">{{ scope.row.wpname }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            :label="val"
+            v-for="(val, index) in tableHead"
+            :key="index"
+            width="142"
+            sortable
+          >
+            <template v-slot="scope">
+              <div v-if="scope.row.wpname == ''">
+                <el-row>
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data?.current }}</span></el-col
+                  >
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data.sameperiod }}</span></el-col
+                  >
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12">
+                    <div style="white-space: nowrap; height: 100%">
+                      <span style="white-space: nowrap">{{
+                        scope.row.targetList &&
+                        (scope.row.targetList[index]?.current ||
+                        scope.row.targetList[index]?.current === 0
+                          ? scope.row.targetList[index]?.current
+                          : "--")
+                      }}</span>
+                      <i
+                        v-if="
+                          scope.row.targetList &&
+                          (scope.row.targetList[index]?.compare > 0 ||
+                            scope.row.targetList[index]?.compare === 0)
+                        "
+                        class="active_icon icon-arrow-up compare-lift-up"
+                      ></i>
+                      <i
+                        v-if="
+                          scope.row.targetList &&
+                          scope.row.targetList[index]?.compare < 0
+                        "
+                        class="active_icon icon-arrow-down compare-lift-down"
+                      ></i>
+                    </div>
+                  </el-col>
+                  <el-col :span="12"
+                    ><span>{{
+                      scope.row.targetList &&
+                      (scope.row.targetList[index]?.sameperiod ||
+                      scope.row.targetList[index]?.sameperiod === 0
+                        ? scope.row.targetList[index]?.sameperiod
+                        : "--")
+                    }}</span></el-col
+                  >
+                </el-row>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
     </div>
+    <div class="echarts" style="height: 30vh">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        {{ selectValue }}
+      </div>
+      <div>
+        <BarCharts
+          :list="barList"
+          width="97%"
+          height="32vh"
+          :top="60"
+          :pillarName="pillarName"
+          :xdate="false"
+          :showLegend="true"
+          :units="['', '']"
+        ></BarCharts>
+      </div>
+    </div>
+  </div>
 </template>
-  
+
 <script>
-// import Panel from "@/components/curveAnalyse/panel.vue";
-// import ChartColumnar from '@/components/curveAnalyse/multiple-bar-chart.vue'
-import BarCharts from '../../../economicsOperation/homePage/components/barCharts.vue'
-import { companys, fdlList, zhcydlList } from '@/api/curveAnalyse'
+import { GetOrganization } from "@/api/headerNav.js";
+import BarCharts from "../../homePage/components/barCharts.vue";
+import { companys, fdlList, zhcydlList } from "@/api/curveAnalyse";
 export default {
-    name: 'curveAnalyse',
-    components: {
-        // ChartColumnar,
-        // Panel,
-        BarCharts
+  name: "generationGf",
+  components: {
+    // ChartColumnar,
+    // Panel,
+    BarCharts,
+  },
+  data() {
+    return {
+      pillarName: "",
+
+      list: [],
+
+      tabIndex: -2,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      // barHeight: '260px',
+      barList: [],
+      tableData: [],
+      tableHead: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "六月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      company: "",
+      companyOptions: [],
+      searchYear: this.getmonthValue(),
+      selectList: [
+        {
+          name: "发电量分析",
+        },
+        {
+          name: "综合厂用电量",
+        },
+      ],
+      selectValue: "发电量分析",
+    };
+  },
+  watch: {},
+  filters: {},
+  computed: {},
+  created() {
+    this.initialization();
+  },
+  methods: {
+    compare(property) {
+      return (a, b) => {
+        let val1 = a[property];
+        let val2 = b[property];
+        return val1 - val2;
+      };
+    },
+    rowClick(list) {
+      if (list?.wpname) {
+        let barList = [
+          {
+            name: "本期",
+            children: [],
+            date: [],
+          },
+          {
+            name: "同期",
+            children: [],
+          },
+        ];
+        this.pillarName = list.wpname;
+        list.targetList.forEach((item) => {
+          barList[0].date.push(item.month + "月");
+          barList[0].children.push(item.current || 0);
+          barList[1].children.push(item.compare || 0);
+        });
+        this.barList = barList;
+      }
+    },
+    isNumber(val) {
+      return typeof val === "number" && !isNaN(val);
     },
-    data() {
-        return {
-            pillarName: '',
-            // echartsData: [],
-            // tableName: "",
-            list: [],
-            // DayPower: {
-            //     // 图表所用单位
-            //     units: [""],
-            //     value: [
-            //         {
-            //             title: "",
-            //             yAxisIndex: 0, // 使用单位
-            //             value: [],
-            //         },
-            //     ],
-            // },
-            // BarChartsList: [],
-            tabIndex: -1,
-            tabOptions: [
-                { id: -1, name: "风电" },
-                { id: -2, name: "光伏" },
-            ],
-            // barHeight: '260px',
-            barList: [],
-            tableData: [],
-            tableHead: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
-            company: "",
-            companyOptions: [],
-            searchYear: this.getmonthValue(),
-            selectList: [
+    search() {
+      switch (this.selectValue) {
+        case "发电量分析":
+          fdlList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data.length) {
+              let arr = [
                 {
-                    name: '发电量分析'
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
                 },
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            } else {
+              this.barList = [];
+            }
+          });
+          break;
+
+        case "综合厂用电量":
+          zhcydlList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data.length) {
+              let arr = [
                 {
-                    name: '综合厂用电量'
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
                 },
-            ],
-            selectValue: '发电量分析',
-        }
+              ];
+              this.tableData = [...arr, ...res.data];
+              this.rowClick(res.data[res.data.length - 1]);
+            } else {
+              this.barList = [];
+            }
+          });
+          break;
+      }
     },
-    watch: {},
-    filters: {},
-    computed: {},
-    created() {
-        this.initialization();
+    monthChange(data) {
+      let year = new Date(data).getFullYear().toString();
+      return year;
+    },
+    getmonthValue() {
+      let year = new Date().getFullYear().toString();
+      return year;
     },
-    methods: {
-        compare(property) {
-            return (a, b) => {
-                let val1 = a[property];
-                let val2 = b[property];
-                return val1 - val2;
-            };
-        },
-        rowClick(list) {
-            if (list?.wpname) {
-                let barList = [
-                    {
-                        name: '本期',
-                        children: [],
-                        date: [],
-                    },
-                    {
-                        name: '同期',
-                        children: [],
-                    },
-                ]
-                this.pillarName = list.wpname
-                list.targetList.forEach((item) => {
-                    barList[0].date.push(item.month + '月')
-                    barList[0].children.push(item.current || 0)
-                    barList[1].children.push(item.compare || 0)
-                })
-                this.barList = barList
-            }
-        },
-        isNumber(val) {
-            return typeof val === "number" && !isNaN(val);
-        },
-        search() {
-            switch (this.selectValue) {
-                case '发电量分析':
-                fdlList({
-                companys: this.company,
-                type: this.tabIndex,
-                year: this.monthChange(this.searchYear)
-            }).then(res => {
-                if (res.data) {
-                    let arr = [
-                            {
-                            "wpname": "",
-                            "data": {
-                                "wpname": "期次",
-                                "current": "本期",
-                                "sameperiod": "同期"
-                            }
-                        },
-                    ]
-                    this.tableData = [...arr, ...res.data]
-                    this.rowClick(res.data[res.data.length-1])
-                }
-            })
-                    break;
-            
-                    case '综合厂用电量':
-                    zhcydlList({
-                companys: this.company,
-                type: this.tabIndex,
-                year: this.monthChange(this.searchYear)
-            }).then(res => {
-                if (res.data) {
-                    let arr = [
-                            {
-                            "wpname": "",
-                            "data": {
-                                "wpname": "期次",
-                                "current": "本期",
-                                "sameperiod": "同期"
-                            }
-                        },
-                    ]
-                    this.tableData = [...arr, ...res.data]
-                    this.rowClick(res.data[res.data.length-1])
-                }
-            })
-                    break
-            }
-
-            
-        },
-        monthChange(data) {
-            let year = new Date(data).getFullYear().toString();
-            return year;
-        },
-        getmonthValue() {
-            let year = new Date().getFullYear().toString();
-            return year;
-        },
 
-        tabClick(data) {
-            this.tabIndex = data
-            this.search()
-        },
-        initialization() {
-            companys().then(res => {
-                if (res.data) {
-                    this.companyOptions = res.data
-                    this.company = res.data[0].id
-                    this.search()
-                }
-            })
-        },
+    tabClick(data) {
+      this.$router.push({
+        path: "/economicsOperation/thematicAnalysis/generationFd",
+      });
+    },
+    initialization() {
+      GetOrganization({ type: this.tabIndex }).then((res) => {
+        if (res.data) {
+          this.companyOptions = res.data;
+          this.company = res.data[0].id;
+          this.search();
+        }
+      });
     },
-    mounted() { },
-    beforeUnmount() { },
+  },
+  mounted() {},
+  beforeUnmount() {},
 };
 </script>
-  
+
 <style lang="less" scoped>
 .data-bodys {
-    display: flex;
-    flex-direction: column;
-    background-color: rgba(0, 0, 0, 0.45);
-    border-radius: 5px;
-    padding: 5px;
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(0, 0, 0, 0.45);
+  border-radius: 5px;
+  padding: 5px;
 }
 
 .parcel-box {
-    padding: 0 20px;
-    box-sizing: border-box;
-
-    .economicTable {}
+  padding: 0 20px;
+  box-sizing: border-box;
 
-    .line {
-        padding-bottom: 5px;
-        .leftContent {
-            width: 242px;
-            height: 41px;
-            line-height: 41px;
-            background: url("../../../../../assets/imgs/title_left_bg.png");
-
-            span {
-                font-size: 16px;
-                font-family: Microsoft YaHei;
-                font-weight: 400;
-                color: #FFFFFF;
-                margin-left: 25px;
-            }
-        }
+  .failure-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .search {
+    display: flex;
+    flex-direction: row;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    align-items: center;
+    // justify-content: space-between;
 
-        .rightContent {
-            width: 212px;
-            height: 28px;
-            margin-top: 13px;
-            background: url("../../../../../assets/imgs/title_right_bg.png");
-        }
+    button {
+      margin-left: 10px;
+      background: rgba(67, 81, 107, 0.3);
+      border: 1px solid #354460;
+      color: #b3b3b3;
     }
-
-    .search {
-        display: flex;
-        flex-direction: row;
-        padding-top: 10px;
-        align-items: center;
-        justify-content: space-between;
-
-        .left {
-            display: flex;
-            flex-direction: row;
-            align-items: center;
-        }
-
-        .right {
-            position: relative;
-
-            .select-back {
-                position: absolute;
-                right: 5px;
-                top: 0px;
-                z-index: 0;
-            }
-
-            .title-select {
-                z-index: 2;
-            }
-        }
-
-        .tabCut {
-            display: inline-block;
-            margin: 0 20px;
-
-            div {
-                display: inline-block;
-                width: 60px;
-                height: 27px;
-                border: 1px solid #354460;
-                text-align: center;
-                line-height: 25px;
-                cursor: pointer;
-            }
-
-            div:nth-child(1) {
-                border-radius: 13px 0px 0px 13px;
-            }
-
-            div:nth-child(2) {
-                border-radius: 0px 13px 13px 0px;
-            }
-
-            .active {
-                background-color: #0C3378;
-                color: #fff;
-            }
-        }
-
-        button {
-            margin-left: 10px;
-            background: rgba(67, 81, 107, 0.3);
-            border: 1px solid #354460;
-            color: #B3B3B3;
+    ::v-deep .search-left {
+      display: flex;
+      align-items: center;
+      .el-select {
+        margin-right: 10px;
+        width: 155px;
+        .el-input .el-input__inner {
+          width: 150px;
         }
-
-        .searchColor {
-            background-color: rgba(0, 70, 199, 0.2);
-            border: 1px solid #3B4C6C;
-            color: #B3B3B3;
-            font-size: 14px;
-
-            &:hover {
-                background-color: rgba(0, 70, 199, .5);
-                color: #ffffff;
-            }
+      }
+    }
+    .search-btns {
+      display: flex;
+      .searchColor {
+        background-color: rgba(0, 70, 199, 0.2);
+        border: 1px solid #3b4c6c;
+        color: #b3b3b3;
+        font-size: 14px;
+
+        &:hover {
+          background-color: rgba(0, 70, 199, 0.5);
+          color: #ffffff;
         }
+      }
+    }
+  }
+  .search-right {
+    position: relative;
+    .select-back {
+      position: absolute;
+      top: -1px;
+      left: 0;
+    }
+  }
+
+  .line {
+    padding-bottom: 5px;
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
     }
 
-    .echarts {
-        margin-top: 20px;
-        background-color: rgba(0, 0, 0, 0.45);
-        border-radius: 5px;
-        width: 100%;
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
     }
+    .left {
+      float: left;
+    }
+    .line-right {
+      float: right;
+    }
+  }
+
+  .echarts {
+    margin-top: 20px;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    width: 100%;
+  }
 }
 
 .clearfix::after {
-    content: "";
-    clear: both;
-    height: 0;
-    line-height: 0;
-    visibility: hidden;
-    display: block;
+  content: "";
+  clear: both;
+  height: 0;
+  line-height: 0;
+  visibility: hidden;
+  display: block;
 }
 
 .clearfix {
-    zoom: 1;
-}
-
-.left {
-    float: left;
-}
-
-.right {
-    float: right;
+  zoom: 1;
 }
 
 /deep/ .el-input__prefix {
-    right: -15px;
-    left: unset;
+  right: -15px;
+  left: unset;
 }
 
 /deep/ .el-input--prefix .el-input__inner {
-    padding-left: 20px;
+  padding-left: 20px;
 }
 
 .el-table::before {
-    height: 0;
+  height: 0;
 }
 
 .compare-lift-down {
-    margin-left: 7px;
-    font-size: 14px;
-    font-family: Arial;
-    font-weight: 400;
-    color: #FF8300;
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #ff8300;
 }
 
 .compare-lift-up {
-    margin-left: 7px;
-    font-size: 14px;
-    font-family: Arial;
-    font-weight: 400;
-    color: #1C99FF;
+  margin-left: 3px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #1c99ff;
 }
 
 .chart-name {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: relative;
-    width: 100%;
-    height: 40px;
-    border-bottom: 1px solid rgba(106, 106, 106, .5);
-    font-size: 16px;
-    font-family: Microsoft YaHei;
-    font-weight: 400;
-    color: #FFFFFF;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  width: 100%;
+  height: 40px;
+  border-bottom: 1px solid rgba(106, 106, 106, 0.5);
+  font-size: 16px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #ffffff;
 }
 
 .point {
-    width: 6px;
-    height: 1px;
-    background-color: #ffffff;
-    position: absolute;
-
-    &.left {
-        left: 0;
-    }
-
-    &.right {
-        right: 0;
-    }
-
-    &.top {
-        top: -1px;
-    }
-
-    &.bottom {
-        bottom: -1px;
-    }
+  width: 6px;
+  height: 1px;
+  background-color: #ffffff;
+  position: absolute;
+
+  &.left {
+    left: 0;
+  }
+
+  &.right {
+    right: 0;
+  }
+
+  &.top {
+    top: -1px;
+  }
+
+  &.bottom {
+    bottom: -1px;
+  }
 }
 </style>
-  
-  

+ 544 - 0
src/views/layout/economicsOperation/thematicAnalysis/generation/indexFd.vue

@@ -0,0 +1,544 @@
+<template>
+  <div class="parcel-box">
+    <div class="failure-header">
+      <div class="search">
+        <div class="search-left">
+          <el-select
+            size="mini"
+            v-model="tabIndex"
+            placeholder="请选择"
+            @change="tabClick"
+          >
+            <el-option
+              v-for="item in tabOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <el-select
+            size="mini"
+            v-model="company"
+            placeholder="请选择"
+            @change="search"
+          >
+            <el-option
+              v-for="item in companyOptions"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+          <div class="search-input">
+            <el-date-picker
+              size="mini"
+              v-model="searchYear"
+              type="year"
+              value-format="YYYY"
+              placeholder="选择年"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+          </div>
+        </div>
+        <div class="search-btns">
+          <el-button round size="mini" class="searchColor" @click="search"
+            >搜索</el-button
+          >
+        </div>
+      </div>
+      <div class="search-right">
+        <img class="select-back" src="@assets/img/images/select-back.png" />
+        <div class="title-select">
+          <el-select
+            v-model="selectValue"
+            placeholder="请选择"
+            @change="search"
+            clearable
+          >
+            <el-option
+              v-for="item in selectList"
+              :key="item.name"
+              :label="item.name"
+              :value="item.name"
+            >
+            </el-option>
+          </el-select>
+        </div>
+      </div>
+    </div>
+    <div class="data-bodys">
+      <div class="line clearfix">
+        <div class="leftContent left">
+          <span>{{ selectValue }}</span>
+        </div>
+        <div class="rightContent line-right"></div>
+      </div>
+      <div class="economicTable">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          size="mini"
+          stripe
+          height="50vh"
+          @row-click="rowClick"
+        >
+          <el-table-column
+            align="center"
+            prop=""
+            label="场站"
+            show-overflow-tooltip
+            sortable
+          >
+            <template v-slot="scope">
+              <span style="cursor: pointer">{{ scope.row.wpname }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            :label="val"
+            v-for="(val, index) in tableHead"
+            :key="index"
+            width="142"
+            sortable
+          >
+            <template v-slot="scope">
+              <div v-if="scope.row.wpname == ''">
+                <el-row>
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data?.current }}</span></el-col
+                  >
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data.sameperiod }}</span></el-col
+                  >
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12">
+                    <div style="white-space: nowrap; height: 100%">
+                      <span style="white-space: nowrap">{{
+                        scope.row.targetList &&
+                        (scope.row.targetList[index]?.current ||
+                        scope.row.targetList[index]?.current === 0
+                          ? scope.row.targetList[index]?.current
+                          : "--")
+                      }}</span>
+                      <i
+                        v-if="
+                          scope.row.targetList &&
+                          (scope.row.targetList[index]?.compare > 0 ||
+                            scope.row.targetList[index]?.compare === 0)
+                        "
+                        class="active_icon icon-arrow-up compare-lift-up"
+                      ></i>
+                      <i
+                        v-if="
+                          scope.row.targetList &&
+                          scope.row.targetList[index]?.compare < 0
+                        "
+                        class="active_icon icon-arrow-down compare-lift-down"
+                      ></i>
+                    </div>
+                  </el-col>
+                  <el-col :span="12"
+                    ><span>{{
+                      scope.row.targetList &&
+                      (scope.row.targetList[index]?.sameperiod ||
+                      scope.row.targetList[index]?.sameperiod === 0
+                        ? scope.row.targetList[index]?.sameperiod
+                        : "--")
+                    }}</span></el-col
+                  >
+                </el-row>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="echarts" style="height: 30vh">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        {{ selectValue }}
+      </div>
+      <div>
+        <BarCharts
+          :list="barList"
+          width="97%"
+          height="32vh"
+          :top="60"
+          :pillarName="pillarName"
+          :xdate="false"
+          :showLegend="true"
+          :units="['', '']"
+        ></BarCharts>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { GetOrganization } from "@/api/headerNav.js";
+import BarCharts from "../../homePage/components/barCharts.vue";
+import { companys, fdlList, zhcydlList } from "@/api/curveAnalyse";
+export default {
+  name: "curveAnalyse",
+  components: {
+    // ChartColumnar,
+    // Panel,
+    BarCharts,
+  },
+  data() {
+    return {
+      pillarName: "",
+
+      list: [],
+
+      tabIndex: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      // barHeight: '260px',
+      barList: [],
+      tableData: [],
+      tableHead: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "六月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      company: "",
+      companyOptions: [],
+      searchYear: this.getmonthValue(),
+      selectList: [
+        {
+          name: "发电量分析",
+        },
+        {
+          name: "综合厂用电量",
+        },
+      ],
+      selectValue: "发电量分析",
+    };
+  },
+  watch: {},
+  filters: {},
+  computed: {},
+  created() {
+    this.initialization();
+  },
+  methods: {
+    compare(property) {
+      return (a, b) => {
+        let val1 = a[property];
+        let val2 = b[property];
+        return val1 - val2;
+      };
+    },
+    rowClick(list) {
+      if (list?.wpname) {
+        let barList = [
+          {
+            name: "本期",
+            children: [],
+            date: [],
+          },
+          {
+            name: "同期",
+            children: [],
+          },
+        ];
+        this.pillarName = list.wpname;
+        list.targetList.forEach((item) => {
+          barList[0].date.push(item.month + "月");
+          barList[0].children.push(item.current || 0);
+          barList[1].children.push(item.compare || 0);
+        });
+        this.barList = barList;
+      }
+    },
+    isNumber(val) {
+      return typeof val === "number" && !isNaN(val);
+    },
+    search() {
+      switch (this.selectValue) {
+        case "发电量分析":
+          fdlList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data.length) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+
+              this.rowClick(res.data[res.data.length - 1]);
+            } else {
+              this.rowClick([]);
+            }
+          });
+          break;
+
+        case "综合厂用电量":
+          zhcydlList({
+            companys: this.company,
+            type: this.tabIndex,
+            year: this.monthChange(this.searchYear),
+          }).then((res) => {
+            if (res.data.length) {
+              let arr = [
+                {
+                  wpname: "",
+                  data: {
+                    wpname: "期次",
+                    current: "本期",
+                    sameperiod: "同期",
+                  },
+                },
+              ];
+              this.tableData = [...arr, ...res.data];
+
+              this.rowClick(res.data[res.data.length - 1]);
+            } else {
+              this.barList = [];
+            }
+          });
+          break;
+      }
+    },
+    monthChange(data) {
+      let year = new Date(data).getFullYear().toString();
+      return year;
+    },
+    getmonthValue() {
+      let year = new Date().getFullYear().toString();
+      return year;
+    },
+
+    tabClick(data) {
+      this.$router.push({
+        path: "/economicsOperation/thematicAnalysis/generation",
+      });
+    },
+    initialization() {
+      GetOrganization({ type: this.tabIndex }).then((res) => {
+        if (res.data) {
+          this.companyOptions = res.data;
+          this.company = res.data[0].id;
+          this.search();
+        }
+      });
+    },
+  },
+  mounted() {},
+  beforeUnmount() {},
+};
+</script>
+
+<style lang="less" scoped>
+.data-bodys {
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(0, 0, 0, 0.45);
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.parcel-box {
+  padding: 0 20px;
+  box-sizing: border-box;
+
+  .failure-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .search {
+    display: flex;
+    flex-direction: row;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    align-items: center;
+    // justify-content: space-between;
+
+    button {
+      margin-left: 10px;
+      background: rgba(67, 81, 107, 0.3);
+      border: 1px solid #354460;
+      color: #b3b3b3;
+    }
+    ::v-deep .search-left {
+      display: flex;
+      align-items: center;
+      .el-select {
+        margin-right: 10px;
+        width: 155px;
+        .el-input .el-input__inner {
+          width: 150px;
+        }
+      }
+    }
+    .search-btns {
+      display: flex;
+      .searchColor {
+        background-color: rgba(0, 70, 199, 0.2);
+        border: 1px solid #3b4c6c;
+        color: #b3b3b3;
+        font-size: 14px;
+
+        &:hover {
+          background-color: rgba(0, 70, 199, 0.5);
+          color: #ffffff;
+        }
+      }
+    }
+  }
+  .search-right {
+    position: relative;
+    .select-back {
+      position: absolute;
+      top: -1px;
+      left: 0;
+    }
+  }
+
+  .line {
+    padding-bottom: 5px;
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+    .left {
+      float: left;
+    }
+    .line-right {
+      float: right;
+    }
+  }
+
+  .echarts {
+    margin-top: 20px;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    width: 100%;
+  }
+}
+
+.clearfix::after {
+  content: "";
+  clear: both;
+  height: 0;
+  line-height: 0;
+  visibility: hidden;
+  display: block;
+}
+
+.clearfix {
+  zoom: 1;
+}
+
+/deep/ .el-input__prefix {
+  right: -15px;
+  left: unset;
+}
+
+/deep/ .el-input--prefix .el-input__inner {
+  padding-left: 20px;
+}
+
+.el-table::before {
+  height: 0;
+}
+
+.compare-lift-down {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #ff8300;
+}
+
+.compare-lift-up {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #1c99ff;
+}
+
+.chart-name {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  width: 100%;
+  height: 40px;
+  border-bottom: 1px solid rgba(106, 106, 106, 0.5);
+  font-size: 16px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #ffffff;
+}
+
+.point {
+  width: 6px;
+  height: 1px;
+  background-color: #ffffff;
+  position: absolute;
+
+  &.left {
+    left: 0;
+  }
+
+  &.right {
+    right: 0;
+  }
+
+  &.top {
+    top: -1px;
+  }
+
+  &.bottom {
+    bottom: -1px;
+  }
+}
+</style>

+ 420 - 375
src/views/layout/economicsOperation/thematicAnalysis/windEnergy/index.vue

@@ -1,439 +1,484 @@
 <template>
-    <div class="parcel-box">
-        <div class="search">
-            <div class="left">
-                <el-select size="mini" v-model="company" placeholder="请选择" @change="getHomePageData()">
-                    <el-option v-for="item in companyOptions" :key="item.id" :label="item.aname" :value="item.id">
-                    </el-option>
-                </el-select>
-                <div class="tabCut">
-                    <div @click="tabClick(val.id)" :class="tabIndex === val.id ? 'active' : ''"
-                        v-for="val in tabOptions" :key="val.id"><span>{{ val.name }}</span></div>
-                </div>
-                <div class="search-input">
-                    <el-date-picker v-model="searchYear" type="year" value-format="YYYY" placeholder="选择年"
-                        popper-class="date-select">
-                    </el-date-picker>
-                </div>
-                <el-button round size="mini" class="searchColor" @click="search">搜索</el-button>
-            </div>
-            <!-- <el-button round size="mini">导出</el-button> -->
+  <div class="parcel-box">
+    <div class="search">
+      <div class="search-left">
+        <el-select
+          size="mini"
+          v-model="tabIndex"
+          placeholder="请选择"
+          @change="tabClick"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="company"
+          placeholder="请选择"
+          @change="getHomePageData()"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <div class="search-input">
+          <el-date-picker
+            size="mini"
+            v-model="searchYear"
+            type="year"
+            value-format="YYYY"
+            placeholder="选择年"
+            popper-class="date-select"
+          >
+          </el-date-picker>
         </div>
-        <div class="data-bodys">
-            <div class="line clearfix">
-                <div class="leftContent left"><span>{{ tabIndex == -1 ? "风能利用率" : "光能利用率" }}</span></div>
-                <div class="rightContent right"></div>
-            </div>
-            <div class="economicTable">
-                <el-table :data="tableData" style="width: 100%" size="mini" stripe height="50vh" @row-click="rowClick">
-                    <el-table-column align="center" prop="" label="场站" show-overflow-tooltip sortable>
-                        <template v-slot="scope">
-                            <span style="cursor: pointer;">{{ scope.row.wpname }}</span>
-                        </template>
-                    </el-table-column>
-                    <el-table-column align="center" :label="val" v-for="(val, index) in tableHead" :key="index"
-                        width="144" sortable>
-                        <template v-slot="scope">
-                            <div v-if="scope.row.wpname == ''">
-                                <el-row>
-                                    <el-col :span="12"><span>{{ scope.row.data?.current }}</span></el-col>
-                                    <el-col :span="12"><span>{{ scope.row.data.sameperiod }}</span></el-col>
-                                </el-row>
-                            </div>
-                            <div v-else>
-                                <el-row>
-                                    <el-col :span="12" style="position: relative;">
-                                        <div
-                                            style="padding: 0 10px; width: 100%; height: 100%;display: flex; flex-direction: row; align-items: center; justify-content: center;">
-                                            <span style="width: 40px">{{
-                                                    scope.row.targetList && ((scope.row.targetList[index]?.current ||
-                                                        scope.row.targetList[index]?.current === 0) ?
-                                                        scope.row.targetList[index]?.current :
-                                                        '--')
-                                            }}</span>
-                                            <i style="position: absolute; right: 0; top: 4px;"
-                                                v-if="(scope.row.targetList && (scope.row.targetList[index]?.compare > 0 || scope.row.targetList[index]?.compare === 0))"
-                                                class="active_icon icon-arrow-up compare-lift-up"></i>
-                                            <i style="position: absolute; right: 0; top: 4px;"
-                                                v-if="(scope.row.targetList && scope.row.targetList[index]?.compare < 0)"
-                                                class="active_icon icon-arrow-dpwn compare-lift-down"></i>
-                                        </div>
-
-                                    </el-col>
-                                    <el-col :span="12"><span>{{ scope.row.targetList &&
-                                            ((scope.row.targetList[index]?.sameperiod ||
-                                                scope.row.targetList[index]?.sameperiod === 0) ?
-                                                scope.row.targetList[index]?.sameperiod : '--')
-                                    }}</span></el-col>
-                                </el-row>
-                            </div>
-                        </template>
-                    </el-table-column>
-                </el-table>
-            </div>
-        </div>
-        <div class="echarts" style="height:30vh;">
-            <div class="chart-name">
-                <div class="point left bottom"></div>
-                <div class="point right bottom"></div>
-              {{ tabIndex == -1 ? "风能利用率" : "光能利用率" }}
-            </div>
-            <div style="margin-top: 10px;">
-                <BarCharts :list="barList" width="97%" height="32vh" :top="60" :pillarName="pillarName" :xdate="false"
-                    :showLegend="true" :units="['', '']"></BarCharts>
-            </div>
+      </div>
+      <div class="search-btns">
+        <el-button round size="mini" class="searchColor" @click="search"
+          >搜索</el-button
+        >
+      </div>
+      <!-- <el-button round size="mini">导出</el-button> -->
+    </div>
+    <div class="data-bodys">
+      <div class="line clearfix">
+        <div class="leftContent left">
+          <span>风能利用率</span>
         </div>
+        <div class="rightContent right"></div>
+      </div>
+      <div class="economicTable">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          size="mini"
+          stripe
+          height="50vh"
+          @row-click="rowClick"
+        >
+          <el-table-column
+            align="center"
+            prop=""
+            label="场站"
+            show-overflow-tooltip
+            sortable
+          >
+            <template v-slot="scope">
+              <span style="cursor: pointer">{{ scope.row.wpname }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            :label="val"
+            v-for="(val, index) in tableHead"
+            :key="index"
+            width="144"
+            sortable
+          >
+            <template v-slot="scope">
+              <div v-if="scope.row.wpname == ''">
+                <el-row>
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data?.current }}</span></el-col
+                  >
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data.sameperiod }}</span></el-col
+                  >
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12" style="position: relative">
+                    <div
+                      style="
+                        padding: 0 10px;
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                      "
+                    >
+                      <span style="width: 40px">{{
+                        scope.row.targetList &&
+                        (scope.row.targetList[index]?.current ||
+                        scope.row.targetList[index]?.current === 0
+                          ? scope.row.targetList[index]?.current
+                          : "--")
+                      }}</span>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          (scope.row.targetList[index]?.compare > 0 ||
+                            scope.row.targetList[index]?.compare === 0)
+                        "
+                        class="active_icon icon-arrow-up compare-lift-up"
+                      ></i>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          scope.row.targetList[index]?.compare < 0
+                        "
+                        class="active_icon icon-arrow-dpwn compare-lift-down"
+                      ></i>
+                    </div>
+                  </el-col>
+                  <el-col :span="12"
+                    ><span>{{
+                      scope.row.targetList &&
+                      (scope.row.targetList[index]?.sameperiod ||
+                      scope.row.targetList[index]?.sameperiod === 0
+                        ? scope.row.targetList[index]?.sameperiod
+                        : "--")
+                    }}</span></el-col
+                  >
+                </el-row>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="echarts" style="height: 30vh">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        风能利用率
+      </div>
+      <div style="margin-top: 10px">
+        <BarCharts
+          :list="barList"
+          width="97%"
+          height="32vh"
+          :top="60"
+          :pillarName="pillarName"
+          :xdate="false"
+          :showLegend="true"
+          :units="['', '']"
+        ></BarCharts>
+      </div>
     </div>
+  </div>
 </template>
-  
+
 <script>
-// import Panel from "@/components/curveAnalyse/panel.vue";
-// import ChartColumnar from '@/components/curveAnalyse/multiple-bar-chart.vue'
-import BarCharts from '../../../economicsOperation/homePage/components/barCharts.vue'
-// import { companys, fnlylList, gzsslList, whsslList, xdsslList, xnsslList, slsslList } from '@/api/curveAnalyse'
-import { companys, fnlylList } from '@/api/curveAnalyse'
+import { GetOrganization } from "@/api/headerNav.js";
+import BarCharts from "../../../economicsOperation/homePage/components/barCharts.vue";
+import { companys, fnlylList } from "@/api/curveAnalyse";
 export default {
-    name: 'curveAnalyse',
-    components: {
-        // ChartColumnar,
-        // Panel,
-        BarCharts
+  name: "curveAnalyse",
+  components: {
+    BarCharts,
+  },
+  data() {
+    return {
+      pillarName: "",
+
+      list: [],
+      tabIndex: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      barList: [],
+      tableData: [],
+      tableHead: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "六月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      company: "",
+      companyOptions: [],
+      searchYear: this.getmonthValue(),
+    };
+  },
+  watch: {},
+  filters: {},
+  computed: {},
+  created() {
+    this.initialization();
+  },
+  methods: {
+    compare(property) {
+      return (a, b) => {
+        let val1 = a[property];
+        let val2 = b[property];
+        return val1 - val2;
+      };
+    },
+    rowClick(list) {
+      if (list?.wpname) {
+        let barList = [
+          {
+            name: "本期",
+            children: [],
+            date: [],
+          },
+          {
+            name: "同期",
+            children: [],
+          },
+        ];
+        this.pillarName = list.wpname;
+        list.targetList.forEach((item) => {
+          barList[0].date.push(item.month + "月");
+          barList[0].children.push(item.current || 0);
+          barList[1].children.push(item.compare || 0);
+        });
+        this.barList = barList;
+      }
     },
-    data() {
-        return {
-            pillarName: '',
-            // echartsData: [],
-            // tableName: "",
-            list: [],
-            // DayPower: {
-            //     // 图表所用单位
-            //     units: [""],
-            //     value: [
-            //         {
-            //             title: "",
-            //             yAxisIndex: 0, // 使用单位
-            //             value: [],
-            //         },
-            //     ],
-            // },
-            // BarChartsList: [],
-            tabIndex: -1,
-            tabOptions: [
-                { id: -1, name: "风电" },
-                { id: -2, name: "光伏" },
-            ],
-            // barHeight: '260px',
-            barList: [],
-            tableData: [],
-            tableHead: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
-            company: "",
-            companyOptions: [],
-            searchYear: this.getmonthValue(),
+    // isNumber(val) {
+    //     return typeof val === "number" && !isNaN(val);
+    // },
+    search() {
+      fnlylList({
+        companys: this.company,
+        type: this.tabIndex,
+        year: this.monthChange(this.searchYear),
+      }).then((res) => {
+        if (res.data) {
+          let arr = [
+            {
+              wpname: "",
+              data: {
+                wpname: "期次",
+                current: "本期",
+                sameperiod: "同期",
+              },
+            },
+          ];
+          this.tableData = [...arr, ...res.data];
+          this.rowClick(res.data[res.data.length - 1]);
         }
+      });
+    },
+    getHomePageData() {
+      this.search();
     },
-    watch: {},
-    filters: {},
-    computed: {},
-    created() {
-        this.initialization();
+    monthChange(data) {
+      let year = new Date(data).getFullYear().toString();
+      return year;
+    },
+    getmonthValue() {
+      let year = new Date().getFullYear().toString();
+      return year;
     },
-    methods: {
-        compare(property) {
-            return (a, b) => {
-                let val1 = a[property];
-                let val2 = b[property];
-                return val1 - val2;
-            };
-        },
-        rowClick(list) {
-            if (list?.wpname) {
-                let barList = [
-                    {
-                        name: '本期',
-                        children: [],
-                        date: [],
-                    },
-                    {
-                        name: '同期',
-                        children: [],
-                    },
-                ]
-                this.pillarName = list.wpname
-                list.targetList.forEach((item) => {
-                    barList[0].date.push(item.month + '月')
-                    barList[0].children.push(item.current || 0)
-                    barList[1].children.push(item.compare || 0)
-                })
-                this.barList = barList
-            }
-        },
-        // isNumber(val) {
-        //     return typeof val === "number" && !isNaN(val);
-        // },
-        search() {
-            fnlylList({
-                companys: this.company,
-                type: this.tabIndex,
-                year: this.monthChange(this.searchYear)
-            }).then(res => {
-                if (res.data) {
-                    let arr = [
-                        {
-                            "wpname": "",
-                            "data": {
-                                "wpname": "期次",
-                                "current": "本期",
-                                "sameperiod": "同期"
-                            }
-                        },
-                    ]
-                    this.tableData = [...arr, ...res.data]
-                    this.rowClick(res.data[res.data.length - 1])
-                }
-            })
-        },
-        getHomePageData() {
-            this.search()
-        },
-        monthChange(data) {
-            let year = new Date(data).getFullYear().toString();
-            return year;
-        },
-        getmonthValue() {
-            let year = new Date().getFullYear().toString();
-            return year;
-        },
 
-        tabClick(data) {
-            this.tabIndex = data
-            this.search()
-        },
-        initialization() {
-            companys().then(res => {
-                if (res.data) {
-                    this.companyOptions = res.data
-                    this.company = res.data[0].id
-                    this.search()
-                }
-            })
-        },
+    tabClick() {
+      this.$router.push({
+        path: "/economicsOperation/thematicAnalysis/lightEnergy",
+      });
+    },
+    initialization() {
+      GetOrganization({ type: this.tabIndex }).then((res) => {
+        if (res.data) {
+          this.companyOptions = res.data;
+          this.company = res.data[0].id;
+          this.search();
+        }
+      });
     },
-    mounted() { },
-    beforeUnmount() { },
+  },
+  mounted() {},
+  beforeUnmount() {},
 };
 </script>
-  
+
 <style lang="less" scoped>
 .data-bodys {
-    display: flex;
-    flex-direction: column;
-    background-color: rgba(0, 0, 0, 0.45);
-    border-radius: 5px;
-    padding: 5px;
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(0, 0, 0, 0.45);
+  border-radius: 5px;
+  padding: 5px;
 }
 
 .parcel-box {
-    padding: 0 20px;
-    box-sizing: border-box;
+  padding: 0 20px;
+  box-sizing: border-box;
 
-    .tableDataBox {}
-
-    .line {
-        padding-bottom: 5px;
-
-        .leftContent {
-            width: 242px;
-            height: 41px;
-            line-height: 41px;
-            background: url("../../../../../assets/imgs/title_left_bg.png");
-
-            span {
-                font-size: 16px;
-                font-family: Microsoft YaHei;
-                font-weight: 400;
-                color: #FFFFFF;
-                margin-left: 25px;
-            }
-        }
-
-        .rightContent {
-            width: 212px;
-            height: 28px;
-            margin-top: 13px;
-            background: url("../../../../../assets/imgs/title_right_bg.png");
-        }
+  ::v-deep .search-left {
+    display: flex;
+    align-items: center;
+    .el-select {
+      margin-right: 10px;
+      width: 155px;
+      .el-input .el-input__inner {
+        width: 150px;
+      }
+    }
+    .search-btns {
+      display: flex;
+    }
+  }
+  .line {
+    padding-bottom: 5px;
+
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
     }
 
-    .search {
-        display: flex;
-        flex-direction: row;
-        padding-top: 10px;
-        align-items: center;
-        justify-content: space-between;
-
-        .left {
-            display: flex;
-            flex-direction: row;
-            align-items: center;
-        }
-
-        .right {
-            position: relative;
-
-            .select-back {
-                position: absolute;
-                right: 5px;
-                top: 0px;
-                z-index: 0;
-            }
-
-            .title-select {
-                z-index: 2;
-            }
-        }
-
-        .tabCut {
-            display: inline-block;
-            margin: 0 20px;
-
-            div {
-                display: inline-block;
-                width: 60px;
-                height: 27px;
-                border: 1px solid #354460;
-                text-align: center;
-                line-height: 25px;
-                cursor: pointer;
-            }
-
-            div:nth-child(1) {
-                border-radius: 13px 0px 0px 13px;
-            }
-
-            div:nth-child(2) {
-                border-radius: 0px 13px 13px 0px;
-            }
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+  }
 
-            .active {
-                background-color: #0C3378;
-                color: #fff;
-            }
-        }
+  .search {
+    display: flex;
+    flex-direction: row;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    align-items: center;
+    // justify-content: space-between;
 
-        button {
-            margin-left: 10px;
-            background: rgba(67, 81, 107, 0.3);
-            border: 1px solid #354460;
-            color: #B3B3B3;
-        }
+    button {
+      margin-left: 10px;
+      background: rgba(67, 81, 107, 0.3);
+      border: 1px solid #354460;
+      color: #b3b3b3;
+    }
 
-        .searchColor {
-            background-color: rgba(0, 70, 199, 0.2);
-            border: 1px solid #3B4C6C;
-            color: #B3B3B3;
-            font-size: 14px;
+    .searchColor {
+      background-color: rgba(0, 70, 199, 0.2);
+      border: 1px solid #3b4c6c;
+      color: #b3b3b3;
+      font-size: 14px;
 
-            &:hover {
-                background-color: rgba(0, 70, 199, .5);
-                color: #ffffff;
-            }
-        }
+      &:hover {
+        background-color: rgba(0, 70, 199, 0.5);
+        color: #ffffff;
+      }
     }
+  }
 
-    .echarts {
-        margin-top: 20px;
-        background-color: rgba(0, 0, 0, 0.45);
-        border-radius: 5px;
-        width: 100%;
-    }
+  .echarts {
+    margin-top: 20px;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    width: 100%;
+  }
 }
 
 .clearfix::after {
-    content: "";
-    clear: both;
-    height: 0;
-    line-height: 0;
-    visibility: hidden;
-    display: block;
+  content: "";
+  clear: both;
+  height: 0;
+  line-height: 0;
+  visibility: hidden;
+  display: block;
 }
 
 .clearfix {
-    zoom: 1;
+  zoom: 1;
 }
 
 .left {
-    float: left;
+  float: left;
 }
 
 .right {
-    float: right;
+  float: right;
 }
 
 /deep/ .el-input__prefix {
-    right: -15px;
-    left: unset;
+  right: -15px;
+  left: unset;
 }
 
 /deep/ .el-input--prefix .el-input__inner {
-    padding-left: 20px;
+  padding-left: 20px;
 }
 
 .el-table::before {
-    height: 0;
+  height: 0;
 }
 
 .compare-lift-down {
-    margin-left: 7px;
-    font-size: 14px;
-    font-family: Arial;
-    font-weight: 400;
-    color: #FF8300;
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #ff8300;
 }
 
 .compare-lift-up {
-    margin-left: 7px;
-    font-size: 14px;
-    font-family: Arial;
-    font-weight: 400;
-    color: #1C99FF;
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #1c99ff;
 }
 
 .chart-name {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: relative;
-    width: 100%;
-    height: 40px;
-    border-bottom: 1px solid rgba(106, 106, 106, .5);
-    font-size: 16px;
-    font-family: Microsoft YaHei;
-    font-weight: 400;
-    color: #FFFFFF;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  width: 100%;
+  height: 40px;
+  border-bottom: 1px solid rgba(106, 106, 106, 0.5);
+  font-size: 16px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #ffffff;
 }
 
 .point {
-    width: 6px;
-    height: 1px;
-    background-color: #ffffff;
-    position: absolute;
-
-    &.left {
-        left: 0;
-    }
-
-    &.right {
-        right: 0;
-    }
-
-    &.top {
-        top: -1px;
-    }
-
-    &.bottom {
-        bottom: -1px;
-    }
+  width: 6px;
+  height: 1px;
+  background-color: #ffffff;
+  position: absolute;
+
+  &.left {
+    left: 0;
+  }
+
+  &.right {
+    right: 0;
+  }
+
+  &.top {
+    top: -1px;
+  }
+
+  &.bottom {
+    bottom: -1px;
+  }
 }
 </style>
-  
-  

+ 483 - 0
src/views/layout/economicsOperation/thematicAnalysis/windEnergy/indexGf.vue

@@ -0,0 +1,483 @@
+<template>
+  <div class="parcel-box">
+    <div class="search">
+      <div class="search-left">
+        <el-select
+          size="mini"
+          v-model="tabIndex"
+          placeholder="请选择"
+          @change="tabClick"
+        >
+          <el-option
+            v-for="item in tabOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <el-select
+          size="mini"
+          v-model="company"
+          placeholder="请选择"
+          @change="getHomePageData()"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select>
+        <div class="search-input">
+          <el-date-picker
+            size="mini"
+            v-model="searchYear"
+            type="year"
+            value-format="YYYY"
+            placeholder="选择年"
+            popper-class="date-select"
+          >
+          </el-date-picker>
+        </div>
+      </div>
+      <div class="search-btns">
+        <el-button round size="mini" class="searchColor" @click="search"
+          >搜索</el-button
+        >
+      </div>
+      <!-- <el-button round size="mini">导出</el-button> -->
+    </div>
+    <div class="data-bodys">
+      <div class="line clearfix">
+        <div class="leftContent left">
+          <span>光能利用率</span>
+        </div>
+        <div class="rightContent right"></div>
+      </div>
+      <div class="economicTable">
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          size="mini"
+          stripe
+          height="50vh"
+          @row-click="rowClick"
+        >
+          <el-table-column
+            align="center"
+            prop=""
+            label="场站"
+            show-overflow-tooltip
+            sortable
+          >
+            <template v-slot="scope">
+              <span style="cursor: pointer">{{ scope.row.wpname }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            align="center"
+            :label="val"
+            v-for="(val, index) in tableHead"
+            :key="index"
+            width="144"
+            sortable
+          >
+            <template v-slot="scope">
+              <div v-if="scope.row.wpname == ''">
+                <el-row>
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data?.current }}</span></el-col
+                  >
+                  <el-col :span="12"
+                    ><span>{{ scope.row.data.sameperiod }}</span></el-col
+                  >
+                </el-row>
+              </div>
+              <div v-else>
+                <el-row>
+                  <el-col :span="12" style="position: relative">
+                    <div
+                      style="
+                        padding: 0 10px;
+                        width: 100%;
+                        height: 100%;
+                        display: flex;
+                        flex-direction: row;
+                        align-items: center;
+                        justify-content: center;
+                      "
+                    >
+                      <span style="width: 40px">{{
+                        scope.row.targetList &&
+                        (scope.row.targetList[index]?.current ||
+                        scope.row.targetList[index]?.current === 0
+                          ? scope.row.targetList[index]?.current
+                          : "--")
+                      }}</span>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          (scope.row.targetList[index]?.compare > 0 ||
+                            scope.row.targetList[index]?.compare === 0)
+                        "
+                        class="active_icon icon-arrow-up compare-lift-up"
+                      ></i>
+                      <i
+                        style="position: absolute; right: 0; top: 4px"
+                        v-if="
+                          scope.row.targetList &&
+                          scope.row.targetList[index]?.compare < 0
+                        "
+                        class="active_icon icon-arrow-dpwn compare-lift-down"
+                      ></i>
+                    </div>
+                  </el-col>
+                  <el-col :span="12"
+                    ><span>{{
+                      scope.row.targetList &&
+                      (scope.row.targetList[index]?.sameperiod ||
+                      scope.row.targetList[index]?.sameperiod === 0
+                        ? scope.row.targetList[index]?.sameperiod
+                        : "--")
+                    }}</span></el-col
+                  >
+                </el-row>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="echarts" style="height: 30vh">
+      <div class="chart-name">
+        <div class="point left bottom"></div>
+        <div class="point right bottom"></div>
+        光能利用率
+      </div>
+      <div style="margin-top: 10px">
+        <BarCharts
+          :list="barList"
+          width="97%"
+          height="32vh"
+          :top="60"
+          :pillarName="pillarName"
+          :xdate="false"
+          :showLegend="true"
+          :units="['', '']"
+        ></BarCharts>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BarCharts from "../../homePage/components/barCharts.vue";
+import { GetOrganization } from "@/api/headerNav.js";
+import { companys, fnlylList } from "@/api/curveAnalyse";
+export default {
+  name: "lightEnergy",
+  components: {
+    BarCharts,
+  },
+  data() {
+    return {
+      pillarName: "",
+      list: [],
+      tabIndex: -2,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      // barHeight: '260px',
+      barList: [],
+      tableData: [],
+      tableHead: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "六月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      company: "",
+      companyOptions: [],
+      searchYear: this.getmonthValue(),
+    };
+  },
+  watch: {},
+  filters: {},
+  computed: {},
+  created() {
+    this.initialization();
+  },
+  methods: {
+    compare(property) {
+      return (a, b) => {
+        let val1 = a[property];
+        let val2 = b[property];
+        return val1 - val2;
+      };
+    },
+    rowClick(list) {
+      if (list?.wpname) {
+        let barList = [
+          {
+            name: "本期",
+            children: [],
+            date: [],
+          },
+          {
+            name: "同期",
+            children: [],
+          },
+        ];
+        this.pillarName = list.wpname;
+        list.targetList.forEach((item) => {
+          barList[0].date.push(item.month + "月");
+          barList[0].children.push(item.current || 0);
+          barList[1].children.push(item.compare || 0);
+        });
+        this.barList = barList;
+      }
+    },
+    // isNumber(val) {
+    //     return typeof val === "number" && !isNaN(val);
+    // },
+    search() {
+      fnlylList({
+        companys: this.company,
+        type: this.tabIndex,
+        year: this.monthChange(this.searchYear),
+      }).then((res) => {
+        if (res.data) {
+          let arr = [
+            {
+              wpname: "",
+              data: {
+                wpname: "期次",
+                current: "本期",
+                sameperiod: "同期",
+              },
+            },
+          ];
+          this.tableData = [...arr, ...res.data];
+          this.rowClick(res.data[res.data.length - 1]);
+        }
+      });
+    },
+    getHomePageData() {
+      this.search();
+    },
+    monthChange(data) {
+      let year = new Date(data).getFullYear().toString();
+      return year;
+    },
+    getmonthValue() {
+      let year = new Date().getFullYear().toString();
+      return year;
+    },
+
+    tabClick(data) {
+      this.$router.push({
+        path: "/economicsOperation/thematicAnalysis/windEnergy",
+      });
+    },
+    initialization() {
+      GetOrganization({ type: this.tabIndex }).then((res) => {
+        if (res.data) {
+          this.companyOptions = res.data;
+          this.company = res.data[0].id;
+          this.search();
+        }
+      });
+    },
+  },
+  mounted() {},
+  beforeUnmount() {},
+};
+</script>
+
+<style lang="less" scoped>
+.data-bodys {
+  display: flex;
+  flex-direction: column;
+  background-color: rgba(0, 0, 0, 0.45);
+  border-radius: 5px;
+  padding: 5px;
+}
+
+.parcel-box {
+  padding: 0 20px;
+  box-sizing: border-box;
+
+  ::v-deep .search-left {
+    display: flex;
+    align-items: center;
+    .el-select {
+      margin-right: 10px;
+      width: 155px;
+      .el-input .el-input__inner {
+        width: 150px;
+      }
+    }
+    .search-btns {
+      display: flex;
+    }
+  }
+  .line {
+    padding-bottom: 5px;
+
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      background: url("../../../../../assets/imgs/title_left_bg.png");
+
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #ffffff;
+        margin-left: 25px;
+      }
+    }
+
+    .rightContent {
+      width: 212px;
+      height: 28px;
+      margin-top: 13px;
+      background: url("../../../../../assets/imgs/title_right_bg.png");
+    }
+  }
+
+  .search {
+    display: flex;
+    flex-direction: row;
+    padding-top: 10px;
+    align-items: center;
+    // justify-content: space-between;
+
+    button {
+      margin-left: 10px;
+      background: rgba(67, 81, 107, 0.3);
+      border: 1px solid #354460;
+      color: #b3b3b3;
+    }
+
+    .searchColor {
+      background-color: rgba(0, 70, 199, 0.2);
+      border: 1px solid #3b4c6c;
+      color: #b3b3b3;
+      font-size: 14px;
+
+      &:hover {
+        background-color: rgba(0, 70, 199, 0.5);
+        color: #ffffff;
+      }
+    }
+  }
+
+  .echarts {
+    margin-top: 20px;
+    background-color: rgba(0, 0, 0, 0.45);
+    border-radius: 5px;
+    width: 100%;
+  }
+}
+
+.clearfix::after {
+  content: "";
+  clear: both;
+  height: 0;
+  line-height: 0;
+  visibility: hidden;
+  display: block;
+}
+
+.clearfix {
+  zoom: 1;
+}
+
+.left {
+  float: left;
+}
+
+.right {
+  float: right;
+}
+
+/deep/ .el-input__prefix {
+  right: -15px;
+  left: unset;
+}
+
+/deep/ .el-input--prefix .el-input__inner {
+  padding-left: 20px;
+}
+
+.el-table::before {
+  height: 0;
+}
+
+.compare-lift-down {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #ff8300;
+}
+
+.compare-lift-up {
+  margin-left: 7px;
+  font-size: 14px;
+  font-family: Arial;
+  font-weight: 400;
+  color: #1c99ff;
+}
+
+.chart-name {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  width: 100%;
+  height: 40px;
+  border-bottom: 1px solid rgba(106, 106, 106, 0.5);
+  font-size: 16px;
+  font-family: Microsoft YaHei;
+  font-weight: 400;
+  color: #ffffff;
+}
+
+.point {
+  width: 6px;
+  height: 1px;
+  background-color: #ffffff;
+  position: absolute;
+
+  &.left {
+    left: 0;
+  }
+
+  &.right {
+    right: 0;
+  }
+
+  &.top {
+    top: -1px;
+  }
+
+  &.bottom {
+    bottom: -1px;
+  }
+}
+</style>