项目对标的对标不显示

src/views/Decision/Decision2.vue

@@ -58,38 +58,51 @@
 				<button class="btn">导出</button>
 			</div>
 		</div>
-		<div class="mg-b-16">
-			<div class="project-table">
-				<Table :data="tableData" :canScroll="false"></Table>
+
+		<div v-show="detailShow==1">
+			<div class="mg-b-16">
+				<div class="project-table">
+					<Table :data="tableData" :canScroll="false"></Table>
+				</div>
 			</div>
-		</div>
-		<el-row class="mg-b-16">
-			<el-col :span="8">
-				<panel title="发电量占比">
-					<dual-pie-chart height="21.296vh" :innerData="innerFdl" :outerData="outerFdl" />
-				</panel>
-			</el-col>
-			<el-col :span="8">
-				<panel title="各场站损失电量占比">
-					<dual-pie-chart height="21.296vh" :innerData="innerCz" :outerData="outerCz" />
+			<el-row class="mg-b-16">
+				<el-col :span="8">
+					<panel title="发电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerFdl" :outerData="outerFdl" />
+					</panel>
+				</el-col>
+				<el-col :span="8">
+					<panel title="各场站损失电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerCz" :outerData="outerCz" />
+					</panel>
+				</el-col>
+				<el-col :span="8">
+					<panel title="理论发电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerLl" :outerData="outerLl" />
+					</panel>
+				</el-col>
+			</el-row>
+			<div>
+				<panel title="损失电量分析">
+					<multiple-bar-chart height="300px" :list="analyis" :customerTooltip="true" @tooltip="tooltip"
+						:units='["(万KWh)"]' />
 				</panel>
-			</el-col>
-			<el-col :span="8">
-				<panel title="理论发电量占比">
-					<dual-pie-chart height="21.296vh" :innerData="innerLl" :outerData="outerLl" />
+			</div>
+			<el-dialog title="对标排名分析" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
+				:close-on-click-modal="false">
+				<dayinfo :radarValue="radarValue" :windNum="windNum" :windNum2="windNum2" :tabs="tabs"
+					:analyisDialog="analyisDialog" />
+			</el-dialog>
+		</div>
+		<el-row :type="'flex'" class="content" v-show="detailShow==2">
+			<el-col :span="24" class="pd-l-8">
+				<panel :title="'风机对标列表明细'" :showLine="false">
+					<div class="project-table">
+						<Table :data="tableDataDetail"></Table>
+					</div>
 				</panel>
 			</el-col>
 		</el-row>
-		<div>
-			<panel title="损失电量分析">
-				<multiple-bar-chart height="240px" :list="analyis" :customerTooltip="true" @tooltip="tooltip"
-					:units='["(万KWh)"]' />
-			</panel>
-		</div>
-		<el-dialog title="对标排名分析" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
-			:close-on-click-modal="false">
-			<dayinfo :radarValue="radarValue" :windNum="windNum" :windNum2="windNum2" :tabs="tabs" />
-		</el-dialog>
 	</div>
 </template>
 
@@ -131,7 +144,6 @@
 								return "<input class='check' type='CheckBox'/>";
 							},
 							click: function(event, data) {
-								console.log(data)
 								// checkbox 事件
 								// event.target checkbox or td 需进行判断
 								// event.target.checked 判断 checkbox 是否选中
@@ -169,6 +181,20 @@
 							sortable: true,
 						},
 						{
+							name: "发电量排名",
+							field: "fdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量",
+							field: "fdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
 							name: "故障损失电量排名",
 							field: "gzssdlpm",
 							is_num: false,
@@ -236,6 +262,18 @@
 							is_light: false,
 							sortable: true,
 						}, {
+							name: "风能利用率排名",
+							field: "fnlylpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率(%)",
+							field: "fnlyl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},{
 							name: "故障损失率排名",
 							field: "gzsslpm",
 							is_num: false,
@@ -304,12 +342,225 @@
 								return "<a class='action'>详情</a>";
 							},
 							click: function(event, data) {
-								// checkbox 事件
-								// data 判断 当前数据
-								// console.log(that);
-								// console.log(event.target);
-								// console.log(data);
+								var dataId = that.tableIdArr[data.index - 1];
+								that.detailShow = 2;
+								// var that = this;
+								that.API.requestData({
+									method: "GET",
+									subUrl: "benchmarking/details",
+									data: {
+										id: dataId,
+										beginDate: that.value4,
+										endDate: that.value5,
+										target: '',
+										sort: ''
+									},
+									success(res) {
+										var dataTab = [];
+										res.data.forEach((item, index) => {
+											that.tableIdArr.push(item.id);
+
+											dataTab.push({ //表格
+												index: index + 1,
+												name: item.name,
+												zhpm: item.zhpm,
+												gzssdl: item.gzssdl,
+												jxssdlpm: item.jxssdlpm,
+												jxssdl: item.jxssdl,
+												xnssdlpm: item.xnssdlpm,
+												xnssdl: item.xnssdl,
+												xdssdlpm: item.xdssdlpm,
+												xdssdl: item.xdssdl,
+												slssdlpm: item.slssdlpm,
+												slssdl: item.slssdl,
+												fnlylpm: item.fnlylpm,
+												fnlyl: item.fnlyl,
+												gzsslpm: item.gzsslpm,
+												gzssl: item.gzssl,
+												jxsslpm: item.jxsslpm,
+												jxssl: item.jxssl,
+												qflpm: item.qflpm,
+												qfl: item.qfl,
+												xnsslpm: item.xnsslpm,
+												xnssl: item.xnssl,
+												slsslpm: item.slsslpm,
+												slssl: item.slssl,
+												is_light: false
+											})
+										})
+										that.tableDataDetail.data = dataTab;
+									}
+								});
+							}
+						}
+					],
+					data: [],
+				},
+				tableDataDetail: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
 							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "风机名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
 						}
 					],
 					data: [],
@@ -330,11 +581,13 @@
 				innerLl: [], //理论发电量占比
 				outerLl: [],
 				analyis: [], //损失电量分析
-				dialogVisible: true,
+				dialogVisible: false,
 				radarValue: [],
 				windNum: 'dd',
 				windNum2: 'dd',
-				tabs: []
+				tabs: [],
+				analyisDialog: [],
+				detailShow: 1
 			};
 		},
 		created() {
@@ -447,11 +700,12 @@
 							slssdl = [];
 						res.data.forEach((item, index) => {
 							that.tableIdArr.push(item.id);
-
 							dataTab.push({ //表格
 								index: index + 1,
 								name: item.name,
 								zhpm: item.zhpm,
+								fdlpm: item.fdlpm,
+								fdl: item.fdl,
 								gzssdlpm: item.gzssdlpm,
 								gzssdl: item.gzssdl,
 								jxssdlpm: item.jxssdlpm,
@@ -462,6 +716,8 @@
 								xdssdl: item.xdssdl,
 								slssdlpm: item.slssdlpm,
 								slssdl: item.slssdl,
+								fnlylpm: item.fnlylpm,
+								fnlyl: item.fnlyl,
 								gzsslpm: item.gzsslpm,
 								gzssl: item.gzssl,
 								jxsslpm: item.jxsslpm,
@@ -612,19 +868,69 @@
 							windData2: data[1].slssl
 						}];
 
-
 						that.radarValue = [{
 							indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率"],
 							data: [{
-								value: [data[0].fnlyl, data[0].gzssl, data[0].jxssl, data[0].qfl,
-									data[0].xnssl, data[0].slssl
+								value: [data[0].fnlylpm, data[0].gzsslpm, data[0].jxsslpm, data[0].qflpm,
+									data[0].xnsslpm, data[0].slsslpm
 								]
 							}, {
-								value: [data[1].fnlyl, data[1].gzssl, data[1].jxssl, data[1].qfl,
-									data[1].xnssl, data[1].slssl
+								value: [data[1].fnlylpm, data[1].gzsslpm, data[1].jxsslpm, data[1].qflpm,
+									data[1].xnsslpm, data[1].slsslpm
 								]
 							}]
 						}];
+
+						var analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							gzssdl.push({
+								text: item.name,
+								value: item.gzssdl
+							});
+							jxssdl.push({
+								text: item.name,
+								value: item.jxssdl
+							});
+							xnssdl.push({
+								text: item.name,
+								value: item.xnssdl
+							});
+							xdssdl.push({
+								text: item.name,
+								value: item.xdssdl
+							});
+							slssdl.push({
+								text: item.name,
+								value: item.slssdl
+							});
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.analyisDialog = analyis;
 					}
 				});
 			},
@@ -653,6 +959,12 @@
 
 <style lang="less">
 	.decision-page-2 {
+		.content .project-table {
+			tbody {
+				height: calc(100vh - 24.5vh);
+			}
+		}
+
 		.project-table {
 			overflow: auto;
 

src/views/Decision/Decision2Cndb.vue

@@ -1,35 +1,860 @@
 <template>
 	<div class="decision-page-2">
-		场内对标
-		<normal-radar-chart :height="'500px'" />
+		<div class="query mg-b-8">
+			<div class="query-items">
+				<div class="query-item">
+					<div class="lable">场站：</div>
+					<div class="search-input">
+						<el-select v-model="value1" @change="ChangZhanChange(value1)" clearable placeholder="请选择"
+							popper-class="select">
+							<el-option v-for="item in ChangZhan" :key="item.id" :value="item.id" :label="item.name">
+							</el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">开始日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value4" @change="BeginChange(value4)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">结束日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value5" @change="EndChange(value5)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+						<div class="unit svg-icon svg-icon-gray">
+							<svg-icon :svgid="''" />
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="query-actions">
+				<button class="btn green">搜索</button>
+				<button class="btn" @click="dbfx">对标分析</button>
+				<button class="btn">导出</button>
+			</div>
+		</div>
+		<div v-show="detailShow==1">
+			<div class="mg-b-16">
+				<div class="project-table">
+					<Table :data="tableData" :canScroll="false"></Table>
+				</div>
+			</div>
+			<el-row :type="'flex'" class="content">
+				<el-col :span="24" class="pd-l-8">
+					<panel title="损失电量分析">
+						<multiple-bar-chart height="400px" :list="analyis" :customerTooltip="true" @tooltip="tooltip"
+							:units='["(万KWh)"]' />
+					</panel>
+				</el-col>
+			</el-row>
+			<el-dialog title="对标排名分析" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
+				:close-on-click-modal="false">
+				<dayinfo :radarValue="radarValue" :windNum="windNum" :windNum2="windNum2" :tabs="tabs"
+					:analyisDialog="analyisDialog" />
+			</el-dialog>
+		</div>
+		<el-row :type="'flex'" class="content" v-show="detailShow==2">
+			<el-col :span="24" class="pd-l-8">
+				<panel :title="'风机对标列表明细'" :showLine="false">
+					<div class="project-table">
+						<Table :data="tableDataDetail"></Table>
+					</div>
+				</panel>
+			</el-col>
+		</el-row>
 	</div>
 </template>
 
 <script>
-	import NormalRadarChart from "../../components/chart/radar/normal-radar-chart.vue";
+	import MultipleBarChart from "../../components/chart/bar/multiple-bar-chart.vue";
+	import DualPieChart from "../../components/chart/pie/dual-pie-chart.vue";
+	import SvgIcon from "../../components/coms/icon/svg-icon.vue";
+	import Panel from "../../components/coms/panel/panel.vue";
+	import Table from "../../components/coms/table/table.vue";
+	import Dayinfo from "./dayinfo.vue";
 	export default {
 		components: {
-			NormalRadarChart
+			Panel,
+			Table,
+			SvgIcon,
+			DualPieChart,
+			MultipleBarChart,
+			Dayinfo
 		},
 		data() {
-			return {}
+			let that = this;
+			return {
+				tableIdArr: [], //放checkbox的id数组
+				tableDateArr: [],
+				tableDate: [],
+				checkLength: 0, //对标分析只能选择2个
+				tableData: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								var dataDate = that.tableDateArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableDate.forEach((item, i) => {
+										if (item == dataDate) {
+											that.tableDate.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableDate.push(dataDate)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "日期",
+							field: "date",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "发电量排名",
+							field: "fdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量",
+							field: "fdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量排名",
+							field: "gzssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率排名",
+							field: "fnlylpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率(%)",
+							field: "fnlyl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "操作",
+							field: "cz",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<a class='action'>详情</a>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								console.log(dataId)
+								that.detailShow = 2;
+								// var that = this;
+								that.API.requestData({
+									method: "GET",
+									subUrl: "benchmarking/details",
+									data: {
+										id: dataId,
+										beginDate: that.value4,
+										endDate: that.value5,
+										target: '',
+										sort: ''
+									},
+									success(res) {
+										var dataTab = [];
+										res.data.forEach((item, index) => {
+											that.tableIdArr.push(item.id);
+
+											dataTab.push({ //表格
+												index: index + 1,
+												name: item.name,
+												zhpm: item.zhpm,
+												gzssdl: item.gzssdl,
+												jxssdlpm: item.jxssdlpm,
+												jxssdl: item.jxssdl,
+												xnssdlpm: item.xnssdlpm,
+												xnssdl: item.xnssdl,
+												xdssdlpm: item.xdssdlpm,
+												xdssdl: item.xdssdl,
+												slssdlpm: item.slssdlpm,
+												slssdl: item.slssdl,
+												gzsslpm: item.gzsslpm,
+												gzssl: item.gzssl,
+												jxsslpm: item.jxsslpm,
+												jxssl: item.jxssl,
+												qflpm: item.qflpm,
+												qfl: item.qfl,
+												xnsslpm: item.xnsslpm,
+												xnssl: item.xnssl,
+												slsslpm: item.slsslpm,
+												slssl: item.slssl,
+												is_light: false
+											})
+										})
+										that.tableDataDetail.data = dataTab;
+									}
+								});
+							}
+						}
+					],
+					data: [],
+				},
+				tableDataDetail: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "风机名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}
+					],
+					data: [],
+				},
+				options: [],
+				ChangZhan: [], //场站
+				XiangMu: [], //项目
+				XianLu: [], //线路
+				value1: [],
+				value4: "",
+				value5: "",
+				analyis: [], //损失电量分析
+				dialogVisible: false,
+				radarValue: [],
+				windNum: 'dd',
+				windNum2: 'dd',
+				tabs: [],
+				analyisDialog: [],
+				detailShow: 1
+			};
 		},
 		created() {
-			
+			this.ChangZhanVal();
+			this.value4 = this.getTime(1);
+			this.value5 = this.getTime(2);
+			this.AjaxCommon();
 		},
 		methods: {
-			
+			ChangZhanVal() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/wplist",
+					success(res) {
+						that.ChangZhan = res.data;
+						that.value1 = res.data[0].id;
+					}
+				});
+			},
+			ChangZhanChange(val) {
+				this.value1 = val;
+				this.AjaxCommon();
+			},
+			BeginChange(val) {
+				this.value4 = val;
+				this.AjaxCommon();
+			},
+			EndChange(val) {
+				this.value5 = val;
+				this.AjaxCommon();
+			},
+			getTime(val) { //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+				var date = new Date();
+				var year = date.getFullYear(),
+					month = date.getMonth() + 1,
+					day = date.getDate();
+				month >= 1 && month <= 9 ? (month = '0' + month) : '';
+				day >= 0 && day <= 9 ? (day = '0' + day) : '';
+				var begin = year + '-' + month + '-01';
+				var end = year + '-' + month + '-' + day;
+				if (val == 1) {
+					return begin;
+				} else if (val == 2) {
+					return end;
+				}
+			},
+			AjaxCommon() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/cndb",
+					data: {
+						wpid: that.value1,
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						console.log(JSON.stringify(res))
+						var dataTab = [], //表格
+							analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							that.tableDateArr.push(item.date);
+that.tableIdArr.push(item.id);
+							dataTab.push({ //表格
+								index: index + 1,
+								zhpm: item.zhpm,
+								date: item.date.substr(0, 10),
+								fdlpm: item.fdlpm,
+								fdl: item.fdl,
+								gzssdlpm: item.gzssdlpm,
+								gzssdl: item.gzssdl,
+								jxssdlpm: item.jxssdlpm,
+								jxssdl: item.jxssdl,
+								xnssdlpm: item.xnssdlpm,
+								xnssdl: item.xnssdl,
+								xdssdlpm: item.xdssdlpm,
+								xdssdl: item.xdssdl,
+								slssdlpm: item.slssdlpm,
+								slssdl: item.slssdl,
+								fnlylpm: item.fnlylpm,
+								fnlyl: item.fnlyl,
+								gzsslpm: item.gzsslpm,
+								gzssl: item.gzssl,
+								jxsslpm: item.jxsslpm,
+								jxssl: item.jxssl,
+								qflpm: item.qflpm,
+								qfl: item.qfl,
+								xnsslpm: item.xnsslpm,
+								xnssl: item.xnssl,
+								slsslpm: item.slsslpm,
+								slssl: item.slssl,
+								is_light: false
+							})
+							if (index < 7) {
+								gzssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.gzssdl
+								});
+								jxssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.jxssdl
+								});
+								xnssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.xnssdl
+								});
+								xdssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.xdssdl
+								});
+								slssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.slssdl
+								});
+							}
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.tableData.data = dataTab;
+
+						that.analyis = analyis;
+					}
+				});
+			},
+			AjaxDbfx() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/cndb",
+					data: {
+						wpid: that.value1,
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						var data = res.data;
+						that.windNum = data[0].date.substr(0, 10);
+						that.windNum2 = data[1].date.substr(0, 10);
+						that.tabs = [{
+							name: "发电量",
+							windData1: data[0].fdl,
+							windData2: data[1].fdl
+						}, {
+							name: "故障损失电量",
+							windData1: data[0].gzssdl,
+							windData2: data[1].gzssdl
+						}, {
+							name: "检修损失电量",
+							windData1: data[0].jxssdl,
+							windData2: data[1].jxssdl
+						}, {
+							name: "性能未达标损失电量",
+							windData1: data[0].xnssdl,
+							windData2: data[1].xnssdl
+						}, {
+							name: "受累损失电量",
+							windData1: data[0].slssdl,
+							windData2: data[1].slssdl
+						}, {
+							name: "风能利用率",
+							windData1: data[0].fnlyl,
+							windData2: data[1].fnlyl
+						}, {
+							name: "故障损失率",
+							windData1: data[0].gzssl,
+							windData2: data[1].gzssl
+						}, {
+							name: "检修损失率",
+							windData1: data[0].jxssl,
+							windData2: data[1].jxssl
+						}, {
+							name: "弃风率",
+							windData1: data[0].qfl,
+							windData2: data[1].qfl
+						}, {
+							name: "性能损失率",
+							windData1: data[0].xnssl,
+							windData2: data[1].xnssl
+						}, {
+							name: "受累损失率",
+							windData1: data[0].slssl,
+							windData2: data[1].slssl
+						}];
+
+						that.radarValue = [{
+							indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率"],
+							data: [{
+								value: [data[0].fnlylpm, data[0].gzsslpm, data[0].jxsslpm, data[0]
+									.qflpm,
+									data[0].xnsslpm, data[0].slsslpm
+								]
+							}, {
+								value: [data[1].fnlylpm, data[1].gzsslpm, data[1].jxsslpm, data[1]
+									.qflpm,
+									data[1].xnsslpm, data[1].slsslpm
+								]
+							}]
+						}];
+
+						var analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							if (index < 7) {
+								gzssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.gzssdl
+								});
+								jxssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.jxssdl
+								});
+								xnssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.xnssdl
+								});
+								xdssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.xdssdl
+								});
+								slssdl.push({
+									text: item.date.substr(0, 10),
+									value: item.slssdl
+								});
+							}
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.analyisDialog = analyis;
+					}
+				});
+			},
+			tooltip(param, callback) {
+				var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
+
+				var result = param[0].axisValue;
+				param.forEach((value, index) => {
+					result += "<br />" +
+						`<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
+						value.seriesName + "：" + value.value;
+				});
+				callback(result);
+				return true;
+			},
+			dbfx() {
+				var that = this;
+				if (that.tableDate.length == 2) {
+					that.dialogVisible = true;
+					this.AjaxDbfx();
+				}
+			}
 		}
 	};
 </script>
 
 <style lang="less">
 	.decision-page-2 {
+		.content .project-table {
+			tbody {
+				height: calc(100vh - 24.5vh);
+			}
+		}
 		.project-table {
 			overflow: auto;
 
 			tbody {
-				height: 189px;
+				height: calc(100vh - 65vh);
 			}
 
 			th,
@@ -45,5 +870,11 @@
 				}
 			}
 		}
+
+		.action {
+			text-decoration: underline;
+			color: @green;
+			cursor: pointer;
+		}
 	}
 </style>

src/views/Decision/dayinfo.vue

@@ -2,8 +2,10 @@
 	<div class="health-day-info">
 		<div class="body">
 			<div class="left">
-				<div class="chart-body">
-					<normal-radar-chart :height="'500px'" :value="radarValue" />
+				<div class="header">
+					<span class="herder-info">
+						对标排名分析
+					</span>
 				</div>
 				<div class="chart-body">
 					<normal-radar-chart :height="'500px'" :value="radarValue" />
@@ -28,15 +30,31 @@
 					</tr>
 				</table>
 			</div>
+
+		</div>
+		<div class="body">
+			<div style="width: 100%;">
+				<div class="header">
+					<span class="herder-info">
+						损失电量分析
+					</span>
+				</div>
+				<div class="chart-body">
+					<multiple-bar-chart height="240px" :list="analyisDialog" :customerTooltip="true" @tooltip="tooltip"
+						:units='["(万KWh)"]' />
+				</div>
+			</div>
 		</div>
 	</div>
 </template>
 
 <script>
 	import NormalRadarChart from "../../components/chart/radar/normal-radar-chart.vue";
+	import MultipleBarChart from "../../components/chart/bar/multiple-bar-chart.vue";
 	export default {
 		components: {
-			NormalRadarChart
+			NormalRadarChart,
+			MultipleBarChart
 		},
 		props: {
 			windNum: {
@@ -50,10 +68,9 @@
 			radarValue: {
 				type: Array,
 				default: () => [{
-					indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率", "复位及时率", "消缺及时率","状态转换率"],
+					indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率", "复位及时率", "消缺及时率", "状态转换率"],
 					data: [{
-						value: [44200, 14200, 20000, 35000, 50000, 38000, 44200, 14200, 20000],
-						name:'adf'
+						value: [44200, 14200, 20000, 35000, 50000, 38000, 44200, 14200, 20000]
 					}],
 				}],
 			},
@@ -117,7 +134,45 @@
 					windData2: 1
 				}],
 			},
+			analyisDialog: {
+				type: Array,
+				default: () => [{
+					title: "故障损失电量",
+					yAxisIndex: 0,
+					value: [11, 22]
+				}, {
+					title: "检修损失电量",
+					yAxisIndex: 0,
+					value: [11, 22]
+				}, {
+					title: "性能损失电量",
+					yAxisIndex: 0,
+					value: [11, 22]
+				}, {
+					title: "限电损失电量",
+					yAxisIndex: 0,
+					value: [11, 22]
+				}, {
+					title: "受累损失电量",
+					yAxisIndex: 0,
+					value: [11, 22]
+				}]
+			},
 		},
+		methods: {
+			tooltip(param, callback) {
+				var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
+
+				var result = param[0].axisValue;
+				param.forEach((value, index) => {
+					result += "<br />" +
+						`<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
+						value.seriesName + "：" + value.value;
+				});
+				callback(result);
+				return true;
+			},
+		}
 	};
 </script>
 

src/views/Decision/decision2Cjdb.vue

@@ -1,30 +1,896 @@
 <template>
 	<div class="decision-page-2">
-		场内对标
-		<normal-radar-chart :height="'500px'" />
+		<div class="query mg-b-8">
+			<div class="query-items">
+				<div class="query-item">
+					<div class="lable">场站：</div>
+					<div class="search-input">
+						<el-select v-model="value1" @change="ChangZhanChange(value1)" multiple placeholder="请选择"
+							popper-class="select">
+							<el-option v-for="item in ChangZhan" :key="item.id" :value="item.id" :label="item.name">
+							</el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">开始日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value4" @change="BeginChange(value4)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">结束日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value5" @change="EndChange(value5)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+						<div class="unit svg-icon svg-icon-gray">
+							<svg-icon :svgid="''" />
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="query-actions">
+				<button class="btn green">搜索</button>
+				<button class="btn" @click="dbfx">对标分析</button>
+				<button class="btn">导出</button>
+			</div>
+		</div>
+
+		<div v-show="detailShow==1">
+			<div class="mg-b-16">
+				<div class="project-table">
+					<Table :data="tableData" :canScroll="false"></Table>
+				</div>
+			</div>
+			<el-row class="mg-b-16">
+				<el-col :span="12">
+					<panel title="发电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerFdl" :outerData="outerFdl" />
+					</panel>
+				</el-col>
+				<el-col :span="12">
+					<panel title="各场站损失电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerCz" :outerData="outerCz" />
+					</panel>
+				</el-col>
+			</el-row>
+			<div>
+				<panel title="损失电量分析">
+					<multiple-bar-chart height="300px" :list="analyis" :customerTooltip="true" @tooltip="tooltip"
+						:units='["(万KWh)"]' />
+				</panel>
+			</div>
+			<el-dialog title="对标排名分析" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
+				:close-on-click-modal="false">
+				<dayinfo :radarValue="radarValue" :windNum="windNum" :windNum2="windNum2" :tabs="tabs"
+					:analyisDialog="analyisDialog" />
+			</el-dialog>
+		</div>
+		<el-row :type="'flex'" class="content" v-show="detailShow==2">
+			<el-col :span="24" class="pd-l-8">
+				<panel :title="'风机对标列表明细'" :showLine="false">
+					<div class="project-table">
+						<Table :data="tableDataDetail"></Table>
+					</div>
+				</panel>
+			</el-col>
+		</el-row>
 	</div>
 </template>
 
 <script>
-	import NormalRadarChart from "../../components/chart/radar/normal-radar-chart.vue";
+	import MultipleBarChart from "../../components/chart/bar/multiple-bar-chart.vue";
+	import DualPieChart from "../../components/chart/pie/dual-pie-chart.vue";
+	import SvgIcon from "../../components/coms/icon/svg-icon.vue";
+	import Panel from "../../components/coms/panel/panel.vue";
+	import Table from "../../components/coms/table/table.vue";
+	import Dayinfo from "./dayinfo.vue";
 	export default {
 		components: {
-			NormalRadarChart
+			Panel,
+			Table,
+			SvgIcon,
+			DualPieChart,
+			MultipleBarChart,
+			Dayinfo
 		},
 		data() {
-			return {}
+			let that = this;
+			return {
+				tableIdArr: [], //放checkbox的id数组
+				tableId: [],
+				checkLength: 0, //对标分析只能选择2个
+				tableData: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								// checkbox 事件
+								// event.target checkbox or td 需进行判断
+								// event.target.checked 判断 checkbox 是否选中
+								// data  当前数据
+								// console.log(that);
+								// console.log(event.target);
+								// console.log(event.target.checked);
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量排名",
+							field: "fdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量",
+							field: "fdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量排名",
+							field: "gzssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率排名",
+							field: "fnlylpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率(%)",
+							field: "fnlyl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},{
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "操作",
+							field: "cz",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<a class='action'>详情</a>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								that.detailShow = 2;
+								that.API.requestData({
+									method: "GET",
+									subUrl: "benchmarking/details",
+									data: {
+										id: dataId,
+										beginDate: that.value4,
+										endDate: that.value5,
+										target: '',
+										sort: ''
+									},
+									success(res) {
+										var dataTab = [];
+										res.data.forEach((item, index) => {
+											that.tableIdArr.push(item.id);
+											dataTab.push({ //表格
+												index: index + 1,
+												name: item.name,
+												zhpm: item.zhpm,
+												gzssdl: item.gzssdl,
+												jxssdlpm: item.jxssdlpm,
+												jxssdl: item.jxssdl,
+												xnssdlpm: item.xnssdlpm,
+												xnssdl: item.xnssdl,
+												xdssdlpm: item.xdssdlpm,
+												xdssdl: item.xdssdl,
+												slssdlpm: item.slssdlpm,
+												slssdl: item.slssdl,
+												fnlylpm: item.fnlylpm,
+												fnlyl: item.fnlyl,
+												gzsslpm: item.gzsslpm,
+												gzssl: item.gzssl,
+												jxsslpm: item.jxsslpm,
+												jxssl: item.jxssl,
+												qflpm: item.qflpm,
+												qfl: item.qfl,
+												xnsslpm: item.xnsslpm,
+												xnssl: item.xnssl,
+												slsslpm: item.slsslpm,
+												slssl: item.slssl,
+												is_light: false
+											})
+										})
+										that.tableDataDetail.data = dataTab;
+									}
+								});
+							}
+						}
+					],
+					data: [],
+				},
+				tableDataDetail: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "风机名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}
+					],
+					data: [],
+				},
+				options: [],
+				ChangZhan: [], //场站
+				value1: [],
+				value4: "",
+				value5: "",
+				innerFdl: [], //发电量占比
+				outerFdl: [],
+				innerCz: [], //各场站损失电量占比
+				outerLl: [],
+				analyis: [], //损失电量分析
+				dialogVisible: false,
+				radarValue: [],
+				windNum: 'dd',
+				windNum2: 'dd',
+				tabs: [],
+				analyisDialog: [],
+				detailShow: 1
+			};
 		},
 		created() {
-			
+			this.ChangZhanVal();
+			this.value4 = this.getTime(1);
+			this.value5 = this.getTime(2);
+			this.AjaxCommon();
 		},
 		methods: {
-			
+			ChangZhanVal() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/wplist",
+					success(res) {
+						that.ChangZhan = res.data;
+					}
+				});
+			},
+			ChangZhanChange(val) {
+				this.value1 = val;
+				this.AjaxCommon();
+			},
+			BeginChange(val) {
+				this.value4 = val;
+				this.AjaxCommon();
+			},
+			EndChange(val) {
+				this.value5 = val;
+				this.AjaxCommon();
+			},
+			getTime(val) { //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+				var date = new Date();
+				var year = date.getFullYear(),
+					month = date.getMonth() + 1,
+					day = date.getDate();
+				month >= 1 && month <= 9 ? (month = '0' + month) : '';
+				day >= 0 && day <= 9 ? (day = '0' + day) : '';
+				var begin = year + '-' + month + '-01';
+				var end = year + '-' + month + '-' + day;
+				if (val == 1) {
+					return begin;
+				} else if (val == 2) {
+					return end;
+				}
+			},
+			AjaxCommon() {
+				var that = this;
+				that.API.requestData({ //五项损失率
+					method: "GET",
+					subUrl: "benchmarking/cjdb",
+					data: {
+						wpids: that.value1,
+						projectids: that.value2,
+						lineids: that.value3,
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						console.log(JSON.stringify(res))
+						var dataTab = [], //表格
+							fdl = [],
+							cz = [],
+							ll = [],
+							analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							that.tableIdArr.push(item.id);
+							dataTab.push({ //表格
+								index: index + 1,
+								name: item.name,
+								zhpm: item.zhpm,
+								fdlpm: item.fdlpm,
+								fdl: item.fdl,
+								gzssdlpm: item.gzssdlpm,
+								gzssdl: item.gzssdl,
+								jxssdlpm: item.jxssdlpm,
+								jxssdl: item.jxssdl,
+								xnssdlpm: item.xnssdlpm,
+								xnssdl: item.xnssdl,
+								xdssdlpm: item.xdssdlpm,
+								xdssdl: item.xdssdl,
+								slssdlpm: item.slssdlpm,
+								slssdl: item.slssdl,
+								fnlylpm: item.fnlylpm,
+								fnlyl: item.fnlyl,
+								gzsslpm: item.gzsslpm,
+								gzssl: item.gzssl,
+								jxsslpm: item.jxsslpm,
+								jxssl: item.jxssl,
+								qflpm: item.qflpm,
+								qfl: item.qfl,
+								xnsslpm: item.xnsslpm,
+								xnssl: item.xnssl,
+								slsslpm: item.slsslpm,
+								slssl: item.slssl,
+								is_light: false
+							})
+
+							fdl.push({
+								value: item.fdl,
+								name: item.name
+							})
+
+							cz.push({
+								value: (item.gzssdl + item.jxssdl + item.xnssdl + item.xdssdl +
+									item.slssdl).toFixed(2),
+								name: item.name
+							})
+
+							ll.push({
+								value: item.llfdl,
+								name: item.name
+							})
+
+							gzssdl.push({
+								text: item.name,
+								value: item.gzssdl
+							});
+							jxssdl.push({
+								text: item.name,
+								value: item.jxssdl
+							});
+							xnssdl.push({
+								text: item.name,
+								value: item.xnssdl
+							});
+							xdssdl.push({
+								text: item.name,
+								value: item.xdssdl
+							});
+							slssdl.push({
+								text: item.name,
+								value: item.slssdl
+							});
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.tableData.data = dataTab;
+
+						that.innerFdl = fdl;
+						that.outerFdl = fdl;
+
+						that.innerCz = cz;
+						that.outerCz = cz;
+
+						that.analyis = analyis;
+					}
+				});
+			},
+			AjaxDbfx() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/cjdb",
+					data: {
+						wpids: that.tableId,
+						projectids: that.value2,
+						lineids: that.value3,
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						var data = res.data;
+						that.windNum = data[0].name;
+						that.windNum2 = data[1].name;
+						that.tabs = [{
+							name: "发电量",
+							windData1: data[0].fdl,
+							windData2: data[1].fdl
+						}, {
+							name: "故障损失电量",
+							windData1: data[0].gzssdl,
+							windData2: data[1].gzssdl
+						}, {
+							name: "检修损失电量",
+							windData1: data[0].jxssdl,
+							windData2: data[1].jxssdl
+						}, {
+							name: "性能未达标损失电量",
+							windData1: data[0].xnssdl,
+							windData2: data[1].xnssdl
+						}, {
+							name: "受累损失电量",
+							windData1: data[0].slssdl,
+							windData2: data[1].slssdl
+						}, {
+							name: "风能利用率",
+							windData1: data[0].fnlyl,
+							windData2: data[1].fnlyl
+						}, {
+							name: "故障损失率",
+							windData1: data[0].gzssl,
+							windData2: data[1].gzssl
+						}, {
+							name: "检修损失率",
+							windData1: data[0].jxssl,
+							windData2: data[1].jxssl
+						}, {
+							name: "弃风率",
+							windData1: data[0].qfl,
+							windData2: data[1].qfl
+						}, {
+							name: "性能损失率",
+							windData1: data[0].xnssl,
+							windData2: data[1].xnssl
+						}, {
+							name: "受累损失率",
+							windData1: data[0].slssl,
+							windData2: data[1].slssl
+						}];
+
+						that.radarValue = [{
+							indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率"],
+							data: [{
+								value: [data[0].fnlylpm, data[0].gzsslpm, data[0].jxsslpm, data[0].qflpm,
+									data[0].xnsslpm, data[0].slsslpm
+								]
+							}, {
+								value: [data[1].fnlylpm, data[1].gzsslpm, data[1].jxsslpm, data[1].qflpm,
+									data[1].xnsslpm, data[1].slsslpm
+								]
+							}]
+						}];
+
+						var analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							gzssdl.push({
+								text: item.name,
+								value: item.gzssdl
+							});
+							jxssdl.push({
+								text: item.name,
+								value: item.jxssdl
+							});
+							xnssdl.push({
+								text: item.name,
+								value: item.xnssdl
+							});
+							xdssdl.push({
+								text: item.name,
+								value: item.xdssdl
+							});
+							slssdl.push({
+								text: item.name,
+								value: item.slssdl
+							});
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.analyisDialog = analyis;
+					}
+				});
+			},
+			tooltip(param, callback) {
+				var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
+
+				var result = param[0].axisValue;
+				param.forEach((value, index) => {
+					result += "<br />" +
+						`<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
+						value.seriesName + "：" + value.value;
+				});
+				callback(result);
+				return true;
+			},
+			dbfx() {
+				var that = this;
+				if (that.tableId.length == 2) {
+					that.dialogVisible = true;
+					this.AjaxDbfx();
+				}
+			}
 		}
 	};
 </script>
 
 <style lang="less">
 	.decision-page-2 {
+		.content .project-table {
+			tbody {
+				height: calc(100vh - 24.5vh);
+			}
+		}
+
 		.project-table {
 			overflow: auto;
 
@@ -45,5 +911,11 @@
 				}
 			}
 		}
+
+		.action {
+			text-decoration: underline;
+			color: @green;
+			cursor: pointer;
+		}
 	}
 </style>

src/views/Decision/decision2Xmdb.vue

@@ -1,30 +1,932 @@
 <template>
 	<div class="decision-page-2">
-		场内对标
-		<normal-radar-chart :height="'500px'" />
+		<div class="query mg-b-8">
+			<div class="query-items">
+				<div class="query-item">
+					<div class="lable">场站：</div>
+					<div class="search-input">
+						<el-select v-model="value1" @change="ChangZhanChange(value1)" multiple placeholder="请选择"
+							popper-class="select">
+							<el-option v-for="item in ChangZhan" :key="item.id" :value="item.id" :label="item.name">
+							</el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">项目：</div>
+					<div class="search-input">
+						<el-select v-model="value2" @change="XiangMuChange(value2)" multiple placeholder="请选择"
+							popper-class="select">
+							<el-option v-for="item in XiangMu" :key="item.id" :value="item.id" :label="item.name">
+							</el-option>
+						</el-select>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">开始日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value4" @change="BeginChange(value4)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+					</div>
+				</div>
+				<div class="query-item">
+					<div class="lable">结束日期：</div>
+					<div class="search-input">
+						<el-date-picker v-model="value5" @change="EndChange(value5)" type="date"
+							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
+						</el-date-picker>
+						<div class="unit svg-icon svg-icon-gray">
+							<svg-icon :svgid="''" />
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="query-actions">
+				<button class="btn green">搜索</button>
+				<button class="btn" @click="dbfx">对标分析</button>
+				<button class="btn">导出</button>
+			</div>
+		</div>
+
+		<div v-show="detailShow==1">
+			<div class="mg-b-16">
+				<div class="project-table">
+					<Table :data="tableData" :canScroll="false"></Table>
+				</div>
+			</div>
+			<el-row class="mg-b-16">
+				<el-col :span="12">
+					<panel title="发电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerFdl" :outerData="outerFdl" />
+					</panel>
+				</el-col>
+				<el-col :span="12">
+					<panel title="各场站损失电量占比">
+						<dual-pie-chart height="21.296vh" :innerData="innerCz" :outerData="outerCz" />
+					</panel>
+				</el-col>
+			</el-row>
+			<div>
+				<panel title="损失电量分析">
+					<multiple-bar-chart height="300px" :list="analyis" :customerTooltip="true" @tooltip="tooltip"
+						:units='["(万KWh)"]' />
+				</panel>
+			</div>
+			<el-dialog title="对标排名分析" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
+				:close-on-click-modal="false">
+				<dayinfo :radarValue="radarValue" :windNum="windNum" :windNum2="windNum2" :tabs="tabs"
+					:analyisDialog="analyisDialog" />
+			</el-dialog>
+		</div>
+		<el-row :type="'flex'" class="content" v-show="detailShow==2">
+			<el-col :span="24" class="pd-l-8">
+				<panel :title="'风机对标列表明细'" :showLine="false">
+					<div class="project-table">
+						<Table :data="tableDataDetail"></Table>
+					</div>
+				</panel>
+			</el-col>
+		</el-row>
 	</div>
 </template>
 
 <script>
-	import NormalRadarChart from "../../components/chart/radar/normal-radar-chart.vue";
+	import MultipleBarChart from "../../components/chart/bar/multiple-bar-chart.vue";
+	import DualPieChart from "../../components/chart/pie/dual-pie-chart.vue";
+	import SvgIcon from "../../components/coms/icon/svg-icon.vue";
+	import Panel from "../../components/coms/panel/panel.vue";
+	import Table from "../../components/coms/table/table.vue";
+	import Dayinfo from "./dayinfo.vue";
 	export default {
 		components: {
-			NormalRadarChart
+			Panel,
+			Table,
+			SvgIcon,
+			DualPieChart,
+			MultipleBarChart,
+			Dayinfo
 		},
 		data() {
-			return {}
+			let that = this;
+			return {
+				tableIdArr: [], //放checkbox的id数组
+				tableId: [],
+				checkLength: 0, //对标分析只能选择2个
+				tableData: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								// checkbox 事件
+								// event.target checkbox or td 需进行判断
+								// event.target.checked 判断 checkbox 是否选中
+								// data  当前数据
+								// console.log(that);
+								// console.log(event.target);
+								// console.log(event.target.checked);
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量排名",
+							field: "fdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "发电量",
+							field: "fdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量排名",
+							field: "gzssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率排名",
+							field: "fnlylpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "风能利用率(%)",
+							field: "fnlyl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},{
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "操作",
+							field: "cz",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<a class='action'>详情</a>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								that.detailShow = 2;
+								// var that = this;
+								that.API.requestData({
+									method: "GET",
+									subUrl: "benchmarking/details",
+									data: {
+										id: dataId,
+										beginDate: that.value4,
+										endDate: that.value5,
+										target: '',
+										sort: ''
+									},
+									success(res) {
+										var dataTab = [];
+										res.data.forEach((item, index) => {
+											that.tableIdArr.push(item.id);
+
+											dataTab.push({ //表格
+												index: index + 1,
+												name: item.name,
+												zhpm: item.zhpm,
+												gzssdl: item.gzssdl,
+												jxssdlpm: item.jxssdlpm,
+												jxssdl: item.jxssdl,
+												xnssdlpm: item.xnssdlpm,
+												xnssdl: item.xnssdl,
+												xdssdlpm: item.xdssdlpm,
+												xdssdl: item.xdssdl,
+												slssdlpm: item.slssdlpm,
+												slssdl: item.slssdl,
+												fnlylpm: item.fnlylpm,
+												fnlyl: item.fnlyl,
+												gzsslpm: item.gzsslpm,
+												gzssl: item.gzssl,
+												jxsslpm: item.jxsslpm,
+												jxssl: item.jxssl,
+												qflpm: item.qflpm,
+												qfl: item.qfl,
+												xnsslpm: item.xnsslpm,
+												xnssl: item.xnssl,
+												slsslpm: item.slsslpm,
+												slssl: item.slssl,
+												is_light: false
+											})
+										})
+										that.tableDataDetail.data = dataTab;
+									}
+								});
+							}
+						}
+					],
+					data: [],
+				},
+				tableDataDetail: {
+					column: [{
+							name: "",
+							field: "index",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "",
+							field: "check",
+							is_num: false,
+							is_light: false,
+							template: function() {
+								return "<input class='check' type='CheckBox'/>";
+							},
+							click: function(event, data) {
+								var dataId = that.tableIdArr[data.index - 1];
+								if (event.target.checked == false && that.checkLength <= 2) {
+									that.tableId.forEach((item, i) => {
+										if (item == dataId) {
+											that.tableId.splice(i, 1)
+										}
+									})
+									that.checkLength--;
+								} else if (event.target.checked && that.checkLength < 2) {
+									that.tableId.push(dataId)
+									that.checkLength++;
+								} else if (that.checkLength == 2) {
+									event.target.checked = false;
+								}
+							},
+						},
+						{
+							name: "风机名称",
+							field: "name",
+							is_num: false,
+							is_light: false,
+						},
+						{
+							name: "综合排名",
+							field: "zhpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "故障损失电量",
+							field: "gzssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量排名",
+							field: "jxssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "检修损失电量",
+							field: "jxssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量排名",
+							field: "xnssdlpm",
+							is_num: false,
+							is_light: true,
+							sortable: true,
+						},
+						{
+							name: "性能损失电量",
+							field: "xnssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量排名",
+							field: "xdssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						},
+						{
+							name: "限电损失电量",
+							field: "xdssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量排名",
+							field: "slssdlpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失电量",
+							field: "slssdl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率排名",
+							field: "gzsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "故障损失率(%)",
+							field: "gzssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率排名",
+							field: "jxsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "检修损失率(%)",
+							field: "jxssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率排名",
+							field: "qflpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "弃风率(%)",
+							field: "qfl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率排名",
+							field: "xnsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "性能损失率(%)",
+							field: "xnssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率排名",
+							field: "slsslpm",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}, {
+							name: "受累损失率(%)",
+							field: "slssl",
+							is_num: false,
+							is_light: false,
+							sortable: true,
+						}
+					],
+					data: [],
+				},
+				options: [],
+				ChangZhan: [], //场站
+				XiangMu: [], //项目
+				value1: [],
+				value2: [],
+				value4: "",
+				value5: "",
+				innerFdl: [], //发电量占比
+				outerFdl: [],
+				innerCz: [], //各场站损失电量占比
+				outerCz: [],
+				innerLl: [], //理论发电量占比
+				outerLl: [],
+				analyis: [], //损失电量分析
+				dialogVisible: false,
+				radarValue: [],
+				windNum: 'dd',
+				windNum2: 'dd',
+				tabs: [],
+				analyisDialog: [],
+				detailShow: 1
+			};
 		},
 		created() {
-			
+			this.ChangZhanVal();
+			this.value4 = this.getTime(1);
+			this.value5 = this.getTime(2);
+			this.AjaxCommon();
 		},
 		methods: {
-			
+			ChangZhanVal() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/wplist",
+					success(res) {
+						that.ChangZhan = res.data;
+					}
+				});
+			},
+			ChangZhanChange(val) {
+				this.value1 = val;
+				this.value2 = [];
+				this.AjaxCommon();
+				this.XiangMuVal(val);
+			},
+			XiangMuVal(val) {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/projectList",
+					data: {
+						wpids: val
+					},
+					success(res) {
+						that.XiangMu = res.data;
+					}
+				});
+			},
+			XiangMuChange(val) {
+				this.value2 = val;
+				this.AjaxCommon();
+			},
+			BeginChange(val) {
+				this.value4 = val;
+				this.AjaxCommon();
+			},
+			EndChange(val) {
+				this.value5 = val;
+				this.AjaxCommon();
+			},
+			getTime(val) { //时间戳处理，val=1是默认开始时间（当前月第一天），val=2是默认结束时间（今天）
+				var date = new Date();
+				var year = date.getFullYear(),
+					month = date.getMonth() + 1,
+					day = date.getDate();
+				month >= 1 && month <= 9 ? (month = '0' + month) : '';
+				day >= 0 && day <= 9 ? (day = '0' + day) : '';
+				var begin = year + '-' + month + '-01';
+				var end = year + '-' + month + '-' + day;
+				if (val == 1) {
+					return begin;
+				} else if (val == 2) {
+					return end;
+				}
+			},
+			AjaxCommon() {
+				var that = this;
+				that.API.requestData({ //五项损失率
+					method: "GET",
+					subUrl: "benchmarking/xmdb",
+					data: {
+						wpids: that.value1,
+						projectids: that.value2,
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						var dataTab = [], //表格
+							fdl = [],
+							cz = [],
+							ll = [],
+							analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							that.tableIdArr.push(item.id);
+							dataTab.push({ //表格
+								index: index + 1,
+								name: item.name,
+								zhpm: item.zhpm,
+								fdlpm: item.fdlpm,
+								fdl: item.fdl,
+								gzssdlpm: item.gzssdlpm,
+								gzssdl: item.gzssdl,
+								jxssdlpm: item.jxssdlpm,
+								jxssdl: item.jxssdl,
+								xnssdlpm: item.xnssdlpm,
+								xnssdl: item.xnssdl,
+								xdssdlpm: item.xdssdlpm,
+								xdssdl: item.xdssdl,
+								slssdlpm: item.slssdlpm,
+								slssdl: item.slssdl,
+								fnlylpm: item.fnlylpm,
+								fnlyl: item.fnlyl,
+								gzsslpm: item.gzsslpm,
+								gzssl: item.gzssl,
+								jxsslpm: item.jxsslpm,
+								jxssl: item.jxssl,
+								qflpm: item.qflpm,
+								qfl: item.qfl,
+								xnsslpm: item.xnsslpm,
+								xnssl: item.xnssl,
+								slsslpm: item.slsslpm,
+								slssl: item.slssl,
+								is_light: false
+							})
+
+							fdl.push({
+								value: item.fdl,
+								name: item.name
+							})
+
+							cz.push({
+								value: (item.gzssdl + item.jxssdl + item.xnssdl + item.xdssdl +
+									item.slssdl).toFixed(2),
+								name: item.name
+							})
+
+							ll.push({
+								value: item.llfdl,
+								name: item.name
+							})
+
+							gzssdl.push({
+								text: item.name,
+								value: item.gzssdl
+							});
+							jxssdl.push({
+								text: item.name,
+								value: item.jxssdl
+							});
+							xnssdl.push({
+								text: item.name,
+								value: item.xnssdl
+							});
+							xdssdl.push({
+								text: item.name,
+								value: item.xdssdl
+							});
+							slssdl.push({
+								text: item.name,
+								value: item.slssdl
+							});
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.tableData.data = dataTab;
+
+						that.innerFdl = fdl;
+						that.outerFdl = fdl;
+
+						that.innerCz = cz;
+						that.outerCz = cz;
+
+						that.innerLl = ll;
+						that.outerLl = ll;
+
+						that.analyis = analyis;
+					}
+				});
+			},
+			AjaxDbfx() {
+				var that = this;
+				that.API.requestData({
+					method: "GET",
+					subUrl: "benchmarking/xmdb",
+					data: {
+						wpids: that.tableId,
+						projectids: [],
+						beginDate: that.value4,
+						endDate: that.value5,
+						target: '',
+						sort: ''
+					},
+					success(res) {
+						console.log(JSON.stringify(res))
+						var data = res.data;
+						that.windNum = data[0].name;
+						that.windNum2 = data[1].name;
+						that.tabs = [{
+							name: "发电量",
+							windData1: data[0].fdl,
+							windData2: data[1].fdl
+						}, {
+							name: "故障损失电量",
+							windData1: data[0].gzssdl,
+							windData2: data[1].gzssdl
+						}, {
+							name: "检修损失电量",
+							windData1: data[0].jxssdl,
+							windData2: data[1].jxssdl
+						}, {
+							name: "性能未达标损失电量",
+							windData1: data[0].xnssdl,
+							windData2: data[1].xnssdl
+						}, {
+							name: "受累损失电量",
+							windData1: data[0].slssdl,
+							windData2: data[1].slssdl
+						}, {
+							name: "风能利用率",
+							windData1: data[0].fnlyl,
+							windData2: data[1].fnlyl
+						}, {
+							name: "故障损失率",
+							windData1: data[0].gzssl,
+							windData2: data[1].gzssl
+						}, {
+							name: "检修损失率",
+							windData1: data[0].jxssl,
+							windData2: data[1].jxssl
+						}, {
+							name: "弃风率",
+							windData1: data[0].qfl,
+							windData2: data[1].qfl
+						}, {
+							name: "性能损失率",
+							windData1: data[0].xnssl,
+							windData2: data[1].xnssl
+						}, {
+							name: "受累损失率",
+							windData1: data[0].slssl,
+							windData2: data[1].slssl
+						}];
+
+						that.radarValue = [{
+							indicator: ["风能利用率", "故障损失率", "检修损失率", "弃风率", "性能损失率", "受累损失率"],
+							data: [{
+								value: [data[0].fnlylpm, data[0].gzsslpm, data[0].jxsslpm, data[0].qflpm,
+									data[0].xnsslpm, data[0].slsslpm
+								]
+							}, {
+								value: [data[1].fnlylpm, data[1].gzsslpm, data[1].jxsslpm, data[1].qflpm,
+									data[1].xnsslpm, data[1].slsslpm
+								]
+							}]
+						}];
+
+						var analyis = [],
+							gzssdl = [],
+							jxssdl = [],
+							xnssdl = [],
+							xdssdl = [],
+							slssdl = [];
+						res.data.forEach((item, index) => {
+							gzssdl.push({
+								text: item.name,
+								value: item.gzssdl
+							});
+							jxssdl.push({
+								text: item.name,
+								value: item.jxssdl
+							});
+							xnssdl.push({
+								text: item.name,
+								value: item.xnssdl
+							});
+							xdssdl.push({
+								text: item.name,
+								value: item.xdssdl
+							});
+							slssdl.push({
+								text: item.name,
+								value: item.slssdl
+							});
+						})
+						analyis.push({
+							title: "故障损失电量",
+							yAxisIndex: 0,
+							value: gzssdl
+						}, {
+							title: "检修损失电量",
+							yAxisIndex: 0,
+							value: jxssdl
+						}, {
+							title: "性能损失电量",
+							yAxisIndex: 0,
+							value: xnssdl
+						}, {
+							title: "限电损失电量",
+							yAxisIndex: 0,
+							value: xdssdl
+						}, {
+							title: "受累损失电量",
+							yAxisIndex: 0,
+							value: slssdl
+						})
+						that.analyisDialog = analyis;
+					}
+				});
+			},
+			tooltip(param, callback) {
+				var color = ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"];
+
+				var result = param[0].axisValue;
+				param.forEach((value, index) => {
+					result += "<br />" +
+						`<span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:${color[index]};"></span>` +
+						value.seriesName + "：" + value.value;
+				});
+				callback(result);
+				return true;
+			},
+			dbfx() {
+				var that = this;
+				if (that.tableId.length == 2) {
+					that.dialogVisible = true;
+					this.AjaxDbfx();
+				}
+			}
 		}
 	};
 </script>
 
 <style lang="less">
 	.decision-page-2 {
+		.content .project-table {
+			tbody {
+				height: calc(100vh - 24.5vh);
+			}
+		}
+
 		.project-table {
 			overflow: auto;
 
@@ -45,5 +947,11 @@
 				}
 			}
 		}
+
+		.action {
+			text-decoration: underline;
+			color: @green;
+			cursor: pointer;
+		}
 	}
 </style>