部分功能修改及数据查看

src/App.vue

@@ -28,7 +28,7 @@
             <el-menu-item index="/gradeEvaluation">等级评估</el-menu-item>
             <el-menu-item index="/cutAndSpeed">切入切出风速整合</el-menu-item>
             <el-menu-item index="/performanceAnalysis">单机性能分析</el-menu-item>
-            <el-menu-item index="/singleMachinePower">单机功率信息</el-menu-item>
+            <el-menu-item index="/singleMachinePower">单机饱和度</el-menu-item>
             <el-menu-item index="/plannedGeneration">计划发电量列表</el-menu-item>
             <el-submenu index="3-1">
               <template slot="title">单机性能分析</template>
@@ -83,6 +83,10 @@
                 >单机横向对比</el-menu-item
               >
             </el-submenu>
+             <el-submenu index="2-9">  
+              <template slot="title">值际对标</template>
+              <el-menu-item index="/interValue">值际对标</el-menu-item>
+          </el-submenu>
           </el-submenu>
           <el-submenu index="5">
             <template slot="title">健康管理</template>

src/router/index.js

@@ -258,6 +258,19 @@ const routes = [{
 		name: 'performanceAnalysisOperation',
 		component: () => import('../views/gradeEvaluation/PerformanceAnalysisOperation.vue')
 	}
+	,
+	{
+		path: '/interValue',
+		name: 'interValue',
+		component: () => import('../views/betweenValues/InterValue.vue')
+	}
+	,
+	{
+		path: '/interValueLineTable',
+		name: 'interValueLineTable',
+		component: () => import('../views/betweenValues/InterValueLineTable.vue')
+	}
+	,
 ]
 
 const router = new VueRouter({

src/views/benchMarking/FiveLossLineTable.vue

@@ -561,6 +561,21 @@ export default {
               this.options = res.data.data;
             })
             this.wpId = this.$route.query.wpId;
+            if(this.value == ''){
+              if(this.wpId.length == 2){
+                  this.tableSwitch = true;
+                  this.value = this.wpId[0];
+                  this.value2 = this.wpId[1]
+                  this.FiveLossTableDataTable1();
+              }else{
+                  this.value = this.wpId;
+                  this.FiveLossTableDataTable1();
+              }
+            }else{
+              this.FiveLossTableDataTable1();
+            }
+        },
+        FiveLossTableDataTable1(){
             if(this.timedate == ''){
                 this.beginDate = this.$route.query.beginDate;
                 this.endDate = this.$route.query.endDate;
@@ -568,17 +583,6 @@ export default {
                 this.beginDate = this.timedate[0];
                 this.endDate = this.timedate[1];
             }
-            if(this.wpId.length == 2){
-                this.tableSwitch = true;
-                this.value = this.wpId[0];
-                this.value2 = this.wpId[1]
-                this.FiveLossTableDataTable1();
-            }else{
-                this.value = this.wpId;
-                this.FiveLossTableDataTable1();
-            }
-        },
-        FiveLossTableDataTable1(){
             var fiveLossLineDatatable1 = new URLSearchParams();
             fiveLossLineDatatable1.append('pageNum',this.currentPage2);
             fiveLossLineDatatable1.append('pageSize',this.pagesize);
@@ -593,7 +597,19 @@ export default {
             this.FiveLossTableDataTable2(); 
         },
         FiveLossTableDataTable2(){
-          // console.log(this.value2)
+            if(this.timedate == ''){
+                this.beginDate = this.$route.query.beginDate;
+                this.endDate = this.$route.query.endDate;
+            }else{
+                this.beginDate = this.timedate[0];
+                this.endDate = this.timedate[1];
+            }
+            console.log(this.value2.length)
+            if(this.value2.length > 0){
+                this.tableSwitch = true;
+            }else{
+                this.tableSwitch = false;
+            }
             var fiveLossLineDatatable2 = new URLSearchParams();
             fiveLossLineDatatable2.append('pageNum',this.currentPage2);
             fiveLossLineDatatable2.append('pageSize',this.pagesize);
@@ -616,8 +632,6 @@ export default {
             this.sortInOrde2 = [];
             this.multipleSelection1 = [];
             this.multipleSelection1 = val;
-            
-          
         },
         handleSelectionChange2(val) {
             this.sortInOrder = [];

src/views/betweenValues/InterValue.vue

@@ -0,0 +1,713 @@
+<template>
+    <div class="box">
+        <div class="searchBar">
+            <el-form :inline="true" :model="formInline" class="demo-form-inline">
+            <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-date-picker
+                        v-model="value2"
+                        type="year"
+                        placeholder="选择年"
+                        value-format="yyyy">
+                    </el-date-picker>
+                </el-form-item>
+
+                <el-form-item label="月份">
+                    <el-date-picker
+                        v-model="value3"
+                        type="month"
+                        placeholder="选择月"
+                        value-format="MM"
+                        >
+                    </el-date-picker>
+                </el-form-item>
+
+                 <el-form-item label="值际周期">
+                <el-select v-model="value4"  placeholder="请选择">
+                <el-option
+                    v-for="item in options2"
+                    :key="item.label"
+                    :label="item.label"
+                    :value="item.value"
+                >
+                </el-option>
+                </el-select>
+                </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="queryApDataMx"
+                    >风机对标</el-button
+                >
+                </el-form-item>
+
+                <el-form-item>
+                <el-button type="primary" @click="clearAll">清空</el-button>
+                </el-form-item>
+            </el-row>
+            </el-form>
+            <el-table
+            :data="getTableDataAll"
+            :row-style="{ height: '10px' }" 
+            :cell-style="{ textAlign: 'center',padding:'1px' }" 
+            :header-cell-style="headStyle"
+            @selection-change="handleSelectionChange"
+            @sort-change="changeTableSort"
+            style="font-size: 10px;">
+                <el-table-column label="值际对标列表">
+                <el-table-column
+                    type="index"
+                    width="30">
+                </el-table-column>
+                <el-table-column
+                    type="selection"
+                    width=45>
+                </el-table-column>
+                <el-table-column
+                    prop="wpName"
+                    label="风电场名称"
+                    width="95">
+                </el-table-column>
+                <el-table-column
+                    prop="ordernum"
+                    label="综合排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="scadafdlnum"
+                    label="发电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="scadafdl"
+                    label="发电量"
+                    width="65">
+                </el-table-column>
+                <el-table-column
+                    prop="gzssnum"
+                    label="故障损失电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="gzss"
+                    label="故障损失电量"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="jxsslnum"
+                    label="检修损失电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="jxssl"
+                    label="检修损失电量"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xnsslnum"
+                    label="性能损失电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xnssl"
+                    label="性能损失电量"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xdssnum"
+                    label="限电损失电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xdss"
+                    label="限电损失电量"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="slssnum"
+                    label="受累损失电量排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="slss"
+                    label="受累损失电量"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="fnlyl"
+                    label="风能利用率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="gzsslnum"
+                    label="故障损失率排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="gzssl"
+                    label="故障损失率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="jxsslnum"
+                    label="检修损失率排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="jxssl"
+                    label="检修损失率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="qflnum"
+                    label="弃风率排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="qfl"
+                    label="弃风率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xnsslnum"
+                    label="性能损失率排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="xnssl"
+                    label="性能损失率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="slsslnum"
+                    label="受累损失率排名"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="slssl"
+                    label="受累损失率(%)"
+                    width="70">
+                </el-table-column>
+                <el-table-column
+                    prop="address"
+                    label="操作"
+                    width="70">
+                    <template slot-scope="scope">
+                        <el-button size="mini"  @click="handleEdit(scope.$index, scope.row)">详情</el-button>
+                    </template>
+                </el-table-column>
+                </el-table-column>
+            </el-table>
+            	<el-dialog class="el-dialog_body" width="60%" title="对标信息分析" :visible.sync="dialogTableVisible" append-to-body>
+							<div class="margin">
+								<div class="dialogLeftData">
+									<div id="leiDaTu" class="echart"></div>
+                                    <div id="leiDaTu2" class="echart"></div>
+								</div>
+								<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>
+							</div>
+				</el-dialog>
+        </div>
+    </div>    
+</template>
+<script>
+
+export default {
+    data(){
+        return{
+            formInline: {
+                windfarm: "",
+                project: "",
+                line: "",
+            },
+            options: [{
+                value: 'MHS_FDC',
+                label: '麻黄山风电场'
+                }, {
+                value: 'NSS_FDC',
+                label: '牛首山风电场'
+                },
+                {
+                value: 'SBQ_FDC',
+                label: '石板泉风电场'
+                },
+                {
+                value: 'QS_FDC',
+                label: '青山风电场'
+                },
+                {
+                value: 'XS_FDC',
+                label: '香山风电场'
+            }],
+            value:"",
+            value2:"",
+            value3:"",
+            value4:"",
+            ortInOrder:[],
+            sortInOrderTop:[],
+            sortInOrde2:[],
+            getTableData:[],
+            fdcName1:'',
+            fdcName2:'',
+            dialogTableVisible:false,
+            year:"",
+            month:"",
+            cid:[],
+            wpId:[],
+            options2: [
+                {
+                value: '1',
+                label: '一值'
+                }, {
+                value: '2',
+                label: '二值'
+                },
+                {
+                value: '3',
+                label: '三值'
+                },
+                
+            ],
+            classification: [{
+                id:'qf',
+                label: '弃风率'
+                }, {
+                id:'gz',
+                label: '故障损失率'
+                },
+                {
+                id:'jx',
+                label: '检修损失率'
+                },
+                {
+                id:'xn',
+                label: '性能损失率'
+                },
+                {
+                id:'sl',
+                label: '受累损失率'
+            }],
+            multipleSelection:[],
+            getTableDataAll:[],
+            pagesize:10,
+            currentPage2: 1,
+            doesExist:'no',
+            tableData: [{
+            date: '2016-05-02',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1518 弄'
+          }, {
+            date: '2016-05-04',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1517 弄'
+          }, {
+            date: '2016-05-01',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1519 弄'
+          }, {
+            date: '2016-05-03',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1516 弄'
+          }]
+            }
+    },
+    created(){
+        this.InterValueDatainitial();
+    },
+    methods:{
+        headStyle() {
+			return "text-align:center"
+		},
+        queryApData() {
+            this.InterValueData();
+        },
+        queryApDataMx() {
+            this.dialogTableVisible = true;
+                this.$nextTick(function() {
+                    this.drawPie('leiDaTu')
+                })
+                this.$nextTick(function() {
+                    this.drawPie2('leiDaTu2')
+                })
+        },
+        handleEdit(a,b){
+            this.cid = [];
+            this.wpId = [];
+            if(this.multipleSelection.length == 2){
+                for(let i=0;i<this.multipleSelection.length;i++){
+                this.cid.push(this.multipleSelection[i].cid)
+                this.wpId.push(this.multipleSelection[i].wpId)
+                }
+                this.$router.push({
+                path:'/interValueLineTable',
+                query:{
+                    cid:this.cid,
+                    wpId:this.wpId
+                    }
+                })
+            }
+            else{
+                console.log(b)
+                this.$router.push({
+                path:'/interValueLineTable',
+                query:{
+                    cid:b.cid,
+                    wpId:b.wpId
+                    }
+                })
+               
+            } 
+        },
+        handleSelectionChange(val) {
+            this.sortInOrder = [];
+			this.sortInOrderTop = [];
+            this.getTableData = [];
+            this.sortInOrde2 = [];
+            this.multipleSelection = val;
+            if(this.multipleSelection.length == 2){
+                this.fdcName1 = this.multipleSelection[0].wpName;
+                this.fdcName2 = this.multipleSelection[1].wpName;
+                this.sortInOrder.push(this.multipleSelection[0].fnlyl,this.multipleSelection[0].xqjsl,
+                this.multipleSelection[0].ztzhjsl,this.multipleSelection[0].fwjsl,this.multipleSelection[0].slssl,
+                this.multipleSelection[0].xnssl,this.multipleSelection[0].qfl,this.multipleSelection[0].jxssl,
+                this.multipleSelection[0].gzssl);
+                this.sortInOrderTop.push(this.multipleSelection[1].fnlyl,this.multipleSelection[1].xqjsl,
+                this.multipleSelection[1].ztzhjsl,this.multipleSelection[1].fwjsl,this.multipleSelection[1].slssl,
+                this.multipleSelection[1].xnssl,this.multipleSelection[1].qfl,this.multipleSelection[1].jxssl,
+                this.multipleSelection[1].gzssl);
+                for(let i=0;i<this.multipleSelection.length;i++){
+                this.sortInOrde2.push({product:this.multipleSelection[i].wpName,'限电损失电量单位:万KWh':this.multipleSelection[i].xdss,
+                        '故障损失电量单位:万KWh':this.multipleSelection[i].gzss,'检修损失电量单位:万KWh':this.multipleSelection[i].jxssl,
+                        '性能损失电量单位:万KWh':this.multipleSelection[i].xnssl,'受累损失电量单位:万KWh':this.multipleSelection[i].slss});
+                }
+                this.getTableData.push({index:'发电量',data1:this.multipleSelection[0].fdl,data2:this.multipleSelection[1].fdl});
+                this.getTableData.push({index:'故障损失电量',data1:this.multipleSelection[0].gzss,data2:this.multipleSelection[1].gzss});
+                this.getTableData.push({index:'检修损失电量',data1:this.multipleSelection[0].jxssl,data2:this.multipleSelection[1].jxssl});
+                this.getTableData.push({index:'性能未达标损失电量',data1:this.multipleSelection[0].xnsslfraction,data2:this.multipleSelection[1].xnsslfraction});
+                this.getTableData.push({index:'受累损失电量',data1:this.multipleSelection[0].slss,data2:this.multipleSelection[1].slss});
+                this.getTableData.push({index:'风能利用率',data1:this.multipleSelection[0].fnlyl,data2:this.multipleSelection[1].fnlyl});
+                this.getTableData.push({index:'故障损失率',data1:this.multipleSelection[0].gzssl,data2:this.multipleSelection[1].gzssl});
+                this.getTableData.push({index:'检修损失率',data1:this.multipleSelection[0].jxssl,data2:this.multipleSelection[1].jxssl});
+                this.getTableData.push({index:'弃风率',data1:this.multipleSelection[0].qfl,data2:this.multipleSelection[1].qfl});
+                this.getTableData.push({index:'性能损失率',data1:this.multipleSelection[0].xnssl,data2:this.multipleSelection[1].xnssl});
+                this.getTableData.push({index:'受累损失率',data1:this.multipleSelection[0].slssl,data2:this.multipleSelection[1].slssl});
+                this.getTableData.push({index:'复位及时率',data1:this.multipleSelection[0].fwjsl,data2:this.multipleSelection[1].fwjsl});
+                this.getTableData.push({index:'消缺及时率',data1:this.multipleSelection[0].xqjsl,data2:this.multipleSelection[1].xqjsl});
+                this.getTableData.push({index:'状态转换率',data1:this.multipleSelection[0].ztzhjsl,data2:this.multipleSelection[1].ztzhjsl});
+            }
+            
+        },
+        changeTableSort(column){
+			this.orderByColumn = column.prop;
+			if(column.order == "descending"){
+				this.isAsc = 'desc';
+			}else if(column.order == "ascending"){
+				this.isAsc = "asc";
+			}
+		},
+        InterValueDatainitial(){
+            let that = this;
+            this.$http.get('/powercompare/windfarmAjax').then((res) => {
+                that.options = res.data.data;
+            })
+            var valueData1 = new URLSearchParams();
+            valueData1.append('wpId','MHS_FDC');
+            valueData1.append('year',"2021");
+            valueData1.append('month',"1");
+            valueData1.append('zjs',"1")
+            this.$http.post('/contrast/addBenchmarkZj',valueData1).then((res) => {
+                that.tableData = res.data.data;
+                for(let i=0;i<that.tableData.length;i++){
+                    that.getTableDataAll.push(that.tableData[i])
+                } 
+            })
+            var valueData2 = new URLSearchParams();
+            valueData2.append('wpId','NSS_FDC');
+            valueData2.append('year',"2021");
+            valueData2.append('month',"1");
+            valueData2.append('zjs',"1")
+            this.$http.post('/contrast/addBenchmarkZj',valueData2).then((res) => {
+                that.tableData = res.data.data;
+                for(let i=0;i<that.tableData.length;i++){
+                    that.getTableDataAll.push(that.tableData[i])
+                } 
+            })
+            var valueData3 = new URLSearchParams();
+            valueData3.append('wpId','SBQ_FDC');
+            valueData3.append('year',"2021");
+            valueData3.append('month',"1");
+            valueData3.append('zjs',"1")
+            this.$http.post('/contrast/addBenchmarkZj',valueData3).then((res) => {
+                that.tableData = res.data.data;
+                for(let i=0;i<that.tableData.length;i++){
+                    that.getTableDataAll.push(that.tableData[i])
+                } 
+            })
+            var valueData4 = new URLSearchParams();
+            valueData4.append('wpId','QS_FDC');
+            valueData4.append('year',"2021");
+            valueData4.append('month',"1");
+            valueData4.append('zjs',"1")
+            this.$http.post('/contrast/addBenchmarkZj',valueData4).then((res) => {
+                that.tableData = res.data.data;
+                for(let i=0;i<that.tableData.length;i++){
+                    that.getTableDataAll.push(that.tableData[i])
+                } 
+            })
+            var valueData5 = new URLSearchParams();
+            valueData5.append('wpId','XS_FDC');
+            valueData5.append('year',"2021");
+            valueData5.append('month',"1");
+            valueData5.append('zjs',"1")
+            this.$http.post('/contrast/addBenchmarkZj',valueData5).then((res) => {
+                that.tableData = res.data.data;
+                for(let i=0;i<that.tableData.length;i++){
+                    that.getTableDataAll.push(that.tableData[i])
+                } 
+            })
+        },
+        InterValueData(){
+            let that = this;
+            this.doesExist = 'no';
+            var valueData = new URLSearchParams();
+            valueData.append('wpId',this.value);
+            valueData.append('year',this.value2);
+            valueData.append('month',this.value3);
+            valueData.append('zjs',this.value4)
+            this.$http.post('/contrast/addBenchmarkZj',valueData).then((res) => {
+                that.tableData = res.data.data;
+                // console.log(that.getTableDataAll)
+                console.log(that.tableData)
+                for(let i=0;i<that.getTableDataAll.length;i++){
+                    for(let j=0;j<that.tableData.length;j++){
+                        if(that.getTableDataAll[i].wpId == that.tableData[j].wpId && that.getTableDataAll[i].zjName == that.tableData[j].zjName){
+                            that.doesExist = 'yes';
+                            this.$message.error("此值在表中已存在");
+                            return;
+                        }     
+                    } 
+                }
+                if(that.doesExist == 'no'){
+                    for(let i=0;i<that.tableData.length;i++){
+                        that.getTableDataAll.push(that.tableData[i])
+                    }
+                    this.$message.error("添加成功");
+                    return; 
+                }
+                
+            })
+        },
+        drawPie() {
+				var charts;
+				if (charts != null && charts != "" && charts != undefined){
+				    charts.dispose();
+				}
+				charts= this.$echarts.init(document.getElementById('leiDaTu'));
+				let option = {
+					title: {
+        // text: '对标排名分析',
+        left: 'center'
+            },
+            tooltip: {},
+            // legend: {
+            //     data: ['预算分配（Allocated Budget）', '实际开销（Actual Spending）'],
+            //     left: 'right'
+            // },
+            radar: {
+                // shape: 'circle',
+                name: {
+                    textStyle: {
+                        color: '#fff',
+                        backgroundColor: '#999',
+                        borderRadius: 3,
+                        padding: [3, 5]
+                    }
+                },
+                indicator: [
+                    { name: '风能利用率', max: 150},
+                    { name: '消缺及时率', max: 150},
+                    { name: '状态转换率', max: 150},
+                    { name: '复位及时率', max: 150},
+                    { name: '受累损失率', max: 150},
+                    { name: '性能损失率', max: 150},
+                    { name: '弃风率', max: 150},
+                    { name: '检修损失率', max: 150},
+                    { name: '故障损失率', max: 150},
+                ]
+            },
+            series: [{
+                name: '预算 vs 开销（Budget vs spending）',
+                type: 'radar',
+                // areaStyle: {normal: {}},
+                data: [
+                    {
+                        value: this.sortInOrder,
+                        name:this.fdcName1
+                    },
+                    {
+                        value: this.sortInOrderTop,
+                        name: this.fdcName2
+                    }
+                ]
+            }]
+                        }
+                        charts.clear();
+                        charts.setOption(option);
+                        
+            },
+            drawPie2() {
+                        var charts2;
+                        if (charts2 != null && charts2 != "" && charts2 != undefined){
+                            charts2.dispose();
+                        }
+                        charts2= this.$echarts.init(document.getElementById('leiDaTu2'));
+                        let option2 = {
+                            legend: {
+                    orient: 'vertical',
+                    left: 'right'
+                },
+                tooltip: {},
+                dataset: {
+                    dimensions: ['product', '限电损失电量单位:万KWh', '故障损失电量单位:万KWh', '检修损失电量单位:万KWh', '性能损失电量单位:万KWh', '受累损失电量单位:万KWh'],
+                    source: this.sortInOrde2
+                },
+                xAxis: {type: 'category'},
+                yAxis: {},
+                // Declare several bar series, each will be mapped
+                // to a column of dataset.source by default.
+                series: [
+                    {
+                            // barGap:'100%',/*多个并排柱子设置柱子之间的间距*/
+                            type: 'bar',
+                            barWidth : 30,
+                            itemStyle:{
+                                normal:{
+                                    color:'#D201D8'
+                                }
+                            }
+                        },
+                        {
+                            
+                            type: 'bar',
+                            barWidth : 30,
+                            itemStyle:{
+                                normal:{
+                                    color:'#FD0100'
+                                }
+                            }
+                        },
+                        {
+                            
+                            type: 'bar',
+                            barWidth : 30,
+                            itemStyle:{
+                                normal:{
+                                    color:'#FF7B16'
+                                }
+                            }
+                        },
+                        {
+                            
+                            type: 'bar',
+                            barWidth : 30,
+                            itemStyle:{
+                                normal:{
+                                    color:'#8085E9'
+                                }
+                            }
+                        },
+                        {
+                            type: 'bar',
+                            barWidth : 30,
+                            itemStyle:{
+                                normal:{
+                                    color:'#A6A6A6'
+                                }
+                            }
+                        },
+                ]
+                    }
+                    charts2.clear();
+                    charts2.setOption(option2);
+                        
+        },
+        clearAll(){
+            this.getTableDataAll = [];
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+    .box{
+		width: 100%;
+		display: flex;
+		justify-content: space-around;
+ 		align-items: center;
+ 		overflow: hidden;
+	}
+    .searchBar{
+        margin-top: 1%;
+    }
+    #leiDaTu {
+		margin-left: 5%;
+		height: 300px;
+		width: 100%;
+		float: left;
+	}
+    #leiDaTu2 {
+            margin: 15%;
+            height: 300px;
+            width: 450px;
+            float: left;
+        }
+    .margin {
+            width: 100%;
+            height: 618px;
+        }
+    .dialogLeftData {
+            width: 50%;
+            height: 650px;
+            text-align: center;
+            float: left;
+	}
+
+	.dialogRightData {
+		width: 50%;
+		height: 650px;
+		text-align: center;
+		float: left;
+	}
+</style>

src/views/betweenValues/InterValueLineTable.vue

@@ -0,0 +1,809 @@
+<template>
+    <div class="box">
+        <div class="searchBar">
+        <el-form :inline="true" :model="formInline" class="demo-form-inline">
+          <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"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+              >
+              </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="toExcel">导出</el-button>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="goReturn">返回</el-button>
+            </el-form-item>
+          </el-row>
+        </el-form>
+        <el-table
+            :data="fdcLineData"
+            :row-style="{ height: '10px' }" 
+            :cell-style="{ textAlign: 'center',padding:'1px' }" 
+            :header-cell-style="headStyle"
+            @selection-change="handleSelectionChange"
+            @sort-change="changeTableSort"
+            style="font-size: 10px;"
+            >
+            <el-table-column label="值际对标列表">
+            <el-table-column
+              type="index"
+              width="45">
+            </el-table-column>
+            <el-table-column
+              type="selection"
+              width=45>
+            </el-table-column>
+            <el-table-column
+              prop="wtId"
+              label="风机"
+              width="80">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="ordernum"
+              label="排名"
+              width="50">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzssnum"
+              label="故障排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzss"
+              label="故障损失"
+               width="70">
+            <template slot-scope="scope">
+              <span>{{scope.row.gzss | rounding}}</span>
+            </template>
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="whssnum"
+              label="检修排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="whss"
+              label="检修损失"
+               width="80">
+            <template slot-scope="scope">
+              <span>{{scope.row.whss | rounding}}</span>
+            </template>
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="qfssnum"
+              label="性能排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="qfss"
+              label="性能损失"
+               width="80">
+            <template slot-scope="scope">
+              <span>{{scope.row.qfss | rounding}}</span>
+            </template>
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xdssnum"
+              label="限电排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xdss"
+              label="限电损失"
+               width="70">
+            <template slot-scope="scope">
+              <span>{{scope.row.xdss | rounding}}</span>
+            </template>
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slssnum"
+              label="受累排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slss"
+              label="受累损失"
+               width="70">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="gzsslnum"
+              label="故障损失率排名"
+               width="90">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzssl"
+              label="故障损失率"
+               width="80">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="jxsslnum"
+              label="检修损失率排名"
+               width="90">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="jxssl"
+              label="检修损失率"
+               width="80">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="qflnum"
+              label="弃风率排名"
+               width="80">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="qfl"
+              label="弃风率"
+               width="60">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xnsslnum"
+              label="性能损失率排名"
+               width="85">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xnssl"
+              label="性能损失率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slssl"
+              label="受累损失率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="fwjsl"
+              label="复位及时率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xqjsl"
+              label="消缺及时率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="ztzhjsl"
+              label="状态转换率"
+               width="81">
+            </el-table-column>
+            </el-table-column>
+        </el-table>
+        <el-table
+            v-if="tableSwitch"
+            :data="fdcLineData2"
+            :row-style="{ height: '10px' }" 
+            :cell-style="{ textAlign: 'center',padding:'1px' }" 
+            :header-cell-style="headStyle"
+            @selection-change="handleSelectionChange2"
+            @sort-change="changeTableSort"
+            style="font-size: 10px;"
+            >
+            <el-table-column label="值际对标列表">
+            <el-table-column
+              type="index"
+              width="45">
+            </el-table-column>
+            <el-table-column
+              type="selection"
+              width=45>
+            </el-table-column>
+            <el-table-column
+              prop="wtId"
+              label="风机"
+              width="80">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="ordernum"
+              label="排名"
+              width="50">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzssnum"
+              label="故障排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzss"
+              label="故障损失"
+               width="70">
+            <template slot-scope="scope">
+              <span>{{scope.row.gzss | rounding}}</span>
+            </template>
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="whssnum"
+              label="检修排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="whss"
+              label="检修损失"
+               width="80">
+            <template slot-scope="scope">
+              <span>{{scope.row.whss | rounding}}</span>
+            </template>
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="qfssnum"
+              label="性能排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="qfss"
+              label="性能损失"
+               width="80">
+            <template slot-scope="scope">
+              <span>{{scope.row.qfss | rounding}}</span>
+            </template>
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xdssnum"
+              label="限电排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xdss"
+              label="限电损失"
+               width="70">
+            <template slot-scope="scope">
+              <span>{{scope.row.xdss | rounding}}</span>
+            </template>
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slssnum"
+              label="受累排名"
+               width="70">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slss"
+              label="受累损失"
+               width="70">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="gzsslnum"
+              label="故障损失率排名"
+               width="90">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="gzssl"
+              label="故障损失率"
+               width="80">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="jxsslnum"
+              label="检修损失率排名"
+               width="90">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="jxssl"
+              label="检修损失率"
+               width="80">
+            </el-table-column>
+             <el-table-column
+             :sortable="'custom'"
+              prop="qflnum"
+              label="弃风率排名"
+               width="80">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="qfl"
+              label="弃风率"
+               width="60">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xnsslnum"
+              label="性能损失率排名"
+               width="85">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xnssl"
+              label="性能损失率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="slssl"
+              label="受累损失率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="fwjsl"
+              label="复位及时率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="xqjsl"
+              label="消缺及时率"
+               width="81">
+            </el-table-column>
+            <el-table-column
+            :sortable="'custom'"
+              prop="ztzhjsl"
+              label="状态转换率"
+               width="81">
+            </el-table-column>
+            </el-table-column>
+        </el-table>
+        <el-dialog class="el-dialog_body" width="60%" title="对标信息分析" :visible.sync="dialogTableVisible" append-to-body>
+							<div class="margin">
+								<div class="dialogLeftData">
+									<div id="leiDaTu3" class="echart"></div>
+                  <div id="leiDaTu4" class="echart"></div>
+								</div>
+								<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>
+							</div>
+				</el-dialog>
+        </div>
+    </div>
+</template>
+<script>
+export default {
+    data(){
+        return{
+            formInline: {
+                windfarm: "",
+                project: "",
+                line: "",
+            },
+            tableData: [{
+                date: '2016-05-02',
+                name: '王小虎',
+                address: '上海市普陀区金沙江路 1518 弄'
+            }, {
+                date: '2016-05-04',
+                name: '王小虎',
+                address: '上海市普陀区金沙江路 1517 弄'
+            }, {
+                date: '2016-05-01',
+                name: '王小虎',
+                address: '上海市普陀区金沙江路 1519 弄'
+            }, {
+                date: '2016-05-03',
+                name: '王小虎',
+                address: '上海市普陀区金沙江路 1516 弄'
+            }],
+            options: [],
+            tableSwitch:false,
+            value: '',
+            value2: '',
+            timedate: ['Fri Jan 01 2021 00:00:00 GMT+0800','Mon Jan 04 2021 00:00:00 GMT+0800'],
+            multipleSelection:[],
+            multipleSelection1:[],
+            multipleSelection2:[],
+            orderByColumn:'',
+            isAsc:'asc',
+            fdcLineData:[],
+            fdcLineData2:[],
+            currentPage2: 1,
+            pagesize: 10,
+            cid:[],
+            cid1:'',
+            cid2:'',
+            wpId:[],
+            beginDate:'',
+            endDate:'',
+            dialogTableVisible:false,
+            sortInOrder:[],
+            sortInOrderTop:[],
+            fdcName1:'',
+            fdcName2:'',
+            sortInOrde2:[],
+            getTableData:[],
+        }
+    },
+    filters: {
+      rounding (value) {
+      return value.toFixed(2)
+      }
+    },
+    created(){
+        this.getDataLine();
+    },
+    methods:{
+        queryApData() {
+            this.getDataLine();
+        },
+        queryApDataMx() {
+            this.dialogTableVisible = true;
+            if (this.multipleSelection1.length + this.multipleSelection2.length == 2) {
+              this.multipleSelection = this.multipleSelection1.concat(this.multipleSelection2);
+            } else {
+              this.$message.error("请选两个风场！");
+              return;
+            }
+            console.log(this.multipleSelection)
+            if(this.multipleSelection.length==2){
+              this.fdcName1 = this.multipleSelection[0].wtName;
+              this.fdcName2 = this.multipleSelection[1].wtName;
+              this.sortInOrder.push(this.multipleSelection[0].fnlyl,this.multipleSelection[0].xqjsl,
+              this.multipleSelection[0].ztzhjsl,this.multipleSelection[0].fwjsl,this.multipleSelection[0].slssl,
+              this.multipleSelection[0].xnssl,this.multipleSelection[0].qfl,this.multipleSelection[0].jxssl,
+              this.multipleSelection[0].gzssl);
+              this.sortInOrderTop.push(this.multipleSelection[1].fnlyl,this.multipleSelection[1].xqjsl,
+              this.multipleSelection[1].ztzhjsl,this.multipleSelection[1].fwjsl,this.multipleSelection[1].slssl,
+              this.multipleSelection[1].xnssl,this.multipleSelection[1].qfl,this.multipleSelection[1].jxssl,
+              this.multipleSelection[1].gzssl);
+              for(let i=0;i<this.multipleSelection.length;i++){
+              this.sortInOrde2.push({product:this.multipleSelection[i].wtName,'限电损失电量单位:万KWh':this.multipleSelection[i].xdss,
+                    '故障损失电量单位:万KWh':this.multipleSelection[i].gzss,'检修损失电量单位:万KWh':this.multipleSelection[i].jxssl,
+                    '性能损失电量单位:万KWh':this.multipleSelection[i].xnssl,'受累损失电量单位:万KWh':this.multipleSelection[i].slss});
+              }
+              this.getTableData.push({index:'发电量',data1:this.multipleSelection[0].scadafdl,data2:this.multipleSelection[1].scadafdl});
+              this.getTableData.push({index:'故障损失电量',data1:this.multipleSelection[0].gzss,data2:this.multipleSelection[1].gzss});
+              this.getTableData.push({index:'检修损失电量',data1:this.multipleSelection[0].jxssl,data2:this.multipleSelection[1].jxssl});
+              this.getTableData.push({index:'性能未达标损失电量',data1:this.multipleSelection[0].xnsslfraction,data2:this.multipleSelection[1].xnsslfraction});
+              this.getTableData.push({index:'受累损失电量',data1:this.multipleSelection[0].slss,data2:this.multipleSelection[1].slss});
+              this.getTableData.push({index:'风能利用率',data1:this.multipleSelection[0].fnlyl,data2:this.multipleSelection[1].fnlyl});
+              this.getTableData.push({index:'故障损失率',data1:this.multipleSelection[0].gzssl,data2:this.multipleSelection[1].gzssl});
+              this.getTableData.push({index:'检修损失率',data1:this.multipleSelection[0].jxssl,data2:this.multipleSelection[1].jxssl});
+              this.getTableData.push({index:'弃风率',data1:this.multipleSelection[0].qfl,data2:this.multipleSelection[1].qfl});
+              this.getTableData.push({index:'性能损失率',data1:this.multipleSelection[0].xnssl,data2:this.multipleSelection[1].xnssl});
+              this.getTableData.push({index:'受累损失率',data1:this.multipleSelection[0].slssl,data2:this.multipleSelection[1].slssl});
+              this.getTableData.push({index:'复位及时率',data1:this.multipleSelection[0].fwjsl,data2:this.multipleSelection[1].fwjsl});
+              this.getTableData.push({index:'消缺及时率',data1:this.multipleSelection[0].xqjsl,data2:this.multipleSelection[1].xqjsl});
+              this.getTableData.push({index:'状态转换率',data1:this.multipleSelection[0].ztzhjsl,data2:this.multipleSelection[1].ztzhjsl});        
+            }
+            this.$nextTick(function() {
+                this.drawPie('leiDaTu3')
+            })
+            this.$nextTick(function() {
+                this.drawPie2('leiDaTu4')
+            })
+        },
+        getDataLine(){
+          this.$http.get('/powercompare/windfarmAjax').then((res) => {
+              this.options = res.data.data;
+          })
+          this.wpId = this.$route.query.wpId;
+          this.cid = this.$route.query.cid;
+          console.log(this.wpId)
+          if(this.value == ''){
+            if(this.wpId.length == 2){
+              this.tableSwitch = true;
+              this.value = this.wpId[0];
+              this.value2 = this.wpId[1];
+              this.cid1 = this.cid[0];
+              this.cid2 = this.cid[1];
+              this.FiveLossTableData1();
+            }else{
+              this.value = this.wpId;
+              this.cid1 = this.cid;
+              this.FiveLossTableData1();
+            }
+          }else{
+              this.FiveLossTableData1();
+          }
+        },
+        FiveLossTableData1(){
+            this.beginDate = this.timedate[0];
+            this.endDate = this.timedate[1];
+            var interValueLineData = new URLSearchParams();
+            interValueLineData.append('pageNum',this.currentPage2);
+            interValueLineData.append('pageSize',this.pagesize);
+            interValueLineData.append('orderByColumn',this.orderByColumn);
+            interValueLineData.append('isAsc',this.isAsc);
+            interValueLineData.append('cid',this.cid1);
+            interValueLineData.append('beginDate',this.beginDate);
+            interValueLineData.append('endDate',this.endDate);
+            interValueLineData.append('wpId',this.value);
+            this.$http.post('/contrast/benchmarkZjWtList',interValueLineData).then((res) => {
+              this.fdcLineData = res.data.data;
+          })
+          this.FiveLossTableData2();
+        },
+        FiveLossTableData2(){
+            this.beginDate = this.timedate[0];
+            this.endDate = this.timedate[1];
+            if(this.value2.length > 0){
+                this.tableSwitch = true;
+            }else{
+                this.tableSwitch = false;
+            }
+            var interValueLineData = new URLSearchParams();
+            interValueLineData.append('pageNum',this.currentPage2);
+            interValueLineData.append('pageSize',this.pagesize);
+            interValueLineData.append('orderByColumn',this.orderByColumn);
+            interValueLineData.append('isAsc',this.isAsc);
+            interValueLineData.append('cid',this.cid2);
+            interValueLineData.append('beginDate',this.beginDate);
+            interValueLineData.append('endDate',this.endDate);
+            interValueLineData.append('wpId',this.value2);
+            this.$http.post('/contrast/benchmarkZjWtList',interValueLineData).then((res) => {
+             this.fdcLineData2 = res.data.data;
+          })
+        },
+        headStyle() {
+			    return "text-align:center"
+		    },
+        handleSelectionChange(val) {
+            this.sortInOrder = [];
+            this.sortInOrderTop = [];
+            this.getTableData = [];
+            this.sortInOrde2 = [];
+            this.multipleSelection1 = [];
+            this.multipleSelection1 = val;
+        },
+        handleSelectionChange2(val) {
+            this.sortInOrder = [];
+            this.sortInOrderTop = [];
+            this.getTableData = [];
+            this.sortInOrde2 = [];
+            this.multipleSelection2 = [];
+            this.multipleSelection2 = val;
+        },
+        changeTableSort(column){
+          this.orderByColumn = column.prop;
+          if(column.order == "descending"){
+            this.isAsc = 'desc';
+          }else if(column.order == "ascending"){
+            this.isAsc = "asc";
+          }
+          this.getDataLine();
+        },
+        drawPie() {
+            var charts;
+            if (charts != null && charts != "" && charts != undefined){
+                charts.dispose();
+            }
+            charts= this.$echarts.init(document.getElementById('leiDaTu3'));
+            let option = {
+              title: {
+            // text: '对标排名分析',
+            left: 'center'
+        },
+        tooltip: {},
+        // legend: {
+        //     data: ['预算分配（Allocated Budget）', '实际开销（Actual Spending）'],
+        //     left: 'right'
+        // },
+        radar: {
+            // shape: 'circle',
+            name: {
+                textStyle: {
+                    color: '#fff',
+                    backgroundColor: '#999',
+                    borderRadius: 3,
+                    padding: [3, 5]
+                }
+            },
+            indicator: [
+                { name: '风能利用率', max: 150},
+                { name: '消缺及时率', max: 150},
+                { name: '状态转换率', max: 150},
+                { name: '复位及时率', max: 150},
+                { name: '受累损失率', max: 150},
+                { name: '性能损失率', max: 150},
+                { name: '弃风率', max: 150},
+                { name: '检修损失率', max: 150},
+                { name: '故障损失率', max: 150},
+            ]
+        },
+        series: [{
+            name: '预算 vs 开销（Budget vs spending）',
+            type: 'radar',
+            // areaStyle: {normal: {}},
+            data: [
+                {
+                    value: this.sortInOrder,
+                    name:this.fdcName1
+                },
+                {
+                    value: this.sortInOrderTop,
+                    name: this.fdcName2
+                }
+            ]
+        }]
+            }
+            charts.clear();
+            charts.setOption(option);
+            
+          },
+          drawPie2() {
+            var charts2;
+            if (charts2 != null && charts2 != "" && charts2 != undefined){
+                charts2.dispose();
+            }
+            charts2= this.$echarts.init(document.getElementById('leiDaTu4'));
+            let option2 = {
+              legend: {
+                  orient: 'vertical',
+                  left: 'right'
+              },
+              tooltip: {},
+              dataset: {
+                  dimensions: ['product', '限电损失电量单位:万KWh', '故障损失电量单位:万KWh', '检修损失电量单位:万KWh', '性能损失电量单位:万KWh', '受累损失电量单位:万KWh'],
+                  source: this.sortInOrde2
+              },
+              xAxis: {type: 'category'},
+              yAxis: {},
+              series: [
+                  {
+                        // barGap:'100%',/*多个并排柱子设置柱子之间的间距*/
+                        type: 'bar',
+                        barWidth : 30,
+                        itemStyle:{
+                            normal:{
+                                color:'#D201D8'
+                            }
+                        }
+                    },
+                    {
+                        
+                        type: 'bar',
+                        barWidth : 30,
+                        itemStyle:{
+                            normal:{
+                                color:'#FD0100'
+                            }
+                        }
+                    },
+                    {
+                        
+                        type: 'bar',
+                        barWidth : 30,
+                        itemStyle:{
+                            normal:{
+                                color:'#FF7B16'
+                            }
+                        }
+                    },
+                    {
+                        
+                        type: 'bar',
+                        barWidth : 30,
+                        itemStyle:{
+                            normal:{
+                                color:'#8085E9'
+                            }
+                        }
+                    },
+                    {
+                        type: 'bar',
+                        barWidth : 30,
+                        itemStyle:{
+                            normal:{
+                                color:'#A6A6A6'
+                            }
+                        }
+                    },
+              ]
+                  }
+                  charts2.clear();
+                  charts2.setOption(option2);
+            
+          },
+          goReturn(){
+            this.$router.push('/interValue')
+          },
+          toExcel(){}
+          }
+
+}
+</script>
+<style lang="scss" scoped>
+    .box{
+		width: 100%;
+		display: flex;
+		justify-content: space-around;
+ 		align-items: center;
+ 		overflow: hidden;
+	}
+  .searchBar{
+    margin-top: 1%;
+  }
+  #leiDaTu3 {
+		margin-left: 5%;
+		height: 300px;
+		width: 100%;
+		float: left;
+	}
+  #leiDaTu4 {
+		margin: 15%;
+		height: 300px;
+		width: 450px;
+		float: left;
+	}
+  .margin {
+		width: 100%;
+		height: 618px;
+	}
+  .dialogLeftData {
+		width: 50%;
+		height: 650px;
+		text-align: center;
+		float: left;
+	}
+
+	.dialogRightData {
+		width: 50%;
+		height: 650px;
+		text-align: center;
+		float: left;
+	}
+</style>

src/views/gradeEvaluation/PerformanceAnalysis.vue

@@ -2,11 +2,10 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
-                    <span>查询条件</span>
-                </div>
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="风场：">
                 <el-select v-model="value"  placeholder="请选择" @change="projectData">
                 <el-option
@@ -49,7 +48,7 @@
             :data="gridData"
             :row-style="{ height: '10px' }" 
             :cell-style="{ textAlign: 'center',padding:'1px' }" 
-            :header-cell-style="headStyle"
+            :header-cell-style="{ textAlign:'center',background:'#F5F7FA'}"
             @sort-change="changeTableSort"
             @row-click="tableDatawindturbineName"
             border
@@ -64,79 +63,94 @@
                width="125">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="fdl"
               label="实际发电量(万千瓦时)"
-              width="90">
+              width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="llfdl"
               label="理论发电量(万千瓦时)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="sbklyl"
               label="设备利用小时数(小时)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="sbklyl"
               label="设备可利用率(%)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="dxklyxs"
               label="等效可用系数(%)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="fs"
               label="平均风速(m/s)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="xfqr"
               label="小风切入风速(m/s)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="yxxs"
               label="有效风时数(小时)"
-               width="90">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="gzss"
               label="故障损失电量(万千瓦时)"
-               width="95">
+               width="120">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="xdss"
               label="调度限电损失电量(万千瓦时)"
-               width="80">
+               width="120">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="jxss"
               label="计划检修损失电量(万千瓦时)"
-               width="80">
+               width="120">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="xnss"
               label="性能未达标损失电量(万千瓦时)"
-               width="85">
+               width="120">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="gzxs"
               label="故障停用时间(小时)"
-               width="80">
+               width="100">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="glyzxxs"
               label="机组功率一致性系数(%)"
-               width="80">
+               width="120">
             </el-table-column>
             <el-table-column
+            :sortable="'custom'"
               prop="jfpl"
               label="静风频率"
-               width="80">
+               width="100">
             </el-table-column>        
        </el-table>
        </div>
@@ -180,7 +194,7 @@ export default {
             this.callAndSpeedData();
         },
         headStyle() {
-          return "text-align:center"
+          return "text-align:center,background-color:red"
         },
         tableDatawindturbineName(val){
           this.fanData = val;

src/views/gradeEvaluation/PerformanceAnalysisOperation.vue

@@ -6,7 +6,7 @@
                 id="callthepolicetable"
                 :row-style="{ height: '10px' }" 
                 :cell-style="{ textAlign: 'center',padding:'1px' }" 
-                :header-cell-style="headStyle"
+                :header-cell-style="{ textAlign:'center',background:'#F5F7FA'}"
                 @sort-change="changeTableSort"
                 :data="tableDataAll"
                 border

src/views/rankingIndex/CutAndSpeed.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="风场：">
                 <el-select v-model="value"  placeholder="请选择">
                 <el-option

src/views/rankingIndex/CutAndSpeedHistory.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="风场：">
                 <el-select v-model="value"  placeholder="请选择" @change="queryApData">
                 <el-option
@@ -247,7 +249,7 @@ export default {
             }
             var callAndSpeedData = new URLSearchParams();
             callAndSpeedData.append('pageNum',this.currentPage2);
-		    callAndSpeedData.append('pageSize',this.pagesize);
+		        callAndSpeedData.append('pageSize',this.pagesize);
             callAndSpeedData.append('orderByColumn',this.orderByColumn);
             callAndSpeedData.append('isAsc',this.isAsc);
             if(this.value == ''){

src/views/rankingIndex/PlannedGeneration.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="风场：">
                 <el-select v-model="value"  placeholder="请选择" @change="projectData">
                 <el-option

src/views/rankingIndex/RankingCallThePolice.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="维度">
                 <el-select v-model="value"  placeholder="请选择">
                 <el-option

src/views/rankingIndex/RankingCurveDeviationRate.vue

@@ -4,11 +4,13 @@
             <el-tabs v-model="activeName" @tab-click="handleClick" type="card">
                 <el-tab-pane label="月曲线偏差率排行榜" name="first" :key="'first'">
                     <el-card class="box-card">
-                    <div slot="header" class="clearfix" style="font-size:15px">
+                    <!-- <div slot="header" class="clearfix" style="font-size:15px">
                         <span>查询条件</span>
-                    </div>
+                    </div> -->
                     <el-form :inline="true" :model="formInline" class="demo-form-inline">
                 <el-row :gutter="1">
+                    <el-form-item label="查询条件">
+                    </el-form-item>
                     <el-form-item label="风场">
                     <el-select v-model="value"  
                     @change="queryApData()" placeholder="请选择">
@@ -50,11 +52,12 @@
             </el-tab-pane>
             <el-tab-pane label="日曲线偏差率排行榜" name="second" :key="'second'">
                 <el-card class="box-card">
-                    <div slot="header" class="clearfix" style="font-size:15px">
+                    <!-- <div slot="header" class="clearfix" style="font-size:15px">
                         <span>查询条件</span>
-                    </div>
+                    </div> -->
                     <el-form :inline="true" :model="formInline" class="demo-form-inline">
                 <el-row :gutter="1">
+                    <el-form-item label="查询条件"></el-form-item>
                     <el-form-item label="风场">
                     <el-select v-model="value"  
                     @change="queryApData()" placeholder="请选择">
@@ -96,6 +99,7 @@
             :cell-style="{ textAlign: 'center',padding:'1px' }" 
             :header-cell-style="headStyle"
             @sort-change="changeTableSort"
+            @row-click="tableDatawindturbineName"
             style="font-size: 10px;margin-top:1%">
             <el-table-column :label=title>
             <el-table-column
@@ -112,36 +116,59 @@
               prop="monthdeviationrate"
               label="实际/保证(%)"
               width="260">
+              <template slot-scope="scope" > 
+                  <div @click="clickCopy('sjbz')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template> 
             </el-table-column>
             <el-table-column
             :sortable="'custom'"
               prop="standarddeviationrate"   
               label="实际/量优(%)"
               width="260">
+              <template slot-scope="scope" > 
+                  <div @click="clickCopy('sjzy')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template> 
             </el-table-column>
             <el-table-column
             :sortable="'custom'"
               prop="yeardeviationrate"
               label="实际/保证(%)"
               width="260">
+              <template slot-scope="scope" > 
+                  <div @click="clickCopy('zybz')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template>
             </el-table-column>
             <el-table-column
               prop="deviationrate1"
               label="环比"
                width="260">
+               <template slot-scope="scope" > 
+                  <div @click="clickCopy('hb')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template>
             </el-table-column>
             <el-table-column
               prop="deviationrate2"
               label="同比"
                width="260">
+               <template slot-scope="scope" > 
+                  <div @click="clickCopy('tb')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template>
             </el-table-column>
             <el-table-column
               prop="deviationrate3"
               label="比标杆风机"
                width="260">
+               <template slot-scope="scope" > 
+                  <div @click="clickCopy('bg')" :style="{color:'#000000'}">{{scope.row.monthdeviationrate}}</div>
+              </template>
             </el-table-column>
             </el-table-column>        
        </el-table>
+       <el-dialog :title="eldialogtitle" :visible.sync="dialogFormVisible">
+           <div style="width:100%;height:400px">
+            <div id="leiDaTu" class="echart" style="width:100%;height:350px"></div>
+           </div>
+        </el-dialog>
         </div>
     </div>
 </template>
@@ -170,7 +197,17 @@ export default {
 		    pagesize: 10,
             orderByColumn:'',
             isAsc: '',
+            type:'1',
             gridData:[],
+            dialogFormVisible:false,
+            fanData:[],
+            ChartData:[],
+            dayChartData:[],
+            Xdata:[],
+            sjdata:[],
+            bzdata:[],
+            eldialogtitle:'',
+
             
         }
     },
@@ -185,10 +222,59 @@ export default {
 			return "text-align:center"
 		},
         handleClick(tab) {
-            // console.log(tab.name)
+            console.log(tab.name)
             this.information = tab.name;
+            // console.log(this.information)
             this.DeviceRatData();
         },
+        clickCopy(e) {
+             this.type = e;
+        },
+        tableDatawindturbineName(val) {
+        //   console.log(val);
+          this.dialogFormVisible = true;
+          this.Xdata = [];
+          this.sjdata = [];
+          this.bzdata = [];
+          this.fanData = val;
+          var deviceRateChartData = new URLSearchParams();
+          if(this.information == 'first'){
+            this.eldialogtitle = '月曲线偏差率排行';
+            deviceRateChartData.append('type',this.type);
+            deviceRateChartData.append('wtId',this.fanData.windturbineid);
+            deviceRateChartData.append('year',this.timeyear);
+            deviceRateChartData.append('month',this.timemonth);
+            this.$http.post('/leaderboard/curveMonthchatAjax',deviceRateChartData).then((res) =>{
+                this.ChartData = res.data.data.datas;
+                console.log(this.ChartData)
+                for(let i = 0; i<this.ChartData.length ; i++){
+                    this.Xdata.push(this.ChartData[i].value1);
+                    this.sjdata.push(this.ChartData[i].value2);
+                    this.bzdata.push(this.ChartData[i].value3);
+                }
+                this.$nextTick(function() {
+                    this.drawPie('leiDaTu')
+                })
+            })
+          }else if(this.information == 'second'){
+            this.eldialogtitle = '日曲线偏差率排行';
+            deviceRateChartData.append('type',this.type);
+            deviceRateChartData.append('wtId',this.fanData.windturbineid);
+            deviceRateChartData.append('recorddate',this.time);
+            this.$http.post('/leaderboard/getCurvechatAjax',deviceRateChartData).then((res) =>{
+                this.ChartData = res.data.data.datas;
+                console.log(this.ChartData)
+                for(let i = 0; i<this.ChartData.length ; i++){
+                    this.Xdata.push(this.ChartData[i].value1);
+                    this.sjdata.push(this.ChartData[i].value2);
+                    this.bzdata.push(this.ChartData[i].value3);
+                }
+                this.$nextTick(function() {
+                    this.drawPie('leiDaTu')
+                })
+            })
+           }
+        },
         changeTableSort(column){
 			this.orderByColumn = column.prop;
 			if(column.order == "descending"){
@@ -230,6 +316,79 @@ export default {
                 })
             }
         },
+        drawPie() {
+				var charts;
+				if (charts != null && charts != "" && charts != undefined){
+				    charts.dispose();
+				}
+				charts= this.$echarts.init(document.getElementById('leiDaTu'));
+				let option = {
+                    tooltip: {
+                        trigger: 'axis',
+                        axisPointer: {
+                            type: 'cross',
+                            crossStyle: {
+                                color: '#999'
+                            }
+                        }
+                    },
+					title: {
+                        text: '曲线偏差率排行',
+                        left: 'center'
+                    },
+                    tooltip: {
+                        trigger: 'axis'
+                    },
+                    legend: {
+                         orient: 'vertical',
+                        left: 'center',
+                        bottom:'bottom',
+                        data: ['实际功率(kw)', '保证功率(kw)']
+                    },
+                    // grid: {
+                    //     left: '3%',
+                    //     right: '4%',
+                    //     bottom: '3%',
+                    //     containLabel: true
+                    // },
+                    xAxis: {
+                        type: 'category',
+                        // boundaryGap: false,
+                        axisPointer: {
+                            type: 'shadow'
+                        },
+                        // splitLine: {
+                        //      show: true,
+                        // },
+                        data: this.Xdata
+                    },
+                    yAxis: {
+                        type: 'value'
+                    },
+                    series: [
+                        {
+                            name: '实际功率(kw)',
+                            type: 'line',
+                            stack: '总量',
+                            data: this.sjdata
+                        },
+                        {
+                            name: '保证功率(kw)',
+                            type: 'line',
+                            stack: '总量',
+                            data: this.bzdata,
+                            itemStyle:{
+                                normal:{
+                                    color:'#000000'
+                                }
+                            },
+                        },
+                    ]
+				}
+				charts.clear();
+				charts.setOption(option);
+				
+		},
         toExcel(){
             excelHelper.exportExcel("devicerattable","负荷率排行榜",".xls",true);
         }
@@ -247,4 +406,5 @@ export default {
     .searchBar{
         margin-top: 1%;
     }
+
 </style>

src/views/rankingIndex/RankingLoadRate.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="类型">
                 <el-select v-model="value"  placeholder="请选择">
                 <el-option

src/views/rankingIndex/RankingUtilization.vue

@@ -2,11 +2,13 @@
     <div class="box">
         <div class="searchBar">
             <el-card class="box-card">
-                <div slot="header" class="clearfix" style="font-size:15px">
+                <!-- <div slot="header" class="clearfix" style="font-size:15px">
                     <span>查询条件</span>
-                </div>
+                </div> -->
                 <el-form :inline="true" :model="formInline" class="demo-form-inline">
             <el-row :gutter="1">
+                <el-form-item label="查询条件">
+                </el-form-item>
                 <el-form-item label="类型">
                 <el-select v-model="value"  placeholder="请选择">
                 <el-option

src/views/rankingIndex/SingleMachinePower.vue

@@ -4,11 +4,10 @@
             <el-tabs v-model="activeName" @tab-click="handleClick" type="card">
                 <el-tab-pane label="总功率情况" name="first" :key="'first'">
                     <el-card class="box-card">
-                    <div slot="header" class="clearfix" style="font-size:15px;height:10px">
-                        <span>查询条件</span>
-                    </div>
                     <el-form :inline="true" :model="formInline" class="demo-form-inline" style="height:30px">
                 <el-row :gutter="1">
+                    <el-form-item label="查询条件:">
+                    </el-form-item>
                     <el-form-item label="风电电场：">
                     <el-select v-model="value"  
                     @change="queryApData()" placeholder="请选择">
@@ -47,11 +46,10 @@
             </el-tab-pane>
             <el-tab-pane label="月功率情况" name="second" :key="'second'">
                 <el-card class="box-card">
-                    <div slot="header" class="clearfix" style="font-size:15px;height:10px">
-                        <span>查询条件</span>
-                    </div>
                     <el-form :inline="true" :model="formInline" class="demo-form-inline" style="height:30px">
                 <el-row :gutter="1">
+                    <el-form-item label="查询条件:">
+                    </el-form-item>
                     <el-form-item label="风场">
                     <el-select v-model="value"  
                     @change="queryApData()" placeholder="请选择">
@@ -78,18 +76,22 @@
                     </el-form-item>
                     <el-form-item label="年份：">
                         <el-date-picker
+                        value-format="yyyy"
                         v-model="timeyear"
-                        
                         type="year"
                         placeholder="选择年"
+                        format="yyyy"
                         >
                         </el-date-picker>
                     </el-form-item>
                     <el-form-item label="月份：">
                         <el-date-picker
-                        v-model="timemonth"
+                        value-format="yyyy-MM"
+                        v-model="month"
                         type="month"
-                        placeholder="选择月">
+                        placeholder="选择月"
+                        format="yyyy-MM"
+                        >
                         </el-date-picker>
                     </el-form-item>
 
@@ -107,11 +109,10 @@
             </el-tab-pane>
             <el-tab-pane label="日功率情况" name="cord" :key="'cord'">
                 <el-card class="box-card">
-                    <div slot="header" class="clearfix" style="font-size:15px;height:10px">
-                        <span>查询条件</span>
-                    </div>
                     <el-form :inline="true" :model="formInline" class="demo-form-inline" style="height:30px">
                 <el-row :gutter="1">
+                    <el-form-item label="查询条件:">
+                    </el-form-item>
                     <el-form-item label="风场">
                     <el-select v-model="value"  
                     @change="queryApData()" placeholder="请选择">
@@ -138,9 +139,11 @@
                     </el-form-item>
                     <el-form-item label="选择时间：">
                         <el-date-picker
+                        value-format="yyyy-MM-dd"
                         v-model="time"
                         type="date"
-                        placeholder="选择日期">
+                        placeholder="选择日期"
+                        format="yyyy-MM-dd">
                         </el-date-picker>
                     </el-form-item>
 
@@ -307,6 +310,7 @@ export default {
             value2:'MG01_01',
             options: [],
             options2:[],
+            month:'2021-01',
             time:'2021-01-01',
             timemonth:'1',
             timeyear:'2021',
@@ -411,7 +415,16 @@ export default {
                 singleMachinePowerData.append('orderByColumn',this.orderByColumn);
                 singleMachinePowerData.append('isAsc',this.isAsc);
                 singleMachinePowerData.append('wtId',this.value2);
+                this.timeyear = this.timeyear.toString();          
                 singleMachinePowerData.append('year',this.timeyear);
+                this.timemonth = this.month.toString();          
+                console.log(this.timemonth)
+                    // this.timemonth = this.month.substring(6,7);
+                if(this.timemonth.substring(6,7) < 10){
+                    this.timemonth = this.timemonth.substring(6,7);
+                }else{
+                    this.timemonth = this.timemonth.substring(5,7)
+                }                 
                 singleMachinePowerData.append('month',this.timemonth);
                 this.$http.post("/powersaturation/powersaturationmonthlist",singleMachinePowerData).then((res) =>{
                     this.gridData = res.data.data.list;