<template>
    <div class="box">
        <div class="searchBar">
        <el-form :inline="true" :model="formInline" class="demo-form-inline" style="margin-left:1%;margin-top:5px">
          <el-row :gutter="1">
            <el-form-item label="风场一">
              <el-select v-model="value"   placeholder="请选择">
              <el-option
                v-for="item in options"
                :key="item.name"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
            </el-form-item>
            
            <el-form-item label="风场二">
              <el-select v-model="value2"  placeholder="请选择">
              <el-option
                v-for="item in options"
                :key="item.name"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
            </el-form-item>

            <el-form-item label="选择时间：">
              <el-date-picker
                v-model="timedate"
                value-format="yyyy-MM-dd"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :picker-options="pickerOptions">
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="queryApData" :plain="true">查询</el-button>
            </el-form-item>
            <el-form-item >
              <el-button type="primary" @click="queryApDataMx">对标分析</el-button>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="goReturn">返回</el-button>
            </el-form-item>
          </el-row>
        </el-form>
        <el-card>
        <el-table
            v-loading="loading"
            :data="fdcLineData"
            :row-style="{ height: '10px' }" 
            :cell-style="{ textAlign: 'center'}" 
            :header-cell-style="headStyle"
            @selection-change="handleSelectionChange"
            @sort-change="changeTableSort"
            max-height="388px"
            style="margin-bottom:18px;widht:100%"
            >
            <el-table-column label="场际对标列表一">
            <el-table-column
              fixed
              type="index"
              width="45">
            </el-table-column>
            <el-table-column
              type="selection"
              width=45>
            </el-table-column>
            <el-table-column
              prop="wtId"
              label="风机名称"
              width="100">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="ordernum"
              label="排名"
              width="80">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="scadafdlnum"
              label="发电量排名"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="scadafdl"
              :formatter="filter_fdl"
              label="发电量"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzssnum"
              label="故障排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzss"
              label="故障损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.gzss | rounding}}</span>
            </template>
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="whssnum"
              label="检修排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="whss"
              label="检修损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.whss | rounding}}</span>
            </template>
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="qfssnum"
              label="性能排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="qfss"
              label="性能损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.qfss | rounding}}</span>
            </template>
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xdssnum"
              label="限电排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xdss"
              label="限电损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.xdss | rounding}}</span>
            </template>
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slssnum"
              label="受累排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slss"
              label="受累损失"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="fnlyl"
              label="风能利用率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="gzsslnum"
              label="故障损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzssl"
              label="故障损失率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="jxsslnum"
              label="检修损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="jxssl"
              label="检修损失率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="qflnum"
              label="弃风率排名"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="qfl"
              label="弃风率"
               width="100">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xnsslnum"
              label="性能损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xnssl"
              label="性能损失率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slsslnum"
              label="受累损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slssl"
              label="受累损失率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="fwjsl"
              label="复位及时率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xqjsl"
              label="消缺及时率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="ztzhjsl"
              label="状态转换率"
               width="130">
            </el-table-column>
            </el-table-column>
        </el-table>
        </el-card>

        <el-card>
        <el-table
            v-loading="loading2"
            :data="fdcLineData2"
            :row-style="{ height: '10px' }" 
            :cell-style="{ textAlign: 'center'}" 
            :header-cell-style="headStyle"
            @selection-change="handleSelectionChange2"
            @sort-change="changeTableSort"
            max-height="388px"
            style="widht:100%"
            v-if="tb2"
            >
            <el-table-column label="场际对标列表二">
             <el-table-column
              fixed
              type="index"
              width="45">
            </el-table-column>
            <el-table-column
              type="selection"
              width=45>
            </el-table-column>
            <el-table-column
              prop="wtId"
              label="风机名称"
              width="100">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="ordernum"
              label="排名"
              width="80">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="scadafdlnum"
              label="发电量排名"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="scadafdl"
              :formatter="filter_fdl"
              label="发电量"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzssnum"
              label="故障排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzss"
              label="故障损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.gzss | rounding}}</span>
            </template>
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="whssnum"
              label="检修排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="whss"
              label="检修损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.whss | rounding}}</span>
            </template>
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="qfssnum"
              label="性能排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="qfss"
              label="性能损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.qfss | rounding}}</span>
            </template>
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xdssnum"
              label="限电排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xdss"
              label="限电损失"
               width="110">
            <template slot-scope="scope">
              <span>{{scope.row.xdss | rounding}}</span>
            </template>
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slssnum"
              label="受累排名"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slss"
              label="受累损失"
               width="110">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="fnlyl"
              label="风能利用率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="gzsslnum"
              label="故障损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="gzssl"
              label="故障损失率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="jxsslnum"
              label="检修损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="jxssl"
              label="检修损失率"
               width="130">
            </el-table-column>
             <el-table-column
             :sortable="'custom'"
              prop="qflnum"
              label="弃风率排名"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="qfl"
              label="弃风率"
               width="100">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xnsslnum"
              label="性能损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xnssl"
              label="性能损失率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slsslnum"
              label="受累损失率排名"
               width="150">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="slssl"
              label="受累损失率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="fwjsl"
              label="复位及时率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="xqjsl"
              label="消缺及时率"
               width="130">
            </el-table-column>
            <el-table-column
            :sortable="'custom'"
              prop="ztzhjsl"
              label="状态转换率"
               width="130">
            </el-table-column>
            </el-table-column>
        </el-table>
        </el-card>
        <el-dialog class="el-dialog_body" width="60%" title="对标信息分析" :visible.sync="dialogTableVisible" :modal-append-to-body="false" append-to-body>
							<div class="margin">
                <el-row>
                  <el-col :span="12">
								<div class="dialogLeftData">
                  <el-row>
									<div id="leiDaTu5" class="echart" style="width: 100%; height: 300px"></div></el-row>
                  <el-row>
                  <div id="leiDaTu6" class="echart" style="width: 100%; height: 300px"></div></el-row>
								</div>
                </el-col>
                <el-col :span="12">
								<div class="dialogRightData">
									<el-table :data="getTableData" height="618"
									:row-style="{ height: '10px' }"
									border :header-cell-style="headStyle" :cell-style="{ textAlign: 'center',padding:'7px' }" 
									 style="width: 100%;font-size: 10px;">
											<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>
								</div>
                </el-col>
                </el-row>
							</div>
				</el-dialog>
        </div>
    </div>
</template>
<script>
import innationBenchmarkParticulars from "@assets/js/benchmarkingSys/innationBenchmarkParticulars";
export default innationBenchmarkParticulars;
</script>

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