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