sisweb/src/views/benchmarkingSys/yardBenchmark.vue

<template>
  <el-container>
    <el-header>
      <el-card style="margin-top: -10px ; width : 100%">
        <el-row :gutter="1">
          <el-form :inline="true" class="demo-form-inline">
            <el-form-item label="风场">
              <el-select
                v-model="fc"
                clearable
                placeholder="请选择"
                @change="query_fc()"
              >
                <el-option
                  v-for="item in FClist"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="开始时间">
              <el-date-picker
                v-model="beginDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>

            <el-form-item label="结束时间">
              <el-date-picker
                value-format="yyyy-MM-dd"
                v-model="endDate"
                type="date"
                placeholder="选择日期"
              >
              </el-date-picker>
            </el-form-item>

            <el-form-item>
              <el-button
                type="primary"
                @click="query_benchmarkWpList"
                :plain="true"
                >查询</el-button
              >
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="dialog()" :plain="true"
                >对标分析</el-button
              >
            </el-form-item>
          </el-form>
        </el-row>
      </el-card>

      <el-dialog
        title="对标信息分析"
        :visible.sync="dialogTableVisible"
        width="65%"
      >
        <el-row>
          <el-col :span="12">
            <div id="leidatu" style="width: 600px; height: 350px"></div>
            <div id="histogram_n" style="width: 600px; height: 350px"></div>
          </el-col>
          <el-col :span="12">
            <el-table :data="getTableData">
              <el-table-column prop="index" label="指标"> </el-table-column>
              <el-table-column prop="data1" :label="fdcName1">
              </el-table-column>
              <el-table-column prop="data2" :label="fdcName2">
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </el-dialog>
    </el-header>
    <el-main>
      <el-card style="margin-top: 20px; height: 400px">
        <el-table
          ref="multipleTable"
          :data="tableData"
          tooltip-effect="dark"
          style="width: 100%"
          :cell-style="{ textAlign: 'center' }"
          :header-cell-style="headStyle"
          border
          max-height="370px"
          height="370px"
          @selection-change="changeFun"
        >
          >
          <!-- <el-table-column label="场内对标列表"> -->
          <el-table-column type="index" width="50"> </el-table-column>
          <el-table-column
            type="selection"
            class="selection"
            @selection-change="changeFun"
            width="50"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="ordernum"
            label="综合排名"
            width="120"
          >
          </el-table-column>
          <el-table-column
            sortable
            :formatter="filter_date"
            prop="recordDate"
            label="日期"
            value-format="yyyy-MM-dd"
            width="120"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="scadafdlnum"
            label="发电量排名"
            width="120"
          >
          </el-table-column>
          <el-table-column sortable prop="fdl" label="发电量" width="120">
          </el-table-column>
          <el-table-column
            sortable
            prop="gzssnum"
            label="故障损失排名"
            width="139"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="gzss"
            label="故障损失电量"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="whssnum"
            label="检修损失排名"
            width="139"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="whss"
            label="检修损失电量"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="qfssnum"
            label="性能损失排名"
            width="139"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="qfss"
            label="性能损失电量"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="xdssnum"
            label="限电损失排名"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="xdss"
            label="限电损失电量"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="slssnum"
            label="受累损失排名"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="slss"
            label="受累损失电量"
            width="130"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="fnlylnum"
            label="风能利用率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="fnlyl"
            label="风能利用率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="gzsslnum"
            label="故障损失率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="gzssl"
            label="故障损失率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="jxsslnum"
            label="检修损失率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="jxssl"
            label="检修损失率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="qflnum"
            label="弃风率排名"
            width="130"
          >
          </el-table-column>
          <el-table-column sortable prop="qfl" label="弃风率(%)" width="130">
          </el-table-column>
          <el-table-column
            sortable
            prop="xnsslnum"
            label="性能损失率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="xnssl"
            label="性能损失率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="slsslnum"
            label="受累损失率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="slssl"
            label="受累损失率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="fwjslnum"
            label="复位及时率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="fwjsl"
            label="复位及时率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="ztzhjslnum"
            label="状态转换率排名"
            width="150"
          >
          </el-table-column>
          <el-table-column
            sortable
            prop="ztzhjsl"
            label="状态转换率(%)"
            width="150"
          >
          </el-table-column>
          <el-table-column fixed="right" label="操作" width="100">
            <template slot-scope="scope">
              <el-button
                size="medium"
                type="text"
                @click="handleEdit(scope.$index, scope.row)"
                >详情</el-button
              >
            </template>
          </el-table-column>
          <!-- </el-table-column> -->
        </el-table>
      </el-card>

      <el-row
        style="
          width: 96%;
          height: 333px;
          display: flex;
          justify-content: space-between;
        "
      >
        <div id="histogram" style="width: 80%; height: 300px"></div>
      </el-row>
    </el-main>
  </el-container>
</template>

<script>
import yardBenchmark from "@assets/js/benchmarkingSys/yardBenchmark";
export default yardBenchmark;
</script>

<style lang="scss" scoped>
 @import "@assets/css/benchmarkingSys/yardBenchmark.scss";
</style>